Start Menu
This commit is contained in:
@@ -1,4 +1,115 @@
|
||||
p
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
|
||||
@import url('https://fonts.googleapis.com/css2?family=Alkatra&family=Delicious+Handrawn&family=Roboto:wght@300&display=swap');
|
||||
|
||||
*
|
||||
{
|
||||
font-family: "Roboto Light", sans-serif;
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
li, a, button
|
||||
{
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
color: #ecf0f1;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
header
|
||||
{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30px 10%;
|
||||
background-color: #24242A;
|
||||
}
|
||||
|
||||
.navLinks
|
||||
{
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.navLinks li
|
||||
{
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
padding: 0px 20px;
|
||||
}
|
||||
|
||||
|
||||
.navLinks li a
|
||||
{
|
||||
transition: all 0.5s ease 0s;
|
||||
}
|
||||
|
||||
.navLinks li a:hover, .navLinks li:hover
|
||||
{
|
||||
color: #0088a9;
|
||||
}
|
||||
|
||||
button
|
||||
{
|
||||
padding: 9px 25px;
|
||||
background-color: rgba(0, 136, 169, 1);
|
||||
border: none;
|
||||
border-radius: 50px;
|
||||
cursor: pointer;
|
||||
transition: all 0.5s ease 0s;
|
||||
}
|
||||
|
||||
button:hover
|
||||
{
|
||||
background-color: rgba(0, 136, 169, 0.3);
|
||||
}
|
||||
|
||||
nav
|
||||
{
|
||||
order: 1;
|
||||
}
|
||||
|
||||
h1
|
||||
{
|
||||
text-align: center;
|
||||
font-size: 50px;
|
||||
|
||||
color: white;
|
||||
}
|
||||
|
||||
.margin-top
|
||||
{
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
body
|
||||
{
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-size: cover;
|
||||
background-color: #31313a;
|
||||
}
|
||||
|
||||
|
||||
.dropdown div
|
||||
{
|
||||
display: none;
|
||||
position: absolute;
|
||||
padding: 20px;
|
||||
margin-left: -90px;
|
||||
background-color: #24242A;
|
||||
border-radius: 50px
|
||||
}
|
||||
|
||||
.dropdown div ul li
|
||||
{
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.dropdown:hover div ul, .dropdown:hover div
|
||||
{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
Reference in New Issue
Block a user