encapsulating all css
Oleg
committed Aug 05, 2011
commit acd643fc4693158c72a442b20795172eb40a0641
Showing 5
changed files with
107 additions
and 104 deletions
app/assets/stylesheets/comfortable_mexican_sofa/content.css
+15
-15
| @@ | @@ -59,7 +59,7 @@ |
| } | |
| /* -- Listings ----------------------------------------------------------- */ | |
| - | ul.list li .item { |
| + | #cms_body ul.list li .item { |
| overflow: hidden; | |
| padding: 5px; | |
| background-color: #f1f1f1; | |
| @@ | @@ -67,62 +67,62 @@ ul.list li .item { |
| -moz-border-radius: 3px; | |
| margin-bottom: 5px; | |
| } | |
| - | ul.list li .item .toggle { |
| + | #cms_body ul.list li .item .toggle { |
| float: left; | |
| height: 28px; | |
| width: 28px; | |
| } | |
| - | ul.list li .item .toggle a { |
| + | #cms_body ul.list li .item .toggle a { |
| display: block; | |
| height: 28px; | |
| width: 28px; | |
| background: url(/assets/comfortable_mexican_sofa/arrow_right.gif) center center no-repeat; | |
| } | |
| - | ul.list li .item .toggle a span { |
| + | #cms_body ul.list li .item .toggle a span { |
| display: none; | |
| } | |
| - | ul.list li .item .toggle.open a { |
| + | #cms_body ul.list li .item .toggle.open a { |
| background-image: url(/assets/comfortable_mexican_sofa/arrow_bottom.gif); | |
| } | |
| - | ul.list li .item .icon { |
| + | #cms_body ul.list li .item .icon { |
| float: left; | |
| width: 28px; | |
| height: 28px; | |
| background: url(/assets/comfortable_mexican_sofa/icon_regular.gif); | |
| } | |
| - | ul.list li .item .icon .dragger { |
| + | #cms_body ul.list li .item .icon .dragger { |
| width: 28px; | |
| height: 28px; | |
| background: url(/assets/comfortable_mexican_sofa/icon_move.gif); | |
| cursor: move; | |
| display: none; | |
| } | |
| - | ul.list li .item .icon:hover .dragger { |
| + | #cms_body ul.list li .item .icon:hover .dragger { |
| display: block; | |
| } | |
| - | ul.list li .item .icon .dragger span { |
| + | #cms_body ul.list li .item .icon .dragger span { |
| display: none; | |
| } | |
| - | ul.list li .item .label { |
| + | #cms_body ul.list li .item .label { |
| margin-left: 60px; | |
| font-size: 14px; | |
| font-weight: bold; | |
| } | |
| - | ul.list li .item .label .sublabel { |
| + | #cms_body ul.list li .item .label .sublabel { |
| font-size: 10px; | |
| font-weight: normal; | |
| } | |
| - | ul.list li ul { |
| + | #cms_body ul.list li ul { |
| margin-left: 28px; | |
| } | |
| - | ul.list li .action_links { |
| + | #cms_body ul.list li .action_links { |
| float: right; | |
| opacity: 0.2; | |
| } | |
| - | ul.list li .item:hover .action_links { |
| + | #cms_body ul.list li .item:hover .action_links { |
| opacity: 1; | |
| } | |
| - | ul.list li .item:hover { |
| + | #cms_body ul.list li .item:hover { |
| background-color: #fff; | |
| } | |
app/assets/stylesheets/comfortable_mexican_sofa/form.css
+37
-37
| @@ | @@ -1,9 +1,9 @@ |
| /* -- Forms -------------------------------------------------------------- */ | |
| - | .form_element { |
| + | #cms_body .form_element { |
| overflow: hidden; | |
| margin-bottom: 5px; | |
| } | |
| - | .form_element .label { |
| + | #cms_body .form_element .label { |
| width: 117px; | |
| float: left; | |
| text-align: right; | |
| @@ | @@ -17,38 +17,38 @@ |
| -moz-border-radius-bottomleft: 3px; | |
| border-right: 3px solid #bbb; | |
| } | |
| - | .form_element .value { |
| + | #cms_body .form_element .value { |
| margin-left: 150px; | |
| overflow: hidden; | |
| } | |
| - | .form_element .value input[type='text'], |
| - | .form_element .value input[type='password'], |
| - | .form_element .value input[type='datetime'], |
| - | .form_element .value input[type='number'], |
| - | .form_element .value select, |
| - | .form_element .value textarea { |
| + | #cms_body .form_element .value input[type='text'], |
| + | #cms_body .form_element .value input[type='password'], |
| + | #cms_body .form_element .value input[type='datetime'], |
| + | #cms_body .form_element .value input[type='number'], |
| + | #cms_body .form_element .value select, |
| + | #cms_body .form_element .value textarea { |
| border: 0px; | |
| width: 100%; | |
| padding: 2px 0px; | |
| font-family: 'Courier New', Courier, monospace; | |
| } | |
| - | .form_element .value input[type='datetime'], |
| - | .form_element .value input[type='number'] { |
| + | #cms_body .form_element .value input[type='datetime'], |
| + | #cms_body .form_element .value input[type='number'] { |
| width: 200px; | |
| } | |
| - | .form_element .value textarea { |
| + | #cms_body .form_element .value textarea { |
| height: 300px; | |
| } | |
| - | .form_element .value .CodeMirror-wrapping { |
| + | #cms_body .form_element .value .CodeMirror-wrapping { |
| background-color: #fff; | |
| } | |
| - | .form_element.check_box_element input { |
| + | #cms_body .form_element.check_box_element input { |
| width: auto; | |
| } | |
| - | .page_form_extras { |
| + | #cms_body .page_form_extras { |
| margin-bottom: 10px; | |
| } | |
| - | #form_blocks .no_tags { |
| + | #cms_body #form_blocks .no_tags { |
| background-color: #252525; | |
| color: #aaa; | |
| border-radius: 3px; | |
| @@ | @@ -56,30 +56,30 @@ |
| text-align: center; | |
| padding: 10px; | |
| } | |
| - | #form_blocks .no_tags a { |
| + | #cms_body #form_blocks .no_tags a { |
| color: #fff; | |
| } | |
| - | #form_blocks .no_tags a:hover { |
| + | #cms_body #form_blocks .no_tags a:hover { |
| color: #aaa; | |
| text-decoration: underline; | |
| } | |
| - | #form_blocks .no_tags code { |
| + | #cms_body #form_blocks .no_tags code { |
| color: #B85042; | |
| } | |
| - | .form_element.field_datetime .label, |
| - | .form_element.field_integer .label, |
| - | .form_element.field_string .label, |
| - | .form_element.field_text .label { |
| + | #cms_body .form_element.field_datetime .label, |
| + | #cms_body .form_element.field_integer .label, |
| + | #cms_body .form_element.field_string .label, |
| + | #cms_body .form_element.field_text .label { |
| border-color: #48699C; | |
| } | |
| - | .form_element.page_datetime .label, |
| - | .form_element.page_integer .label, |
| - | .form_element.page_string .label, |
| - | .form_element.page_text .label, |
| - | .form_element.page_rich_text .label { |
| + | #cms_body .form_element.page_datetime .label, |
| + | #cms_body .form_element.page_integer .label, |
| + | #cms_body .form_element.page_string .label, |
| + | #cms_body .form_element.page_text .label, |
| + | #cms_body .form_element.page_rich_text .label { |
| border-color: #3F7300; | |
| } | |
| - | .form_error { |
| + | #cms_body .form_error { |
| background-color: #9e0b0f; | |
| font-size: 14px; | |
| color: #fff; | |
| @@ | @@ -87,31 +87,31 @@ |
| text-align: center; | |
| margin-bottom: 10px; | |
| } | |
| - | .form_element.errors .label { |
| + | #cms_body .form_element.errors .label { |
| border-color: #9e0b0f; | |
| } | |
| - | .form_element.errors .errors { |
| + | #cms_body .form_element.errors .errors { |
| margin: 2px 0px 0px 150px; | |
| font-size: 11px; | |
| color: #9e0b0f; | |
| } | |
| - | .form_element.submit_element { |
| + | #cms_body .form_element.submit_element { |
| margin-top: 10px; | |
| } | |
| - | .form_element.submit_element .value { |
| + | #cms_body .form_element.submit_element .value { |
| background-color: #f1f1f1; | |
| border-radius: 3px; | |
| -moz-border-radius: 3px; | |
| padding: 5px; | |
| } | |
| - | .form_element.submit_element label { |
| + | #cms_body .form_element.submit_element label { |
| margin: 0px 5px; | |
| } | |
| - | .form_element.submit_element input[name='commit'], |
| - | .form_element.submit_element input[name='save'] { |
| + | #cms_body .form_element.submit_element input[name='commit'], |
| + | #cms_body .form_element.submit_element input[name='save'] { |
| float: right; | |
| } | |
| - | .form_element .desc { |
| + | #cms_body .form_element .desc { |
| margin: 2px 0px 0px 150px; | |
| font-size: 11px; | |
| color: #777; | |
app/assets/stylesheets/comfortable_mexican_sofa/structure.css
+45
-42
| @@ | @@ -1,39 +1,42 @@ |
| /* -- Containers --------------------------------------------------------- */ | |
| - | html, body { |
| + | html { |
| + | height: 100%; |
| + | } |
| + | body#cms_body { |
| height: 100%; | |
| background-color: #252525; | |
| } | |
| - | .body_wrapper { |
| + | #cms_body .body_wrapper { |
| height: 100%; | |
| } | |
| - | .left_column { |
| + | #cms_body .left_column { |
| width: 175px; | |
| float: left; | |
| } | |
| - | .center_column { |
| + | #cms_body .center_column { |
| position: relative; | |
| margin: 0px 250px 0px 175px; | |
| min-height: 100%; | |
| background-color: #e6e6e6; | |
| } | |
| - | .center_column .center_column_content { |
| + | #cms_body .center_column .center_column_content { |
| padding: 25px; | |
| } | |
| - | .right_column { |
| + | #cms_body .right_column { |
| width: 250px; | |
| float: right; | |
| } | |
| - | .right_column_content { |
| + | #cms_body .right_column_content { |
| padding: 25px 10px; | |
| width: 230px; | |
| position: fixed; | |
| } | |
| - | .left_column_content { |
| + | #cms_body .left_column_content { |
| padding: 25px 0px 25px 10px; | |
| width: 165px; | |
| position: fixed; | |
| } | |
| - | .left_column_content ul.nav a { |
| + | #cms_body .left_column_content ul.nav a { |
| display: block; | |
| padding: 3px 10px; | |
| margin-bottom: 5px; | |
| @@ | @@ -48,17 +51,17 @@ html, body { |
| color: #fff; | |
| opacity: 0.3; | |
| } | |
| - | .left_column_content ul.nav a:hover, |
| - | .left_column_content ul.nav a.active { |
| + | #cms_body .left_column_content ul.nav a:hover, |
| + | #cms_body .left_column_content ul.nav a.active { |
| color: #fff; | |
| opacity: 1; | |
| } | |
| - | .right_column_content h2 { |
| + | #cms_body .right_column_content h2 { |
| color: #d8d8d8; | |
| text-shadow: #000 1px 1px; | |
| margin-bottom: 5px; | |
| } | |
| - | .right_column_content .box { |
| + | #cms_body .right_column_content .box { |
| background-color: #484848; | |
| padding: 5px; | |
| border-radius: 3px; | |
| @@ | @@ -68,24 +71,24 @@ html, body { |
| color: #fff; | |
| } | |
| /* -- Flash Messages ----------------------------------------------------- */ | |
| - | .flash { |
| + | #cms_body .flash { |
| text-align: center; | |
| padding: 8px; | |
| color: #fff; | |
| background-color: #066B12; | |
| } | |
| - | .flash.error { |
| + | #cms_body .flash.error { |
| background-color: #9e0b0f; | |
| } | |
| /* -- Buttons ------------------------------------------------------------ */ | |
| - | a.button, |
| - | button, |
| - | input[type='button'], |
| - | input[type='submit'], |
| - | input[type='reset'], |
| - | input[type='file'], |
| - | .action_links a, |
| - | a.ui-dialog-titlebar-close { |
| + | #cms_body a.button, |
| + | #cms_body button, |
| + | #cms_body input[type='button'], |
| + | #cms_body input[type='submit'], |
| + | #cms_body input[type='reset'], |
| + | #cms_body input[type='file'], |
| + | #cms_body .action_links a, |
| + | #cms_body a.ui-dialog-titlebar-close { |
| margin-left: 3px; | |
| background-color: #b4b4b4; | |
| color: #1b1b1b; | |
| @@ | @@ -99,34 +102,34 @@ a.ui-dialog-titlebar-close { |
| background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F9F9F9), color-stop(34%,#D5D5D5), color-stop(100%,#B4B4B4)); | |
| text-shadow: #f5f5f5 1px 1px; | |
| } | |
| - | a.button:hover, |
| - | button:hover, |
| - | input[type='button']:hover, |
| - | input[type='submit']:hover, |
| - | input[type='reset']:hover, |
| - | input[type='file']:hover, |
| - | .action_links a:hover, |
| - | a.ui-dialog-titlebar-close:hover { |
| + | #cms_body a.button:hover, |
| + | #cms_body button:hover, |
| + | #cms_body input[type='button']:hover, |
| + | #cms_body input[type='submit']:hover, |
| + | #cms_body input[type='reset']:hover, |
| + | #cms_body input[type='file']:hover, |
| + | #cms_body .action_links a:hover, |
| + | #cms_body a.ui-dialog-titlebar-close:hover { |
| box-shadow: inset 0px 0px 5px #aaa; | |
| -moz-box-shadow: inset 0px 0px 5px #aaa; | |
| -webkit-box-shadow: inset 0px 0px 5px #aaa; | |
| border-color: #484848; | |
| } | |
| - | a.button.big, |
| - | button, |
| - | input[type='button'], |
| - | input[type='submit'], |
| - | input[type='reset'], |
| - | input[type='file'] { |
| + | #cms_body a.button.big, |
| + | #cms_body button, |
| + | #cms_body input[type='button'], |
| + | #cms_body input[type='submit'], |
| + | #cms_body input[type='reset'], |
| + | #cms_body input[type='file'] { |
| padding: 3px 10px; | |
| font-size: 10px; | |
| letter-spacing: 0.5px; | |
| } | |
| - | a.button.big { |
| + | #cms_body a.button.big { |
| float: right; | |
| } | |
| /* -- Sofa Version ------------------------------------------------------- */ | |
| - | .center_column .sofa { |
| + | #cms_body .center_column .sofa { |
| position: absolute; | |
| background: #000; | |
| bottom: 0px; | |
| @@ | @@ -135,13 +138,13 @@ a.button.big { |
| padding: 5px 10px; | |
| font-size: 10px; | |
| } | |
| - | .center_column .sofa a { |
| + | #cms_body .center_column .sofa a { |
| color: #484848; | |
| } | |
| - | .center_column .sofa a:hover { |
| + | #cms_body .center_column .sofa a:hover { |
| color: #f1f1f1; | |
| } | |
| - | .center_column .sofa span.version { |
| + | #cms_body .center_column .sofa span.version { |
| color: #f1f1f1; | |
| font-size: 9px; | |
| margin-left: 2px; | |
app/assets/stylesheets/comfortable_mexican_sofa/typography.css
+9
-9
| @@ | @@ -1,8 +1,8 @@ |
| - | body { |
| + | body#cms_body { |
| font: 13px 'Lucida Grande', 'Tahoma', sans-serif; | |
| } | |
| - | h1 { |
| + | #cms_body h1 { |
| font: bold 25px/25px 'Lucida Grande', 'Tahoma', serif; | |
| margin-bottom: 25px; | |
| padding-bottom: 5px; | |
| @@ | @@ -10,27 +10,27 @@ h1 { |
| text-shadow: #fff 1px 1px; | |
| border-bottom: 2px solid #9f9f9f; | |
| } | |
| - | h2 { |
| + | #cms_body h2 { |
| font: bold 16px/16px 'Lucida Grande', 'Tahoma', serif; | |
| text-shadow: #fff 1px 1px; | |
| margin-bottom: 15px; | |
| } | |
| - | h1 + h2 { |
| + | #cms_body h1 + h2 { |
| margin-top: -15px; | |
| } | |
| - | a { |
| + | #cms_body a { |
| text-decoration: none; | |
| color: #384E66; | |
| } | |
| - | a:hover { |
| + | #cms_body a:hover { |
| color: #1C2733; | |
| } | |
| - | strong { |
| + | #cms_body strong { |
| font-weight: bold; | |
| } | |
| - | em { |
| + | #cms_body em { |
| font-style: italic; | |
| } | |
| - | code { |
| + | #cms_body code { |
| font: 13px Consolas, Monaco, Courier New, Courier, monospace; | |
| } | |
| \ No newline at end of file | |
app/views/layouts/cms_admin/_body.html.erb
+1
-1
| @@ | @@ -1,4 +1,4 @@ |
| - | <body class='c_<%= params[:controller].idify %> a_<%= params[:action].idify %>'> |
| + | <body id='cms_body' class='c_<%= params[:controller].idify %> a_<%= params[:action].idify %>'> |
| <div class='body_wrapper'> | |
| <div class='left_column'> | |
| <div class='left_column_content'> | |