ilstyle 0.4.4 → 0.4.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: b1dabb73c09cf8af4824ec820e254c2f64764393
-  data.tar.gz: da6b712999d89d47e86e5089e4a39a1ac9e8cbcd
+  metadata.gz: 57f3c0ef420dc66914a73fd79684c8a43dbb42d0
+  data.tar.gz: fb732fa922ac1d90242cff059a932188f4604878
 SHA512:
-  metadata.gz: 281af71a9560c0e5d2b5254ceca49076f07f2518f7d96c4c839d39a08ff4450f9070aabf7d9bb8f105c09f06c56fbfccbb1311a3b5c79816607892b8d130d0ad
-  data.tar.gz: 3f9be1505ea0bd9685af9f4db72994267e46ef34b9c23a01517041dbd6d3ff1ba6d379210464117d2e523eef7889955104f0656f8b0b92bbb9ad334d9368982d
+  metadata.gz: 02d8b1d4d09365f8f2474a476cd65b7c56c7ee7000c4a59ad361b2b05477a6d76c1880ef73022da791edfee3c0345bb89683c570c95774d7f11c2f0467652c64
+  data.tar.gz: bc6d24e333efa4606b550a40407c6e616c905a981531e8649ee41a84931dc5142420c308aed80963f236961e708696d87e2d49213af6bec8f963b19b92347f15

data/app/assets/stylesheets/ilstyle/i-level.css.scss

@@ -1,7 +1,20 @@
 /* Regular CSS file for i-level look */
 /* Imports */
 @import url(http://fonts.googleapis.com/css?family=Open+Sans:300,400);
-@import 'colours';
+
+/* Define colours */
+$ilorange:#F57E29;
+$ilorangelight:#fe854b;
+$ilgray:#535353;
+$ilgraylight:#a6a6a6;
+$ilblue:#0E719F;
+$ilgreen:#0ec505;
+$ildarkgreen:#01992b;
+$ilred:#fc2727;
+$ildarkred: #ff0c37;
+$ilredlight: #ff949a;
+$ilbackground: #e4e4e4;
+$ilyellow: #ffc974;
 
 /************************************
  **           Text                  *
@@ -32,6 +45,7 @@ h2 {
 
 label {
   font-weight:300;
+  vertical-align: top;
 }
 strong {
   float: left;
@@ -70,7 +84,7 @@ ol {
   }
   fieldset.two-column {
     display:inline-block;
-    width: 48%;
+    width: 49.167em;
     min-width: 300px;
     padding: 0;
     margin: 5px 0;
@@ -79,14 +93,23 @@ ol {
   }
   li{
     margin: 3px 0px;
-    label{ width: 145px; }
+    label{ width: 15.833em; }
   }
 
   li input, li select, li textarea,{
-    width: 150px;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    width: 15.833em;
   }
   li input.small, li select.small, li textarea.small,{
-    width: 50px;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    width: 4.167em;
+  }
+  li input.large, li select.large, li textarea.large,{
+    width: 32.500em;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
   }
 
 }
@@ -109,13 +132,8 @@ ol > li > label {
 ol > li > input,
 ol > li > textarea,
 ol > li > select{
-  width: calc(40%);
-  max-width: 300px;
   float:right;
 }
-ol > fieldset > li select {
-  width: 150px;
-}
 
 ol > li > span {
   margin: 1px 0px 1px 0px;
@@ -168,50 +186,52 @@ textarea:focus{
 /************************************
  ** Layout - Header                 *
  ***********************************/
-#headerContainer{
-  padding-left: 80px; /* Left col width  */
-  padding-right:300px; /* Right col width */
-  margin-top: 5px;
-  height: 40px;
-  position: relative;
+
+
+/************************************
+ ** MARK : Layout - Navigation bar  *
+ ***********************************/
+/* To fix the issue of showing a menu over an element with position:fixed, 
+ we add a container and define an ordering, using Flexboxes */
+.navigation_container{
+  display: -webkit-box;
+  display: -moz-box;
+  display: box;
+
+  -webkit-box-orient: vertical;
+  -moz-box-orient: vertical;
+  box-orient: vertical;
+  width: 100%;
+  -moz-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
+  -webkit-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
+  box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
+  z-index: 999999;
 }
 
-#headerContainer .column{
-  float: left;
+#sidebar{
+  -webkit-box-ordinal-group: 3;
+  -moz-box-ordinal-group: 3;
+  box-ordinal-group: 3;
+
+  position: fixed;
+  width: 100%;
+    top: 41px;
+  z-index: 90;
+
+  -moz-box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.5);
+  -webkit-box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.5);
+  box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.5);
 }
-/* Header: Center Column*/
-#hdrCenter{
+#navContainer{
+  -webkit-box-ordinal-group: 2;
+  -moz-box-ordinal-group: 2;
+  box-ordinal-group: 2;
+
+  position: fixed;
+  top: 0;
   width:100%;
-  text-align:center;
-  color: #888;
-  font-size: 2.5em;
-  font-weight: 300;
-  height: 40px;
-}
-/* header: left column*/
-#hdrLeft{
-  width: 150px;
-  right: 150px;
-  height: 40px;
-  margin-left: -100%; /* Position the left column to the left of the center colmun */
-}
-#leftlogin{
-  /*fixes problems with left column on login page*/
-  width: 80px;
-  right: 80px;
-  margin-left: 0; /* Position the left column to the left of the center colmun */
-}
-/* header: right column*/
-#hdrRight{
-  width: 300px;
-  height: 40px;
-  margin-right: -300px; /*Position the right column to the right of the center column*/
-  text-align: right;
 }
 
-/************************************
- ** MARK : Layout - Navigation bar  *
- ***********************************/
 #empty_nav_bar{
   height: 5px;
 }
@@ -219,13 +239,7 @@ textarea:focus{
 .navContainerPadding {
  	padding-top:40px;
 }
-.fixedNavContainer {
-  position: fixed; top: 0;
-  z-index:99;
-  width:100%;
-}
-.fixedNavContainer[role=menubar]{
-  top: 41px;
+.fixedNavContainer[role="menubar"]{
 }
 
 #logo {
@@ -246,6 +260,7 @@ nav[role=navigation]{
   background-color: $ilorange;
   height:40px;
   min-width: 900px;
+  z-index: 100;
 
   border-bottom: 1px solid white;
   /* fix issue with inline-box */
@@ -260,6 +275,8 @@ nav[role=navigation]{
     display: inline-block;
     border-right: 1px solid white;
     height: 40px;
+    min-width: 7.500em;
+    text-align: center;
     a, a:link, a:active {
       display: inline-block;
       text-decoration: none;
@@ -286,7 +303,7 @@ nav[role=navigation]{
   li:hover ul{
     display:block;
     color: white;
-    position: absolute;
+    z-index: 200;
   }
 
   li.last ul{
@@ -295,18 +312,26 @@ nav[role=navigation]{
   }
     ul{
       display: none;
+      position: absolute;
       width: 190px;
       padding: 0;
-      background-color: $ilgray;
 
       list-style-type: none;
-      z-index: 99999;
+      li:first-child{
+        margin-top: 1px;
+        border-top: none;
+      }
       form li,li{
+        background-color: $ilgray;
+        border-right: none;
         text-align: right;
         float:none;
         font-size: 11px;
         color: white;
         border-top: 1px solid #666;
+        -moz-box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.5);
+        -webkit-box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.5);
+        box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.5);
         a{
           width: 170px;
         }
@@ -336,6 +361,10 @@ article nav[role=navigation]{
 /************************************
  ** MARK : Layout - menubar         *
  ***********************************/
+#navigation_container nav[role=menubar]{
+  border-bottom: none;
+}
+
 nav[role=menubar]{
   background-color: $ilgraylight;
   height:26px;
@@ -347,6 +376,12 @@ nav[role=menubar]{
   letter-spacing: 0px;
   word-spacing: 0px;
 
+  ul{
+    margin-left: 25px;
+  }
+  li:first-child{
+    border-left: 1px solid white;
+  }
   li{
     font-size: 11px;
     margin: 0px;
@@ -381,7 +416,6 @@ nav[role=menubar]{
       padding: 0;
       background-color: $ilgray;
       list-style-type: none;
-      z-index: 99999;
       li{
         float:none;
         width: 190px;
@@ -409,13 +443,14 @@ article.content {
   text-align: left;
   margin: 0 auto;
   padding-left: 10px;
+  display:block;
 
   section{
-    width: calc(90%);
+    width: 100em;
     margin: 0 auto 10px auto;
     background-color: $ilbackground;
-    padding: 10px;
-    nav{ min-width: calc(100% + 20px ); }
+    padding: 0.833em 0 0.833em 0.833em;
+    nav{ min-width: calc(100% + 0.833em ); }
   }
 }
 
@@ -549,11 +584,15 @@ input[type=submit]:focus,
  ***********************************/
 
 .notification{
-  margin: 1% 20% ;
   line-height: 18px;
   border-radius: 0 \0;
 
-  position: relative;
+  position: fixed;
+  top: 15%;
+  width: 40%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  right: auto;
   padding: 7px 15px;
   margin-bottom: 18px;
   color: #fff;
@@ -581,10 +620,9 @@ input[type=submit]:focus,
   -moz-border-radius: 4px;
   border-radius: 4px;
 
-  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
-  -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
-
+  -webkit-box-shadow: 0 3px 28px rgba(0, 0, 0, .95);
+  -moz-box-shadow: 0 3px 28px rgba(0, 0, 0, .95);
+  box-shadow: 0 3px 28px rgba(0, 0, 0, .95);
   margin-bottom: 0;
 
   &.notice{

data/lib/ilstyle/version.rb

@@ -1,3 +1,3 @@
 module Ilstyle
-  VERSION = '0.4.4'
+  VERSION = '0.4.5'
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: ilstyle
 version: !ruby/object:Gem::Version
-  version: 0.4.4
+  version: 0.4.5
 platform: ruby
 authors:
 - Etienne van Delden
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-09-01 00:00:00.000000000 Z
+date: 2014-09-18 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -54,6 +54,7 @@ files:
 - app/assets/images/ilstyle/arrow-right_large.png
 - app/assets/images/ilstyle/arrow-right_large_hover.png
 - app/assets/images/ilstyle/i-level_ruiten.png
+- app/assets/images/ilstyle/logo-grey-white.png
 - app/assets/javascripts/i-level.js
 - app/assets/stylesheets/ilstyle/1024.css
 - app/assets/stylesheets/ilstyle/10cols.css
@@ -129,7 +130,6 @@ files:
 - huisstijl/i-Level_PBS_layout/i-Level_PBS_specificaties.psd
 - huisstijl/i-Level_PBS_layout/i-Level_PBS_specificaties_2.psd
 - huisstijl/i-Level_PBS_layout/template_PBS_screen1.psd
-- huisstijl/logo-grey-white
 - huisstijl/logo-grey-white.ai
 - huisstijl/logo-textual-black_white.ai
 - huisstijl/logo-textual.ai