Navigation

jmr06005 · Jun 27, 2014 · cb47531 · cb47531
1 parent 29168b2
commit cb47531
Show file tree

Hide file tree

Showing 2 changed files with 97 additions and 0 deletions.
diff --git a/style.css b/style.css
@@ -168,6 +168,55 @@ img {
 
 /*	NAV
 --------------------------------------------------------------*/
+/* overwriting bootstrap 3's philosophical opposition to drop down menus. */
+.dropdown-submenu {
+  position: relative;
+}
+
+.dropdown-submenu > .dropdown-menu {
+  top: 0;
+  left: 100%;
+  margin-top: -6px;
+  margin-left: -1px;
+  -webkit-border-radius: 0 6px 6px 6px;
+  -moz-border-radius: 0 6px 6px 6px;
+  border-radius: 0 6px 6px 6px;
+}
+
+.dropdown-submenu:hover > .dropdown-menu {
+  display: block;
+}
+
+.dropdown-submenu > a:after {
+  display: block;
+  content: " ";
+  float: right;
+  width: 0;
+  height: 0;
+  border-color: transparent;
+  border-style: solid;
+  border-width: 5px 0 5px 5px;
+  border-left-color: #cccccc;
+  margin-top: 5px;
+  margin-right: -10px;
+}
+
+.dropdown-submenu:hover > a:after {
+  border-left-color: #ffffff;
+}
+
+.dropdown-submenu .pull-left {
+  float: none;
+}
+
+.dropdown-submenu.pull-left > .dropdown-menu {
+  left: -100%;
+  margin-left: 10px;
+  -webkit-border-radius: 6px 0 6px 6px;
+  -moz-border-radius: 6px 0 6px 6px;
+  border-radius: 6px 0 6px 6px;
+}
+
 .navbar-collapse {
   max-height: none;
 }

diff --git a/style.scss b/style.scss
@@ -209,6 +209,54 @@ img {
 
 /*	NAV
 --------------------------------------------------------------*/		
+/* overwriting bootstrap 3's philosophical opposition to drop down menus. */
+.dropdown-submenu{
+    position:relative;
+	}
+
+	.dropdown-submenu > .dropdown-menu {
+		top:0;
+		left:100%;
+		margin-top:-6px;
+		margin-left:-1px;
+		-webkit-border-radius:0 6px 6px 6px;
+		-moz-border-radius:0 6px 6px 6px;
+		border-radius:0 6px 6px 6px;
+		}
+
+		.dropdown-submenu:hover > .dropdown-menu{
+			display:block;
+			}
+
+		.dropdown-submenu > a:after{
+			display:block;
+			content:" ";
+			float:right;
+			width:0;
+			height:0;
+			border-color:transparent;
+			border-style:solid;
+			border-width:5px 0 5px 5px;
+			border-left-color:#cccccc;
+			margin-top:5px;
+			margin-right:-10px;
+			}
+
+			.dropdown-submenu:hover > a:after{
+				border-left-color:#ffffff;
+				}
+
+		.dropdown-submenu .pull-left{
+			float:none;
+			}
+
+			.dropdown-submenu.pull-left > .dropdown-menu{
+				left:-100%;
+				margin-left:10px;
+				-webkit-border-radius:6px 0 6px 6px;
+				-moz-border-radius:6px 0 6px 6px;
+				border-radius:6px 0 6px 6px;
+				}
 
 .navbar-collapse {
 	max-height:none;