Changeset 5571

Timestamp:

08/19/14 10:20:22 (10 years ago)

Author:

Twan Goosen

Message:

styling of toggle border
Refs #594

Location:

VirtualCollectionRegistry/trunk/VirtualCollectionRegistry/src/main/webapp

Files:

• css/_toggleborder.scss (moved) (moved from VirtualCollectionRegistry/trunk/VirtualCollectionRegistry/src/main/webapp/css/toggleborder.scss) (1 diff)
• icons/glyphicons_367_expand_white.png (added)
• icons/glyphicons_369_collapse_top_white.png (added)

VirtualCollectionRegistry/trunk/VirtualCollectionRegistry/src/main/webapp/css/_toggleborder.scss

@@ -16 +16 @@
 */
 
-@import 'globals';
+div.toggleBorder {
 
-div.toggleBorder {
-    border-top: 1px solid #000000;
+    div.toggleBorderHeader {
+        margin: 0;
+        padding-left: 4px;
+        color: #fff;
+        font-weight: bolder;
+        cursor: pointer;
+
+        /* mimick header of 'display' table (CLARIN style) */
+        background-color: $clarin_blue;
+
+        border-top-left-radius: 6px !important;
+        border-bottom-left-radius: 6px !important;
+        -webkit-border-top-left-radius: 6px !important;
+        -webkit-border-bottom-left-radius: 6px !important;
+        -moz-border-top-left-radius: 6px !important;
+        -moz-border-bottom-left-radius: 6px !important;  
+
+        border-top-right-radius: 6px !important;
+        border-bottom-right-radius: 6px !important;
+        -webkit-border-top-right-radius: 6px !important;
+        -webkit-border-bottom-right-radius: 6px !important;
+        -moz-border-top-right-radius: 6px !important;
+        -moz-border-bottom-right-radius: 6px !important;
+
+        span {
+            font-weight: bold;
+            padding: 2px 2px 2px ($iconsize + 4px);
+            /* icon from GLYPHICONS.com */
+            background-image: url('../icons/glyphicons_369_collapse_top_white.png');
+            background-size: $iconsize;
+            background-repeat: no-repeat;
+            background-position: center left;
+        }
+
+        &.collapsed span {
+            /* icon from GLYPHICONS.com */
+            background-image: url('../icons/glyphicons_367_expand_white.png');
+        }
+    }
+
+    div.toggleBorderContent {
+        margin: 0;
+        padding: 5px;
+    }
 }
-
-div.toggleBorder div.toggleBorderHeader {
-    margin: 0;
-    padding: 2px 2px 2px 16px;
-    border-bottom: 1px solid #000000;
-    color: inherit;
-    background-color: #D4DEEF;
-    /* icon from GLYPHICONS.com */
-    background-image: url('../icons/glyphicons_369_collapse_top.png');
-    background-size: $iconsize;
-    background-repeat: no-repeat;
-    background-position: center left;
-    cursor: pointer;
-}
-
-div.toggleBorder div.toggleBorderHeader span {
-    font-weight: bold;
-}
-
-div.toggleBorder div.toggleBorderHeader.collapsed {
-    /* icon from GLYPHICONS.com */
-    background-image: url('../icons/glyphicons_367_expand.png');
-    background-size: $iconsize;
-    background-repeat: no-repeat;
-    background-position: center left;
-}
-
-div.toggleBorder div.toggleBorderContent {
-    margin: 0;
-    padding: 5px;
-}
-