Header, Footer and ToTop-Button

This commit is contained in:
hoernschen 2020-12-13 22:33:38 +01:00
parent d156ead8e0
commit 4ae49b6b0b
8 changed files with 384 additions and 4 deletions

38
css/footer.css Normal file
View file

@ -0,0 +1,38 @@
.footer {
margin: auto;
padding: 1.5rem;
text-align: center;
display: block;
background-color: #333;
color: #f2f2f2;
}
.social-media {
display: flex;
justify-content: center;
flex-wrap: wrap;
font-size: 2em;
color: Tomato;
}
.links {
margin-top: 1.5rem;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.link {
display: flex;
justify-content: space-around;
flex-grow: 0;
flex-shrink: 1;
line-height: 32px;
padding: 0px 24px;
}
.copyright {
margin-top: 1.5rem;
width: 100%;
font-size: small;
}

41
css/header.css Normal file
View file

@ -0,0 +1,41 @@
.header {
margin: auto;
padding: 1.5rem;
padding-bottom: 0rem;
text-align: center;
display: flex;
font-size: large;
}
.logo {
display: flex;
width: 48pt;
}
.header-items {
padding-right: 1rem;
margin: auto;
margin-right: 0px;
display: flex;
float: right;
right: 0px;
align-items: right;
text-align: right;
}
.header-item {
margin-left: 2.5rem
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown:hover .dropdown-content {
display: block;
}

3
css/index.css Normal file
View file

@ -0,0 +1,3 @@
body {
margin: 0px
}

31
css/totop.css Normal file
View file

@ -0,0 +1,31 @@
.totop {
display: inline-flex;
background-color: Tomato;
color: #f2f2f2;
width: 50px;
height: 50px;
align-items: center;
justify-content: center;
border-radius: 50%;
margin: 30px;
position: fixed;
bottom: 30px;
right: 30px;
transition: background-color .3s;
z-index: 1000;
}
.show {
visibility: visible;
opacity: 1;
}
.hide {
visibility: hidden;
opacity: 0;
}
.totop:hover {
cursor: pointer;
background-color: #333;
}