added sengi icon
This commit is contained in:
parent
2f6c071eaa
commit
d1b28cb897
|
@ -63,6 +63,7 @@ body {
|
||||||
width: calc(3 * (100% - 3 * 1rem) / 4 + 2 * 1rem); }
|
width: calc(3 * (100% - 3 * 1rem) / 4 + 2 * 1rem); }
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
|
position: relative;
|
||||||
background-color: #f7f7f7;
|
background-color: #f7f7f7;
|
||||||
height: calc(100vh - 3rem);
|
height: calc(100vh - 3rem);
|
||||||
overflow: hidden; }
|
overflow: hidden; }
|
||||||
|
@ -135,6 +136,13 @@ body {
|
||||||
position: relative;
|
position: relative;
|
||||||
top: -2px; }
|
top: -2px; }
|
||||||
|
|
||||||
|
.sengi-icon {
|
||||||
|
position: absolute;
|
||||||
|
top: 3rem;
|
||||||
|
left: 3rem;
|
||||||
|
width: 6rem;
|
||||||
|
height: 6rem; }
|
||||||
|
|
||||||
.footer {
|
.footer {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
background-color: #141414;
|
background-color: #141414;
|
||||||
|
|
|
@ -0,0 +1,33 @@
|
||||||
|
.footer {
|
||||||
|
text-align: center;
|
||||||
|
background-color: rgb(20, 20, 20);
|
||||||
|
color: white;
|
||||||
|
height: 18rem;
|
||||||
|
padding-top: 4em;
|
||||||
|
|
||||||
|
&__title {
|
||||||
|
font-family: 'Open Sans', sans-serif;
|
||||||
|
font-weight: lighter;
|
||||||
|
font-size: 2rem;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
&__buttons {
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
&--button {
|
||||||
|
font-size: 4rem;
|
||||||
|
color:whitesmoke;
|
||||||
|
transition: all .2s;
|
||||||
|
|
||||||
|
&:not(:last-child){
|
||||||
|
margin-right: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color:rgb(250, 164, 36);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
.header {
|
.header {
|
||||||
|
position: relative;
|
||||||
background-color: rgb(247, 247, 247);
|
background-color: rgb(247, 247, 247);
|
||||||
height: calc(100vh - 3rem);
|
height: calc(100vh - 3rem);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -118,36 +118,10 @@
|
||||||
top: -2px;
|
top: -2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer {
|
.sengi-icon {
|
||||||
text-align: center;
|
position: absolute;
|
||||||
background-color: rgb(20, 20, 20);
|
top: 3rem;
|
||||||
color: white;
|
left: 3rem;
|
||||||
height: 18rem;
|
width: 6rem;
|
||||||
padding-top: 4em;
|
height: 6rem;
|
||||||
|
|
||||||
&__title {
|
|
||||||
font-family: 'Open Sans', sans-serif;
|
|
||||||
font-weight: lighter;
|
|
||||||
font-size: 2rem;
|
|
||||||
margin-bottom: 1.5rem;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
&__buttons {
|
|
||||||
margin: auto;
|
|
||||||
|
|
||||||
&--button {
|
|
||||||
font-size: 4rem;
|
|
||||||
color:whitesmoke;
|
|
||||||
transition: all .2s;
|
|
||||||
|
|
||||||
&:not(:last-child){
|
|
||||||
margin-right: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color:rgb(250, 164, 36);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
|
@ -5,3 +5,4 @@
|
||||||
|
|
||||||
@import "./layout/grid";
|
@import "./layout/grid";
|
||||||
@import "./layout/header";
|
@import "./layout/header";
|
||||||
|
@import "./layout/footer";
|
Binary file not shown.
After Width: | Height: | Size: 59 KiB |
|
@ -16,15 +16,15 @@
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="header">
|
<header class="header">
|
||||||
|
<img class="sengi-icon" src="images/sengi.png">
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-1-of-2">
|
<div class="col-1-of-2">
|
||||||
<img class="header__image" src="images/sengi_image.png" />
|
<img class="header__image" src="images/sengi_image.png" />
|
||||||
</div>
|
</div>
|
||||||
<div class="col-1-of-2">
|
<div class="col-1-of-2">
|
||||||
<div class="header__download-box">
|
<div class="header__download-box">
|
||||||
<h1 class="header__download-box--title">
|
<h1 class="header__download-box--title">Discover Sengi</h1>
|
||||||
Discover Sengi
|
|
||||||
</h1>
|
|
||||||
|
|
||||||
<div class="header__download-box--description">
|
<div class="header__download-box--description">
|
||||||
A FLOSS multi-account Mastodon and Pleroma desktop client<br />
|
A FLOSS multi-account Mastodon and Pleroma desktop client<br />
|
||||||
|
|
Loading…
Reference in New Issue