zen 0.1a → 0.2

data/lib/zen/public/admin/css/grid.css

@@ -18,86 +18,86 @@
  */
 .container
 {
-  margin:    0 2%;
-  overflow:  hidden;
-  width:     96%;
+    margin:    0 2%;
+    overflow:  hidden;
+    width:     96%;
 }
 /* Clear the floats so background colors and other properties can be used properly */
 .container:after, .clearfix:after
 {
-  clear:      both;
-  content:    '.';
-  display:    block;
-  height:     0;
-  visibility: hidden;
+    clear:      both;
+    content:    '.';
+    display:    block;
+    height:     0;
+    visibility: hidden;
 }
 
 .grid_1, .grid_2, .grid_3, .grid_4 , .grid_5, .grid_6,
 .grid_7, .grid_8, .grid_9, .grid_10, .grid_11
 {
-  float:        left;
-  margin-right: 3.8%;
+    float:        left;
+    margin-right: 3.8%;
 }
 
 .grid_1
 {
-  width: 4.85%;
+    width: 4.85%;
 }
 
 .grid_2
 {
-  width: 13.5%;
+    width: 13.5%;
 }
 
 .grid_3
 {
-  width: 22.15%;
+    width: 22.15%;
 }
 
 .grid_4
 {
-  width: 30.8%;
+    width: 30.8%;
 }
 
 .grid_5
 {
-  width: 39.45%;
+    width: 39.45%;
 }
 
 .grid_6
 {
-  width: 48.1%;
+    width: 48.1%;
 }
 
 .grid_7
 {
-  width: 56.75%;
+    width: 56.75%;
 }
 
 .grid_8
 {
-  width: 65.4%;
+    width: 65.4%;
 }
 
 .grid_9
 {
-  width: 74.05%;
+    width: 74.05%;
 }
 
 .grid_10
 {
-  width: 82.7%;
+    width: 82.7%;
 }
 
 .grid_11
 {
-  width: 91.35%;
+    width: 91.35%;
 }
 
 .grid_12
 {
-  width: 100%;
-  float: left;
+    width: 100%;
+    float: left;
 }
 
 /**
@@ -107,7 +107,7 @@
  */
 .container > *:last-child, .container .last
 {
-  margin-right: 0px;
+    margin-right: 0px;
 }
 
 /**
@@ -115,5 +115,5 @@
  */
 img, object, embed
 {
-  max-width: 100%;
-}
+    max-width: 100%;
+}

data/lib/zen/public/admin/css/layout.css

@@ -17,55 +17,65 @@
   height:        30px;
   width:         100%;
 }
+
     #top #main_nav .left li
     {
-      float:   left;
+        float:   left;
     }
+
     #top #main_nav .right li
     {
-      float:   right;
+        float:   right;
     }
-      #top #main_nav ul li a
-      {
-        color:            #fff;
-        display:          block;
-        margin:           3px 10px;
-        padding:          3px 3px 5px 3px;
-        text-decoration:  none;
-        text-align:       center;
-      }
-      #top #main_nav ul li:hover, #top #main_nav ul li a:hover
-      {
+
+        #top #main_nav ul li a
+        {
+            color:            #fff;
+            display:          block;
+            margin:           3px 10px;
+            padding:          3px 3px 5px 3px;
+            text-decoration:  none;
+            text-align:       center;
+        }
+
+    #top #main_nav ul li:hover, #top #main_nav ul li a:hover
+    {
         background:    #555;
         text-shadow:   1px 1px #000;
-      }
-      #top #main_nav ul li ul
-      {
-        background: #555;
-        left:       -10000px;
-        margin-top: -4px;
-        position:   absolute;
-        padding:    7px;
-      }
-        #top #main_nav ul li ul li
+    }
+
+        /* Sub menus */
+        #top #main_nav ul li ul
+        {
+            background: #555;
+            left:       -10000px;
+            margin-top: -4px;
+            position:   absolute;
+            padding:    7px;
+        }
+
+        #top #main_nav ul li:hover ul
         {
-          float:      none!important;
+            left: auto;
         }
-          #top #main_nav ul li ul li a
-          {
-            background:    none;
-            margin:        0px;
-            padding:       5px;
-            text-align:    left;
-          }
-          #top #main_nav ul li ul li a:hover
-          {
-            background:    #666;
-          }
-      #top #main_nav ul li:hover ul
-      {
-        left: auto;
-      }
+
+            #top #main_nav ul li ul li
+            {
+                float:      none!important;
+            }
+
+                #top #main_nav ul li ul li a
+                {
+                    background:    none;
+                    margin:        0px;
+                    padding:       5px;
+                    text-align:    left;
+                }
+
+                #top #main_nav ul li ul li a:hover
+                {
+                    background:    #666;
+                }
 
 /**
  * Main area of the admin panel. The content stretches across the entire screen and there
@@ -73,39 +83,40 @@
  */
 #container
 {
-  background:    #fff;
-  border-radius: 5px;
-  border:        5px solid #ddd;
-  margin-top:    20px;
-  min-height:    100px;
+    background:    #fff;
+    border-radius: 5px;
+    border:        5px solid #ddd;
+    margin-top:    20px;
+    min-height:    100px;
   
-  -webkit-border-radius: 5px;
-  -moz-border-radius:    5px;
+    -webkit-border-radius: 5px;
+    -moz-border-radius:    5px;
 }
-  #container article
-  {
-    padding: 15px;
-  }
+
+    #container article
+    {
+        padding: 15px;
+    }
 
 #login #container, #login #main_footer
 {
-  margin: 20px auto;
-  width:  500px;
+    margin: 20px auto;
+    width:  500px;
 }
-  #login #container
-  {
-    margin-top: 50px;
-  }
+    #login #container
+    {
+        margin-top: 50px;
+    }
   
 /**
  * Bottom part of the admin panel containing the footer
  */
 #main_footer
 {
-  margin-top: 20px;
-  text-align: center;
+    margin-top: 20px;
+    text-align: center;
 }
-  #main_footer p
-  {
-    margin-bottom: 8px;
-  }
+    #main_footer p
+    {
+      margin-bottom: 8px;
+    }

data/lib/zen/public/admin/css/modals.css

@@ -0,0 +1,63 @@
+@charset "UTF-8";
+
+/**
+ * Modal windows.
+ *
+ * @author Yorick Peterse
+ * @since  0.1
+ */
+#modal_background, #modal_container
+{
+    height:     100%;
+    left:       0px; 
+    position:   fixed;
+    top:        0px;
+    width:      100%;
+}
+
+#modal_container
+{
+    position:       absolute!important;
+}
+
+#modal_container:after
+{
+    clear:      both;
+    content:    '.';
+    display:    block;
+    height:     0;
+    visibility: hidden;
+}
+
+#modal_background
+{
+    background: #444;
+    opacity:    0.8;
+}
+    
+    #modal_container #modal_window
+    {
+        background: #fff;
+        border:     1px solid #000;
+        margin:     5% auto 20px auto;
+        min-height: 50px;
+        padding:    20px 10px 10px 10px;
+        width:      50%;
+    }
+    
+    #modal_container #modal_window.fullscreen
+    {
+        height:     90%;
+        margin-top: 2%;
+        width:      95%;
+    }
+
+        #modal_container #modal_window #modal_close
+        {
+            background: url("../images/icons/close.png");
+            cursor:     pointer;
+            display:    block;
+            height:     30px;
+            margin:     -50px 0px 0px -20px;
+            width:      30px;
+        }

data/lib/zen/public/admin/css/notifications.css

@@ -0,0 +1,84 @@
+@charset "UTF-8";
+
+/**
+ * Notifications, errors, etc.
+ *
+ * @author Yorick Peterse
+ * @since  0.1
+ */
+#success
+{
+    background: #B3D760 url("../images/icons/success.png") no-repeat 5px center;
+    border:     1px solid #599929;
+}
+
+#error
+{
+    background: #F57E62 url("../images/icons/error.png") no-repeat 5px center;
+    border:     1px solid #FF3100;
+}
+
+#notice
+{
+    background: #FFF58C url("../images/icons/info.png") no-repeat 5px center;
+    border:     1px solid #FFDA05;
+}
+
+#notification_container
+{
+    position: absolute;
+    right:    10px;
+    top:      35px;
+}
+
+    #login #notification_container
+    {
+        top: 10px;
+    }
+
+.notification
+{
+    background:    #000;
+    border-radius: 10px;
+    cursor:        pointer;
+    color:         #fff;
+    margin-bottom: 10px;
+    min-height:    55px;
+    padding:       10px;
+    width:         230px;
+    
+    -moz-border-radius:    10px;
+    -webkit-border-radius: 10px;
+    -o-border-radius:      10px;
+    -khtml-border-radius:  10px;
+}
+
+    .notification .close
+    {
+        background: url("../images/icons/close.png") no-repeat center left;
+        display:    none;
+        height:     33px;
+        left:       0px;
+        margin-top: -13px;
+        position:   absolute;
+        width:      33px;
+    }
+
+    .notification:hover .close
+    {
+        display: block;
+    }
+
+    .notification .image
+    {
+        float:        left;
+        margin-top:   3px;
+        margin-right: 10px;
+    }
+
+    .notification .title
+    {
+        font-size:     14px;
+        font-weight:   bold;
+        margin-bottom: 10px;
+    }

data/lib/zen/public/admin/css/tables.css

@@ -0,0 +1,71 @@
+@charset "UTF-8";
+
+/**
+* Tables
+*
+* @author Yorick Peterse
+* @since  0.1
+*/
+table
+{
+    border:          1px solid #aaa;
+    border-collapse: separate;
+    width:           100%;
+    text-align:      left;
+}
+
+    table thead
+    {
+        background:      #ddd;
+    }
+
+        table thead tr th
+        {
+            background:    #ddd -webkit-gradient(linear, left bottom, left top, from(#ddd), to(#eee));
+            background:    #ddd -moz-linear-gradient(bottom, top, #ddd, #eee);
+            border-top:    1px solid #fff;
+            border-right:  1px solid #aaa;
+            border-bottom: 1px solid #aaa;
+            text-shadow:   1px 1px #fff;
+        }
+
+        table thead tr th:last-child, table tbody tr td:last-child
+        {
+            border-right:  none;
+        }
+
+        table thead tr th, table tbody tr td
+        {
+            padding:      5px 10px 5px 10px;
+        }
+
+        .table thead tr th:first-child, .table tbody tr td:first-child
+        {
+            width:        15px;
+        }
+
+        .table thead tr th:first-child input[type="checkbox"], .table tbody tr td:first-child input[type="checkbox"]
+        {
+            margin-top:  3px;
+        }
+
+    table tr.odd
+    {
+        background: #f2f2f2;
+    }
+
+    table tbody tr:hover
+    {
+        background: #f2f2f2;
+    }
+
+        table tbody tr td
+        {
+            border-right:  1px solid #ccc;
+            border-bottom: 1px solid #ccc;
+        }
+
+        table tbody tr:last-child td
+        {
+            border-bottom: none;
+        }