add basic main card
This commit is contained in:
parent
0cbbeb562f
commit
9b6ac78514
2 changed files with 33 additions and 6 deletions
22
index.html
22
index.html
|
@ -12,12 +12,24 @@
|
||||||
<body>
|
<body>
|
||||||
<div class="card navigation-card">
|
<div class="card navigation-card">
|
||||||
<div class="navigation-buttons">
|
<div class="navigation-buttons">
|
||||||
<a href="#" class="button-default">home</a>
|
<button class="button-default">home</button>
|
||||||
<a href="#" class="button-default">file server</a>
|
<button class="button-default">file server</button>
|
||||||
<a href="#" class="button-default">git server</a>
|
<button class="button-default">git server</button>
|
||||||
<a href="#" class="button-default">about me</a>
|
<button class="button-default">about me</button>
|
||||||
<a href="#" class="button-default">contact me</a>
|
<button class="button-default">contact me</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="card">
|
||||||
|
<p>idididi</p>
|
||||||
|
<p>idididi</p>
|
||||||
|
<p>idididi</p>
|
||||||
|
<p>idididi</p>
|
||||||
|
<p>idididi</p>
|
||||||
|
<p>idididi</p>
|
||||||
|
<p>idididi</p>
|
||||||
|
<p>idididi</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
17
style.css
17
style.css
|
@ -1,6 +1,7 @@
|
||||||
body {
|
body {
|
||||||
background: #414141;
|
background: #2E2E2E;
|
||||||
font-family: 'Roboto', sans-serif;
|
font-family: 'Roboto', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card {
|
.card {
|
||||||
|
@ -27,10 +28,24 @@ body {
|
||||||
.button-default {
|
.button-default {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
border: 2px solid #818181;
|
border: 2px solid #818181;
|
||||||
|
background-color: #d1d1d1;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
font-size: 18px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
margin-top: 2px;
|
margin-top: 2px;
|
||||||
margin-bottom: 2px;
|
margin-bottom: 2px;
|
||||||
color: #818181;
|
color: #818181;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-default:hover {
|
||||||
|
color: #d1d1d1;
|
||||||
|
background-color: #818181;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
.card {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
}
|
}
|
Loading…
Reference in a new issue