Auf Thema antworten

Beitrag

[QUOTE="dilly87, post: 13433, member: 4583"]
hier der css für den header/nav 
[CODE]header{
    padding: 50px 50px;
    display: flex;
    justify-content: left;
    align-items: left;
    margin:20px;
    flex-wrap: wrap;
    font-size: 30px;
    text-align: left;   
}

.johannes{
    font-size: 90px;
}

nav{
    margin-bottom: 145px;
}
nav ul{
    list-style: none;
    display: flex;
    gap: 355px;
px;
}

nav a{
    color: var(--secondary-text-color);
    text-decoration: none;
}

a {
    position: relative;
    display: inline-block;
    font-size: 1em;
    font-weight: 00;
    color: white;
    overflow: hidden;
    background: linear-gradient(to left, grey, grey 50%, white 5%);
    background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: 200% 100%;
  background-position: 100%;
  transition: background-position 275ms ease;
}

a:hover {
  background-position: 0 100%;
  cursor: crosshair;
}

#toggle_button{
    display: none;
}
label[for="toggle_button"] {
    display: none;
}
label[for="toggle_button"] span{
    font-size: 40px;
}
@media(max-width: 800px){
    nav{
        position: absolute;
        top: 0;
        left: 0;
        background: var(--secondary-color);
        padding: 15px;
        border-radius: 0 0 25px 0;

}
    nav ul{
        display: none;
        flex-direction: column;
    }
    #toggle_button:checked ~ ul{
        display: flex;
    }
    label[for="toggle_button"] {
        display: block;
}
}[/CODE]
[/QUOTE]

Authentifizierung