123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113 |
- .sb-navbar {
- .navbar-brand {
- font-size: 1.15rem;
- font-weight: 700;
- img {
- height: 3.5rem;
- }
- }
- .navbar-toggler {
- color: $gray-900;
- border: 0;
- padding: 1rem;
- &:focus {
- outline: none;
- }
- &:active {
- color: fade-out($gray-900, 0.5);
- }
- }
- .navbar-nav {
- .nav-item {
- .nav-link {
- font-weight: 700;
- letter-spacing: 0.05rem;
- text-transform: uppercase;
- font-size: 0.8rem;
- line-height: 0.8rem;
- padding: 1rem 0;
- i {
- font-size: 0.9rem;
- }
- }
- }
- .dropdown-menu {
- font-size: 0.85rem;
- .dropdown-header {
- font-size: 0.75rem;
- }
- }
- }
- .tooltip {
- display: none;
- }
- @include media-breakpoint-up(lg) {
- .tooltip {
- display: block;
- }
- .navbar-nav {
- padding-top: 0;
- padding-bottom: 0;
- .nav-item {
- .nav-link {
- padding: 1rem 0.5rem;
- margin-bottom: 0;
- }
- .dropdown-menu {
- top: 50px;
- }
- }
- }
- .dropdown-templates,
- .dropdown-themes {
- padding: 0;
- overflow: hidden;
- left: -212px;
- .dropdown-item {
- border-radius: 0 !important;
- }
- .dropdown-themes-callout {
- width: 20rem;
- .btn-xl {
- font-size: 0.6rem;
- padding: 0.75rem 1rem;
- }
- h5 {
- margin-bottom: 0.25rem;
- }
- p {
- margin-bottom: 2rem;
- font-size: 0.85rem;
- color: fade-out($white, 0.15);
- }
- }
- }
- .dropdown-themes {
- .dropdown-themes-callout {
- background: linear-gradient(to bottom, #{fade-out($black, .5)} 0%,#{fade-out($black, .3)} 75%,$black 100%), url('/assets/img/bg-navbar-dropdown-themes.png');
- background-position: center;
- background-size: cover;
- }
- .dropdown-item:active {
- background-color: $red;
- }
- }
- .dropdown-templates {
- .dropdown-themes-callout {
- background: linear-gradient(to bottom, #{fade-out($black, .5)} 0%,#{fade-out($black, .3)} 75%,$black 100%), url('/assets/img/bg-navbar-dropdown-templates.png');
- background-position: center;
- background-size: cover;
- }
- .dropdown-item:active {
- background-color: $blue;
- }
- }
- }
- }
|