basics_01 #3

Merged
hendr-ik merged 21 commits from basics_01 into main 2023-11-13 09:46:15 +01:00
4 changed files with 39 additions and 8 deletions
Showing only changes of commit e174217f67 - Show all commits

View File

@ -7,9 +7,20 @@ COLORS
.color-extra {
color: #F5BEA7;
}
/* ---------------------------------------------------
LAYOUT
----------------------------------------------------*/
/* ---------------------------------------------------
TYPOGRAPHY
----------------------------------------------------*/
.trackedWide {
letter-spacing: 0.04em;
}
/* ---------------------------------------------------
IMAGES
----------------------------------------------------*/
.imageCrop {
object-fit: none;
}

View File

@ -0,0 +1,13 @@
<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"/>
<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"/>
<ellipse cx="698" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
<ellipse cx="384" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
<ellipse cx="384" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
<ellipse cx="227" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
<ellipse cx="227" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
<ellipse cx="541" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
<ellipse cx="541" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
</svg>

After

Width:  |  Height:  |  Size: 748 B

View File

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

View File

@ -2,10 +2,17 @@
{% set index = True %}
{% block content %}
<h1 class="f4 trackedWide ma0 mb3">
<span class="fw4">offen.</span><span class="fw7">software</span>
</h1>
<p class="ma0">
<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 class="pt3 ph3 ph0-l">
<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">
</div>
<div class="ph3 pa0-l">
<p class="ma0">
<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>
{% endblock %}