Skip to content
GitLab
Commit 1dbb942d authored by Mark Otto's avatar Mark Otto
Browse files

massive update to customize page to include all the new variables (and ensure... 

massive update to customize page to include all the new variables (and ensure they're being used in the .less files)
parent 95a3cd87
Hide whitespace changes
Inline Side-by-side
Showing
with 152 additions and 21 deletions
+152 -21
docs/assets/bootstrap.zip
+ 0
- 0
View file @ 1dbb942d
No preview for this file type
docs/assets/css/bootstrap.css
+ 6
- 4
View file @ 1dbb942d
......@@ -124,7 +124,7 @@ a {
text-decoration: none;
}
a:hover {
color: #006699;
color: #005580;
text-decoration: underline;
}
.row {
......@@ -2601,8 +2601,8 @@ input[type="submit"].btn.btn-small {
}
.nav-tabs .dropdown-toggle:hover .caret,
.nav-pills .dropdown-toggle:hover .caret {
border-top-color: #006699;
border-bottom-color: #006699;
border-top-color: #005580;
border-bottom-color: #005580;
}
.nav-tabs .active .dropdown-toggle .caret,
.nav-pills .active .dropdown-toggle .caret {
......@@ -3901,7 +3901,7 @@ a.thumbnail:hover {
.hero-unit {
padding: 60px;
margin-bottom: 30px;
background-color: #f5f5f5;
background-color: #eeeeee;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
......@@ -3910,12 +3910,14 @@ a.thumbnail:hover {
margin-bottom: 0;
font-size: 60px;
line-height: 1;
color: inherit;
letter-spacing: -1px;
}
.hero-unit p {
font-size: 18px;
font-weight: 200;
line-height: 27px;
color: inherit;
}
.pull-right {
float: right;
......
docs/download.html
+ 69
- 5
View file @ 1dbb942d
......@@ -227,6 +227,12 @@
</div>
<div class="row download-builder">
<div class="span3">
<h3>Scaffolding</h3>
<label>@bodyBackground</label>
<input type="text" class="span3" placeholder="@white">
<label>@textColor</label>
<input type="text" class="span3" placeholder="@grayDark">
<h3>Links</h3>
<label>@linkColor</label>
<input type="text" class="span3" placeholder="#08c">
......@@ -247,6 +253,13 @@
<input type="text" class="span3" placeholder="#c3325f">
<label>@purple</label>
<input type="text" class="span3" placeholder="#7a43b6">
<h3>Sprites</h3>
<label>@iconSpritePath</label>
<input type="text" class="span3" placeholder="'../img/glyphicons-halflings.png'">
<label>@iconWhiteSpritePath</label>
<input type="text" class="span3" placeholder="'../img/glyphicons-halflings-white.png'">
</div><!-- /span -->
<div class="span3">
<h3>Grid system</h3>
......@@ -261,6 +274,7 @@
<input type="text" class="span3" placeholder="6.382978723%">
<label>@fluidGridGutterWidth</label>
<input type="text" class="span3" placeholder="2.127659574%">
<h3>Typography</h3>
<label>@baseFontSize</label>
<input type="text" class="span3" placeholder="13px">
......@@ -268,13 +282,32 @@
<input type="text" class="span3" placeholder="'Helvetica Neue', Helvetica, Arial, sans-serif">
<label>@baseLineHeight</label>
<input type="text" class="span3" placeholder="18px">
<label>@altFontFamily</label>
<input type="text" class="span3" placeholder="Georgia, 'Times New Roman', Times, serif;">
<label>@headingsFontFamily</label>
<input type="text" class="span3" placeholder="inherit">
<label>@headingsFontWeight</label>
<input type="text" class="span3" placeholder="bold">
<label>@headingsColor</label>
<input type="text" class="span3" placeholder="inherit">
<label>@heroUnitBackground</label>
<input type="text" class="span3" placeholder="@grayLighter">
<label>@heroUnitHeadingColor</label>
<input type="text" class="span3" placeholder="inherit">
<label>@heroUnitLeadColor</label>
<input type="text" class="span3" placeholder="inherit">
</div><!-- /span -->
<div class="span3">
<h3>Forms</h3>
<label>@primaryButtonColor</label>
<input type="text" class="span3" placeholder="@blue">
<label>@placeholderText</label>
<input type="text" class="span3" placeholder="@grayLight">
<h3>Tables</h3>
<label>@tableBackground</label>
<input type="text" class="span3" placeholder="transparent">
<label>@tableBackgroundAccent</label>
<input type="text" class="span3" placeholder="#f9f9f9">
<label>@tableBackgroundHover</label>
<input type="text" class="span3" placeholder="#f5f5f5">
<label>@tableBorder</label>
<input type="text" class="span3" placeholder="#ddd">
<h3>Navbar</h3>
<label>@navbarHeight</label>
<input type="text" class="span3" placeholder="40px">
......@@ -288,8 +321,39 @@
<input type="text" class="span3" placeholder="@grayLight">
<label>@navbarLinkColorHover</label>
<input type="text" class="span3" placeholder="@white">
<label>@navbarLinkColorActive</label>
<input type="text" class="span3" placeholder="@navbarLinkColorHover">
<label>@navbarLinkBackgroundHover</label>
<input type="text" class="span3" placeholder="transparent">
<label>@navbarLinkBackgroundActive</label>
<input type="text" class="span3" placeholder="@navbarBackground">
<h3>Dropdowns</h3>
<label>@dropdownBackground</label>
<input type="text" class="span3" placeholder="@white">
<label>@dropdownLinkColor</label>
<input type="text" class="span3" placeholder="@grayDark">
<label>@dropdownLinkColorHover</label>
<input type="text" class="span3" placeholder="@white">
<label>@dropdownLinkBackgroundHover</label>
<input type="text" class="span3" placeholder="@linkColor">
</div><!-- /span -->
<div class="span3">
<h3>Forms</h3>
<label>@placeholderText</label>
<input type="text" class="span3" placeholder="@grayLight">
<label>@inputBackground</label>
<input type="text" class="span3" placeholder="@white">
<label>@inputBorder</label>
<input type="text" class="span3" placeholder="#ccc">
<label>@inputDisabledBackground</label>
<input type="text" class="span3" placeholder="@grayLighter">
<label>@btnPrimaryBackground</label>
<input type="text" class="span3" placeholder="@linkColor">
<label>@btnPrimaryBackgroundHighlight</label>
<input type="text" class="span3" placeholder="darken(@white, 10%);">
<h3>Form states &amp; alerts</h3>
<label>@warningText</label>
<input type="text" class="span3" placeholder="#c09853">
......
docs/templates/pages/download.mustache
+ 69
- 5
View file @ 1dbb942d
......@@ -151,6 +151,12 @@
</div>
<div class="row download-builder">
<div class="span3">
<h3>{{_i}}Scaffolding{{/i}}</h3>
<label>@bodyBackground</label>
<input type="text" class="span3" placeholder="@white">
<label>@textColor</label>
<input type="text" class="span3" placeholder="@grayDark">
<h3>{{_i}}Links{{/i}}</h3>
<label>@linkColor</label>
<input type="text" class="span3" placeholder="#08c">
......@@ -171,6 +177,13 @@
<input type="text" class="span3" placeholder="#c3325f">
<label>@purple</label>
<input type="text" class="span3" placeholder="#7a43b6">
<h3>{{_i}}Sprites{{/i}}</h3>
<label>@iconSpritePath</label>
<input type="text" class="span3" placeholder="'../img/glyphicons-halflings.png'">
<label>@iconWhiteSpritePath</label>
<input type="text" class="span3" placeholder="'../img/glyphicons-halflings-white.png'">
</div><!-- /span -->
<div class="span3">
<h3>{{_i}}Grid system{{/i}}</h3>
......@@ -185,6 +198,7 @@
<input type="text" class="span3" placeholder="6.382978723%">
<label>@fluidGridGutterWidth</label>
<input type="text" class="span3" placeholder="2.127659574%">
<h3>{{_i}}Typography{{/i}}</h3>
<label>@baseFontSize</label>
<input type="text" class="span3" placeholder="13px">
......@@ -192,13 +206,32 @@
<input type="text" class="span3" placeholder="'Helvetica Neue', Helvetica, Arial, sans-serif">
<label>@baseLineHeight</label>
<input type="text" class="span3" placeholder="18px">
<label>@altFontFamily</label>
<input type="text" class="span3" placeholder="Georgia, 'Times New Roman', Times, serif;">
<label>@headingsFontFamily</label>
<input type="text" class="span3" placeholder="inherit">
<label>@headingsFontWeight</label>
<input type="text" class="span3" placeholder="bold">
<label>@headingsColor</label>
<input type="text" class="span3" placeholder="inherit">
<label>@heroUnitBackground</label>
<input type="text" class="span3" placeholder="@grayLighter">
<label>@heroUnitHeadingColor</label>
<input type="text" class="span3" placeholder="inherit">
<label>@heroUnitLeadColor</label>
<input type="text" class="span3" placeholder="inherit">
</div><!-- /span -->
<div class="span3">
<h3>{{_i}}Forms{{/i}}</h3>
<label>@primaryButtonColor</label>
<input type="text" class="span3" placeholder="@blue">
<label>@placeholderText</label>
<input type="text" class="span3" placeholder="@grayLight">
<h3>{{_i}}Tables{{/i}}</h3>
<label>@tableBackground</label>
<input type="text" class="span3" placeholder="transparent">
<label>@tableBackgroundAccent</label>
<input type="text" class="span3" placeholder="#f9f9f9">
<label>@tableBackgroundHover</label>
<input type="text" class="span3" placeholder="#f5f5f5">
<label>@tableBorder</label>
<input type="text" class="span3" placeholder="#ddd">
<h3>{{_i}}Navbar{{/i}}</h3>
<label>@navbarHeight</label>
<input type="text" class="span3" placeholder="40px">
......@@ -212,8 +245,39 @@
<input type="text" class="span3" placeholder="@grayLight">
<label>@navbarLinkColorHover</label>
<input type="text" class="span3" placeholder="@white">
<label>@navbarLinkColorActive</label>
<input type="text" class="span3" placeholder="@navbarLinkColorHover">
<label>@navbarLinkBackgroundHover</label>
<input type="text" class="span3" placeholder="transparent">
<label>@navbarLinkBackgroundActive</label>
<input type="text" class="span3" placeholder="@navbarBackground">
<h3>{{_i}}Dropdowns{{/i}}</h3>
<label>@dropdownBackground</label>
<input type="text" class="span3" placeholder="@white">
<label>@dropdownLinkColor</label>
<input type="text" class="span3" placeholder="@grayDark">
<label>@dropdownLinkColorHover</label>
<input type="text" class="span3" placeholder="@white">
<label>@dropdownLinkBackgroundHover</label>
<input type="text" class="span3" placeholder="@linkColor">
</div><!-- /span -->
<div class="span3">
<h3>{{_i}}Forms{{/i}}</h3>
<label>@placeholderText</label>
<input type="text" class="span3" placeholder="@grayLight">
<label>@inputBackground</label>
<input type="text" class="span3" placeholder="@white">
<label>@inputBorder</label>
<input type="text" class="span3" placeholder="#ccc">
<label>@inputDisabledBackground</label>
<input type="text" class="span3" placeholder="@grayLighter">
<label>@btnPrimaryBackground</label>
<input type="text" class="span3" placeholder="@linkColor">
<label>@btnPrimaryBackgroundHighlight</label>
<input type="text" class="span3" placeholder="darken(@white, 10%);">
<h3>{{_i}}Form states &amp; alerts{{/i}}</h3>
<label>@warningText</label>
<input type="text" class="span3" placeholder="#c09853">
......
less/hero-unit.less
+ 3
- 1
View file @ 1dbb942d
......@@ -4,17 +4,19 @@
.hero-unit {
padding: 60px;
margin-bottom: 30px;
background-color: #f5f5f5;
background-color: @heroUnitBackground;
.border-radius(6px);
h1 {
margin-bottom: 0;
font-size: 60px;
line-height: 1;
color: @heroUnitHeadingColor;
letter-spacing: -1px;
}
p {
font-size: 18px;
font-weight: 200;
line-height: @baseLineHeight * 1.5;
color: @heroUnitLeadColor;
}
}
less/variables.less
+ 5
- 6
View file @ 1dbb942d
......@@ -40,7 +40,7 @@
// Links
// -------------------------
@linkColor: #08c;
@linkColorHover: #069;
@linkColorHover: darken(@linkColor, 15%);
// Typography
......@@ -67,7 +67,7 @@
// -------------------------
@btnBackground: @white;
@btnBackgroundHighlight: darken(@white, 10%);
@btnBorder: #ccc;
@btnBorder: darken(@white, 20%);
@btnPrimaryBackground: @linkColor;
@btnPrimaryBackgroundHighlight: spin(@btnPrimaryBackground, 15%);
......@@ -92,7 +92,6 @@
// -------------------------
@inputBackground: @white;
@inputBorder: #ccc;
@inputDisabledBackground: @grayLighter;
......@@ -153,9 +152,9 @@
// Hero unit
// -------------------------
@heroUnitBackground: #312f2e;
@heroUnitHeadingColor: @white;
@heroUnitLeadColor: @white;
@heroUnitBackground: @grayLighter;
@heroUnitHeadingColor: inherit;
@heroUnitLeadColor: inherit;
// Form states and alerts
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment