diff options
author | Michael <icarus@dabo.de> | 2012-05-19 16:55:33 +0200 |
---|---|---|
committer | Michael <icarus@dabo.de> | 2012-05-19 16:55:33 +0200 |
commit | 6342b3e0bdd5774857a8fca809994f05e0208d25 (patch) | |
tree | 54114a005e74c8a6d8bad8a490e1d1e41bc4178f /view/theme/dispy/light/_base.less | |
parent | 2b8c4df544f59d611ad1e8fc0dbc5fcd38bee8f7 (diff) | |
parent | 9a940786c18c1c2bd772aec93f1828f67dc45667 (diff) | |
download | volse-hubzilla-6342b3e0bdd5774857a8fca809994f05e0208d25.tar.gz volse-hubzilla-6342b3e0bdd5774857a8fca809994f05e0208d25.tar.bz2 volse-hubzilla-6342b3e0bdd5774857a8fca809994f05e0208d25.zip |
Merge branch 'master' of github.com:annando/friendica
Diffstat (limited to 'view/theme/dispy/light/_base.less')
-rw-r--r-- | view/theme/dispy/light/_base.less | 172 |
1 files changed, 172 insertions, 0 deletions
diff --git a/view/theme/dispy/light/_base.less b/view/theme/dispy/light/_base.less new file mode 100644 index 000000000..70576145c --- /dev/null +++ b/view/theme/dispy/light/_base.less @@ -0,0 +1,172 @@ +// _base.less +// +// the base file for dispy's light "sub-theme". +// +// Notes: +// this is used to define mixins (think of them as functions) +// and variables. the mixins are the ".foo () {}" things, vars are +// like "@bar". +// +// (BTW, this will make it a LOT easier to maintain.) +// +// Dev. Note: the // style comments don't show up at all when +// you "compile" the css (with `lessc`), but css (/**/) comments +// do. i use them to our advantage :). + +// import our reset styles first +@import "../css/reset"; + +//* backgrounds */ +@dk_bg_colour: #2e3436; +@bg_colour: #eeeeec; +@bg_alt_colour: #2e302e; +@med_bg_colour: #4e4f4e; +@menu_bg_colour: #555753; + +//* font colour, aka color: */ +@lt_main_colour: #ffff99; +@main_colour: #111; +@main_alt_colour: #999999; +// darken(@main_alt_colour, 6.5%) > #888888 +// //#9eabb0 +// darken(@main_alt_colour, 10%) > #777777 +// darken(@main_alt_colour, 20%) > #666666 +// darken(@main_alt_colour, 26.8%) > #555555 +// darken(@main_alt_colour, 33.5%) > #444444 +// darken(@main_alt_colour, 40%) > #333333 +// +// lighten(@main_alt_colour, 26.5%) > #dddddd +// lighten(@main_alt_colour, 20%) > #cccccc +// lighten(@main_alt_colour, 13.5%) > #bbbbbb +// lighten(@main_alt_colour, 6.5%) > #aaaaaa +// lighten(@main_alt_colour, 30%) +@disabled_colour: #dddddd; +@shiny_colour: #f2f2c3; +@red_orange: #ff2000; +@orange: #f8911b; +@lt_orange: #fcaf3e; +@shadow_colour: @main_colour; +@lt_shadow_colour: #888888; +@friendica_blue: #3465a4; +@border2: #babdb6; +@group_show: #9ade00; +@group_hide: #ff4141; +@notice: #511919; +@info: #364e59; +@alert: #ff0000; + +@lt_main_colour: lighten(@bg_colour, 10%); +@dk_main_colour: darken(@bg_colour, 10%); + +//* links */ +@link_colour: #3465a4; +@dk_link_colour: darken(@link_colour, 10%); +@lt_link_colour: lighten(@link_colour, 10%); +//@hover_colour: #729fcf; +@hover_colour: @dk_link_colour; + +// other colours +@med_border_colour: #babdd6; + +//* box shadows */ +@menu_shadow: 5px 0 10px 0 @shadow_colour; +@main_shadow: 3px 3px 3px 10px 0 @shadow_colour; + +// default here was @main_shadow +.box_shadow(@h: 5px, @v: 5px, @blur: 5px, @spread: 0px, @colour: @shadow_colour) { + -moz-box-shadow: @h @v @blur @spread @colour; + -o-box-shadow: @h @v @blur @spread @colour; + -webkit-box-shadow: @h @v @blur @spread @colour; + -ms-box-shadow: @h @v @blur @spread @colour; + box-shadow: @h @v @blur @spread @colour; +} +//* http://css-tricks.com/snippets/css/css-box-shadow/ +//* box-shadow: +//* 1. The horizontal offset of the shadow, positive means +//* the shadow will be on the right of the box, a negative +//* offset will put the shadow on the left of the box. +//* 2. The vertical offset of the shadow, a negative one +//* means the box-shadow will be above the box, a +//* positive one means the shadow will be below the box. +//* 3. The blur radius (optional), if set to 0 the shadow +//* will be sharp, the higher the number, the more blurred +//* it will be. +//* 4. The spread radius (optional), positive values increase +//* the size of the shadow, negative values decrease the size. +//* Default is 0 (the shadow is same size as blur). +//* 5. Colo[u]r +//*/ + +//* text-shadow */ +.text_shadow (@h: 1px, @v: 1px, @c: @shadow_colour) { + -moz-text-shadow: @h @v @c; + -o-text-shadow: @h @v @c; + -webkit-text-shadow: @h @v @c; + -ms-text-shadow: @h @v @c; + text-shadow: @h @v @c; +} +//* transitions */ +.transition (@type: all, @dur: 0.75s, @effect: ease-in-out) { + -webkit-transition: @arguments; + -moz-transition: @arguments; + -o-transition: @arguments; + -ms-transition: @arguments; + transition: @arguments; +} + +//* borders */ +.borders (@size: 1px, @style: solid, @colour: @main_colour) { + border: @size @style @colour; +} +.med_borders (@sz: 2px, @st: solid, @c: @med_border_colour) { + border: @sz @st @c; +} +//* rounded box corners */ +.rounded_corners (@r: 5px) { + -o-border-radius: @r; + -webkit-border-radius: @r; + -moz-border-radius: @r; + -ms-border-radius: @r; + border-radius: @r; +} +.text_overflow (@t: ellipsis) { + -moz-text-overflow: @t; + -ms-text-verflow: @t; + -o-text-overflow: @t; + -webkit-text-overflow: @t; + text-overflow: @t; +} + +//* pre wrap */ +.wrap () { + white-space: pre-wrap; + white-space: pre; + word-wrap: none; +} +//* font size sizing */ +.default_font () { + font-size: 14pt; + line-height: 1.1em; + font-family: sans-serif; +} +.font_size_adjust () { + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + -o-text-size-adjust: 100%; + font-size-adjust: 100%; +} + +//* reset ul, ol */ +.list_reset () { + margin: 0px; + padding: 0px; + list-style: none; + list-style-position: inside; +} + +//* box size: width, height */ +.box (@w: 20px, @h: 20px) { + width: @w; + height: @h; +} + |