offen.software/website
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

layout 2

Browse Source
This commit is contained in:
Hendrik Niefeld 2023-11-09 23:10:25 +01:00
parent e174217f67
commit 3d883cd8c5
4 changed files with 45 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
website/theme/static/css/styles.css
View File

@ -1,16 +1,38 @@
/* ---------------------------------------------------
COLORS
----------------------------------------------------*/
.bgColor-extra {
background-color: #4B1202;
}
.color-extra {
.colorSalmon {
color: #F5BEA7;
}
.colorWhite {
color: #FAFEFF;
}
.bgColorWine {
background-color: #4B1202;
}
.bgColorOrange {
background-color: #E9500A;
}
/* ---------------------------------------------------
LAYOUT
----------------------------------------------------*/
.paddingExtra {
padding-left: 0;
padding-right: 0;
}
@media only screen and (max-width: 48rem) {
.paddingExtra {
padding-left: 1rem;
padding-right: 1rem;
}
}
.buttonPadding {
padding-top: 0.8rem;
padding-right: 3rem;
padding-bottom: 0.75rem;
padding-left: 3rem;
}
/* ---------------------------------------------------
TYPOGRAPHY
@ -18,6 +40,11 @@ TYPOGRAPHY
.trackedWide {
letter-spacing: 0.04em;
}
.trackedExtraWide {
letter-spacing: 0.15em;
}
/* ---------------------------------------------------
IMAGES
----------------------------------------------------*/

4
website/theme/static/images/gfx-index.svg
View File

@ -1,5 +1,5 @@
<svg width="768" height="416" viewBox="0 0 768 416" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="768" height="416" fill="#E9500A"/>
<svg width="768" height="432" viewBox="0 0 768 432" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="768" height="432" fill="#E9500A"/>
<ellipse cx="70" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
<ellipse cx="70" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
<ellipse cx="698" cy="97" rx="70" ry="69" fill="#D9D9D9"/>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 748 B

After

Width:  |  Height:  |  Size: 748 B

2
website/theme/templates/base.html
View File

@ -31,7 +31,7 @@
-->
</head>
{% endblock %}
<body class="poppins f4 f2-ns trackedWide lh-title no-js color-extra bgColor-extra">
<body class="poppins f4 f2-ns trackedWide lh-title no-js colorSalmon bgColorWine">
<main class="w-100">
<div class="mw7 center">

14
website/theme/templates/index.html
View File

@ -2,17 +2,23 @@
{% set index = True %}
{% block content %}
<div class="pt3 ph3 ph0-l">
<div class="pt3 paddingExtra">
<h1 class="f4 trackedWide ma0 mb3">
<span class="fw4">offen.</span><span class="fw7">software</span>
</h1>
</div>
<div class="w-100">
<img src="/theme/images/gfx-index.svg" alt="pattern" width="768px" class="db imageCrop">
<img src="/theme/images/gfx-index.svg" alt="pattern" width="768px" height="432" class="db imageCrop">
</div>
<div class="ph3 pa0-l">
<p class="ma0">
<div class="paddingExtra">
<p class="trackedWide ma0 mt3">
<span class="fw4">We </span><span class="fw7">think up, create and ship </span><span class="fw4">software for organisations and individuals who embrace </span><span class="fw7">societal change.</span>
</p>
</div>
<div class="w-100">
<div class="flex flex-column items-center">
<a class="link dim br1 f5 fw7 ttu trackedExtraWide dib buttonPadding colorWhite bgColorOrange" href="###" rel="noopener">Learn more</a>
</div>
</div>
{% endblock %}