2
0
mirror of https://github.com/offen/website.git synced 2024-11-22 17:10:29 +01:00

feature layout images

This commit is contained in:
Hendrik Niefeld 2020-02-25 11:08:23 +01:00
parent cb7c881151
commit c3a93e037d
5 changed files with 29 additions and 33 deletions

View File

@ -35,15 +35,6 @@ COLORS
.cclr-dark-white { .cclr-dark-white {
background-color: #f9f7f2; background-color: #f9f7f2;
} }
.mintA {
background-color: #BBD9D3;
}
.mintB {
background-color: #89B8AF;
}
.mintC {
background-color: #72A49A;
}
/* --------------------------------------------------- /* ---------------------------------------------------
@ -77,7 +68,11 @@ LAYOUT
/* Custom Tachyons class */ /* Custom Tachyons class */
.w55-container, .w55-container,
.w55 { .w55 {
width: 20rem;
}
.w56 {
width: 20rem; width: 20rem;
height: 480px;
} }
/* Custom media query - extra small */ /* Custom media query - extra small */
@media only screen and (max-width: 40em) { @media only screen and (max-width: 40em) {
@ -85,7 +80,9 @@ LAYOUT
width: 100%; width: 100%;
} }
} }
.mt77 {
margin-top: 18rem;
}
/* --------------------------------------------------- /* ---------------------------------------------------
TYPO AND LAYOUT ELEMENTS TYPO AND LAYOUT ELEMENTS
@ -358,8 +355,12 @@ GRAPHICS
} }
} }
/* --------------------------------------------- */ /* --------------------------------------------- */
#bg-temp { #bg-feature-1 {
background: url(/theme/images/temp.png) center; background: url(/theme/images/gfx-feature-1.png) center;
background-repeat: no-repeat;
}
#bg-feature-2 {
background: url(/theme/images/gfx-feature-2.png) center;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
/* --------------------------------------------- */ /* --------------------------------------------- */

Binary file not shown.

After

Width:  |  Height:  |  Size: 157 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 238 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 161 KiB

View File

@ -41,53 +41,48 @@
<div class="w4 mintB dn db-ns">
</div>
<div class="flex justify-center w55-container" id="bg-temp">
<div class="w55 tc pa3 pb7"> <div class="flex justify-center w55-container" id="bg-feature-1">
<h2 class="f25 normal lh-solid mb3"> <div class="w56 tc pa3">
<h2 class="f25 normal lh-solid mt4 mb3">
Free & Open Free & Open
</h2> </h2>
<p class="ma0 mb5"> <p class="ma0 mb5">
Anyone can audit our open source code to verify it works as intended. Offen will always be available for free. Our open source code can be fully audited by the community. It will always be available for free. Seriously.
</p> </p>
</div> </div>
</div> </div>
<div class="w2 mintC dn db-ns">
</div>
<div class="flex justify-center w55-container mintA">
<div class="w55 tc pa3"> <div class="flex justify-center w55-container" id="bg-feature-2">
<h2 class="f25 normal lh-solid mt7 mb3"> <div class=" w56 tc pa3">
<em>Fair & Secure</em> <h2 class="f25 normal lh-solid mt77 mb3">
Fair & Secure
</h2> </h2>
<p class="ma0 mb5"> <p class="ma0 mb5">
Pay respect to your website visitors and gain insights as a user at the same time. All data is encrypted end-to-end. Pay respect to your website visitors. Gain valuable insights at the same time. All data is encrypted end-to-end.
</p> </p>
</div> </div>
</div> </div>
<div class="w2 w4-m mintB dn db-ns">
</div>
<div class="flex justify-center w55-container mintA"> <div class="flex justify-center w55-container mintA">
<div class="w55 tc pa3"> <div class="w56 tc pa3">
<h2 class="f25 normal lh-solid mt7 mb3"> <h2 class="f25 normal lh-solid">
<em>Easy to use</em> <em>Self hosted</em>
</h2> </h2>
<p class="ma0 mb5"> <p class="ma0 mb5">
Simply paste our code into the source of your website. Users can visit the auditorium to access their data. Comply with GDPR guidelines. Don't share data with third parties. Your users have full access to their data.
</p> </p>
</div> </div>
</div> </div>
<div class="w3 mintC dn db-ns">
</div>
</div> </div>