Commits

Doug Stewart committed 60c591e

Final batch o' LESS layout fixes. Hopefully.

Comments (0)

Files changed (12)

layouts/less/3-columns-fixed-sb-both.less

-/* Custom mix-in for this layout only. */
-.lbmargin(@margin, @default) when (isnumber(@margin)){
-	margin: 0 (@margin - 5px);
-}
-.lbmargin(@margin, @default) when not (isnumber(@margin)){
-	margin: 0 @default;
-}
 #container{.setwidth(@containerwidth, 960px);margin:0 auto}
 #wrapper{float:left;.setwidth(@wrapperwidth, 100%)}
-#lb-content{.lbmargin(@primarysbwidth, 145px)}
+#lb-content{.lbmargin(@primarysbwidth - 5, 145px)}
 #primarysb{float:left;.setwidth(@primarysbwidth, 150px);.marginl(-@containerwidth, -960px)}
 #secondarysb{float:left;.setwidth(@primarysbwidth, 150px);.marginl(-@primarysbwidth, -150px)}
 #footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-fluid-sb-fixed-both.less

-/*
- @wrapperwidth: 100%;
- @primarysbwidth: 200px;
- @footerwidth: 100%;
-*/
-#wrapper{float:left;width:@wrapperwidth}
-#lb-content{margin: 0 200px}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@wrapperwidth}
-#secondarysb{float:left;width:@primarysbwidth;margin-left:-@primarysbwidth}
-#footer{clear:left;width:@footerwidth}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%)}
+#lb-content{.lbmargin(@primarysbwidth, 200px)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 200px);.marginl(-@wrapperwidth, -100%)}
+#secondarysb{float:left;.setwidth(@primarysbwidth, 200px);.marginl(-@primarysbwidth, -200px)}
+#footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-fluid-sb-fixed-left.less

  @primarysbwidth: 200px;
  @footerwidth: 100%;
 */
-#wrapper{float:right;width:@wrapperwidth;margin-left:-@primarysbwidth * 2}
-#lb-content{margin-left:@primarysbwidth * 2}
-#primarysb{float:left;width:@primarysbwidth}
-#secondarysb{float:right;width:@primarysbwidth}
-#footer{clear:both;width:@footerwidth}
+#wrapper{float:right;.setwidth(@wrapperwidth, 100%);.marginl(-@primarysbwidth * 2, -400px)}
+#lb-content{.marginl(@primarysbwidth * 2, 400px)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 200px)}
+#secondarysb{float:right;.setwidth(@primarysbwidth, 200px)}
+#footer{clear:both;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-fluid-sb-fixed-right.less

-/*
- @wrapperwidth: 100%;
- @primarysbwidth: 200px;
- @footerwidth: 100%;
-*/
-#wrapper{float:left;width:@wrapperwidth}
-#lb-content{margin-right:@primarysbwidth * 2}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@primarysbwidth * 2}
-#secondarysb{float:left;width:@primarysbwidth;margin-left:-@primarysbwidth}
-#footer{clear:left;width:@footerwidth}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%)}
+#lb-content{.marginr(@primarysbwidth * 2, 400px)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 200px);.marginl(-@primarysbwidth * 2, -400px)}
+#secondarysb{float:left;.setwidth(@primarysbwidth, 200px);.marginl(-@primarysbwidth, -200px)}
+#footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-percentage-sb-both.less

  @primarysbwidth: 25%;
  @footerwidth: 100%;
 */
-#wrapper{float:left;width:@wrapperwidth}
-#lb-content{margin: 0 @primarysbwidth}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@wrapperwidth}
-#secondarysb{float:left;width:@primarysbwidth;margin-left:-@primarysbwidth}
-#footer{clear:left;width:@footerwidth}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%)}
+#lb-content{.lbmargin(@primarysbwidth, 25%)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 25%);.marginl(-@wrapperwidth, -100%)}
+#secondarysb{float:left;.setwidth(@primarysbwidth, 25%);.marginl(-@primarysbwidth, -25%)}
+#footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-percentage-sb-left.less

-/*
- @wrapperwidth: 100%;
- @primarysbwidth: 25%;
- @footerwidth: 100%;
-*/
-#wrapper{float:left;width:@wrapperwidth}
-#lb-content{margin-left: @primarysbwidth * 2}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@wrapperwidth}
-#secondarysb{float:left;width:@primarysbwidth;margin-left:-@wrapperwidth + @primarysbwidth}
-#footer{clear:left;width:100%}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%)}
+#lb-content{.marginl(@primarysbwidth * 2, 50%)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 25%);.marginl(-@wrapperwidth, -100%)}
+#secondarysb{float:left;.setwidth(@primarysbwidth, 25%);.marginl(-@wrapperwidth + @primarysbwidth, -75%)}
+#footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-percentage-sb-right.less

-/*
- @wrapperwidth: 100%;
- @primarysbwidth: 25%;
- @footerwidth: 100%;
-*/
-#wrapper{float:left;width:@wrapperwidth}
-#lb-content{margin-right: @primarysbwidth * 2}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@primarysbwidth * 2}
-#secondarysb{float:left;width:@primarysbwidth;margin-left:-@primarysbwidth}
-#footer{clear:left;width:@footersbwidth}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%)}
+#lb-content{.marginr(@primarysbwidth * 2, 50%)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 25%);.marginl(-@primarysbwidth * 2, -50%)}
+#secondarysb{float:left;.setwidth(@primarysbwidth, 25%);.marginl(-@primarysbwidth, -25%)}
+#footer{clear:left;.setwidth(@footersbwidth, 100%)}

layouts/less/3-columns-sb-both-hybrid-left.less

-/*
- @wrapperwidth: 100%;
- @primarysbwidth: 33%;
- @secondarysbwidth: 200px;
- @footerwidth: 100%;
-*/
-#wrapper{float:left;width:@wrapperwidth}
-#lb-content{margin: 0 @secondarysbwidth 0 @primarysbwidth}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@wrapperwidth}
-#secondarysb{float:left;width:@secondarysbwidth;margin-left:-@secondarysbwidth}
-#footer{clear:left;width:@footerwidth}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%)}
+#lb-content{.setmargins(@secondarysbwidth, @primarysbwidth, 0 200px 0 33%)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 33%);.marginl(-@wrapperwidth, -100%)}
+#secondarysb{float:left;.setwidth(@secondarysbwidth, 200px);.marginl(-@secondarysbwidth, -200px)}
+#footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-sb-both-hybrid-right.less

-/*
- @wrapperwidth: 100%;
- @primarysbwidth: 200px;
- @secondarysbwidth: 33%;
- @footerwidth: 100%;
-*/
-#wrapper{float:left;width:@wrapperwidth}
-#lb-content{margin: 0 @secondarysbwidth 0 @primarysbwidth}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@wrapperwidth}
-#secondarysb{float:left;width:@secondarysbwidth;margin-left:-@secondarysbwidth}
-#footer{clear:left;width:@footerwidth}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%)}
+#lb-content{.setmargins(@secondarysbwidth, @primarysbwidth, 0 33% 0 200px)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 200px);.marginl(-@wrapperwidth, -100%)}
+#secondarysb{float:left;.setwidth(@secondarysbwidth, 33%);.marginl(-@secondarysbwidth, -33%)}
+#footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-sb-left-hybrid.less

-/*
- @wrapperwidth: 100%;
- @primarysbwidth: 25%;
- @secondarysbwidth: 200px;
- @footerwidth: 100%;
-*/
-#wrapper{float:left;width:@wrapperwidth;margin-left:-@secondarysbwidth}
-#lb-content{margin: 0 @primarysbwidth 0 @secondarysbwidth}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@primarysbwidth}
-#secondarysb{float:left;width:@secondarysbwidth}
-#footer{clear:left;width:@footerwidth}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%);.marginl(-@secondarysbwidth, -200px)}
+#lb-content{.setmargins(@primarysbwidth, @secondarysbwidth, 0 25% 0 200px)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 25%);.marginl(-@primarysbwidth, -25%)}
+#secondarysb{float:left;.setwidth(@secondarysbwidth, 200px)}
+#footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/3-columns-sb-right-hybrid.less

-/*
- @wrapperwidth: 100%;
- @primarysbwidth: 200px;
- @secondarysbwidth: 25%;
- @footerwidth: 100%;
-*/
-#wrapper{float:left;width:@wrapperwidth;margin-left:-@secondarysbwidth}
-#lb-content{margin: 0 @primarysbwidth 0 @secondarysbwidth}
-#primarysb{float:left;width:@primarysbwidth;margin-left:-@primarysbwidth}
-#secondarysb{float:left;width:@secondarysbwidth}
-#footer{clear:left;width:@footerwidth}
+#wrapper{float:left;.setwidth(@wrapperwidth, 100%);.marginl(-@secondarysbwidth, -25%)}
+#lb-content{.setmargins(@primarysbwidth, @secondarysbwidth, 0 200px 0 25%)}
+#primarysb{float:left;.setwidth(@primarysbwidth, 200px);.marginl(-@primarysbwidth, -200px)}
+#secondarysb{float:left;.setwidth(@secondarysbwidth, 25%)}
+#footer{clear:left;.setwidth(@footerwidth, 100%)}

layouts/less/master.less

 	width: @defaultw;
 }
 
+.setmargins(@margins, @default) when (isnumber(@margins)){
+	margin: @margins;
+}
+.setmargins(@margins, @default) when not (isnumber(@margins)){
+	margin: @default;
+}
+.setmargins(@marginp, @margins, @default) when (isnumber(@marginp)) and (isnumber(@margins)){
+	margin: 0 @marginp 0 @margins;
+}
+.setmargins(@marginp, @margins, @default) when not (isnumber(@marginp)) and not (isnumber(@margins)){
+	margin: @default;
+}
+
 /* Specify left margin, fall back to a default. */
 .marginl(@margin, @default) when (isnumber(@margin)){
 	margin-left: @margin;
 	margin-right: @default;
 }
 
+.lbmargin(@margin, @default) when (isnumber(@margin)){
+	margin: 0 @margin;
+}
+.lbmargin(@margin, @default) when not (isnumber(@margin)){
+	margin: 0 @default;
+}
+
 /* Select a layout, fall back to a default if none specified */
 .layout(@layout) when (isstring(@layout)){
 	@import @layout;
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.