Changeset 345 for Dev/branches/rest-dojo-ui/client/rft/css

Timestamp:

06/21/12 14:31:38 (13 years ago)

Author:

tjcschipper

Message:

• Fixed Index Menu layout and overlays.

Location:

Dev/branches/rest-dojo-ui/client/rft/css

Files:

• layout.css (modified) (5 diffs)
• rftButtons.css (modified) (5 diffs)

Dev/branches/rest-dojo-ui/client/rft/css/layout.css

@@ -172 +172 @@
     width: 190px;
 }
-
 .claro .dijitTab.dijitTabHover {
     color: #ffffff;
@@ -196 +195 @@
     -o-transition: all 0.1s;
 }
-
 .claro .dijitTabContainer.blue .dijitTab.dijitTabChecked {
     background-color: #0072bc;
@@ -212 +210 @@
     background-color: #3aa605;
 }
-
 .claro .dijitTabContainer.blue .dijitTab.dijitTabActive {
     color: #0072bc;
@@ -229 +226 @@
 }
 
-
 /* Index Menu */
-.rftIndexMenuBlock {
+.claro .rftIndexMenuBlock {
     width: 400px;
     height: 400px;
@@ -237 +233 @@
     float: left;
     margin: 16px;
-    padding: 0;
-}
-
-.rftIndexMenuBlockMask {
+    overflow: hidden;
+}
+.claro .rftIndexMenuMask {
     height: 400px;
     width: 400px;
-    margin: 0 0 0 -400px;
-    background: #ff00ff;
-    color: #999999;
-    visibility: visible;
-    float: left;
-}
-.rftIndexMenuBlockMask:hover {
-    visibility: hidden;
-}
+    background: #444444;
+    color: #999999;
+    margin-top: 0;
+}
+.claro .rftIndexMenuBlock:hover .rftIndexMenuMask {
+    margin-top: -400px;
+}
+.claro .rftIndexMenuMask .label {
+    color: #999999;
+    font-size: 32px;
+    line-height: 28px;
+    height: 32px;
+    margin: 184px 0;
+    float: left;
+}
+.claro .rftIndexMenuMask .rftIcon {
+    width: 32px;
+    height: 32px;
+    background-image: url('images/icons/rftIcons32.png');
+    margin: 184px 8px 0 8px;
+    float: left;
+}
+

Dev/branches/rest-dojo-ui/client/rft/css/rftButtons.css

@@ -216 +216 @@
     font-weight: normal;
 }
+.claro .rftIndexMenuButton .dijitButtonText {
+    padding-bottom: 10px;
+    line-height: 20px;
+    transition: all 0.3s;
+    -moz-transition: all 0.3s;
+    -webkit-transition: all 0.3s;
+    -o-transition: all 0.3s;
+}
+.claro .rftIndexMenuButton .dijitButtonContents {
+    vertical-align: top;
+}
 .claro .rftIndexMenuButton .rftIcon {
     height: 32px;
@@ -222 +233 @@
     padding: 0;
     background-image: url('images/icons/rftIcons32.png');
+    vertical-align: top;
 }
 .claro .oneHeight {
@@ -242 +254 @@
 }
 .claro .rftIndexMenuButton.rftIndexMenuButtonHover,
-.claro .rftIndexMenuButton.rftIndexMenuButtonHover .rftButtonText{
+.claro .rftIndexMenuButton.rftIndexMenuButtonHover .dijitButtonText {
+    color: #ffffff;
     transition: all 0.1s;
     -moz-transition: all 0.1s;
@@ -248 +261 @@
     -o-transition: all 0.1s;
 }
-.claro .rftIndexMenuButton.rftIndexMenuButtonHover .dijitButtonText {
-    color: #ffffff;
-}
 .claro .rftIndexMenuButton.rftIndexMenuButtonHover.blue {
     background: #0072bc;
@@ -266 +276 @@
     background: #ff5b12;
 }
+.claro .rftIndexMenuButton.rftIndexMenuButtonActive {
+    color: #000000;
+    background: #ffffff;
+    transition: all 0.3s;
+    -moz-transition: all 0.3s;
+    -webkit-transition: all 0.3s;
+    -o-transition: all 0.3s;
+}
+.claro .rftIndexMenuButton.rftIndexMenuButtonActive .rftIcon {
+    background-image: url('images/icons/rftIcons32b.png');
+}
+