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 
  box-shadow: 3px 0 10px 0 rgba(183,192,206,.2);
14 
  transition: width .1s ease, left .1s ease;
15 
 
16 
  @media(max-width: 991px) {
17 
    width: 100%;
18 
    left: 0;
19 
    .navbar-content {
20 
      width: calc(100% - #{$sidebar-folded-width} - 1px);
21 
    }
22 
  }
23 
 
24 
  .sidebar-toggler {
25 
    height: 100%;
26 
    border-right: 1px solid $border-color;
27 
    align-items: center;
28 
    padding: 0 25px;
29 
    display: none;
30 
    svg {
31 
      width: 20px;
32 
      height: 20px;
33 
      color: $text-muted;
34 
    }
35 
    @media(max-width: 991px) {
36 
      display: flex;
37 
    }
38 
  }
39 
 
40 
  .search-form {
41 
    @extend .d-none;
42 
    @extend .d-md-flex;
43 
    @extend .align-items-center;
44 
    width: 100%;
45 
    margin-right: 60px;
46 
    .input-group {
47 
      .input-group-text {
48 
        padding: 0;
49 
        border: 0;
50 
        color: $text-muted;
51 
        background: $input-bg;
52 
        svg {
53 
          width: 20px;
54 
          height: 20px;
55 
          cursor: pointer;
56 
        }
57 
      }
58 
      .form-control {
59 
        border: 0;
60 
        margin-top: 3px;
61 
      }
62 
    }
63 
  }
64 
 
65 
  .navbar-content {
66 
    display: flex;
67 
    width: 100%;
68 
    height: 100%;
69 
    padding-left: 25px;
70 
    padding-right: 25px;
71 
    @media(max-width: 991px) {
72 
      width: calc(100% - #{$sidebar-folded-width} - 1px);
73 
    }
74 
    .navbar-nav {
75 
      display: flex;
76 
      flex-direction: row;
77 
      margin-left: auto;
78 
      .nav-item {
79 
        position: relative;
80 
        margin-left: 5px;
81 
        margin-right: 5px;
82 
        min-width: 30px;
83 
        display: flex;
84 
        align-items: center;
85 
        .nav-link {
86 
          color: $body-color;
87 
          padding: 0;
88 
          position: relative;
89 
          margin-left: auto;
90 
          margin-right: auto;
91 
          &:hover,
92 
          &[aria-expanded="true"] {
93 
            color: $primary;
94 
          }
95 
          &::after {
96 
            display: none;
97 
          }
98 
          svg {
99 
            width: 20px;
100 
            height: 20px;
101 
          }
102 
          .indicator {
103 
            position: absolute;
104 
            top: 0px;
105 
            right: 2px;
106 
            .circle {
107 
                background: $primary;
108 
                width: 7px;
109 
                height: 7px;
110 
                border-radius: 50%;
111 
                &::before {
112 
                    background-color: $primary;
113 
                    content: "";
114 
                    display: table;
115 
                    border-radius: 50%;
116 
                    position: absolute;
117 
                    @extend .pulse;
118 
                }
119 
            }
120 
          }
121 
        }
122 
        &.dropdown {
123 
          @media(max-width: 767px) {
124 
            position: static;
125 
          }
126 
          .dropdown-menu {
127 
            width: max-content;
128 
            position: absolute;
129 
            right: -20px;
130 
            left: auto;
131 
            @extend .dropdownAnimation;
132 
            &::before {
133 
              content: '';
134 
              width: 13px;
135 
              height: 13px;
136 
              background: $dropdown-bg;
137 
              position: absolute;
138 
              top: -7px;
139 
              right: 28px;
140 
              transform: rotate(45deg);
141 
              border-top: 1px solid $dropdown-border-color;
142 
              border-left: 1px solid $dropdown-border-color;
143 
            }
144 
            @media(max-width: 767px) {
145 
              right: 20px;
146 
              width: calc(100% - 40px);
147 
              &::before{
148 
                display: none;
149 
              }
150 
            }
151 
          }
152 
        }
153 
      }
154 
    }
155 
  }
156 
}