74 lines
1.1 KiB
CSS
74 lines
1.1 KiB
CSS
.navbar {
|
|
/* position: unset; */
|
|
display: grid;
|
|
justify-content: center;
|
|
justify-items: end;
|
|
gap: 1rem;
|
|
align-items: center;
|
|
grid-template-columns: repeat(2, auto);
|
|
}
|
|
|
|
.navbar figure {
|
|
border: var(--border-color) 5px solid;
|
|
height: 60px;
|
|
width: 60px;
|
|
align-self: center;
|
|
margin-top: 2%;
|
|
position: relative;
|
|
text-align: end;
|
|
justify-items: end;
|
|
}
|
|
|
|
.navbar h1 {
|
|
font-size: 43px;
|
|
color: hsl(35, 100%, 70%);
|
|
text-align: center;
|
|
font-family: 'Major Mono Display', monospace;
|
|
font-weight: bold;
|
|
}
|
|
|
|
|
|
.navbar .user-avtar {
|
|
position: absolute;
|
|
top: 0.5rem;
|
|
right: 0px;
|
|
width: 4.5rem;
|
|
max-width: 5rem;
|
|
}
|
|
|
|
.navbar .user-avtar .avtar{
|
|
border: 5px solid #fff;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
|
|
@media (max-width: 600px){
|
|
/* .navbar {
|
|
justify-content: space-between;
|
|
} */
|
|
|
|
.navbar h1 {
|
|
padding: 5px;
|
|
margin-top: 10px;
|
|
font-size: 30px;
|
|
}
|
|
|
|
.role-content h3 {
|
|
font-size: 25px;
|
|
margin-top: 25px;
|
|
text-align: center;
|
|
}
|
|
|
|
.navbar .user-avtar {
|
|
transform: scale(0.8);
|
|
margin-right: -5px;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1200px){
|
|
.navbar {
|
|
margin-top: -15px;
|
|
}
|
|
}
|
|
|