offen/website
2
0
Fork 0
mirror of https://github.com/offen/website.git synced 2024-11-22 09:00:28 +01:00
Code Issues Projects Releases Wiki Activity

update table

Browse Source
This commit is contained in:
Hendrik Niefeld 2020-05-24 20:08:40 +02:00
parent 7adf8f7118
commit b3808c2173
3 changed files with 40 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
homepage/theme/static/css/fix.css
View File

@ -95,7 +95,8 @@ LAYOUT
width: 27%;
}
.wx-table-b,
.wx-table-c {
.wx-table-c,
.wx-table-d {
width: 16%;
}
.hx24 {
@ -124,7 +125,8 @@ LAYOUT
.wx-table-b {
width: 20%;
}
.wx-table-c {
.wx-table-c,
.wx-table-d {
width: 16%;
}
.hx-try-user {
@ -139,7 +141,8 @@ LAYOUT
width: 100%;
}
.wx-table-b,
.wx-table-c {
.wx-table-c,
.wx-table-d {
width: 25%;
}
.hx-compare-c,
@ -318,12 +321,29 @@ i {
.inner-shaddow {
box-shadow: inset 0px 0px 4px 0px rgba(0,0,0,0.75);
}
/* Table */
.bg-table {
display: none;
}
.hscroll {
padding: 2rem;
}
@media only screen and (max-width: 45em) {
.bg-table {
display: inline-block;
top: 0;
right: 0;
z-index : 560;
}
.hscroll {
overflow-x: auto;
}
.hscroll table {
width: 46rem;
width: 48rem;
}
.wx-table-d {
width: 8rem;
padding-right: 4rem;
}
}
@ -395,10 +415,11 @@ STACKING IMAGES
z-index : 550;
}
.bg-cta-pfeil {
top: -11rem;
top: -13rem;
left: 66%;
z-index : 570;
}
@media only screen and (min-width: 30em) {
.bg-feature-1 {
left: calc(50% - 21rem);
@ -413,10 +434,9 @@ STACKING IMAGES
.bg-metrics-bulb {
top: 11rem;
left: calc(100% - 30rem);
z-index : 550;
}
.bg-cta-pfeil {
top: -12rem;
top: -14rem;
left: 72%;
}
}

BIN
homepage/theme/static/images/gfx-table-fade.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.2 KiB

20
homepage/theme/templates/index.html
View File

@ -499,7 +499,13 @@
<!-- 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="w-100 dib br0 br2-l mb5 mb0-l shadow-4 cclr-fnt-black-mid bg-white">
<div class="relative">
<div class="absolute bg-table">
<img src="/theme/images/gfx-table-fade.png" alt="smile" width="100px" height="290px">
</div>
</div>
<div class="hscroll">
@ -511,7 +517,7 @@
<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>
<td class="wx-table-d truncate pv2 pl2 pr1">Offen</td>
</tr>
<tr class="bg-near-white">
@ -531,7 +537,7 @@
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<td class="wx-table-d 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>
@ -555,7 +561,7 @@
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<td class="wx-table-d 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>
@ -579,7 +585,7 @@
<circle cx="7.5" cy="7.5" r="7.5" fill="#F7BF08"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<td class="wx-table-d 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>
@ -603,7 +609,7 @@
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<td class="wx-table-d 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>
@ -627,7 +633,7 @@
<circle cx="7.5" cy="7.5" r="7.5" fill="#CCCCCC"/>
</svg>
</td>
<td class="truncate pv2 pl2 pr1">
<td class="wx-table-d 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>