center when big, code cleanup

[wfpl-cms.git] / style.styl

diff --git a/style.styl b/style.styl
index 140571a..9e99de0 100644 (file)
--- a/style.styl
+++ b/style.styl
@@ -25,6 +25,7 @@ columns = wfpl_columns({
        name: 'centerer'
        margin: 15px
        width: centerer_width
+       position: relative
        child: {
                type: 'alternatives'
                full: {
@@ -61,6 +62,8 @@ columns = wfpl_columns({
        }
 })
 
+biggest_content_width = columns['widths']['.centerer.full > .main']
+
 hide_in_one_column_mode = {
        ".centerer.with_sidebar > .sidebar.plain": 1
        ".centerer.with_sidebar > .sidebar.bordered": 1
@@ -205,38 +208,29 @@ body
        font: font_size_normal Arimo, Arial, sans-serif
 
 // call this for each ckeditor on each page
-ckeditor(basename, element_name, width)
+ckeditor_elements_already = {}
+ckeditor(basename, element_name, body_id, width)
        // ckeditor ui, including border around wysiwyg area
-       #{basename}_body #cke_{element_name}
-               margin-left: -15px
-               if width < 650px
-                       width: 680px
-               else
-                       width: width + 30px
+       unless element_name in ckeditor_elements_already
+               ckeditor_elements_already[element_name] = 1
+               #{basename}_body #cke_{element_name}
+                       width: biggest_content_width + 30px
+                       margin-right: -30px
        // body tag of the wysiwyg area
-       #{basename}_wysiwyg_{element_name}
+       #{basename}_wysiwyg_{body_id}
                background: content_bg
                width: width
                margin: 0 auto
-               if width <= 600px
-                       min-width: 0
-                       width: width
-                       margin: 0 auto
-                       border-right: 20px solid #eee
-                       border-left: 20px solid #eee
-                       border-top: 1px solid #eee
-                       border-bottom: 1px solid #eee
-                       min-height: 250px
-
-// FIXME fix this for layouts
-ckeditor('admin_pages', 'content', columns.width)
-
-// outermost div for centering, shadow, etc
-#centerer
-       position: relative
-       background: content_bg
-       padding: site_padding
-       margin: 0 auto
+               min-width: 0
+               width: width
+               margin: 0 auto
+               border: 5px solid #eee
+               min-height: 50px
+
+ckeditor('admin_pages', 'content', 'content_full_main', columns['widths']['.centerer.full > .main'])
+ckeditor('admin_pages', 'content', 'content_with_sidebar_main', columns['widths']['.centerer.with_sidebar > .main'])
+ckeditor('admin_pages', 'sidebar_content', 'content_with_sidebar_sidebar_plain', columns['widths']['.centerer.with_sidebar > .sidebar.plain'])
+ckeditor('admin_pages', 'sidebar_content', 'content_with_sidebar_sidebar_bordered', columns['widths']['.centerer.with_sidebar > .sidebar.bordered'])
 
 body > .centerer > .nav
        padding-bottom: 20px
@@ -407,12 +401,17 @@ table.evenodd
 for selector, css in columns.css
        body > {selector}
                {css}
+
+// center when big
+body > .centerer
+       margin: 0 auto
+
 @media screen and (max-width: (columns.width))
        // output responsive css from column calculations
        for selector, css in columns.responsive_css
                body > {selector}
                        {css}
-       
+
        // as big as it can be
        body > .centerer
                width: auto