Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
5455 stevensc 1 
@use "../../settings/mixins.scss";
3488 stevensc 2 
 
3 
.userImgContainer {
5455 stevensc 4 
  align-items: center;
5 
  cursor: pointer;
3488 stevensc 6 
  display: flex;
5455 stevensc 7 
  gap: 0.5rem;
3488 stevensc 8 
  position: relative;
5455 stevensc 9 
  order: 2;
10 
 
3488 stevensc 11 
  h3 {
12 
    font-weight: bold;
13 
  }
14 
 
5455 stevensc 15 
  img {
16 
    width: 65px;
17 
    height: 65px;
18 
    border-radius: 50%;
19 
    object-fit: contain;
20 
  }
21 
 
22 
  @include mixins.for-size(desktop) {
23 
    order: 4;
24 
  }
3488 stevensc 25 
}
26 
 
27 
.userDropdown {
28 
  background-color: $bg-color;
29 
  box-shadow: $light-shadow;
30 
  border: 1px solid $border-primary;
5455 stevensc 31 
  padding: 1rem;
32 
  position: absolute;
33 
  right: 0;
34 
  top: calc(100% + 0.5rem);
35 
  z-index: 200;
36 
 
3488 stevensc 37 
  ul {
38 
    display: flex;
39 
    flex-direction: column;
5455 stevensc 40 
    gap: 0.5rem;
41 
 
3488 stevensc 42 
    a {
43 
      color: $font-color;
5455 stevensc 44 
 
3488 stevensc 45 
      &:hover {
5455 stevensc 46 
        text-shadow: 0 0 0 $font-color;
3488 stevensc 47 
      }
5455 stevensc 48 
 
49 
      &:is(:last-child) {
3488 stevensc 50 
        font-weight: 600;
5455 stevensc 51 
 
3488 stevensc 52 
        &:hover {
53 
          color: $danger;
54 
        }
55 
      }
56 
    }
57 
  }
58 
}
59 
 
60 
.fadeIn {
61 
  transform-origin: top;
62 
  animation: fadeIn 0.3s;
63 
}
64 
 
65 
.fadeOut {
5455 stevensc 66 
  transform-origin: bottom;
3488 stevensc 67 
  animation: fadeOut 0.3s;
68 
}
69 
 
70 
@keyframes fadeIn {
71 
  0% {
72 
    transform: scaleY(0);
73 
  }
5455 stevensc 74 
 
3488 stevensc 75 
  100% {
76 
    transform: scaleY(1);
77 
  }
78 
}
5455 stevensc 79 
 
3488 stevensc 80 
@keyframes fadeOut {
81 
  0% {
82 
    transform: scaleY(1);
83 
  }
5455 stevensc 84 
 
3488 stevensc 85 
  100% {
86 
    transform: scaleY(0);
87 
  }
5455 stevensc 88 
}