From: zuber Date: Mon, 26 Oct 2009 12:17:23 +0000 (+0100) Subject: Style przycisków. X-Git-Url: https://git.mdrn.pl/redakcja.git/commitdiff_plain/ca8ebe550fa1fcad2f347d1c2e490e133851d6a4 Style przycisków. --- diff --git a/platforma/static/css/awesome-overlay-sprite.png b/platforma/static/css/awesome-overlay-sprite.png new file mode 100755 index 00000000..ef8dd2d5 Binary files /dev/null and b/platforma/static/css/awesome-overlay-sprite.png differ diff --git a/platforma/static/css/buttons.css b/platforma/static/css/buttons.css new file mode 100644 index 00000000..034c3b7a --- /dev/null +++ b/platforma/static/css/buttons.css @@ -0,0 +1,93 @@ +/* set an awesome color for the buttons */ +button.awesome, +input.awesome, +a.button.awesome { + background-color: #111; +} +/* Touch the rest at your onw risk. */ +button.awesome, +input.awesome, +a.button.awesome { + + font: inherit; + background-repeat: repeat-x; + color: #fff; + text-decoration: none; + position: relative; + cursor: pointer; + border: 0; + font-style: normal; + font-weight: bold; + line-height: 1; + + padding: 5px 10px 6px; + font-size: 13px; + + /* IE only stuff */ + border-bottom: 1px solid transparent\9; + + /* not all browser support these, but who cares? */ + text-shadow: 0 -1px 1px rgba(0,0,0,0.25), -2px 0 1px rgba(0,0,0,0.25); + border-radius: 5px; + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.5); + -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.5); + + /* one image for all states + see http://www.alistapart.com/articles/sprites */ + background-image: url(awesome-overlay-sprite.png); + background-position: 0 0; + + /* cross browser inline block hack + see http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/ */ + display: -moz-inline-stack; + display: inline-block; + vertical-align: middle; + *display: inline !important; + position: relative; + + /* help IE to calm down a bit */ + zoom: 1; + + /*disable text selection (Firefox only)*/ + -moz-user-select: none; +} +/* hide selection background color */ +.awesome::selection { + background: transparent; +} + +button.awesome:hover, +input.awesome:hover, +a.button.awesome:hover { + background-position: 0 -50px; + color: #fff; +} +button.awesome:active, +input.awesome:active, +a.button.awesome:active { + background-position: 0 100%; + -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.7); + /* unfortunately, Safari seems not to support inset yet */ + -webkit-box-shadow: none; + + /* IE only stuff */ + border-bottom: 0\9; + border-top: 1px solid #666\9; +} + +/* Remove extra padding in Firefox */ +button::-moz-focus-inner { + border: 0; + padding: 0; +} + +button.awesome.small, input.awesome.small, a.button.awesome.small { padding: 4px 7px 5px; font-size: 10px; } +button.awesome.small:active, input.awesome.small:active, a.button.awesome.small:active { padding: 5px 7px 4px; } +button.awesome.medium, input.awesome.medium, a.button.awesome.medium { /* default */ } +button.awesome.medium:active, input.awesome.medium:active, a.button.awesome.medium:active { padding: 6px 10px 5px; } +button.awesome.large, input.awesome.large, a.button.awesome.large { padding: 8px 14px 9px; font-size: 14px; } +button.awesome.large:active, input.awesome.large:active, a.button.awesome.large:active { padding: 9px 14px 8px; } + +.awesome.green { background-color: #3ACC00 !important; }