Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
4299 stevensc 1 
.sidebar {
4306 stevensc 2 
    position: relative;
4299 stevensc 3 
    display: flex;
4 
    flex-direction: column;
5 
    text-align: center;
6 
    height: fit-content;
4306 stevensc 7 
    grid-area: sidebar;
4299 stevensc 8 
}
9 
 
10 
.sidebar__top {
11 
    align-items: center;
12 
    background-color: #fff;
4980 stevensc 13 
    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08);
4299 stevensc 14 
    display: flex;
15 
    flex-direction: column;
16 
    overflow: hidden;
4308 stevensc 17 
    * {
18 
        margin-bottom: 0.5rem;
19 
    }
4498 stevensc 20 
    h1,
21 
    p,
22 
    span {
4301 stevensc 23 
        font-size: 0.9rem;
4499 stevensc 24 
        padding: 0 1rem;
4301 stevensc 25 
    }
4498 stevensc 26 
    span {
27 
        color: rgba(0, 0, 0, 0.6);
28 
    }
4308 stevensc 29 
    .sidebar__cover {
4299 stevensc 30 
        width: 100%;
31 
        height: 60px;
32 
        object-fit: cover;
33 
        margin-bottom: -20px;
34 
    }
35 
}
36 
 
37 
.sidebar__bottom {
38 
    margin-top: 10px;
39 
    display: flex;
40 
    flex-direction: column;
41 
    align-items: center;
42 
    border: 1px solid lightgray;
43 
    background-color: #fff;
44 
    overflow: hidden;
4318 stevensc 45 
    padding: 10px 0;
4299 stevensc 46 
}
47 
 
4438 stevensc 48 
.sidebar-apps__widget {
49 
    background-color: #fff;
50 
    padding: 1rem;
4439 stevensc 51 
    margin-top: 0.5rem;
4441 stevensc 52 
    gap: 0.5rem;
4961 stevensc 53 
    @media (min-width: 768px) {
4980 stevensc 54 
        box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08);
4961 stevensc 55 
        border-radius: 10px;
56 
    }
4438 stevensc 57 
}
58 
 
4299 stevensc 59 
.sidebar__stats {
4313 stevensc 60 
    background-color: #fff;
4299 stevensc 61 
    padding-top: 10px;
62 
    padding-bottom: 10px;
63 
    border: 1px solid lightgray;
64 
    border-top: 0;
4321 stevensc 65 
    &:nth-last-child(2) {
66 
        border-radius: 10px;
67 
        border-top-left-radius: 0;
68 
        border-top-right-radius: 0;
69 
    }
4299 stevensc 70 
}
71 
 
72 
.sidebar__stat {
4305 stevensc 73 
    padding: 10px;
4299 stevensc 74 
    display: flex;
75 
    justify-content: space-between;
76 
    cursor: pointer;
77 
    &:hover {
78 
        background-color: rgba(0, 0, 0, 0.08);
79 
    }
4315 stevensc 80 
    & > span {
81 
        font-size: 0.9rem;
4299 stevensc 82 
        font-weight: 600;
83 
        color: gray;
84 
    }
85 
}
86 
 
87 
.sidebar__stat-number {
88 
    font-weight: bold !important;
89 
    color: #0a66c2 !important;
90 
}
91 
 
92 
.sidebar__recent-item__container {
93 
    display: flex;
94 
    flex-direction: column;
95 
    width: 100%;
96 
}
97 
 
98 
.sidebar__recent-item {
99 
    cursor: pointer;
100 
    display: flex;
101 
    align-items: center;
102 
    justify-content: space-between;
103 
    width: 100%;
4318 stevensc 104 
    padding: 0 10px;
4299 stevensc 105 
}
106 
 
107 
.sidebar__recent-item > p {
4315 stevensc 108 
    font-size: 0.9rem;
4299 stevensc 109 
    font-weight: 600;
110 
    color: gray;
111 
}
112 
 
113 
.sidebar__recent-actions {
114 
    align-items: center;
115 
    display: flex;
116 
    gap: 10px;
117 
}
118 
 
119 
.sidebar__recent-icon {
120 
    background-color: #0000;
121 
    border: none;
122 
    border-radius: 50%;
123 
    height: 2rem;
124 
    width: 2rem;
125 
    display: grid;
126 
    place-items: center;
127 
    padding: 0;
128 
    cursor: pointer;
129 
    transition: all 0.2s;
130 
}
131 
 
132 
.sidebar__recent-item:hover .sidebar__recent-icon {
133 
    background-color: rgba(0, 0, 0, 0.08);
134 
}
135 
 
136 
.sidebar__options {
137 
    display: none;
138 
}
139 
 
140 
.sidebar__options.show {
141 
    display: block;
142 
}
143 
 
144 
.sideabar__footer {
145 
    display: grid;
146 
    place-items: center;
147 
}
148 
 
149 
.sideabar__footer > button {
150 
    border: none;
151 
    background-color: #0000;
152 
    width: 100%;
153 
    margin-top: 10px;
154 
    color: gray;
155 
}
156 
 
157 
.sideabar__footer > button:hover {
158 
    background-color: rgba(0, 0, 0, 0.08);
159 
}
160 
 
4314 stevensc 161 
.helper__list {
162 
    display: flex;
163 
    flex-direction: column;
4316 stevensc 164 
    transition: all 0.2s ease-in-out;
4319 stevensc 165 
    overflow: hidden;
4659 stevensc 166 
    gap: 0.5rem;
4316 stevensc 167 
    &.hide {
4317 stevensc 168 
        height: 0;
4316 stevensc 169 
    }
170 
    &.show {
4317 stevensc 171 
        height: auto;
4316 stevensc 172 
    }
4315 stevensc 173 
    .helper__list-item {
4660 stevensc 174 
        padding: 5px 10px;
4315 stevensc 175 
        display: flex;
176 
        align-items: center;
177 
        gap: 0.5rem;
178 
        &:hover {
179 
            background-color: rgba(0, 0, 0, 0.08);
180 
        }
181 
        & > span {
182 
            font-size: 0.9rem;
183 
            font-weight: 600;
184 
            color: gray;
4320 stevensc 185 
            text-align: left;
4315 stevensc 186 
        }
187 
    }
4314 stevensc 188 
}
189 
 
4299 stevensc 190 
@media (min-width: 576px) {
191 
    .sidebar__top {
192 
        border-radius: 10px;
193 
        border-bottom-right-radius: 0;
194 
        border-bottom-left-radius: 0;
195 
    }
196 
 
197 
    .sidebar__bottom {
198 
        border-radius: 10px;
199 
    }
200 
 
4305 stevensc 201 
    .sidebar__stats:nth-last-child(1) {
4299 stevensc 202 
        border-radius: 10px;
203 
        border-top-right-radius: 0;
204 
        border-top-left-radius: 0;
205 
    }
206 
}
207 
 
208 
@media (min-width: 768px) {
209 
    .sideabar__footer {
210 
        display: none;
211 
    }
212 
 
213 
    .sidebar__options {
214 
        display: block;
215 
    }
216 
}