Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
4296 stevensc 1 
.sidebar {
2 
    position: sticky;
3 
    top: 80px;
4 
    display: flex;
5 
    flex-direction: column;
6 
    text-align: center;
7 
    height: fit-content;
8 
    grid-area: "sidebar";
9 
}
10 
 
11 
.sidebar__top {
12 
    align-items: center;
13 
    background-color: #fff;
14 
    border: 1px solid lightgray;
15 
    display: flex;
16 
    flex-direction: column;
17 
    padding-bottom: 10px;
18 
    overflow: hidden;
19 
}
20 
 
21 
.sidebar__bottom {
22 
    margin-top: 10px;
23 
    padding: 10px;
24 
    display: flex;
25 
    flex-direction: column;
26 
    align-items: center;
27 
    border: 1px solid lightgray;
28 
    background-color: #fff;
29 
    overflow: hidden;
30 
}
31 
 
32 
.sidebar__top>img {
33 
    width: 100%;
34 
    height: 60px;
35 
    object-fit: cover;
36 
    margin-bottom: -20px;
37 
}
38 
 
39 
.sidebar__stats {
40 
    padding-top: 10px;
41 
    padding-bottom: 10px;
42 
    border: 1px solid lightgray;
43 
    border-top: 0;
44 
}
45 
 
46 
.sidebar__stat {
47 
    padding-left: 10px;
48 
    padding-right: 10px;
49 
    display: flex;
50 
    justify-content: space-between;
51 
    cursor: pointer;
52 
}
53 
 
54 
.sidebar__stat:hover {
55 
    background-color: rgba(0, 0, 0, 0.08);
56 
}
57 
 
58 
.sidebar__stat>p {
59 
    font-size: .8rem;
60 
    font-weight: 600;
61 
    color: gray;
62 
}
63 
 
64 
.sidebar__stat-number {
65 
    font-weight: bold !important;
66 
    color: #0a66c2 !important;
67 
}
68 
 
69 
.sidebar__recent-item__container {
70 
    display: flex;
71 
    flex-direction: column;
72 
    width: 100%;
73 
}
74 
 
75 
.sidebar__recent-item {
76 
    cursor: pointer;
77 
    display: flex;
78 
    align-items: center;
79 
    justify-content: space-between;
80 
    width: 100%;
81 
}
82 
 
83 
.sidebar__recent-item>p {
84 
    font-size: .8rem;
85 
    font-weight: 600;
86 
    color: gray;
87 
}
88 
 
89 
.sidebar__recent-actions {
90 
    align-items: center;
91 
    display: flex;
92 
    gap: 10px;
93 
}
94 
 
95 
.sidebar__recent-icon {
96 
    background-color: #0000;
97 
    border: none;
98 
    border-radius: 50%;
99 
    height: 2rem;
100 
    width: 2rem;
101 
    display: grid;
102 
    place-items: center;
103 
    padding: 0;
104 
    cursor: pointer;
105 
    opacity: 0;
106 
    transition: all .2s;
107 
}
108 
 
109 
.sidebar__recent-item:hover .sidebar__recent-icon {
110 
    background-color: rgba(0, 0, 0, 0.08);
111 
    opacity: initial;
112 
}
113 
 
114 
.sidebar__options {
115 
    display: none;
116 
}
117 
 
118 
.sidebar__options.show {
119 
    display: block;
120 
}
121 
 
122 
.sideabar__footer {
123 
    display: grid;
124 
    place-items: center;
125 
}
126 
 
127 
.sideabar__footer>button {
128 
    border: none;
129 
    background-color: #0000;
130 
    width: 100%;
131 
    margin-top: 10px;
132 
    color: gray;
133 
}
134 
 
135 
.sideabar__footer>button:hover {
136 
    background-color: rgba(0, 0, 0, 0.08);
137 
}
138 
 
139 
@media (min-width: 576px) {
140 
    .sidebar__top {
141 
        border-radius: 10px;
142 
        border-bottom-right-radius: 0;
143 
        border-bottom-left-radius: 0;
144 
    }
145 
 
146 
    .sidebar__bottom {
147 
        border-radius: 10px;
148 
    }
149 
 
150 
    .sidebar__stats:nth-last-child(2) {
151 
        border-radius: 10px;
152 
        border-top-right-radius: 0;
153 
        border-top-left-radius: 0;
154 
    }
155 
 
156 
}
157 
 
158 
@media (min-width: 768px) {
159 
    .sideabar__footer {
160 
        display: none;
161 
    }
162 
 
163 
    .sidebar__options {
164 
        display: block;
165 
    }
166 
}