I added some styles to the dropdown nav
authorIan Weller <ian@gaslightmedia.com>
Fri, 7 Apr 2017 18:45:21 +0000 (14:45 -0400)
committerIan Weller <ian@gaslightmedia.com>
Fri, 7 Apr 2017 18:45:21 +0000 (14:45 -0400)
I added styles to help with spacing and text alignment of the dropdown
menu.

root/scss/_topbar.scss

index 43fbd78..8ef1e5d 100644 (file)
                     background: transparent;
                 }
             }
-//            &.drop-left {
-//                ul.dropdown {
-//                    padding-left: 21px;
-//                    padding-right: 250px;
-//                    top: 74px;
-//                    background: $white;
-//                    border-bottom-left-radius: 10px;
-//                    border-bottom-right-radius: 10px;
-//                    min-width: 500px;
-//                    box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.5);
-//                    -ms-box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.5);
-//                    -moz-box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.5);
-//                    -webkit-box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.5);
-//                    li {
-//                        white-space: nowrap;
-//                        border-bottom: 1px solid #e7e7e8;
-//                        padding: 5px 0;
-//                        &.nav-img-container {
-//                            img {
-//                                position: absolute;
-//                                right: 20px;
-//                                top: 23px;
-//                                border: 6px solid #fdefd4;
-//                            }
-//                            border: none;
-//                        }
-//                        a {
-//                            padding-left: 0;
-//                            text-align: left;
-//                            font-size: 18px;
-//                            &:hover {
-//                                color: $d-blue;
-//                                text-shadow: 0 0 1px $green;
-//                                text-shadow: 1 0 1px $green;
-//                                text-shadow: 0 1 1px $green;
-//                                text-shadow: -1 0 1px $green;
-//                                text-shadow: 0 -1 1px $green;
-//                            }
-//                        }
-//                    }
-//                }
-//            }
+            ul.dropdown {
+                li {
+                    a {
+                        border-top-left-radius: 0;
+                        border-top-right-radius: 0;
+                        text-align: left;
+                    }
+                    &:not(.has-form):not(.active) {
+                        & > a:not(.button) {
+                            font-size: rem-calc(20);
+                            padding: 10px 14px;
+                            
+                        }
+                    }
+                    &.active:not(.has-form) {
+                        & > a:not(.button) {
+                            padding: 10px 14px;
+                            
+                        }
+                    }
+                }
+            }
+            &.drop-left {
+                ul.dropdown {
+                    right: -1%;
+                    left: auto;
+                    li {
+                        a {
+                            text-align: left;       
+                        }
+                    }
+                }
+            }
 //            &.drop-right {
 //                ul.dropdown {
 //                    padding-left: 250px;