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