diff options
Diffstat (limited to 'budget/static')
| -rw-r--r-- | budget/static/awesome/awesome-buttons.css | 106 | ||||
| -rw-r--r-- | budget/static/awesome/awesome.css | 29 | ||||
| -rw-r--r-- | budget/static/main.css | 49 | ||||
| -rw-r--r-- | budget/static/uniform/blue.uni-form.css | 151 | ||||
| -rwxr-xr-x | budget/static/uniform/uni-form.css | 164 |
5 files changed, 452 insertions, 47 deletions
diff --git a/budget/static/awesome/awesome-buttons.css b/budget/static/awesome/awesome-buttons.css new file mode 100644 index 0000000..7b38e13 --- /dev/null +++ b/budget/static/awesome/awesome-buttons.css @@ -0,0 +1,106 @@ +/* + awesome buttons are based on a blog post by ZERB + Read there blog post for more information: + "Super awesome Buttons with CSS3 and RGBA":http://www.zurb.com/article/266/super-awesome-buttons-with-css3-and-rgba + + this buttons are even more awesome, as the need only one color for all three states, + and have an super awesome onclick state +*/ + +/* set an awesome color for the buttons, feel free to add new colors like an .awesome.green or .awesome.secondary */ +.awesome { + background-color: #111 !important; + color: #fff !important; +} + +/* the awesome size gets set here. Feel Free to add new sizes, like .awesome.small or .small.large */ +.awesome { padding: 5px 10px 6px !important; font-size: 13px !important; } +.awesome:active { padding: 6px 10px 5px !important; } + +/* Touch the rest at your onw risk. */ +.awesome { + border: 0 !important; + cursor: pointer !important; + font-style: normal !important; + font-weight: bold !important; + font: inherit !important; + line-height: 1 !important; + position: relative !important; + text-align: cente !important; + text-decoration: none !important; + + /* vertical margin is the oposite of button's awesomeness */ + margin-top: 0 !important; + margin-bottom: 0 !important; + + /* 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) !important; + + border-radius: 5px !important; + -moz-border-radius: 5px !important; + -webkit-border-radius: 5px !important; + box-shadow: 0 1px 2px rgba(0,0,0,0.5) !important; + -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.5) !important; + -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.5) !important; + + /* who needs images these days? */ + background-image: -moz-linear-gradient(top, rgba(255,255,255,.2), rgba(150,150,150,.2), rgba(0,0,0,.0)) !important; + background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.2)), color-stop(0.5, rgba(150,150,150,.2)), to(rgba(0,0,0,.0))) !important; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#30ffffff,endColorstr=#10000000) progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135,strength=2); + + /* 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 !important; + *display: inline !important; + position: relative; + + /* IE luv */ + zoom: 1; + + /*disable text selection (Firefox only)*/ + -moz-user-select: none; +} + +/* OPERA only + if there is no border set, Opera shows a transparent background-color if border-radius is set. */ +@media all and (-webkit-min-device-pixel-ratio:10000),not all and (-webkit-min-device-pixel-ratio:0) { + input.awesome { + border: 1px solid RGBa(0,0,0,0) !important; + } +} + +/* hide selection background color */ +.awesome::selection { + background: transparent; +} + +.awesome { + outline: 0; /*remove dotted line, works for links only*/ +} +.awesome::-moz-focus-inner { + border: none; /* remove dotted lines for buttons */ +} +.awesome:focus, +.awesome:hover { + background-image: -moz-linear-gradient(top, rgba(255,255,255,.4), rgba(150,150,150,.3), rgba(0,0,0,.0)) !important; + background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)), color-stop(0.5, rgba(150,150,150,.3)), to(rgba(0,0,0,.0))) !important; + #filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#50ffffff,endColorstr=#20000000) progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135,strength=2); +} +.awesome:active { + background-image: -moz-linear-gradient(top, rgba(0,0,0,.2), rgba(150,150,150,.2), rgba(255,255,255,.2)) !important; + background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.2)), color-stop(0.5, rgba(150,150,150,.2)), to(rgba(255,255,255,.2))) !important; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#20000000,endColorstr=#50ffffff) progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=315,strength=1); + + box-shadow: inset 0 1px 2px rgba(0,0,0,0.7) !important; + -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.7) !important; + -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.7) !important; +} + +/* Safari doesn't support inset box shadow, so we better remove it */ +@media screen and (-webkit-min-device-pixel-ratio:0){ + .awesome:active { + -webkit-box-shadow: none; + } +}
\ No newline at end of file diff --git a/budget/static/awesome/awesome.css b/budget/static/awesome/awesome.css new file mode 100644 index 0000000..47c624a --- /dev/null +++ b/budget/static/awesome/awesome.css @@ -0,0 +1,29 @@ +@import url('awesome-buttons.css'); + +/* awesome buttons extensions */ +.awesome.blue { + background-color: #0A50FF !important; +} +.awesome.red { + background-color: #e33100 !important; +} +.awesome.green { + background-color: #3ACC00 !important; +} +.awesome.orange { + background-color: #ff8f0b !important; +} +.awesome.small { + padding: 4px 7px 5px !important; + font-size: 10px !important; +} +.awesome.small:active { + padding: 5px 7px 4px !important; +} +.awesome.large { + padding: 8px 14px 9px !important; + font-size: 14px !important; +} +.awesome.large:active { + padding: 9px 14px 8px !important; +} diff --git a/budget/static/main.css b/budget/static/main.css index d8f25f9..8520d94 100644 --- a/budget/static/main.css +++ b/budget/static/main.css @@ -1,5 +1,6 @@ @import url('blueprint/screen.css'); -@import url('awesome.css'); +@import url('awesome/awesome.css'); +@import url('uniform/blue.uni-form.css'); /** CSS3 fonts **/ @import url(http://fonts.googleapis.com/css?family=Lobster); @@ -20,10 +21,6 @@ margin-right: 20px; } -#share{ - float:right; -} - #content h2 { font-weight: bold; text-shadow: #DDD 2px 5px 2px; @@ -46,45 +43,3 @@ a { color: #a45900; } - -/** Recipe **/ -.recipe-title{ - font-family: 'Vibur', arial, serif; - font-size: 2.5em; -} - -.recipe-ingredients{ - float: right; - width: 24em; - margin: 0 40px; - margin-top: -60px; -} - -dl.recipe-ingredients -{ - width: 24em; - margin: 2em 0; - padding: 0; - font-family: georgia, times, serif; -} - -.recipe-ingredients dt -{ - width: 7em; - float: left; - margin: 0 0 0 0; - padding: .5em; - border-top: 1px solid #999; - font-weight: bold; -} - -dt { clear: both; } - -.recipe-ingredients dd -{ - float: left; - width: 13em; - margin: 0 0 0 0; - padding: .5em; - border-top: 1px solid #999; -} diff --git a/budget/static/uniform/blue.uni-form.css b/budget/static/uniform/blue.uni-form.css new file mode 100644 index 0000000..adb5ff6 --- /dev/null +++ b/budget/static/uniform/blue.uni-form.css @@ -0,0 +1,151 @@ +@import url('uni-form.css'); + +/* ------------------------------------------------------------------------------ + + UNI-FORM BLUE by DRAGAN BABIC (v2) | Wed, 31 Mar 10 + + ------------------------------------------------------------------------------ + + Copyright (c) 2010, Dragan Babic + + Permission is hereby granted, free of charge, to any person + obtaining a copy of this software and associated documentation + files (the "Software"), to deal in the Software without + restriction, including without limitation the rights to use, + copy, modify, merge, publish, distribute, sublicense, and/or sell + copies of the Software, and to permit persons to whom the + Software is furnished to do so, subject to the following + conditions: + + The above copyright notice and this permission notice shall be + included in all copies or substantial portions of the Software. + + THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, + EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES + OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND + NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT + HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, + WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING + FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR + OTHER DEALINGS IN THE SOFTWARE. + + ------------------------------------------------------------------------------ */ + +.uniForm{} + + .uniForm legend{ font-weight: bold; font-size: 100%; margin: 0; padding: 1.5em 0; } + + .uniForm .ctrlHolder{ padding: 1em; } + .uniForm .ctrlHolder.focused{ background: #e1f0f6; } + + .uniForm .buttonHolder{ background: #c4ced1; text-align: right; margin: 1.5em 0 0 0; padding: 1.5em; + /* CSS3 */ + border-radius: 4px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + -o-border-radius: 4px; + -khtml-border-radius: 4px; + } + .uniForm .buttonHolder .primaryAction{ padding: 10px 22px; line-height: 1; background: #254a86; border: 1px solid #163362; font-size: 12px; font-weight: bold; color: #fff; + /* CSS3 */ + border-radius: 4px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + -o-border-radius: 4px; + -khtml-border-radius: 4px; + box-shadow: 1px 1px 0 #d5e2e7; + -webkit-box-shadow: 1px 1px 0 #d5e2e7; + -moz-box-shadow: 1px 1px 0 #d5e2e7; + text-shadow: -1px -1px 0 rgba(0,0,0,.25); + } + .uniForm .buttonHolder .primaryAction:active{ position: relative; top: 1px; } + .uniForm .secondaryAction { text-align: left; } + .uniForm button.secondaryAction { background: transparent; border: none; color: #777; margin: 1.25em 0 0 0; padding: 0; } + + .uniForm .inlineLabels label em, + .uniForm .inlineLabels .label em{ font-style: normal; font-weight: bold; } + .uniForm label small{ font-size: .75em; color: #777; } + + .uniForm .textInput, + .uniForm textarea { padding: 4px 2px; border: 1px solid #b2babe; background: #fff; + /* CSS3 */ + border-radius: 3px; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + -o-border-radius: 3px; + -khtml-border-radius: 3px; + } + .uniForm textarea { height: 12em; } + + .uniForm .ctrlHolder ul li label{ font-size: .85em; } + + /* Get rid of the 'glow' effect in WebKit, optional */ + .uniForm .ctrlHolder .textInput:focus, + .uniForm .ctrlHolder textarea:focus{ outline: none; } + + .uniForm .formHint { font-size: .85em; color: #777; } + .uniForm .inlineLabels .formHint { padding-top: .5em; } + .uniForm .ctrlHolder.focused .formHint{ color: #333; } + +/* ----------------------------------------------------------------------------- */ +/* ############################### Messages #################################### */ +/* ----------------------------------------------------------------------------- */ + + /* Error message at the top of the form */ + .uniForm #errorMsg{ background: #c20f2e; color: #fff; margin: 0 0 1.5em 0; padding: 1px 1.5em; + /* CSS3 */ + border-radius: 4px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + -o-border-radius: 4px; + -khtml-border-radius: 4px; + box-shadow: 0 0 14px rgba(0,0,0,.25); + -webkit-box-shadow: 0 0 14px rgba(0,0,0,.25); + -moz-box-shadow: 0 0 14px rgba(0,0,0,.25); + } + .uniForm #errorMsg ol{ margin: 0 0 1.5em 0; padding: 0; } + .uniForm #errorMsg ol li{ margin: 0 0 3px 1.5em; padding: 7px; background: #a20d27; position: relative; font-size: .85em; + /* CSS3 */ + border-radius: 4px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + -o-border-radius: 4px; + -khtml-border-radius: 4px; + } + + .uniForm .ctrlHolder.error, + .uniForm .ctrlHolder.focused.error{ color: #c20f2e; + /* CSS3 */ + border-radius: 4px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + -o-border-radius: 4px; + -khtml-border-radius: 4px; + } + .uniForm .ctrlHolder.error input.error, + .uniForm .ctrlHolder.error select.error, + .uniForm .ctrlHolder.error textarea.error{ border-color: #c20f2e; } + + /* Success messages at the top of the form */ + .uniForm #okMsg{ background: #59a20e; color: #343434; margin: 0 0 1.5em 0; padding: 1.5em; text-align: center; + /* CSS3 */ + border-radius: 4px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + -o-border-radius: 4px; + -khtml-border-radius: 4px; + box-shadow: 0 0 14px rgba(0,0,0,.25); + -webkit-box-shadow: 0 0 14px rgba(0,0,0,.25); + -moz-box-shadow: 0 0 14px rgba(0,0,0,.25); + text-shadow: 1px 1px 0 rgba(255,255,255,.25); + } + .uniForm #okMsg p{ margin: 0; } + +/* ----------------------------------------------------------------------------- */ +/* ############################### Columns ##################################### */ +/* ----------------------------------------------------------------------------- */ + + .uniForm .col{ margin-bottom: 1.5em; } + /* Use .first and .last classes to control the layout/spacing of your columns */ + .uniForm .col.first{ width: 49%; float: left; clear: none; } + .uniForm .col.last { width: 49%; float: right; clear: none; margin-right: 0; } diff --git a/budget/static/uniform/uni-form.css b/budget/static/uniform/uni-form.css new file mode 100755 index 0000000..d0aca26 --- /dev/null +++ b/budget/static/uniform/uni-form.css @@ -0,0 +1,164 @@ +/* ------------------------------------------------------------------------------ + + Copyright (c) 2010, Dragan Babic + + Permission is hereby granted, free of charge, to any person + obtaining a copy of this software and associated documentation + files (the "Software"), to deal in the Software without + restriction, including without limitation the rights to use, + copy, modify, merge, publish, distribute, sublicense, and/or sell + copies of the Software, and to permit persons to whom the + Software is furnished to do so, subject to the following + conditions: + + The above copyright notice and this permission notice shall be + included in all copies or substantial portions of the Software. + + THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, + EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES + OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND + NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT + HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, + WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING + FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR + OTHER DEALINGS IN THE SOFTWARE. + + ------------------------------------------------------------------------------ */ +/* ############################# GENERALS ################################### */ +/* ------------------------------------------------------------------------------ */ + +.uniForm{ margin: 0; padding: 0; position: relative; z-index: 1; } /* reset stuff */ + + /* Some generals and more resets */ + .uniForm fieldset{ border: none; margin: 0; padding: 0; } + .uniForm fieldset legend{ margin: 0; padding: 0; } + + /* This are the main units that contain form elements */ + .uniForm .ctrlHolder, + .uniForm .buttonHolder{ margin: 0; padding: 0; clear: both; } + + /* Clear all floats */ + .uniForm:after, + .uniForm .buttonHolder:after, + .uniForm .ctrlHolder:after, + .uniForm .ctrlHolder .multiField:after, + .uniForm .inlineLabel:after{ content: "."; display: block; height: 0; line-height: 0; font-size: 0; clear: both; min-height: 0; visibility: hidden; } + + .uniForm label, + .uniForm button{ cursor: pointer; } + +/* ------------------------------------------------------------------------------ */ +/* ########################## DEFAULT LAYOUT ################################ */ +/* ------------------------------------------------------------------------------ */ +/* Styles for form controls where labels are above the input elements */ +/* ------------------------------------------------------------------------------ */ + + .uniForm label, + .uniForm .label{ display: block; float: none; margin: 0 0 .5em 0; padding: 0; line-height: 100%; width: auto; } + + /* Float the input elements */ + .uniForm .textInput, + .uniForm .fileUpload, + .uniForm .selectInput, + .uniForm select, + .uniForm textarea{ float: left; width: 53%; margin: 0; } + + /* Read-Only output */ + .uniForm .readOnlyLabel{ margin: 0; font-size: 1em; font-weight: bold; } + .uniForm .readOnly{ font-size: .85em; } + .uniForm .readOnly .choiceLabel{ color: #777; text-transform: uppercase; font-size: .75em; letter-spacing: .15em; } + + /* Postition the hints */ + .uniForm .formHint{ float: right; width: 43%; margin: 0; clear: none; } + + /* Position the elements inside combo boxes (multiple inputs/selects/checkboxes/radio buttons per unit) */ + .uniForm ul{ float: left; width: 53%; margin: 0; padding: 0; } + .uniForm ul li{ margin: 0 0 .5em 0; list-style: none; } + .uniForm ul li label{ margin: 0; float: none; display: block; overflow: visible; } + /* Alternate layout */ + .uniForm ul.alternate li{ float: left; width: 30%; margin-right: 3%; } + .uniForm ul.alternate li label{ float: none; display: block; width: 98%; } + .uniForm ul .textInput, + .uniForm ul .selectInput, + .uniForm ul select, + .uniForm ul.alternate .textInput, + .uniForm ul.alternate .selectInput, + .uniForm ul.alternate select{ width: 98%; margin-top: .5em; display: block; float: none; } + + /* Required fields asterisk styling */ + .uniForm label em, + .uniForm .label em{ float: left; width: 1em; margin: 0 0 0 -1em; } + +/* ------------------------------------------------------------------------------ */ +/* ######################### ALTERNATE LAYOUT ############################### */ +/* ------------------------------------------------------------------------------ */ +/* Styles for form controls where labels are in line with the input elements */ +/* Set the class of the parent (preferably to a fieldset) to .inlineLabels */ +/* ------------------------------------------------------------------------------ */ + + .uniForm .inlineLabels label, + .uniForm .inlineLabels .label, + .uniForm .inlineLabels .readOnlyLabel{ float: left; margin: .3em 2% 0 0; padding: 0; line-height: 1; position: relative; width: 32%; } + + .uniForm .inlineLabels .readOnlyLabel{ margin: 0; } + + /* Float the input elements */ + .uniForm .inlineLabels .textInput, + .uniForm .inlineLabels .fileUpload, + .uniForm .inlineLabels .selectInput, + .uniForm .inlineLabels select, + .uniForm .inlineLabels textarea{ float: left; width: 64%; } + + /* Postition the hints */ + .uniForm .inlineLabels .formHint{ clear: both; float: none; width: auto; margin-left: 34%; position: static; } + + /* Position the elements inside combo boxes (multiple inputs/selects/checkboxes/radio buttons per unit) */ + .uniForm .inlineLabels ul{ float: left; width: 66%; } + .uniForm .inlineLabels ul li{ margin: .5em 0; } + .uniForm .inlineLabels ul li label{ float: none; display: block; width: 100%; } + /* Alternate layout */ + .uniForm .inlineLabels ul.alternate li{ margin-right: 3%; margin-top: .25em; } + .uniForm .inlineLabels ul li label .textInput, + .uniForm .inlineLabels ul li label textarea, + .uniForm .inlineLabels ul li label select{ float: none; display: block; width: 98%; } + + .uniForm .inlineLabels .readOnly{ float: right; width: 66%; } + + /* Required fields asterisk styling */ + .uniForm .inlineLabels label em, + .uniForm .inlineLabels .label em{ display: block; float: none; margin: 0; position: absolute; right: 0; } + +/* ----------------------------------------------------------------------------- */ +/* ########################### Additional Stuff ################################ */ +/* ----------------------------------------------------------------------------- */ + + /* Generals */ + .uniForm legend{ color: inherit; } + + .uniForm .secondaryAction{ float: left; } + + /* .inlineLabel is used for inputs within labels - checkboxes and radio buttons */ + .uniForm .inlineLabel input, + .uniForm .inlineLabels .inlineLabel input, + .uniForm .blockLabels .inlineLabel input, + /* class .inlineLabel is depreciated */ + .uniForm label input{ float: none; display: inline; margin: 0; padding: 0; border: none; } + + .uniForm .buttonHolder .inlineLabel, + .uniForm .buttonHolder label{ float: left; margin: .5em 0 0 0; width: auto; max-width: 60%; text-align: left; } + + /* When you don't want to use a label */ + .uniForm .inlineLabels .noLabel ul{ margin-left: 34%; /* Match to width of label + gap to field */ } + + /* Classes for control of the widths of the fields */ + .uniForm .small { width: 30% !important; } + .uniForm .medium{ width: 45% !important; } + .uniForm .large { } /* Large is default and should match the value you set for .textInput, textarea or select */ + .uniForm .auto { width: auto !important; height: auto !important; } + .uniForm .small, + .uniForm .medium, + .uniForm .auto{ margin-right: 4px; } + +/* Columns */ +.uniForm .col{ float: left; } +.uniForm .col{ width: 50%; }
\ No newline at end of file |