Proyectos de Subversion LeadersLinked - Backend

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
16825 efrain 1 
.navbar {
2 
  width: calc(100% - #{$sidebar-width-lg});
3 
  height: $navbar-height;
4 
  background: $card-bg;
5 
  border-bottom: 1px solid $border-color;
6 
  display: flex;
7 
  align-items: center;
8 
  padding: 0;
9 
  position: fixed;
10 
  right: 0;
11 
  left: $sidebar-width-lg;
12 
  z-index: 978;
13 
  -webkit-box-shadow: 3px 0 10px 0 #03060b;
14 
          box-shadow: 3px 0 10px 0 #03060b;
15 
  -webkit-transition: width .1s ease, left .1s ease;
16 
  transition: width .1s ease, left .1s ease;
17 
 
18 
  @media(max-width: 991px) {
19 
    width: 100%;
20 
    left: 0;
21 
    .navbar-content {
22 
      width: calc(100% - #{$sidebar-folded-width} - 1px);
23 
    }
24 
  }
25 
 
26 
  .sidebar-toggler {
27 
    height: 100%;
28 
    border-right: 1px solid $border-color;
29 
    display: flex;
30 
    align-items: center;
31 
    padding: 0 25px;
32 
    display: none;
33 
    svg {
34 
      width: 20px;
35 
      height: 20px;
36 
      color: $text-muted;
37 
    }
38 
    @media(max-width: 991px) {
39 
      display: -webkit-box;
40 
      display: -ms-flexbox;
41 
      display: flex;
42 
    }
43 
  }
44 
 
45 
  .search-form {
46 
    @extend .d-none;
47 
    @extend .d-md-flex;
48 
    @extend .align-items-center;
49 
    width: 100%;
50 
    margin-right: 60px;
51 
    .input-group {
52 
      .input-group-text {
53 
        padding: 0;
54 
        border: 0;
55 
        color: $text-muted;
56 
        background: $input-bg;
57 
        svg {
58 
          width: 20px;
59 
          height: 20px;
60 
          cursor: pointer;
61 
        }
62 
      }
63 
      .form-control {
64 
        border: 0;
65 
        background: transparent;
66 
        padding: 0 .8rem;
67 
        margin-top: 3px;
68 
        color: $text-muted;
69 
        &::-webkit-input-placeholder {
70 
          color: $text-muted;
71 
        }
72 
        &:-ms-input-placeholder {
73 
          color: $text-muted;
74 
        }
75 
        &::-ms-input-placeholder {
76 
          color: $text-muted;
77 
        }
78 
        &::placeholder {
79 
          color: $text-muted;
80 
        }
81 
      }
82 
    }
83 
  }
84 
 
85 
  .navbar-content {
86 
    display: flex;
87 
    width: 100%;
88 
    height: 100%;
89 
    padding-left: 25px;
90 
    padding-right: 25px;
91 
    @media(max-width: 991px) {
92 
      width: calc(100% - #{$sidebar-folded-width} - 1px);
93 
    }
94 
    .navbar-nav {
95 
      display: flex;
96 
      flex-direction: row;
97 
      margin-left: auto;
98 
      .nav-item {
99 
        position: relative;
100 
        margin-left: 5px;
101 
        margin-right: 5px;
102 
        min-width: 30px;
103 
        display: flex;
104 
        align-items: center;
105 
        .nav-link {
106 
          color: $text-muted;
107 
          padding: 0;
108 
          position: relative;
109 
          margin-left: auto;
110 
          margin-right: auto;
111 
          &:hover,
112 
          &[aria-expanded="true"] {
113 
            color: $primary;
114 
          }
115 
          &::after {
116 
            display: none;
117 
          }
118 
          svg {
119 
            width: 20px;
120 
            height: 20px;
121 
          }
122 
          .indicator {
123 
            position: absolute;
124 
            top: 0px;
125 
            right: 2px;
126 
            .circle {
127 
                background: $primary;
128 
                width: 7px;
129 
                height: 7px;
130 
                border-radius: 50%;
131 
                &::before {
132 
                    background-color: $primary;
133 
                    content: "";
134 
                    display: table;
135 
                    border-radius: 50%;
136 
                    position: absolute;
137 
                    @extend .pulse;
138 
                }
139 
            }
140 
          }
141 
        }
142 
        &.dropdown {
143 
          @media(max-width: 767px) {
144 
            position: static;
145 
          }
146 
          .dropdown-menu {
147 
            width: max-content;
148 
            position: absolute;
149 
            right: -20px;
150 
            left: auto;
151 
            @extend .dropdownAnimation;
152 
            font-size: .875rem;
153 
            &::before {
154 
              content: '';
155 
              width: 13px;
156 
              height: 13px;
157 
              background: $dropdown-bg;
158 
              position: absolute;
159 
              top: -7px;
160 
              right: 28px;
161 
              -webkit-transform: rotate(45deg);
162 
                      transform: rotate(45deg);
163 
              border-top: 1px solid $border-color;
164 
              border-left: 1px solid $border-color;
165 
            }
166 
            @media(max-width: 767px) {
167 
              right: 20px;
168 
              width: calc(100% - 40px);
169 
              &::before{
170 
                display: none;
171 
              }
172 
            }
173 
          }
174 
        }
175 
      }
176 
    }
177 
  }
178 
}