From a5214c8248d4fd663dbcfbd09d51185a71a79dc2 Mon Sep 17 00:00:00 2001 From: davegandy Date: Sat, 5 Oct 2013 17:16:44 -0400 Subject: [PATCH] getting tests updated, tweaking list items again --- css/font-awesome.css | 5 +- css/font-awesome.min.css | 2 +- less/core.less | 5 +- .../tests/rotated-flipped-inside-btn.html | 12 +- src/assets/font-awesome/less/core.less | 6 +- src/assets/less/site-3.0.0.less | 1 + src/assets/less/site/lazy.less | 86 ++++ src/test.html | 472 +++++++++--------- 8 files changed, 342 insertions(+), 247 deletions(-) create mode 100644 src/assets/less/site/lazy.less diff --git a/css/font-awesome.css b/css/font-awesome.css index c7bfde04e..833671c3e 100644 --- a/css/font-awesome.css +++ b/css/font-awesome.css @@ -70,9 +70,12 @@ position: absolute; left: -2.142857142857143em; width: 2.142857142857143em; - line-height: inherit; + top: 0.14285714285714285em; text-align: center; } +.fa-li.fa-lg { + left: -1.8571428571428572em; +} .fa.hide { display: none; } diff --git a/css/font-awesome.min.css b/css/font-awesome.min.css index af289386a..1c5cb4560 100644 --- a/css/font-awesome.min.css +++ b/css/font-awesome.min.css @@ -2,7 +2,7 @@ .fa-lg{font-size:1.3333333333333333em;vertical-align:-10%;line-height:0.75em;} .fa.fa-fixed-width{display:inline-block;width:1.1428571428571428em;padding-right:0.2857142857142857em;text-align:right;}.fa.fa-fixed-width.fa-lg{width:1.4285714285714286em;} .fa-ul{padding-left:0;margin-left:2.142857142857143em;list-style-type:none;}.fa-ul>li{position:relative;} -.fa-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;line-height:inherit;text-align:center;} +.fa-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;top:0.14285714285714285em;text-align:center;}.fa-li.fa-lg{left:-1.8571428571428572em;} .fa.hide{display:none;} .fa-muted{color:#eeeeee;} .fa-light{color:#ffffff;} diff --git a/less/core.less b/less/core.less index 28c98d6d0..67313b0d4 100644 --- a/less/core.less +++ b/less/core.less @@ -40,8 +40,11 @@ position: absolute; left: -@icons-li-width; width: @icons-li-width; - line-height: inherit; + top: (2em / 14); text-align: center; + &.fa-lg { + left: -@icons-li-width + (4em / 14); + } } // allows usage of the hide class directly on font awesome icons diff --git a/src/_includes/tests/rotated-flipped-inside-btn.html b/src/_includes/tests/rotated-flipped-inside-btn.html index 3a8e45c07..fc0d78829 100644 --- a/src/_includes/tests/rotated-flipped-inside-btn.html +++ b/src/_includes/tests/rotated-flipped-inside-btn.html @@ -1,6 +1,6 @@ -  normal
-  fa-rotate-90
-  fa-rotate-180
-  fa-rotate-270
-  fa-flip-horizontal
-  fa-flip-vertical +  normal
+  fa-rotate-90
+  fa-rotate-180
+  fa-rotate-270
+  fa-flip-horizontal
+  fa-flip-vertical diff --git a/src/assets/font-awesome/less/core.less b/src/assets/font-awesome/less/core.less index ee1e51345..f3237fa2f 100644 --- a/src/assets/font-awesome/less/core.less +++ b/src/assets/font-awesome/less/core.less @@ -42,8 +42,12 @@ position: absolute; left: -@icons-li-width; width: @icons-li-width; - line-height: inherit; + top: (2em / 14); text-align: center; + &.{{ site.fontawesome.css_prefix }}-lg { + top: (1em / 14); + left: -@icons-li-width + (4em / 14); + } } // allows usage of the hide class directly on font awesome icons diff --git a/src/assets/less/site-3.0.0.less b/src/assets/less/site-3.0.0.less index a9954088f..9df8bd40e 100644 --- a/src/assets/less/site-3.0.0.less +++ b/src/assets/less/site-3.0.0.less @@ -15,3 +15,4 @@ @import "site/feature-list"; @import "site/example-rating"; @import "site/footer"; +@import "site/lazy"; diff --git a/src/assets/less/site/lazy.less b/src/assets/less/site/lazy.less new file mode 100644 index 000000000..71af4a1fe --- /dev/null +++ b/src/assets/less/site/lazy.less @@ -0,0 +1,86 @@ +@size-none: 0px; +@size-sm: 5px; +@size-md: 10px; +@size-lg: 22px; + +.padding-none { padding: @size-none !important; } +.padding { padding: @size-md !important; } +.padding-sm { padding: @size-sm !important; } +.padding-lg { padding: @size-lg !important; } + +.padding-top-none { padding-top: @size-none !important; } +.padding-top { padding-top: @size-md !important; } +.padding-top-sm { padding-top: @size-sm !important; } +.padding-top-lg { padding-top: @size-lg !important; } + +.padding-right-none { padding-right: @size-none !important; } +.padding-right { padding-right: @size-md !important; } +.padding-right-sm { padding-right: @size-sm !important; } +.padding-right-lg { padding-right: @size-lg !important; } + +.padding-bottom-none { padding-bottom: @size-none !important; } +.padding-bottom { padding-bottom: @size-md !important; } +.padding-bottom-sm { padding-bottom: @size-sm !important; } +.padding-bottom-lg { padding-bottom: @size-lg !important; } + +.padding-left-none { padding-left: @size-none !important; } +.padding-left { padding-left: @size-md !important; } +.padding-left-sm { padding-left: @size-sm !important; } +.padding-left-lg { padding-left: @size-lg !important; } + +.margin-none { margin: @size-none !important; } +.margin { margin: @size-md !important; } +.margin-sm { margin: @size-sm !important; } +.margin-lg { margin: @size-lg !important; } + +.margin-top-none { margin-top: @size-none !important; } +.margin-top { margin-top: @size-md !important; } +.margin-top-lg { margin-top: @size-lg !important; } +.margin-top-sm { margin-top: @size-sm !important; } + +.margin-right-none { margin-right: @size-none !important; } +.margin-right { margin-right: @size-md !important; } +.margin-right-lg { margin-right: @size-lg !important; } +.margin-right-sm { margin-right: @size-sm !important; } + +.margin-bottom-none { margin-bottom: @size-none !important; } +.margin-bottom { margin-bottom: @size-md !important; } +.margin-bottom-lg { margin-bottom: @size-lg !important; } +.margin-bottom-sm { margin-bottom: @size-sm !important; } + +.margin-left-none { margin-left: @size-none !important; } +.margin-left { margin-left: @size-md !important; } +.margin-left-lg { margin-left: @size-lg !important; } +.margin-left-sm { margin-left: @size-sm !important; } + +.border-left-none { border-left: none !important; } +.border-right-none { border-right: none !important; } +.border-bottom-none { border-bottom: none !important; } +.border-top-none { border-top: none !important; } + +.display-block { display: block; } // use to swap an anchor tag to span a whole row to make click target larger +.no-underline:hover { text-decoration: none; } +.clickable { cursor: pointer; } +.strong { font-weight: bold; } +.em { font-style: italic; } +.small { font-size: 85%; } // Ex: 14px base font * 85% = about 12px +.no-link { color: @gray-dark; } + +.text-sans-serif { font-family: @font-family-sans-serif; } +.text-ellipsis { .text-overflow(); } // truncates text to a single line with an ellipsis at the end +.text-default { + font-family: @font-family-base; + font-size: @font-size-base; + line-height: @line-height-base; + font-weight: normal; +} +.text-hilite { + color: @link-color; + &:hover { + color: @link-hover-color; + text-decoration: underline; + } +} +.text-strike { text-decoration: line-through; } +.text-upper { text-transform: uppercase; } +.text-lower { text-transform: lowercase; } diff --git a/src/test.html b/src/test.html index 6d0f4af00..72014d790 100644 --- a/src/test.html +++ b/src/test.html @@ -9,139 +9,137 @@ relative_path: ../

Icons Icons should have proper alignment and not be clipped

-
+
Building
-
+
Building Large
-
+
Building
-
+
Building Large
-
+
Building
-
+
Building Large
-
+
Building Large
-
+
Circle
-
+
Circle Large
-
+
Circle
-
+
Circle Large
-
+
Circle
-
+
Circle Large
-
+
Circle Large
-

Links with Icons icon should activate link & underline

+

Links with Icons icon should activate link & NOT underline

-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here
-
- Link Here +
+ Link Here

Navbar should stay same height

-
-
- Font Awesome - -
+
+ Font Awesome +
@@ -149,101 +147,101 @@ relative_path: ../

Plain buttons next to buttons w/icons should be same height, icons not clipped

Buttons

-
+
- - - + + +
- - - + + +
- - - + + +
- - - + + +
-
+
- - - + + +
- - - + + +
- - - + + +
- - - + + +
-
+
- - - + + +
- - - + + +
- - - + + +
- - - + + +
-
+
- - - + + +
- - - + + +
- - - + + +
- - - + + +
@@ -252,101 +250,101 @@ relative_path: ../

Anchors

-
+
-
+
-
+
-
+
@@ -354,37 +352,37 @@ relative_path: ../

Button groups should be same height

-
+
- -
-
+
- -
-
+
- -
@@ -394,30 +392,30 @@ relative_path: ../

Buttons with pulled 2x, 3x, 4x should be same height, have correct line height

-
+
-
+
-
+
@@ -426,7 +424,7 @@ relative_path: ../

Nav pills & nav tabs should be same height and properly vertically aligned

-
+
-
+