Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 3495 | Rev 3511 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3488 stevensc 1 
@use "../../settings/breakpoints.scss";
2 
 
3 
.userImgContainer {
4 
  display: flex;
5 
  align-items: center;
6 
  position: relative;
7 
  gap: 1rem;
8 
  cursor: pointer;
9 
  .d-flex,
10 
  .d-inline-flex {
11 
    gap: 5px;
12 
  }
13 
  h3 {
14 
    font-weight: bold;
15 
  }
16 
}
17 
 
18 
.userImg {
19 
  width: 45px;
20 
  object-fit: contain;
21 
  border-radius: 50%;
22 
  background-color: $bg-color;
23 
}
24 
 
25 
.userDropdown {
26 
  position: absolute;
27 
  top: 100%;
28 
  right: 0;
29 
  background-color: $bg-color;
30 
  width: 220px;
31 
  box-shadow: $light-shadow;
32 
  border: 1px solid $border-primary;
33 
  overflow: hidden;
34 
  z-index: 1000;
35 
  @media (max-width: 767px) {
36 
    right: 0;
37 
  }
38 
  ul {
39 
    display: flex;
40 
    flex-direction: column;
41 
    justify-content: center;
42 
    padding: 1.5rem;
43 
    li:not(:first-child) {
44 
      margin-top: 1rem;
45 
    }
46 
    a {
47 
      color: $font-color;
48 
      font-size: 1rem;
49 
      &:hover {
50 
        color: $font-color;
3502 stevensc 51 
        font-weight: bold;
3488 stevensc 52 
      }
53 
    }
54 
    .logOutContainer {
55 
      &__a {
56 
        font-weight: 600;
57 
        &:hover {
58 
          color: $danger;
59 
        }
60 
      }
61 
    }
62 
  }
63 
}
64 
 
65 
.fadeIn {
66 
  transform-origin: top;
67 
  animation: fadeIn 0.3s;
68 
}
69 
 
70 
.fadeOut {
71 
  transform-origin: top;
72 
  animation: fadeOut 0.3s;
73 
}
74 
 
75 
@keyframes fadeIn {
76 
  0% {
77 
    transform: scaleY(0);
78 
  }
79 
  100% {
80 
    transform: scaleY(1);
81 
  }
82 
}
83 
@keyframes fadeOut {
84 
  0% {
85 
    transform: scaleY(1);
86 
  }
87 
  100% {
88 
    transform: scaleY(0);
89 
  }
90 
}
91 
 
92 
@include breakpoints.maxwidth("medium") {
93 
  .userImg {
94 
    width: 65px;
95 
  }
96 
}