feat: aligment and setting up grids

This commit is contained in:
Smigz 2023-11-14 14:26:15 -05:00
parent c67a8d62ce
commit ef61c387aa
2 changed files with 27 additions and 3 deletions

View file

@ -9,15 +9,35 @@
}
.navbar h1,ul {
.navbar ul {
grid-column: 1 / 2;
display: grid;
grid-template-rows: repeat(auto-fit, minmax(30px, 1fr));
justify-content: center;
gap: 20px;
}
.topbar {
grid-row: 1 / 2;
grid-column: 1 / 3;
}
.topbar ul {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
}
.topbar h1 {
margin-bottom: 50px;
justify-self: center;
}
.content {
grid-column: 2 / 3;
}
ul {
list-style-type: none;
}

View file

@ -10,7 +10,6 @@
<div class="container">
<div class="sidebar">
<nav class="navbar">
<h1 class="nav-header">Dashboard</h1>
<ul>
<li>Home</li>
<li>Profile</li>
@ -24,7 +23,12 @@
</nav>
</div>
<div class="topbar">
<ul>
<h1 class="topbar-header">Dashboard</h1>
<li>New</li>
<li>Upload</li>
<li>Share</li>
</ul>
</div>
<div class="content">