From c001ce6eeaa523fade5f0c0e62cb9e63351abbb5 Mon Sep 17 00:00:00 2001 From: Matt Baer Date: Thu, 4 Jan 2018 19:39:26 -0500 Subject: [PATCH] Move LESS files out of `css` to `less` directory --- less/app.less | 2 + less/core.less | 409 +++++++++++++++++++++++++++++++++++++++++++ less/less.install | 11 ++ less/lib/elements.less | 156 +++++++++++++++++ less/makefile | 23 +++ makefile | 8 +- static/css/app.less | 2 - static/css/core.less | 409 ------------------------------------------- static/css/less.install | 11 -- static/css/lib/elements.less | 156 ----------------- static/css/makefile | 21 --- static/makefile | 17 -- 12 files changed, 605 insertions(+), 620 deletions(-) create mode 100644 less/app.less create mode 100644 less/core.less create mode 100755 less/less.install create mode 100644 less/lib/elements.less create mode 100644 less/makefile delete mode 100644 static/css/app.less delete mode 100644 static/css/core.less delete mode 100755 static/css/less.install delete mode 100644 static/css/lib/elements.less delete mode 100644 static/css/makefile delete mode 100644 static/makefile diff --git a/less/app.less b/less/app.less new file mode 100644 index 0000000..281d888 --- /dev/null +++ b/less/app.less @@ -0,0 +1,2 @@ +@import "core"; +@import "lib/elements.less"; diff --git a/less/core.less b/less/core.less new file mode 100644 index 0000000..6882b84 --- /dev/null +++ b/less/core.less @@ -0,0 +1,409 @@ +@primary: rgb(114, 120, 191); +@secondary: rgb(114, 191, 133); +@subheaders: #444; +@fonts: Monaco, Menlo, 'Ubuntu Mono', Consolas, source-code-pro, monospace; + +body { + margin: 0; + padding: 0; + font-size: 100%; + font-family: @fonts; + color: #111; + + h1 { + a { + color: black; + .transition-duration(0.2s); + &:hover { + color: #303030; + } + } + } + h1, h2, h3 { + line-height: 1.2; + } + + header { + margin: 0 auto; + padding: 1.15em; + + h1 { + display: inline; + } + a { + margin: 0 0 0 1em; + &:link, &:visited { + color: blue; + } + &.no { + text-decoration: line-through; + color: #bdbdbd; + cursor: default; + } + } + nav { + display: inline; + margin: 0 1em; + line-height: 2.4em; + span, a { + margin: 0 0 0 1em; + } + a, a:link, a:visited { + color: #999; + &.current { + color: #666; + text-decoration: underline; + cursor: default; + } + } + } + } + &#promo { + div.heading { + margin: 8em 0; + } + div.heading, div.attention-form { + h1 { + font-size: 3.5em; + } + input { + padding-left: 0.75em; + padding-right: 0.75em; + .rounded(.25em); + &[type=email] { + max-width: 16em; + } + &[type=submit] { + padding-left: 1.5em; + padding-right: 1.5em; + .transition(0.2s); + &:hover { + background-color: lighten(@primary, 3%); + } + } + } + } + h2 { + margin-bottom: 0; + font-size: 1.8em; + font-weight: normal; + span.write-as { + color: black; + } + &.soon { + color: lighten(@subheaders, 50%); + span { + &.write-as { + color: lighten(#000, 50%); + } + &.note { + color: lighten(#333, 50%); + font-variant: small-caps; + margin-left: 0.5em; + } + } + } + } + .half-col a + a { + margin-left: 2em; + } + } + + footer { + text-align: center; + padding: 0 2em; + margin-bottom: 4em; + + a { + text-decoration: none; + .transition-duration(0.2s); + -moz-transition-property: color; + -webkit-transition-property: color; + -o-transition-property: color; + transition-property: color; + + + a { + margin-left: 0.8em; + } + &:link, &:visited { + color: #888; + } + &:hover { + color: #666; + } + &.home { + color: #333; + font-weight: bold; + &:hover { + color: #000; + } + } + } + nav { + margin: 3em 0 2em; + } + + .made-by { + font-size: 0.86em; + color: #aaa; + } + } + &#neighborhood { + ul { + list-style: none; + padding: 0; + } + li:before { + content: "\2302\A0"; + } + } +} + +.open-house { + display: inline; + margin: 2em; + float: left; + height: 295px; + + img { + border: 1px solid #ccc; + display: block; + max-width: 320px; + max-height: 240px; + .opacity(.6); + .transition-duration(0.3s); + } + a:hover img { + .opacity(1); + } + + .house-name { + max-width: 320px; + margin-top: 1em; + font-size: 1.4em; + text-align: center; + display: block; + } +} + +#editor, #preview-wrap { + position: absolute; + top: 5em; + bottom: 0; + font-size: 1em; + border-top: 1px solid #ccc; +} + +#editor { + border-right: 1px solid #ccc; + right: 50%; + left: 0; +} +#preview-wrap { + left: 50%; + right: 0; + iframe { + position: absolute; + width: 100%; + height: 100%; + border: 0; + } +} + +header { + margin: 1em; +} + +a { + text-decoration: none; + &:hover { + text-decoration: underline; + } +} + +hr { + border: 0; + height: 1px; + background: #ccc; + max-width: 40em; + margin: 4em auto; + text-align: center; +} + +pre, .hljs { + margin: 0; + padding: 0.5em 2em 1.5em; + font-size: 1.2em; +} + +input { + padding: 0.5em; + font-family: @fonts; + &[type=submit] { + border: 1px solid @primary; + background: @primary; + color: white; + } +} + +#official-writing, #wrapper { + margin: 1em 2em 4em; + font-size: 1.2em; + + h2, h3, h4 { + color: @subheaders; + } + + ul { + margin: 0; + padding: 0 0 0 1em; + list-style-position: inside; + line-height: 1.4; + text-indent: -1em; + } +} + +#tools { + position: fixed; + bottom: 0; + left: 0; + right: 0; + padding: 1em 2em; + + .tool { + display: inline-block; + margin: 0 2em 0 0; + + &#status { + color: #666; + &.doing { + font-style: italic; + } + } + } + .mode-wp { + font-family: serif; + } + .mode-typewriter { + font-family: @fonts; + } +} +.clearfix { + overflow: auto; +} +.half-col, .half { + float: left; + + .half-col { + margin-left: 4em; + } +} +.half { + width: 50%; +} + +.hljs { + overflow-x: inherit; + background: transparent; +} + +code { + font-family: @fonts; + font-size: 1em; +} + +#wrapper { + max-width: 50em; +} + +.stat { + display: inline-block; + font-size: 1.2em; + &+.stat { + margin-left: 1em; + } + + .num { + font-weight: bold; + } + .label { + font-size: 0.9em; + color: #999; + } +} + +@media all and (min-width: 1280px) { + body#promo { + div.heading { + margin: 10em 0; + } + } +} + +@media all and (min-width: 1600px) { + body#promo { + div.heading { + margin: 14em 0; + } + } +} + +@media all and (max-width: 900px) { + .half-col { + float: none; + text-align: center; + + &+.half-col { + margin-top: 3em; + margin-left: 0; + } + } + #beta { + font-size: 1.15em; + } +} + +@media all and (max-width: 600px) { + #editor { + right: 0; + } + #preview { + display: none; + } +} + +@media all and (max-height: 500px) { + body#promo { + div.heading { + margin: 5em 0; + } + } +} + +@media all and (max-height: 400px) { + body#promo { + div.heading { + margin: 0em 0; + } + } +} + +/* Smartphones (portrait and landscape) ----------- */ +@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { + header { + .opacity(1); + } +} + +/* Smartphones (portrait) ----------- */ +@media only screen and (max-width : 320px) { + header { + .opacity(1); + } +} + +/* iPads (portrait and landscape) ----------- */ +@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { + header { + .opacity(1); + } +} diff --git a/less/less.install b/less/less.install new file mode 100755 index 0000000..2327997 --- /dev/null +++ b/less/less.install @@ -0,0 +1,11 @@ +#!/bin/sh + +# Install Less via npm (Nodejs Package Manager) +if [ ! -e "$(which lessc)" ] ; then + if [ ! -e "node_modules/.bin/lessc" ] ; then + npm install less + npm install less-plugin-clean-css + fi +else + echo LESS $(npm view less version 2>&1 | grep -v WARN) is installed +fi diff --git a/less/lib/elements.less b/less/lib/elements.less new file mode 100644 index 0000000..9e45973 --- /dev/null +++ b/less/lib/elements.less @@ -0,0 +1,156 @@ +/*--------------------------------------------------- + LESS Elements 0.9 + --------------------------------------------------- + A set of useful LESS mixins + More info at: http://lesselements.com + ---------------------------------------------------*/ + +.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) { + background: @color; + background: -webkit-gradient(linear, + left bottom, + left top, + color-stop(0, @start), + color-stop(1, @stop)); + background: -ms-linear-gradient(bottom, + @start, + @stop); + background: -moz-linear-gradient(center bottom, + @start 0%, + @stop 100%); + background: -o-linear-gradient(@stop, + @start); + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start)); +} +.bw-gradient(@color: #F5F5F5, @start: 0, @stop: 255) { + background: @color; + background: -webkit-gradient(linear, + left bottom, + left top, + color-stop(0, rgb(@start,@start,@start)), + color-stop(1, rgb(@stop,@stop,@stop))); + background: -ms-linear-gradient(bottom, + rgb(@start,@start,@start) 0%, + rgb(@stop,@stop,@stop) 100%); + background: -moz-linear-gradient(center bottom, + rgb(@start,@start,@start) 0%, + rgb(@stop,@stop,@stop) 100%); + background: -o-linear-gradient(rgb(@stop,@stop,@stop), + rgb(@start,@start,@start)); + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",rgb(@stop,@stop,@stop),rgb(@start,@start,@start))); +} +.bordered(@top-color: #EEE, @right-color: #EEE, @bottom-color: #EEE, @left-color: #EEE) { + border-top: solid 1px @top-color; + border-left: solid 1px @left-color; + border-right: solid 1px @right-color; + border-bottom: solid 1px @bottom-color; +} +.drop-shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @alpha: 0.1) { + -webkit-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); + -moz-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); + box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); +} +.rounded(@radius: 2px) { + -webkit-border-radius: @radius; + -moz-border-radius: @radius; + border-radius: @radius; +} +.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) { + -webkit-border-top-right-radius: @topright; + -webkit-border-bottom-right-radius: @bottomright; + -webkit-border-bottom-left-radius: @bottomleft; + -webkit-border-top-left-radius: @topleft; + -moz-border-radius-topright: @topright; + -moz-border-radius-bottomright: @bottomright; + -moz-border-radius-bottomleft: @bottomleft; + -moz-border-radius-topleft: @topleft; + border-top-right-radius: @topright; + border-bottom-right-radius: @bottomright; + border-bottom-left-radius: @bottomleft; + border-top-left-radius: @topleft; + .background-clip(padding-box); +} +.opacity(@opacity: 0.5) { + -moz-opacity: @opacity; + -khtml-opacity: @opacity; + -webkit-opacity: @opacity; + opacity: @opacity; + @opperc: @opacity * 100; + -ms-filter: ~"progid:DXImageTransform.Microsoft.Alpha(opacity=@{opperc})"; + filter: ~"alpha(opacity=@{opperc})"; +} +.transition-duration(@duration: 0.2s) { + -moz-transition-duration: @duration; + -webkit-transition-duration: @duration; + -o-transition-duration: @duration; + transition-duration: @duration; +} +.transform(...) { + -webkit-transform: @arguments; + -moz-transform: @arguments; + -o-transform: @arguments; + -ms-transform: @arguments; + transform: @arguments; +} +.rotation(@deg:5deg){ + .transform(rotate(@deg)); +} +.scale(@ratio:1.5){ + .transform(scale(@ratio)); +} +.transition(@duration:0.2s, @ease:ease-out) { + -webkit-transition: all @duration @ease; + -moz-transition: all @duration @ease; + -o-transition: all @duration @ease; + transition: all @duration @ease; +} +.inner-shadow(@horizontal:0, @vertical:1px, @blur:2px, @alpha: 0.4) { + -webkit-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); + -moz-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); + box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); +} +.box-shadow(@arguments) { + -webkit-box-shadow: @arguments; + -moz-box-shadow: @arguments; + box-shadow: @arguments; +} +.box-sizing(@sizing: border-box) { + -ms-box-sizing: @sizing; + -moz-box-sizing: @sizing; + -webkit-box-sizing: @sizing; + box-sizing: @sizing; +} +.user-select(@argument: none) { + -webkit-user-select: @argument; + -moz-user-select: @argument; + -ms-user-select: @argument; + user-select: @argument; +} +.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #EEE, @columnRuleStyle: solid, @columnRuleWidth: 1px) { + -moz-column-width: @colwidth; + -moz-column-count: @colcount; + -moz-column-gap: @colgap; + -moz-column-rule-color: @columnRuleColor; + -moz-column-rule-style: @columnRuleStyle; + -moz-column-rule-width: @columnRuleWidth; + -webkit-column-width: @colwidth; + -webkit-column-count: @colcount; + -webkit-column-gap: @colgap; + -webkit-column-rule-color: @columnRuleColor; + -webkit-column-rule-style: @columnRuleStyle; + -webkit-column-rule-width: @columnRuleWidth; + column-width: @colwidth; + column-count: @colcount; + column-gap: @colgap; + column-rule-color: @columnRuleColor; + column-rule-style: @columnRuleStyle; + column-rule-width: @columnRuleWidth; +} +.translate(@x:0, @y:0) { + .transform(translate(@x, @y)); +} +.background-clip(@argument: padding-box) { + -moz-background-clip: @argument; + -webkit-background-clip: @argument; + background-clip: @argument; +} \ No newline at end of file diff --git a/less/makefile b/less/makefile new file mode 100644 index 0000000..aa1c00b --- /dev/null +++ b/less/makefile @@ -0,0 +1,23 @@ +ifeq ($(shell which lessc),/usr/local/bin/lessc) + LESSC=/usr/local/bin/lessc +else + LESSC=node_modules/.bin/lessc +endif +export LESSC + +CSSDIR=../static/css/ + +all : + $(LESSC) app.less --clean-css="--s1 --advanced --compatibility=ie8" $(CSSDIR)house.css + +local : all + +development : all + +production : all + +install : + ./less.install + +clean : + rm -f $(CSSDIR)house.css diff --git a/makefile b/makefile index 123de1b..f1ba2d2 100644 --- a/makefile +++ b/makefile @@ -3,16 +3,16 @@ all : local install : ./keys.sh gen - cd static/; $(MAKE) install $(MFLAGS) + cd less/; $(MAKE) install $(MFLAGS) local : force_look - cd static/; $(MAKE) $(MFLAGS) + cd less/; $(MAKE) $(MFLAGS) development : force_look - cd static/; $(MAKE) development $(MFLAGS) + cd less/; $(MAKE) development $(MFLAGS) production : force_look - cd static/; $(MAKE) production $(MFLAGS) + cd less/; $(MAKE) production $(MFLAGS) ./build.sh hidden : production diff --git a/static/css/app.less b/static/css/app.less deleted file mode 100644 index 281d888..0000000 --- a/static/css/app.less +++ /dev/null @@ -1,2 +0,0 @@ -@import "core"; -@import "lib/elements.less"; diff --git a/static/css/core.less b/static/css/core.less deleted file mode 100644 index 6882b84..0000000 --- a/static/css/core.less +++ /dev/null @@ -1,409 +0,0 @@ -@primary: rgb(114, 120, 191); -@secondary: rgb(114, 191, 133); -@subheaders: #444; -@fonts: Monaco, Menlo, 'Ubuntu Mono', Consolas, source-code-pro, monospace; - -body { - margin: 0; - padding: 0; - font-size: 100%; - font-family: @fonts; - color: #111; - - h1 { - a { - color: black; - .transition-duration(0.2s); - &:hover { - color: #303030; - } - } - } - h1, h2, h3 { - line-height: 1.2; - } - - header { - margin: 0 auto; - padding: 1.15em; - - h1 { - display: inline; - } - a { - margin: 0 0 0 1em; - &:link, &:visited { - color: blue; - } - &.no { - text-decoration: line-through; - color: #bdbdbd; - cursor: default; - } - } - nav { - display: inline; - margin: 0 1em; - line-height: 2.4em; - span, a { - margin: 0 0 0 1em; - } - a, a:link, a:visited { - color: #999; - &.current { - color: #666; - text-decoration: underline; - cursor: default; - } - } - } - } - &#promo { - div.heading { - margin: 8em 0; - } - div.heading, div.attention-form { - h1 { - font-size: 3.5em; - } - input { - padding-left: 0.75em; - padding-right: 0.75em; - .rounded(.25em); - &[type=email] { - max-width: 16em; - } - &[type=submit] { - padding-left: 1.5em; - padding-right: 1.5em; - .transition(0.2s); - &:hover { - background-color: lighten(@primary, 3%); - } - } - } - } - h2 { - margin-bottom: 0; - font-size: 1.8em; - font-weight: normal; - span.write-as { - color: black; - } - &.soon { - color: lighten(@subheaders, 50%); - span { - &.write-as { - color: lighten(#000, 50%); - } - &.note { - color: lighten(#333, 50%); - font-variant: small-caps; - margin-left: 0.5em; - } - } - } - } - .half-col a + a { - margin-left: 2em; - } - } - - footer { - text-align: center; - padding: 0 2em; - margin-bottom: 4em; - - a { - text-decoration: none; - .transition-duration(0.2s); - -moz-transition-property: color; - -webkit-transition-property: color; - -o-transition-property: color; - transition-property: color; - - + a { - margin-left: 0.8em; - } - &:link, &:visited { - color: #888; - } - &:hover { - color: #666; - } - &.home { - color: #333; - font-weight: bold; - &:hover { - color: #000; - } - } - } - nav { - margin: 3em 0 2em; - } - - .made-by { - font-size: 0.86em; - color: #aaa; - } - } - &#neighborhood { - ul { - list-style: none; - padding: 0; - } - li:before { - content: "\2302\A0"; - } - } -} - -.open-house { - display: inline; - margin: 2em; - float: left; - height: 295px; - - img { - border: 1px solid #ccc; - display: block; - max-width: 320px; - max-height: 240px; - .opacity(.6); - .transition-duration(0.3s); - } - a:hover img { - .opacity(1); - } - - .house-name { - max-width: 320px; - margin-top: 1em; - font-size: 1.4em; - text-align: center; - display: block; - } -} - -#editor, #preview-wrap { - position: absolute; - top: 5em; - bottom: 0; - font-size: 1em; - border-top: 1px solid #ccc; -} - -#editor { - border-right: 1px solid #ccc; - right: 50%; - left: 0; -} -#preview-wrap { - left: 50%; - right: 0; - iframe { - position: absolute; - width: 100%; - height: 100%; - border: 0; - } -} - -header { - margin: 1em; -} - -a { - text-decoration: none; - &:hover { - text-decoration: underline; - } -} - -hr { - border: 0; - height: 1px; - background: #ccc; - max-width: 40em; - margin: 4em auto; - text-align: center; -} - -pre, .hljs { - margin: 0; - padding: 0.5em 2em 1.5em; - font-size: 1.2em; -} - -input { - padding: 0.5em; - font-family: @fonts; - &[type=submit] { - border: 1px solid @primary; - background: @primary; - color: white; - } -} - -#official-writing, #wrapper { - margin: 1em 2em 4em; - font-size: 1.2em; - - h2, h3, h4 { - color: @subheaders; - } - - ul { - margin: 0; - padding: 0 0 0 1em; - list-style-position: inside; - line-height: 1.4; - text-indent: -1em; - } -} - -#tools { - position: fixed; - bottom: 0; - left: 0; - right: 0; - padding: 1em 2em; - - .tool { - display: inline-block; - margin: 0 2em 0 0; - - &#status { - color: #666; - &.doing { - font-style: italic; - } - } - } - .mode-wp { - font-family: serif; - } - .mode-typewriter { - font-family: @fonts; - } -} -.clearfix { - overflow: auto; -} -.half-col, .half { - float: left; - + .half-col { - margin-left: 4em; - } -} -.half { - width: 50%; -} - -.hljs { - overflow-x: inherit; - background: transparent; -} - -code { - font-family: @fonts; - font-size: 1em; -} - -#wrapper { - max-width: 50em; -} - -.stat { - display: inline-block; - font-size: 1.2em; - &+.stat { - margin-left: 1em; - } - - .num { - font-weight: bold; - } - .label { - font-size: 0.9em; - color: #999; - } -} - -@media all and (min-width: 1280px) { - body#promo { - div.heading { - margin: 10em 0; - } - } -} - -@media all and (min-width: 1600px) { - body#promo { - div.heading { - margin: 14em 0; - } - } -} - -@media all and (max-width: 900px) { - .half-col { - float: none; - text-align: center; - - &+.half-col { - margin-top: 3em; - margin-left: 0; - } - } - #beta { - font-size: 1.15em; - } -} - -@media all and (max-width: 600px) { - #editor { - right: 0; - } - #preview { - display: none; - } -} - -@media all and (max-height: 500px) { - body#promo { - div.heading { - margin: 5em 0; - } - } -} - -@media all and (max-height: 400px) { - body#promo { - div.heading { - margin: 0em 0; - } - } -} - -/* Smartphones (portrait and landscape) ----------- */ -@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { - header { - .opacity(1); - } -} - -/* Smartphones (portrait) ----------- */ -@media only screen and (max-width : 320px) { - header { - .opacity(1); - } -} - -/* iPads (portrait and landscape) ----------- */ -@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { - header { - .opacity(1); - } -} diff --git a/static/css/less.install b/static/css/less.install deleted file mode 100755 index 2327997..0000000 --- a/static/css/less.install +++ /dev/null @@ -1,11 +0,0 @@ -#!/bin/sh - -# Install Less via npm (Nodejs Package Manager) -if [ ! -e "$(which lessc)" ] ; then - if [ ! -e "node_modules/.bin/lessc" ] ; then - npm install less - npm install less-plugin-clean-css - fi -else - echo LESS $(npm view less version 2>&1 | grep -v WARN) is installed -fi diff --git a/static/css/lib/elements.less b/static/css/lib/elements.less deleted file mode 100644 index 9e45973..0000000 --- a/static/css/lib/elements.less +++ /dev/null @@ -1,156 +0,0 @@ -/*--------------------------------------------------- - LESS Elements 0.9 - --------------------------------------------------- - A set of useful LESS mixins - More info at: http://lesselements.com - ---------------------------------------------------*/ - -.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) { - background: @color; - background: -webkit-gradient(linear, - left bottom, - left top, - color-stop(0, @start), - color-stop(1, @stop)); - background: -ms-linear-gradient(bottom, - @start, - @stop); - background: -moz-linear-gradient(center bottom, - @start 0%, - @stop 100%); - background: -o-linear-gradient(@stop, - @start); - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start)); -} -.bw-gradient(@color: #F5F5F5, @start: 0, @stop: 255) { - background: @color; - background: -webkit-gradient(linear, - left bottom, - left top, - color-stop(0, rgb(@start,@start,@start)), - color-stop(1, rgb(@stop,@stop,@stop))); - background: -ms-linear-gradient(bottom, - rgb(@start,@start,@start) 0%, - rgb(@stop,@stop,@stop) 100%); - background: -moz-linear-gradient(center bottom, - rgb(@start,@start,@start) 0%, - rgb(@stop,@stop,@stop) 100%); - background: -o-linear-gradient(rgb(@stop,@stop,@stop), - rgb(@start,@start,@start)); - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",rgb(@stop,@stop,@stop),rgb(@start,@start,@start))); -} -.bordered(@top-color: #EEE, @right-color: #EEE, @bottom-color: #EEE, @left-color: #EEE) { - border-top: solid 1px @top-color; - border-left: solid 1px @left-color; - border-right: solid 1px @right-color; - border-bottom: solid 1px @bottom-color; -} -.drop-shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @alpha: 0.1) { - -webkit-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); - -moz-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); - box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha); -} -.rounded(@radius: 2px) { - -webkit-border-radius: @radius; - -moz-border-radius: @radius; - border-radius: @radius; -} -.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) { - -webkit-border-top-right-radius: @topright; - -webkit-border-bottom-right-radius: @bottomright; - -webkit-border-bottom-left-radius: @bottomleft; - -webkit-border-top-left-radius: @topleft; - -moz-border-radius-topright: @topright; - -moz-border-radius-bottomright: @bottomright; - -moz-border-radius-bottomleft: @bottomleft; - -moz-border-radius-topleft: @topleft; - border-top-right-radius: @topright; - border-bottom-right-radius: @bottomright; - border-bottom-left-radius: @bottomleft; - border-top-left-radius: @topleft; - .background-clip(padding-box); -} -.opacity(@opacity: 0.5) { - -moz-opacity: @opacity; - -khtml-opacity: @opacity; - -webkit-opacity: @opacity; - opacity: @opacity; - @opperc: @opacity * 100; - -ms-filter: ~"progid:DXImageTransform.Microsoft.Alpha(opacity=@{opperc})"; - filter: ~"alpha(opacity=@{opperc})"; -} -.transition-duration(@duration: 0.2s) { - -moz-transition-duration: @duration; - -webkit-transition-duration: @duration; - -o-transition-duration: @duration; - transition-duration: @duration; -} -.transform(...) { - -webkit-transform: @arguments; - -moz-transform: @arguments; - -o-transform: @arguments; - -ms-transform: @arguments; - transform: @arguments; -} -.rotation(@deg:5deg){ - .transform(rotate(@deg)); -} -.scale(@ratio:1.5){ - .transform(scale(@ratio)); -} -.transition(@duration:0.2s, @ease:ease-out) { - -webkit-transition: all @duration @ease; - -moz-transition: all @duration @ease; - -o-transition: all @duration @ease; - transition: all @duration @ease; -} -.inner-shadow(@horizontal:0, @vertical:1px, @blur:2px, @alpha: 0.4) { - -webkit-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); - -moz-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); - box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); -} -.box-shadow(@arguments) { - -webkit-box-shadow: @arguments; - -moz-box-shadow: @arguments; - box-shadow: @arguments; -} -.box-sizing(@sizing: border-box) { - -ms-box-sizing: @sizing; - -moz-box-sizing: @sizing; - -webkit-box-sizing: @sizing; - box-sizing: @sizing; -} -.user-select(@argument: none) { - -webkit-user-select: @argument; - -moz-user-select: @argument; - -ms-user-select: @argument; - user-select: @argument; -} -.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #EEE, @columnRuleStyle: solid, @columnRuleWidth: 1px) { - -moz-column-width: @colwidth; - -moz-column-count: @colcount; - -moz-column-gap: @colgap; - -moz-column-rule-color: @columnRuleColor; - -moz-column-rule-style: @columnRuleStyle; - -moz-column-rule-width: @columnRuleWidth; - -webkit-column-width: @colwidth; - -webkit-column-count: @colcount; - -webkit-column-gap: @colgap; - -webkit-column-rule-color: @columnRuleColor; - -webkit-column-rule-style: @columnRuleStyle; - -webkit-column-rule-width: @columnRuleWidth; - column-width: @colwidth; - column-count: @colcount; - column-gap: @colgap; - column-rule-color: @columnRuleColor; - column-rule-style: @columnRuleStyle; - column-rule-width: @columnRuleWidth; -} -.translate(@x:0, @y:0) { - .transform(translate(@x, @y)); -} -.background-clip(@argument: padding-box) { - -moz-background-clip: @argument; - -webkit-background-clip: @argument; - background-clip: @argument; -} \ No newline at end of file diff --git a/static/css/makefile b/static/css/makefile deleted file mode 100644 index 0145d87..0000000 --- a/static/css/makefile +++ /dev/null @@ -1,21 +0,0 @@ -ifeq ($(shell which lessc),/usr/local/bin/lessc) - LESSC=/usr/local/bin/lessc -else - LESSC=node_modules/.bin/lessc -endif -export LESSC - -all : - $(LESSC) app.less --clean-css="--s1 --advanced --compatibility=ie8" house.css - -local : all - -development : all - -production : all - -install : - ./less.install - -clean : - rm -f house.css diff --git a/static/makefile b/static/makefile deleted file mode 100644 index 4704471..0000000 --- a/static/makefile +++ /dev/null @@ -1,17 +0,0 @@ - -all : local - -install : - cd css/; $(MAKE) install $(MFLAGS) - -local : force_look - cd css/; $(MAKE) $(MFLAGS) - -development : force_look - cd css/; $(MAKE) development $(MFLAGS) - -production : force_look - cd css/; $(MAKE) production $(MFLAGS) - -force_look : - true