Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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