|
|
@@ -131,6 +131,32 @@ input:focus, textarea:focus, button:focus, select:focus
|
|
|
{
|
|
|
border: 1px solid #454545;
|
|
|
}
|
|
|
+/* Lotsa new stuff innit */
|
|
|
+/* Nifty input focus styling from Mollyhawk pages. */
|
|
|
+
|
|
|
+input, select, textarea, textarea.editor {
|
|
|
+ background: #fff;
|
|
|
+ outline:none !important;
|
|
|
+ border: 1px solid #bbb;
|
|
|
+ vertical-align: top;
|
|
|
+ border-radius: 3px;
|
|
|
+ box-shadow: 0 2px 5px rgba(0,0,0,0.05) inset;
|
|
|
+}
|
|
|
+input:hover, select:hover, textarea:hover, textarea.editor:hover {
|
|
|
+ outline:none !important;
|
|
|
+ border: 1px solid #999;
|
|
|
+}
|
|
|
+textarea:hover, textarea.editor:hover {
|
|
|
+ background: #fbfbfb;
|
|
|
+}
|
|
|
+input:focus, select:focus, textarea:focus, textarea.editor:focus {
|
|
|
+ outline:none !important;
|
|
|
+ border: 1px solid #999;
|
|
|
+ box-shadow: 0 2px 5px rgba(0,0,0,0.1) inset;
|
|
|
+}
|
|
|
+select option {padding: 0.1em 0.3em 0.1em 0.3em;}
|
|
|
+/* End lotsa new stuff */
|
|
|
+
|
|
|
.button_link
|
|
|
{
|
|
|
background: #cde7ff url(../images/theme/submit_bg.png) no-repeat;
|
|
|
@@ -154,19 +180,20 @@ a.button_link
|
|
|
}
|
|
|
|
|
|
/* the new "button" */
|
|
|
-a.new_posts:hover
|
|
|
-{
|
|
|
- text-decoration: none;
|
|
|
-}
|
|
|
-span.new_posts
|
|
|
+a.new_posts
|
|
|
{
|
|
|
padding: 0 4px 1px 4px;
|
|
|
- background-color: #ff8300;
|
|
|
+ background: orange;
|
|
|
color: #fff;
|
|
|
font-size: .7em;
|
|
|
font-weight: bold;
|
|
|
+ line-height: 1.1em;
|
|
|
border-radius: 2px;
|
|
|
}
|
|
|
+a.new_posts:hover
|
|
|
+{
|
|
|
+ text-decoration: none;
|
|
|
+}
|
|
|
|
|
|
/* All input elements that are checkboxes or radio buttons shouldn't have a border around them. */
|
|
|
input.input_check, input.input_radio
|
|
|
@@ -1145,157 +1172,148 @@ span.lowerframe span
|
|
|
------------------------------------------------------- */
|
|
|
#main_menu
|
|
|
{
|
|
|
- padding: 0 0.5em;
|
|
|
+ margin: 0 0 0 0;
|
|
|
+ padding: 0 0 0 0;
|
|
|
float: left;
|
|
|
- margin: 0;
|
|
|
- width: 98%;
|
|
|
-}
|
|
|
-
|
|
|
-.dropmenu, .dropmenu ul
|
|
|
-{
|
|
|
- list-style: none;
|
|
|
- line-height: 1em;
|
|
|
- padding: 0;
|
|
|
- margin: 0;
|
|
|
+ width: 100%;
|
|
|
}
|
|
|
.dropmenu
|
|
|
{
|
|
|
- padding: 0 0.5em;
|
|
|
-}
|
|
|
-.dropmenu a
|
|
|
-{
|
|
|
- display: block;
|
|
|
- color: #000;
|
|
|
- text-decoration: none;
|
|
|
-}
|
|
|
-.dropmenu a span
|
|
|
-{
|
|
|
- display: block;
|
|
|
- padding: 0 0 0 5px;
|
|
|
- font-size: 0.9em;
|
|
|
-}
|
|
|
-/* the background's first level only */
|
|
|
-.dropmenu li a.firstlevel
|
|
|
-{
|
|
|
- margin-right: 8px;
|
|
|
-}
|
|
|
-.dropmenu li a.firstlevel span.firstlevel
|
|
|
-{
|
|
|
- display: block;
|
|
|
- position: relative;
|
|
|
- left: -5px;
|
|
|
- padding-left: 5px;
|
|
|
- height: 22px;
|
|
|
- line-height: 19px;
|
|
|
- white-space: pre;
|
|
|
+ margin: 0 0 0 0;
|
|
|
+ padding: 0 0 0 0;
|
|
|
+ float: left;
|
|
|
}
|
|
|
+/* Level 1 button background. */
|
|
|
.dropmenu li
|
|
|
{
|
|
|
+ margin: 0 2px 0 2px;
|
|
|
+ padding: 0 0 0.4em 0;
|
|
|
+ list-style: none;
|
|
|
float: left;
|
|
|
- padding: 0;
|
|
|
- margin: 0;
|
|
|
+ font-size: 0.9em;
|
|
|
+ line-height: 2em;
|
|
|
position: relative;
|
|
|
}
|
|
|
-.dropmenu li ul
|
|
|
-{
|
|
|
- z-index: 90;
|
|
|
- display: none;
|
|
|
- position: absolute;
|
|
|
- left: -6px;
|
|
|
- width: 17em;
|
|
|
- font-weight: normal;
|
|
|
- background: #fff url(../images/theme/menu_gfx.png) -30px -137px repeat-x;
|
|
|
- border: solid 1px #999;
|
|
|
- border-radius: 4px;
|
|
|
- box-shadow: 1px 2px 2px 1px #999;
|
|
|
- padding: 6px 0px 2px 0;
|
|
|
-}
|
|
|
-.dropmenu li li
|
|
|
-{
|
|
|
- width: 17em;
|
|
|
- margin: 0;
|
|
|
-}
|
|
|
-.dropmenu li li a span
|
|
|
+.dropmenu li a
|
|
|
{
|
|
|
+ padding: 0 5px 0 5px;
|
|
|
+ margin: 0 0 0 0;
|
|
|
display: block;
|
|
|
- padding: 8px;
|
|
|
-}
|
|
|
-.dropmenu li ul ul
|
|
|
-{
|
|
|
- margin: -2.2em 0 0 15em;
|
|
|
- padding: 2px 0;
|
|
|
+ border-radius: 4px;
|
|
|
}
|
|
|
-
|
|
|
-/* the active button */
|
|
|
+/* Level 1 active button. */
|
|
|
.dropmenu li a.active
|
|
|
{
|
|
|
- background: url(../images/theme/menu_gfx.png) no-repeat 100% 0;
|
|
|
+ background: orange;
|
|
|
color: #fff;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
-.dropmenu li a.active span.firstlevel
|
|
|
-{
|
|
|
- background: url(../images/theme/menu_gfx.png) no-repeat 0 0;
|
|
|
-}
|
|
|
-/* the hover effects */
|
|
|
-.dropmenu li a.firstlevel:hover, .dropmenu li:hover a.firstlevel
|
|
|
+/* Level 1 hover effects. */
|
|
|
+.dropmenu li a:hover, .dropmenu li:hover a, .dropmenu li a:focus
|
|
|
{
|
|
|
- background: url(../images/theme/menu_gfx.png) no-repeat 100% -30px;
|
|
|
+ background: #597b9f;
|
|
|
color: #fff;
|
|
|
cursor: pointer;
|
|
|
text-decoration: none;
|
|
|
}
|
|
|
-.dropmenu li a.firstlevel:hover span.firstlevel, .dropmenu li:hover a.firstlevel span.firstlevel
|
|
|
+/* If we feel like styling the active state separately. */
|
|
|
+.dropmenu li a:active {}
|
|
|
+/* Levels 2 and 3 submenu wrapper. */
|
|
|
+.dropmenu li ul
|
|
|
{
|
|
|
- background: url(../images/theme/menu_gfx.png) no-repeat 0 -30px;
|
|
|
-}
|
|
|
-/* the hover effects on level2 and 3 */
|
|
|
-.dropmenu li li a:hover, .dropmenu li li:hover>a
|
|
|
+ z-index: 90;
|
|
|
+ position: absolute;
|
|
|
+ top: 2.2em;
|
|
|
+ left: -999em;
|
|
|
+ width: 17em;
|
|
|
+ font-weight: normal;
|
|
|
+ font-size: 1.1em;
|
|
|
+ background: #fff url(../images/theme/menu_gfx.png) -30px -137px repeat-x;
|
|
|
+ border: solid 1px #999;
|
|
|
+ border-radius: 4px;
|
|
|
+ /* Note: Using a black rgba box-shadow with suitable
|
|
|
+ alpha value gives the best effect on any background. */
|
|
|
+ box-shadow: 1px 2px 2px rgba(0,0,0,0.3);
|
|
|
+ padding: 6px 0 4px 0;
|
|
|
+}
|
|
|
+/* Level 2 link background. */
|
|
|
+.dropmenu li li
|
|
|
{
|
|
|
- background: #d4dbe4;
|
|
|
- color: #000;
|
|
|
- text-decoration: none;
|
|
|
+ margin: 0 0 0 0;
|
|
|
+ padding: 0 0 0 0;
|
|
|
+ position: relative;
|
|
|
+ float: none;
|
|
|
}
|
|
|
-.dropmenu li:hover ul ul, .dropmenu li.sfhover ul ul, .dropmenu li:hover ul ul ul, .dropmenu li.sfhover ul ul ul
|
|
|
+/* Note: The next two declarations are for keyboard access with js disabled. */
|
|
|
+.dropmenu ul a:focus
|
|
|
{
|
|
|
- top: -999em;
|
|
|
+ margin-left: 1109.5em;
|
|
|
+ width: 17.8em;
|
|
|
}
|
|
|
-.dropmenu li li:hover ul, .dropmenu li li.sfhover ul
|
|
|
+.dropmenu ul ul a:focus
|
|
|
{
|
|
|
- top: auto;
|
|
|
+ margin-left: 2228em;
|
|
|
}
|
|
|
-.dropmenu li:hover ul, .dropmenu li.sfhover ul, .dropmenu ul ul
|
|
|
+.dropmenu li:hover li a, .dropmenu li.sfhover li a
|
|
|
{
|
|
|
+ margin: 0 0 0 0;
|
|
|
+ padding: 0 0.5em 0 0.5em;
|
|
|
display: block;
|
|
|
- top: 21px;
|
|
|
- left: -5px;
|
|
|
+ border-radius: 0;
|
|
|
+ /* Necessary to allow highlighting of 1st level while hovering over submenu. */
|
|
|
+ background: none;
|
|
|
+ color: #346;
|
|
|
}
|
|
|
-/* These two declarations are necessary for keyboard access with js disabled. */
|
|
|
-.dropmenu ul a:focus {
|
|
|
- margin-left: 9999px;
|
|
|
+/* Level 3 submenu wrapper positioning. */
|
|
|
+.dropmenu li ul ul
|
|
|
+{
|
|
|
+ margin: -2.2em 0 0 15em;
|
|
|
}
|
|
|
-.dropmenu ul a:focus span
|
|
|
+/* Levels 2 and 3 hover effects. */
|
|
|
+.dropmenu li li:hover, .dropmenu li li:hover>a, .dropmenu li li a:focus, .dropmenu li li.subsections a:focus
|
|
|
{
|
|
|
- width: 17em;
|
|
|
- white-space: pre;
|
|
|
background: #d4dbe4;
|
|
|
+ color: #333;
|
|
|
+ text-decoration: none;
|
|
|
}
|
|
|
-/* This declaration is necessary to reset the margin when js is active. */
|
|
|
-.dropmenu ul li.sfhover a:focus
|
|
|
+/* If we feel like styling the active state separately. */
|
|
|
+.dropmenu li li a:active, .dropmenu li li:hover>a:active {}
|
|
|
+/* Reposition Level 2 submenu as visible on hover. */
|
|
|
+.dropmenu li:hover ul, .dropmenu li.sfhover ul
|
|
|
{
|
|
|
- margin-left: 0;
|
|
|
+ left: -4px;
|
|
|
}
|
|
|
-.dropmenu li li.additional_items
|
|
|
+/* Hiding Level 3 submenu off hover. */
|
|
|
+.dropmenu li:hover ul ul, .dropmenu li.sfhover ul ul, .dropmenu li:hover ul ul ul, .dropmenu li.sfhover ul ul ul
|
|
|
+{
|
|
|
+ left: -999em;
|
|
|
+}
|
|
|
+/* Reposition as visible on hover. */
|
|
|
+.dropmenu li li:hover ul, .dropmenu li li.sfhover ul
|
|
|
+{
|
|
|
+ left: auto;
|
|
|
+}
|
|
|
+/* Note: The additonal_items class was only added due to menu_gfx.png being the only background of the submenu and having limited height. */
|
|
|
+/* Can probably be removed as we wont be relying solely on the image in 2.1, and therefore height is effectively unlimited. */
|
|
|
+/* Code for additional items styling has been removed from GenericMenu.template.php with no obvious ill effects. */
|
|
|
+/*.dropmenu li li.additional_items
|
|
|
{
|
|
|
background: #fff;
|
|
|
+}*/
|
|
|
+/* Indicator for additonal levels. Best in the anchor so it stays visible on hover. */
|
|
|
+.dropmenu li li.subsections a
|
|
|
+{
|
|
|
+ background: url(../images/admin/subsection.png) no-repeat 99% 40%;
|
|
|
}
|
|
|
-.dropmenu li li.subsections
|
|
|
-{
|
|
|
- background: url(../images/admin/subsection.png) no-repeat 98% center;
|
|
|
+/* Stops inheritance of indicator icon if there is no fourth level. */
|
|
|
+.dropmenu li li.subsections li a
|
|
|
+{
|
|
|
+ background: none;
|
|
|
}
|
|
|
+/* Highlighting of current section */
|
|
|
.dropmenu li li a.chosen
|
|
|
{
|
|
|
- font-weight: bold;
|
|
|
+ font-weight: bold;
|
|
|
}
|
|
|
|
|
|
/* The dropdown menu toggle image */
|
Spuds