Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
4432 stevensc 1 
.user__options-dropdown,
2 
.nav__options-dropdown {
3 
    position: absolute;
4 
    right: 0;
5 
    min-width: 220px;
6 
    top: calc(100% + 10px);
7 
    background-color: #fff;
8 
    border-radius: 5px;
9 
    box-shadow: 0 0 0 1px rgb(0 0 0 / 5%), 0 3px 3px rgb(0 0 0 / 30%);
10 
    transition: all 0.2s ease-in-out;
11 
    transform-origin: top;
12 
    &.fadeOut {
13 
        transform: scaleY(0);
14 
        opacity: 0;
15 
    }
16 
    &.fadeIn {
17 
        transform: scaleY(1);
18 
        opacity: 1;
19 
    }
20 
    ul {
21 
        display: flex;
22 
        flex-direction: column;
23 
        gap: 0.5rem;
24 
        a {
25 
            white-space: nowrap;
26 
        }
27 
    }
28 
}
29 
 
4809 stevensc 30 
.user__options-dropdown {
4767 stevensc 31 
    border-top-right-radius: 0;
32 
}
33 
 
4432 stevensc 34 
.user__options-item {
35 
    padding: 1rem 10px;
36 
    border-top: 1px solid rgba(0, 0, 0, 0.08);
37 
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
38 
    display: flex;
39 
    flex-direction: column;
40 
    gap: 0.5rem;
41 
    h3 {
42 
        font-weight: 600;
43 
    }
44 
    ul {
45 
        display: flex;
46 
        flex-direction: column;
47 
        gap: 0.5rem;
48 
        a {
49 
            color: gray !important;
50 
            &:hover {
51 
                text-decoration: underline !important;
52 
            }
53 
        }
54 
    }
55 
}
56 
 
57 
.nav__options-dropdown {
58 
    transform: scaleY(0);
4746 stevensc 59 
    right: -10%;
4432 stevensc 60 
    opacity: 0;
61 
    padding: 1rem;
4747 stevensc 62 
    min-width: fit-content;
4767 stevensc 63 
    top: 101%;
4432 stevensc 64 
    ul {
65 
        display: flex;
66 
        flex-direction: column;
67 
        a {
68 
            color: gray !important;
69 
            &:hover {
70 
                text-decoration: underline !important;
71 
            }
72 
        }
4766 stevensc 73 
        li:not(:last-child) {
74 
            padding-bottom: 0.5rem;
75 
        }
4454 stevensc 76 
        li:hover .navLinkLevelThree {
77 
            display: block;
78 
        }
4432 stevensc 79 
    }
4454 stevensc 80 
    .navLinkLevelThree {
81 
        padding: 1rem;
82 
        border: 1px solid lightgray;
83 
        ul {
4456 stevensc 84 
            overflow: hidden;
4455 stevensc 85 
            max-height: none;
4454 stevensc 86 
        }
87 
    }
4432 stevensc 88 
}
89 
 
4743 stevensc 90 
.nav__options-dropdown.mobile {
91 
    top: initial;
92 
    bottom: 99%;
4745 stevensc 93 
    left: 50%;
4743 stevensc 94 
    transform-origin: bottom;
95 
}
96 
 
4809 stevensc 97 
.nav__options-dropdown.show {
4745 stevensc 98 
    transform: scaleY(1);
4432 stevensc 99 
    opacity: 1;
100 
}
101 
 
4747 stevensc 102 
li:hover .header__option.mobile ~ .nav__options-dropdown.mobile {
4746 stevensc 103 
    transform: scaleY(1) translateX(-50%);
104 
    opacity: 1;
105 
}
106 
 
4432 stevensc 107 
.user__options-description {
108 
    display: flex;
109 
    flex-direction: column;
110 
    align-items: center;
111 
    gap: 0.5rem;
112 
    padding: 10px;
113 
    left: 0;
114 
    right: initial;
115 
    .btn__profile {
116 
        padding: 2px;
117 
        border: 1px solid #7405f9;
118 
        width: 100%;
119 
        border-radius: 30px;
120 
        color: #7405f9;
121 
        font-size: 0.9rem;
122 
        text-align: center;
123 
        transition: all 0.1s ease-in;
124 
        &:hover {
125 
            border: 2px solid #7405f9;
126 
        }
127 
    }
128 
}
129 
 
130 
.user__options-info {
131 
    display: flex;
132 
    align-items: center;
133 
    gap: 0.5rem;
134 
    width: 100%;
135 
    h3 {
136 
        font-weight: 600;
137 
        font-size: 1.1rem;
138 
    }
139 
}
140 
 
141 
.user__option-icon {
142 
    height: 16px;
143 
    width: 16px;
144 
}
145 
 
146 
@media (min-width: 768px) {
147 
    .nav__options-dropdown {
4767 stevensc 148 
        right: 0;
149 
        border-top-right-radius: 0;
4432 stevensc 150 
    }
151 
}