RT 4.2.11, ticket#13852

[freeside.git] / rt / share / static / css / aileron / nav.css

diff --git a/rt/share/static/css/aileron/nav.css b/rt/share/static/css/aileron/nav.css
new file mode 100644 (file)
index 0000000..a35175d
--- /dev/null
+++ b/rt/share/static/css/aileron/nav.css
@@ -0,0 +1,170 @@
+.sf-menu {
+    width: 100%;
+    margin-bottom: 0;
+}
+
+.sf-menu li:hover {
+    background-color: #CFDEFF;
+}
+
+.sf-menu li, .sf-menu li li, .sf-menu li li li {
+    background-color: #eaeaea;
+}
+
+.sf-sub-indicator {
+    background-image: url(../../../static/css/images/arrows-grey.png);
+}
+
+.sf-menu li li .sf-sub-indicator {
+    margin-top: -3px;
+}
+
+#page-menu.sf-menu li .sf-sub-indicator {
+    top: 0.7em;
+}
+
+#page-menu.sf-menu li:hover ul, #page-menu.sf-menu li.sfHover ul {
+    top: 2.5em;
+}
+
+#page-menu.sf-menu li ul {
+    border-bottom: 2px solid #ccc;
+}
+
+#main-navigation {
+    position: absolute;
+    top: 1px;
+    left: 0;
+    z-index: 9999;
+    text-color: #000;
+}
+
+#main-navigation .sf-menu a, #main-navigation .sf-menu a:hover {
+    padding-top: 0.5em;
+    padding-bottom: 0.5em;
+    border-color: #fff;
+    color: #000;
+}
+
+#main-navigation a {
+    border-top: none;
+}
+
+#main-navigation li li a {
+    border-top: 1px solid white;
+}
+
+#app-nav.sf-menu > li:first-child > a {
+    border-left: none;
+}
+
+#main-navigation #app-nav > li, #main-navigation #app-nav > li > a {
+    background-color: transparent;
+}
+
+#page-navigation {
+    position: absolute;
+    top: 6.05em;
+    right: 0em;
+    left: auto;
+    z-index: 9995;
+    font-size: 0.9em;
+}
+
+#page-navigation .sf-menu li, #page-navigation .sf-menu li li, #page-navigation .sf-menu li li li {
+    background-color: #fff;
+}
+
+#page-navigation .sf-menu a:visited, #page-navigation .sf-menu a {
+    border: none;
+    color: #000;
+}
+
+/* to stop a "flash" of an unstyled menu on an older browser,  hide the menu until superfish has initialized it */
+#app-nav.toplevel { display: none; }
+#app-nav.toplevel.sf-menu { display:block; }
+#page-menu.toplevel { display: none; }
+#page-menu.toplevel.sf-menu { display:block; }
+
+#topactions {
+ position: absolute;
+ background: transparent;
+ top: 3.2em;
+ right: 0.7em;
+ width: auto;
+ min-width: 42em;
+ font-size: 0.9em;
+ z-index: 99;
+}
+
+#topactions form * {
+    vertical-align: top;
+}
+
+#topactions button, #topactions select, #topactions input{
+ padding-top: 0em;
+ padding-bottom: 0em;
+ width: 8em;
+
+}
+
+#topactions #simple-search .field{
+ margin-left: 1em;
+ color: #787;
+ }
+
+#topactions #simple-search .field:focus {
+ color: #000;
+ }
+
+/* The bookmark star is too tall without adjusting the padding and height */
+
+.sf-menu .toggle-bookmark a {
+    padding: 0 1em;
+    height: 2.5em;
+}
+
+.sf-menu .toggle-bookmark a img {
+    padding-top: 0.6em;
+}
+
+/* Pin page menu to top left corner once you scroll past it */
+
+#page-menu.pinned {
+    position: fixed;
+    top:    0;
+    right:  0;
+    left:   auto;
+    width:  auto;
+
+    background:     white;
+    border-left:    1px #aaa solid;
+    border-bottom:  1px #aaa solid;
+    border-radius:  0 0 0 5px;
+    box-shadow:     0 0 10px rgba(0,0,0,0.4);
+
+    /* stupid vendor prefixes */
+    -moz-border-radius:     0 0 0 5px;
+    -webkit-border-radius:  0 0 0 5px;
+    -moz-box-shadow:        0 0 10px rgba(0,0,0,0.4);
+    -webkit-box-shadow:     0 0 10px rgba(0,0,0,0.4);
+}
+
+#page-menu.pinned li:hover ul,
+#page-menu.pinned li.sfHover ul {
+    border-left:    1px #aaa solid;
+    border-right:   1px #aaa solid;
+    z-index:        -1 !important; /* relative to current stacking context */
+    box-shadow:     0 0 10px rgba(0,0,0,0.4);
+
+    -moz-box-shadow:    0 0 10px rgba(0,0,0,0.4);
+    -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.4);
+}
+
+/* round off the corner of the first menu item so it matches the container */
+#page-menu.pinned > li:first-of-type,
+#page-menu.pinned > li:first-of-type > a {
+    border-radius:          0 0 0 5px;
+    -moz-border-radius:     0 0 0 5px;
+    -webkit-border-radius:  0 0 0 5px;
+}