Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 6635 | Rev 6709 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 6635 Rev 6707
Línea 1... Línea 1...
1 
@use "../../../../styles/breakpoints.scss";
 1 
@use "../../../../styles/breakpoints.scss";
Línea 2... Línea 2...
2 
 
 2 
 
3 
.navbar {
 3 
.header {
4 
  align-items: center;
 4 
  align-items: center;
5 
  background-color: $bg-color;
 5 
  background-color: $bg-color;
6 
  border-bottom: solid 1px $border-primary;
 6 
  border-bottom: solid 1px $border-primary;
7 
  box-shadow: $shadow;
 7 
  box-shadow: $shadow;
Línea 14... Línea 14...
14 
  padding: 1rem 5% 0;
 14 
  padding: 1rem 5% 0;
15 
  position: relative;
 15 
  position: relative;
16 
  width: 100%;
 16 
  width: 100%;
17 
}
 17 
}
Línea 18... Línea -...
18 
 
 - 
 
19 
.rightNavContainer {
 - 
 
20 
  display: none;
 - 
 
21 
  align-items: center;
 - 
 
22 
  height: 100%;
 - 
 
23 
 
 - 
 
24 
  @media (max-width: 361px) {
 - 
 
25 
    gap: 5px;
 - 
 
26 
 
 - 
 
27 
    .btn {
 - 
 
28 
      padding: 0 !important;
 - 
 
29 
 
 - 
 
30 
      .badge {
 - 
 
31 
        font-size: 0.6rem;
 - 
 
32 
      }
 - 
 
33 
    }
 - 
 
34 
  }
 - 
 
35 
}
 - 
 
36 
 
 18 
 
37 
.logo {
 19 
.logo {
38 
  height: 65px;
 20 
  height: 65px;
Línea 39... Línea 21...
39 
  order: 1;
 21 
  order: 1;
Línea 47... Línea 29...
47 
  color: $font-color;
 29 
  color: $font-color;
48 
  font-size: 1.5rem;
 30 
  font-size: 1.5rem;
49 
  order: 3;
 31 
  order: 3;
50 
}
 32 
}
Línea 51... Línea -...
51 
 
 - 
 
52 
.searchIcon {
 - 
 
53 
  color: $font-color;
 - 
 
54 
  width: 25px;
 - 
 
55 
  height: 25px;
 - 
 
56 
  border-radius: 50%;
 - 
 
57 
  font-size: 1.2rem;
 - 
 
58 
  display: flex;
 - 
 
59 
  justify-content: center;
 - 
 
60 
  align-items: center;
 - 
 
61 
  margin-left: 0.5rem;
 - 
 
62 
}
 - 
 
63 
 
 - 
 
64 
.mailIcon {
 - 
 
65 
  color: $font-color;
 - 
 
66 
  width: 25px;
 - 
 
67 
  height: 25px;
 - 
 
68 
  font-size: 1.2rem;
 - 
 
69 
  display: flex;
 - 
 
70 
  justify-content: center;
 - 
 
71 
  align-items: center;
 - 
 
72 
  margin-right: 0.5rem;
 - 
 
73 
 
 - 
 
74 
  @media (max-width: 361px) {
 - 
 
75 
    margin-right: 0rem;
 - 
 
76 
  }
 - 
 
77 
}
 - 
 
78 
 
 33 
 
79 
.badge {
 34 
.badge {
80 
  top: 0%;
 35 
  top: 0%;
81 
  left: 50%;
 36 
  left: 50%;
82 
  font-size: 0.7rem;
 37 
  font-size: 0.7rem;
Línea 85... Línea 40...
85 
  color: #fff;
 40 
  color: #fff;
86 
  border-radius: 100px;
 41 
  border-radius: 100px;
87 
  position: absolute;
 42 
  position: absolute;
88 
}
 43 
}
Línea 89... Línea -...
89 
 
 - 
 
90 
.bellIcon {
 - 
 
91 
  color: $font-color;
 - 
 
92 
  font-size: 1.2rem;
 - 
 
93 
  display: flex;
 - 
 
94 
  justify-content: center;
 - 
 
95 
  align-items: center;
 - 
 
96 
  font-weight: 600;
 - 
 
97 
  clip-path: circle(50%);
 - 
 
98 
 
 - 
 
99 
  @media (max-width: 361px) {
 - 
 
100 
    font-size: 1rem;
 - 
 
101 
    width: 21px;
 - 
 
102 
    height: 21px;
 - 
 
103 
  }
 - 
 
104 
}
 - 
 
105 
 
 - 
 
106 
.triangleDown {
 - 
 
107 
  border-left: 7px solid transparent;
 - 
 
108 
  border-right: 7px solid transparent;
 - 
 
109 
  border-top: 7px solid white;
 - 
 
110 
  margin-left: 0.5rem;
 - 
 
111 
}
 - 
 
112 
 
 - 
 
113 
.triangleUp {
 - 
 
114 
  border-left: 7px solid transparent;
 - 
 
115 
  border-right: 7px solid transparent;
 - 
 
116 
  border-bottom: 7px solid white;
 - 
 
117 
  margin-left: 0.5rem;
 - 
 
118 
}
 - 
 
119 
 
 - 
 
120 
.backdrop {
 - 
 
121 
  position: absolute;
 - 
 
122 
  top: 0;
 - 
 
123 
  left: 0;
 - 
 
124 
  width: 100%;
 - 
 
125 
  height: 100%;
 - 
 
126 
  background-color: rgba(0, 0, 0, 0.205);
 - 
 
127 
  z-index: 900;
 - 
 
128 
}
 - 
 
129 
 
 44 
 
130 
.searchInputContainer {
 45 
.searchInputContainer {
131 
  font-size: 0.9rem;
 46 
  font-size: 0.9rem;
132 
  min-width: 65%;
 47 
  min-width: 65%;
133 
  flex: 1;
 48 
  flex: 1;
Línea 162... Línea 77...
162 
    top: 50%;
 77 
    top: 50%;
163 
    transform: translateY(-50%);
 78 
    transform: translateY(-50%);
164 
  }
 79 
  }
165 
}
 80 
}
Línea 166... Línea -...
166 
 
 - 
 
167 
.chatIcon {
 - 
 
168 
  width: 30px;
 - 
 
169 
  height: 30px;
 - 
 
170 
  object-fit: contain;
 - 
 
171 
  margin-right: 0.2rem;
 - 
 
172 
  position: relative;
 - 
 
173 
 
 - 
 
174 
  &_active::before {
 - 
 
175 
    content: "";
 - 
 
176 
    width: 10px;
 - 
 
177 
    height: 10px;
 - 
 
178 
    border-radius: 50%;
 - 
 
179 
    background-color: red;
 - 
 
180 
    position: absolute;
 - 
 
181 
    top: -1px;
 - 
 
182 
    right: 1px;
 - 
 
183 
  }
 - 
 
184 
}
 - 
 
185 
 
 - 
 
186 
@media (min-width: 1000px) {
 - 
 
187 
  .chatIcon {
 - 
 
188 
    display: none;
 - 
 
189 
  }
 - 
 
190 
}
 - 
 
191 
 
 81 
 
192 
@include breakpoints.maxwidth("medium") {
 82 
@include breakpoints.maxwidth("medium") {
193 
  .logo {
 83 
  .logo {
194 
    max-width: 317px;
 84 
    max-width: 317px;
Línea 195... Línea 85...
195 
  }
 85 
  }
196 
 
 86 
 
197 
  .searchInputContainer input {
 87 
  .searchInputContainer input {
198 
    padding: 0.4rem 1rem 0.4rem 2rem;
 - 
 
199 
  }
 - 
 
200 
 
 - 
 
201 
  .bellIcon {
 - 
 
202 
    background-color: initial;
 - 
 
203 
    color: $font-color;
 88 
    padding: 0.4rem 1rem 0.4rem 2rem;
Línea 204... Línea 89...
204 
  }
 89 
  }
205 
}
 90 
}
206 
 
 91 
 
207 
@include breakpoints.maxwidth("desktop") {
 92 
@include breakpoints.maxwidth("desktop") {
208 
  .searchInputContainer {
 93 
  .searchInputContainer {
209 
    order: 3;
 94 
    order: 3;
Línea 210... Línea -...
210 
    min-width: auto;
 - 
 
211 
    flex: inherit;
 - 
 
212 
  }
 - 
 
213 
 
 - 
 
214 
  .hamburgerIcon {
 95 
    min-width: auto;
215 
    display: none;
 96 
    flex: inherit;
216 
  }
 97 
  }
217 
 
 98 
 
218 
  .navbar {
 99 
  .header {
219 
    padding: 0 5%;
 100 
    padding: 0 5%;