forked from Mirrors/apostrophe
fix footer
parent
ef8d486ecf
commit
ac64dc7e0b
|
@ -0,0 +1,16 @@
|
|||
footer {
|
||||
height: 20vh;
|
||||
width: 100%;
|
||||
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
z-index: 0;
|
||||
|
||||
display: flex;
|
||||
|
||||
color: whitesmoke;
|
||||
}
|
||||
|
||||
footer a{
|
||||
color: whitesmoke;
|
||||
}
|
|
@ -6,7 +6,7 @@ header {
|
|||
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
z-index: 1;
|
||||
z-index: 3;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
main {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
}
|
|
@ -26,21 +26,22 @@ section.dark {
|
|||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
section #programmers {
|
||||
min-height: 50vh;
|
||||
section.programmers {
|
||||
height: 80vh;
|
||||
width: 100%;
|
||||
|
||||
position: absolute;
|
||||
margin-top: -10vh;
|
||||
margin-bottom: 50vh;
|
||||
padding-top: 10vh;
|
||||
/* margin-top: -10vh; */
|
||||
margin-bottom: 20vh;
|
||||
/* padding-top: 10vh; */
|
||||
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
|
||||
z-index: -1;
|
||||
z-index: 2;
|
||||
|
||||
background: whitesmoke;
|
||||
box-shadow: 0px 20px 40px 0px #1010104f;
|
||||
}
|
||||
|
||||
.programmer {
|
||||
|
@ -51,16 +52,3 @@ section #programmers {
|
|||
padding: 20px;
|
||||
}
|
||||
|
||||
section #footer {
|
||||
height: 50vh;
|
||||
width: 100%;
|
||||
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
z-index: -2;
|
||||
|
||||
display: flex;
|
||||
|
||||
color: whitesmoke;
|
||||
}
|
||||
|
||||
|
|
|
@ -519,6 +519,11 @@ body {
|
|||
|
||||
/* LAYOUT - Structure and layout files.
|
||||
========================================================================== */
|
||||
main {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: 100%; }
|
||||
|
||||
header {
|
||||
background-color: #f5f5f588;
|
||||
width: 100%;
|
||||
|
@ -526,7 +531,7 @@ header {
|
|||
/* box-shadow: 0px -17px 20px 20px #29292978; */
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
z-index: 1;
|
||||
z-index: 3;
|
||||
display: flex;
|
||||
align-items: center; }
|
||||
|
||||
|
@ -545,6 +550,18 @@ header a {
|
|||
margin-left: auto;
|
||||
height: 100%; }
|
||||
|
||||
footer {
|
||||
height: 20vh;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
z-index: 0;
|
||||
display: flex;
|
||||
color: whitesmoke; }
|
||||
|
||||
footer a {
|
||||
color: whitesmoke; }
|
||||
|
||||
section {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
|
@ -566,17 +583,18 @@ section.dark {
|
|||
height: 900px;
|
||||
flex-wrap: wrap; }
|
||||
|
||||
section #programmers {
|
||||
min-height: 50vh;
|
||||
section.programmers {
|
||||
height: 80vh;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
margin-top: -10vh;
|
||||
margin-bottom: 50vh;
|
||||
padding-top: 10vh;
|
||||
/* margin-top: -10vh; */
|
||||
margin-bottom: 20vh;
|
||||
/* padding-top: 10vh; */
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
z-index: -1;
|
||||
background: whitesmoke; }
|
||||
z-index: 2;
|
||||
background: whitesmoke;
|
||||
box-shadow: 0px 20px 40px 0px #1010104f; }
|
||||
|
||||
.programmer {
|
||||
display: flex;
|
||||
|
@ -585,15 +603,6 @@ section #programmers {
|
|||
margin-right: auto;
|
||||
padding: 20px; }
|
||||
|
||||
section #footer {
|
||||
height: 50vh;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
z-index: -2;
|
||||
display: flex;
|
||||
color: whitesmoke; }
|
||||
|
||||
/* MODULES - Re-usable site elements.
|
||||
========================================================================== */
|
||||
.background-1 {
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -8,6 +8,7 @@
|
|||
/* LAYOUT - Structure and layout files.
|
||||
========================================================================== */
|
||||
|
||||
@import 'layout/_main.scss';
|
||||
@import 'layout/_grid.scss';
|
||||
@import 'layout/_header.scss';
|
||||
@import 'layout/_footer.scss';
|
||||
|
|
51
index.html
51
index.html
|
@ -25,7 +25,7 @@
|
|||
</head>
|
||||
<body class="background-2">
|
||||
<header>
|
||||
<img class="logo" src="images/uberwriter_logo.svg" alt="logo"></img>
|
||||
<img class="logo" src="images/uberwriter_logo.svg" alt="logo">
|
||||
<h1>berWriter</h1>
|
||||
<div class="buttons">
|
||||
<a href="https://www.paypal.me/WolfVollprecht">
|
||||
|
@ -41,42 +41,39 @@
|
|||
<img src="images/main_web.svg#MainApp" alt="">
|
||||
</section>
|
||||
<section class="section" id="DarkMode">
|
||||
<img src="images/main_web.svg#MainAppDark" alt=""></img>
|
||||
<img src="images/main_web.svg#MainAppDark" alt="">
|
||||
</section>
|
||||
<section class="section" id="InlinePreview">
|
||||
<img src="images/main_web.svg#InlinePreview" alt=""></img>
|
||||
<img src="images/main_web.svg#InlinePreview" alt="">
|
||||
</section>
|
||||
<section class="section" id="InlinePreview-2">
|
||||
<img src="images/main_web.svg#InlinePrevi2w" alt=""></img>
|
||||
<img src="images/main_web.svg#InlinePrevi2w" alt="">
|
||||
</section>
|
||||
<section class="section" id="InlinePreview-3">
|
||||
<img src="images/main_web.svg#InlinePrevi3w" alt=""></img>
|
||||
<img src="images/main_web.svg#InlinePrevi3w" alt="">
|
||||
</section>
|
||||
<section class="section dark" id="footer">
|
||||
<div id="programmers">
|
||||
<div class="programmer left">
|
||||
<img src="images/Wolf.jpeg" alt="Wolf Vollprecht">
|
||||
<p>Blablabla</p>
|
||||
</div>
|
||||
<div class="programmer right">
|
||||
<img src="images/Manu.jpeg" alt="Manuel Genovés">
|
||||
<p>Blebleble</p>
|
||||
</div>
|
||||
<section class="section programmers">
|
||||
<div class="programmer left">
|
||||
<img src="images/Wolf.jpeg" alt="Wolf Vollprecht">
|
||||
<p>Blablabla</p>
|
||||
</div>
|
||||
<div id="footer">
|
||||
<div id="about">
|
||||
<p>UberWriter©, a GPL program</p>
|
||||
|
||||
</div>
|
||||
<div id="links">
|
||||
<a href="https://github.com/UberWriter">Github</a>
|
||||
<a href="https://poeditor.com/join/project/gxVzFyXb2x">Localization</a>
|
||||
<a href="https://flathub.org/apps/details/de.wolfvollprecht.UberWriter">Flathub</a>
|
||||
<a href="https://www.paypal.me/WolfVollprecht">Donate</a>
|
||||
</div>
|
||||
<div class="programmer right">
|
||||
<img src="images/Manu.jpeg" alt="Manuel Genovés">
|
||||
<p>Blebleble</p>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</main>
|
||||
<footer id="footer">
|
||||
<div id="about">
|
||||
<p>UberWriter©, a GPL program</p>
|
||||
|
||||
</div>
|
||||
<div id="links">
|
||||
<a href="https://github.com/UberWriter">Github</a>
|
||||
<a href="https://poeditor.com/join/project/gxVzFyXb2x">Localization</a>
|
||||
<a href="https://flathub.org/apps/details/de.wolfvollprecht.UberWriter">Flathub</a>
|
||||
<a href="https://www.paypal.me/WolfVollprecht">Donate</a>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue