2
0
mirror of https://github.com/offen/website.git synced 2024-10-18 20:20:24 +02:00

Merge pull request #72 from offen/update-may-20

Update may 20
This commit is contained in:
Hendrik Niefeld 2020-05-21 07:26:01 +02:00 committed by GitHub
commit 5c6e3658ea
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 213 additions and 6 deletions

View File

@ -91,6 +91,13 @@ LAYOUT
.wx24-metrics { .wx24-metrics {
width: 86%; width: 86%;
} }
.wx-table-a {
width: 27%;
}
.wx-table-b,
.wx-table-c {
width: 16%;
}
.hx24 { .hx24 {
height: 24rem; height: 24rem;
} }
@ -101,10 +108,9 @@ LAYOUT
height: 30rem; height: 30rem;
} }
.hx-compare-c, .hx-compare-c,
.hx-compare-d { .hx-compare-d,
height: 100%; .hx-metrics,
} .hx-difference {
.hx-metrics {
height: 100%; height: 100%;
} }
@media only screen and (min-width: 30em) { @media only screen and (min-width: 30em) {
@ -112,6 +118,15 @@ LAYOUT
.wx24-metrics { .wx24-metrics {
width: 24rem; width: 24rem;
} }
.wx-table-a {
width: 36%;
}
.wx-table-b {
width: 20%;
}
.wx-table-c {
width: 16%;
}
.hx-try-user { .hx-try-user {
height: 24rem; height: 24rem;
} }
@ -123,6 +138,10 @@ LAYOUT
.wx24-metrics { .wx24-metrics {
width: 100%; width: 100%;
} }
.wx-table-b,
.wx-table-c {
width: 25%;
}
.hx-compare-c, .hx-compare-c,
.hx-compare-d { .hx-compare-d {
height: 50rem; height: 50rem;
@ -130,6 +149,9 @@ LAYOUT
.hx-metrics { .hx-metrics {
height: 132rem; height: 132rem;
} }
.hx-difference {
height: 33rem;
}
} }
/* Margins an paddings */ /* Margins an paddings */
@ -296,7 +318,14 @@ i {
.inner-shaddow { .inner-shaddow {
box-shadow: inset 0px 0px 4px 0px rgba(0,0,0,0.75); box-shadow: inset 0px 0px 4px 0px rgba(0,0,0,0.75);
} }
@media only screen and (max-width: 45em) {
.hscroll {
overflow-x: auto;
}
.hscroll table {
width: 46rem;
}
}
/* --------------------------------------------------- /* ---------------------------------------------------
IMAGES IMAGES

View File

@ -88,7 +88,7 @@
</em> </em>
</h2> </h2>
<p class="wx18 center ma0"> <p class="wx18 center ma0">
Pay respect <i>to your website visitors. Get valuable insights at the same time. All data is</i> encrypted end-to-end. Opt in only. <i>Users must actively give their consent to data collection.</i> encrypted end-to-end.
</p> </p>
</div> </div>
@ -483,6 +483,184 @@
</div> </div>
</div> </div>
<!-- TABLE -->
<div class="w-100">
<div class="w-100 hx-difference dib cclr-bg-white-fade">
<div class="h-100" id="bg-pattern">
<div class="wx24-metrics center">
<p class="f25 lh-solid ma0 ml0 ml5-l mt5 mb4">
<em>
Make a difference
</em>
</p>
</div>
<!-- BOX -->
<div class="mh0 mh5-l">
<div class="w-100 dib br0 br2-l pa4 mb5 mb0-l shadow-4 cclr-fnt-black-mid bg-white">
<div class="hscroll">
<table class="f7 tc collapse dt--fixed mb3">
<tbody>
<tr>
<td class="wx-table-a truncate pv2 pl2 pr1"></td>
<td class="wx-table-b truncate pv2 pl2 pr1 gray">Google Analytics</td>
<td class="wx-table-b truncate pv2 pl2 pr1 gray">Matomo On-Premise</td>
<td class="wx-table-c truncate pv2 pl2 pr1 gray">Fathom</td>
<td class="wx-table-c truncate pv2 pl2 pr1">Offen</td>
</tr>
<tr class="bg-near-white">
<td class="tl truncate pv2 pl2 pr1">Fully self hosted</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
</tr>
<tr>
<td class="tl truncate pv2 pl2 pr1">Open Source code</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
</tr>
<tr class="bg-near-white">
<td class="tl truncate pv2 pl2 pr1">Data can be exported</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
</tr>
<tr>
<td class="tl truncate pv2 pl2 pr1">Users can see and manage own data</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
</tr>
<tr class="bg-near-white">
<td class="tl truncate pv2 pl2 pr1">Opt in only data collection</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>