Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
4247 stevensc 1 
.header {
2 
    position: sticky;
3 
    top: 0;
4 
    border-bottom: 0.1px solid lightgray;
5 
    padding: 10px 0;
6 
    width: 100%;
7 
    overflow: hidden;
8 
    z-index: 999;
9 
}
10 
 
11 
.header__nav {
12 
    display: flex;
13 
    justify-content: space-between;
14 
}
15 
 
16 
.header__left {
17 
    display: flex;
18 
    align-items: center;
19 
    gap: 10px;
20 
}
21 
 
22 
.header__left > img {
23 
    object-fit: contain;
24 
    height: 40px;
25 
}
26 
 
27 
.header__search {
28 
    display: flex;
29 
    align-items: center;
30 
    border-radius: 5px;
31 
    height: 34px;
32 
    color: gray;
33 
    cursor: pointer;
34 
    transition: all 0.2s;
35 
}
36 
 
37 
.header__search:hover {
38 
    color: #000;
39 
}
40 
 
41 
.header__search > input {
42 
    display: none;
43 
    border: none;
44 
    outline: none;
45 
    background: none;
46 
}
47 
 
48 
.header__search.show {
49 
    padding: 0.5rem;
50 
    background-color: #eef3f0;
51 
    flex: 1;
52 
}
53 
 
54 
.header__search.show > input {
55 
    display: initial;
56 
}
57 
 
58 
.header__right {
4249 stevensc 59 
    align-items: center;
4247 stevensc 60 
    flex-grow: 1;
4249 stevensc 61 
    display: flex;
4247 stevensc 62 
    & > ul {
63 
        display: flex;
4249 stevensc 64 
        flex-grow: 1;
4247 stevensc 65 
        justify-content: space-evenly;
66 
        gap: 1.5rem;
67 
    }
68 
    &.hide {
69 
        display: none;
70 
    }
71 
}
72 
 
73 
@media (min-width: 768px) {
74 
    .header__right {
75 
        flex-grow: initial;
76 
        & > ul {
77 
            display: flex !important;
78 
            justify-content: initial;
79 
        }
80 
    }
81 
 
82 
    .header__search {
83 
        padding: 0.5rem;
84 
        background-color: #eef3f0;
85 
    }
86 
 
87 
    .header__search > input {
88 
        display: initial;
89 
    }
90 
}