basics_01 #1
@ -1,7 +1,5 @@
|
||||
title: offen.software
|
||||
description: TBD
|
||||
save_as: index.html
|
||||
template: page
|
||||
template: index
|
||||
sitemap_priority: 1.0
|
||||
|
||||
### offen.software website
|
||||
|
||||
@ -58,5 +58,9 @@ MARKDOWN = {
|
||||
}
|
||||
|
||||
DECORATE_CONTENT = {
|
||||
'h1': ['f5', 'normal', 'ma0', 'fnt-bold-small'],
|
||||
'h2': ['ma0'],
|
||||
'h3': ['ma0'],
|
||||
'h4': ['ma0'],
|
||||
'h5': ['ma0'],
|
||||
'h6': ['ma0']
|
||||
}
|
||||
|
||||
21
website/theme/static/css/fonts.css
Normal file
21
website/theme/static/css/fonts.css
Normal file
@ -0,0 +1,21 @@
|
||||
/* Poppins-400 - latin */
|
||||
@font-face {
|
||||
font-family: 'Poppins';
|
||||
font-display: block;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Poppins Regular'), local('Poppins-Regular');
|
||||
src: url('../fonts/Poppins-Regular.ttf') format('truetype'); /* Safari, Android, iOS */
|
||||
}
|
||||
/* rubik-700 - latin */
|
||||
@font-face {
|
||||
font-family: 'Poppins';
|
||||
font-display: block;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local('Poppins Bold'), local('Poppins-Bold');
|
||||
src: url('../fonts/Poppins-Bold.ttf') format('truetype'); /* Safari, Android, iOS */
|
||||
}
|
||||
.poppins {
|
||||
font-family: Poppins, sans-serif;
|
||||
}
|
||||
@ -1 +1,93 @@
|
||||
/* no css yet */
|
||||
/* ---------------------------------------------------
|
||||
COLORS
|
||||
----------------------------------------------------*/
|
||||
.colorWine {
|
||||
color: #4B1202;
|
||||
}
|
||||
.colorOrange {
|
||||
color: #E9500A;
|
||||
}
|
||||
.colorSalmon {
|
||||
color: #F5BEA7;
|
||||
}
|
||||
.colorWhite {
|
||||
color: #FAFEFF;
|
||||
}
|
||||
.bgColorWine {
|
||||
background-color: #4B1202;
|
||||
}
|
||||
.bgColorOrange {
|
||||
background-color: #E9500A;
|
||||
}
|
||||
.bgColorSalmon {
|
||||
background-color: #F5BEA7;
|
||||
}
|
||||
.bgColorWhite {
|
||||
background-color: #FAFEFF;
|
||||
}
|
||||
|
||||
/* ---------------------------------------------------
|
||||
LAYOUT
|
||||
----------------------------------------------------*/
|
||||
.splashContent {
|
||||
min-height: 86vh;
|
||||
}
|
||||
.splashCta {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
}
|
||||
.paddingSplash {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
@media only screen and (max-width: 48rem) {
|
||||
.paddingSplash {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
}
|
||||
.buttonPadding {
|
||||
padding-top: 1.4rem;
|
||||
}
|
||||
.gapExtra {
|
||||
grid-gap: 1rem;
|
||||
}
|
||||
/* ---------------------------------------------------
|
||||
SPACING
|
||||
----------------------------------------------------*/
|
||||
.hExtra20 {
|
||||
height: 20rem;
|
||||
}
|
||||
.wExtra24 {
|
||||
width: 24rem;
|
||||
}
|
||||
.wExtra32 {
|
||||
width: 32rem;
|
||||
}
|
||||
@media only screen and (max-width: 60rem) {
|
||||
.hExtra20 {
|
||||
height: auto;
|
||||
}
|
||||
.wExtra24,
|
||||
.wExtra32 {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* ---------------------------------------------------
|
||||
TYPOGRAPHY
|
||||
----------------------------------------------------*/
|
||||
.trackedWide {
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
.trackedExtraWide {
|
||||
letter-spacing: 0.15em;
|
||||
}
|
||||
|
||||
/* ---------------------------------------------------
|
||||
IMAGES
|
||||
----------------------------------------------------*/
|
||||
.imageCrop {
|
||||
object-fit: none;
|
||||
}
|
||||
|
||||
95
website/theme/static/fonts/LICENSE
Normal file
95
website/theme/static/fonts/LICENSE
Normal file
@ -0,0 +1,95 @@
|
||||
Poppins-Regular: Indian Type Foundry, Jonny Pinhorn (https://github.com/itfoundry/poppins)
|
||||
Poppins-Bold: Indian Type Foundry, Jonny Pinhorn (https://github.com/itfoundry/poppins)
|
||||
|
||||
This Font Software is licensed under the SIL Open Font License,
|
||||
Version 1.1.
|
||||
|
||||
This license is copied below, and is also available with a FAQ at:
|
||||
http://scripts.sil.org/OFL
|
||||
|
||||
-----------------------------------------------------------
|
||||
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
|
||||
-----------------------------------------------------------
|
||||
|
||||
PREAMBLE
|
||||
The goals of the Open Font License (OFL) are to stimulate worldwide
|
||||
development of collaborative font projects, to support the font
|
||||
creation efforts of academic and linguistic communities, and to
|
||||
provide a free and open framework in which fonts may be shared and
|
||||
improved in partnership with others.
|
||||
|
||||
The OFL allows the licensed fonts to be used, studied, modified and
|
||||
redistributed freely as long as they are not sold by themselves. The
|
||||
fonts, including any derivative works, can be bundled, embedded,
|
||||
redistributed and/or sold with any software provided that any reserved
|
||||
names are not used by derivative works. The fonts and derivatives,
|
||||
however, cannot be released under any other type of license. The
|
||||
requirement for fonts to remain under this license does not apply to
|
||||
any document created using the fonts or their derivatives.
|
||||
|
||||
DEFINITIONS
|
||||
"Font Software" refers to the set of files released by the Copyright
|
||||
Holder(s) under this license and clearly marked as such. This may
|
||||
include source files, build scripts and documentation.
|
||||
|
||||
"Reserved Font Name" refers to any names specified as such after the
|
||||
copyright statement(s).
|
||||
|
||||
"Original Version" refers to the collection of Font Software
|
||||
components as distributed by the Copyright Holder(s).
|
||||
|
||||
"Modified Version" refers to any derivative made by adding to,
|
||||
deleting, or substituting -- in part or in whole -- any of the
|
||||
components of the Original Version, by changing formats or by porting
|
||||
the Font Software to a new environment.
|
||||
|
||||
"Author" refers to any designer, engineer, programmer, technical
|
||||
writer or other person who contributed to the Font Software.
|
||||
|
||||
PERMISSION & CONDITIONS
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of the Font Software, to use, study, copy, merge, embed,
|
||||
modify, redistribute, and sell modified and unmodified copies of the
|
||||
Font Software, subject to the following conditions:
|
||||
|
||||
1) Neither the Font Software nor any of its individual components, in
|
||||
Original or Modified Versions, may be sold by itself.
|
||||
|
||||
2) Original or Modified Versions of the Font Software may be bundled,
|
||||
redistributed and/or sold with any software, provided that each copy
|
||||
contains the above copyright notice and this license. These can be
|
||||
included either as stand-alone text files, human-readable headers or
|
||||
in the appropriate machine-readable metadata fields within text or
|
||||
binary files as long as those fields can be easily viewed by the user.
|
||||
|
||||
3) No Modified Version of the Font Software may use the Reserved Font
|
||||
Name(s) unless explicit written permission is granted by the
|
||||
corresponding Copyright Holder. This restriction only applies to the
|
||||
primary font name as presented to the users.
|
||||
|
||||
4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
|
||||
Software shall not be used to promote, endorse or advertise any
|
||||
Modified Version, except to acknowledge the contribution(s) of the
|
||||
Copyright Holder(s) and the Author(s) or with their explicit written
|
||||
permission.
|
||||
|
||||
5) The Font Software, modified or unmodified, in part or in whole,
|
||||
must be distributed entirely under this license, and must not be
|
||||
distributed under any other license. The requirement for fonts to
|
||||
remain under this license does not apply to any document created using
|
||||
the Font Software.
|
||||
|
||||
TERMINATION
|
||||
This license becomes null and void if any of the above conditions are
|
||||
not met.
|
||||
|
||||
DISCLAIMER
|
||||
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
|
||||
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
|
||||
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
||||
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
|
||||
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
|
||||
OTHER DEALINGS IN THE FONT SOFTWARE.
|
||||
BIN
website/theme/static/fonts/Poppins-Bold.ttf
Normal file
BIN
website/theme/static/fonts/Poppins-Bold.ttf
Normal file
Binary file not shown.
BIN
website/theme/static/fonts/Poppins-Regular.ttf
Normal file
BIN
website/theme/static/fonts/Poppins-Regular.ttf
Normal file
Binary file not shown.
19
website/theme/static/images/gfx-content-1.svg
Normal file
19
website/theme/static/images/gfx-content-1.svg
Normal file
@ -0,0 +1,19 @@
|
||||
<svg width="768" height="192" viewBox="0 0 768 192" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_80_246)">
|
||||
<rect x="704" y="128" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="448" y="64" width="64" height="64" fill="#4B1202"/>
|
||||
<rect x="384" width="64" height="64" fill="#4B1202"/>
|
||||
<rect x="256" y="128" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<circle cx="224" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="96" cy="160" r="32" fill="#4B1202"/>
|
||||
<circle cx="352" cy="96" r="32" fill="#4B1202"/>
|
||||
<circle cx="224" cy="96" r="32" fill="#4B1202"/>
|
||||
<circle cx="672" cy="96" r="32" fill="#4B1202"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_80_246">
|
||||
<rect width="768" height="192" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 800 B |
8
website/theme/static/images/gfx-content-2.svg
Normal file
8
website/theme/static/images/gfx-content-2.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<svg width="768" height="192" viewBox="0 0 768 192" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="448" y="64" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="512" y="128" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<circle cx="96" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="224" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="288" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="352" cy="160" r="32" fill="#4B1202"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 440 B |
20
website/theme/static/images/gfx-content-3.svg
Normal file
20
website/theme/static/images/gfx-content-3.svg
Normal file
@ -0,0 +1,20 @@
|
||||
<svg width="768" height="128" viewBox="0 0 768 128" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_90_2)">
|
||||
<rect x="320" y="64" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="512" y="64" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect y="64" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<circle cx="96" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="224" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="288" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="416" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="480" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="608" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="672" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="736" cy="32" r="32" fill="#4B1202"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_90_2">
|
||||
<rect width="768" height="128" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 832 B |
10
website/theme/static/images/gfx-detail-1.svg
Normal file
10
website/theme/static/images/gfx-detail-1.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_85_316)">
|
||||
<circle cx="32" cy="32" r="32" fill="#E9500A"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_85_316">
|
||||
<rect width="64" height="64" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 291 B |
11
website/theme/static/images/gfx-detail-2.svg
Normal file
11
website/theme/static/images/gfx-detail-2.svg
Normal file
@ -0,0 +1,11 @@
|
||||
<svg width="64" height="128" viewBox="0 0 64 128" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_86_327)">
|
||||
<circle cx="32" cy="32" r="32" fill="#E9500A"/>
|
||||
<circle cx="32" cy="96" r="32" fill="#E9500A"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_86_327">
|
||||
<rect width="64" height="128" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 342 B |
10
website/theme/static/images/gfx-detail-3.svg
Normal file
10
website/theme/static/images/gfx-detail-3.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_92_25)">
|
||||
<rect width="64" height="64" rx="2" fill="#E9500A"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_92_25">
|
||||
<rect width="64" height="64" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 294 B |
45
website/theme/static/images/gfx-index.svg
Normal file
45
website/theme/static/images/gfx-index.svg
Normal file
@ -0,0 +1,45 @@
|
||||
<svg width="768" height="448" viewBox="0 0 768 448" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_79_77)">
|
||||
<rect width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="64" y="64" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="192" y="192" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="384" y="192" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="256" y="256" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="320" y="320" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="384" y="384" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="320" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="192" y="64" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="448" y="128" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="512" y="192" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="576" y="256" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<rect x="704" y="384" width="64" height="64" rx="2" fill="#4B1202"/>
|
||||
<circle cx="96" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="32" cy="96" r="32" fill="#4B1202"/>
|
||||
<circle cx="96" cy="160" r="32" fill="#4B1202"/>
|
||||
<circle cx="160" cy="416" r="32" fill="#4B1202"/>
|
||||
<circle cx="480" cy="416" r="32" fill="#4B1202"/>
|
||||
<circle cx="672" cy="416" r="32" fill="#4B1202"/>
|
||||
<circle cx="224" cy="352" r="32" fill="#4B1202"/>
|
||||
<circle cx="416" cy="352" r="32" fill="#4B1202"/>
|
||||
<circle cx="608" cy="352" r="32" fill="#4B1202"/>
|
||||
<circle cx="96" cy="288" r="32" fill="#4B1202"/>
|
||||
<circle cx="160" cy="288" r="32" fill="#4B1202"/>
|
||||
<circle cx="416" cy="288" r="32" fill="#4B1202"/>
|
||||
<circle cx="352" cy="224" r="32" fill="#4B1202"/>
|
||||
<circle cx="672" cy="224" r="32" fill="#4B1202"/>
|
||||
<circle cx="224" cy="160" r="32" fill="#4B1202"/>
|
||||
<circle cx="416" cy="160" r="32" fill="#4B1202"/>
|
||||
<circle cx="672" cy="160" r="32" fill="#4B1202"/>
|
||||
<circle cx="160" cy="96" r="32" fill="#4B1202"/>
|
||||
<circle cx="288" cy="96" r="32" fill="#4B1202"/>
|
||||
<circle cx="544" cy="96" r="32" fill="#4B1202"/>
|
||||
<circle cx="672" cy="96" r="32" fill="#4B1202"/>
|
||||
<circle cx="224" cy="32" r="32" fill="#4B1202"/>
|
||||
<circle cx="416" cy="32" r="32" fill="#4B1202"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_79_77">
|
||||
<rect width="768" height="448" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
45
website/theme/templates/base.html
Normal file
45
website/theme/templates/base.html
Normal file
@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
{% block head %}
|
||||
<head>
|
||||
<title>
|
||||
{% block title %}{{ title }}{% endblock %}
|
||||
</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="referrer" content="origin">
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5">
|
||||
<meta name="description" content="{{ description }}">
|
||||
<meta property="og:site_name" content="{{ SITENAME }}">
|
||||
<meta property="og:locale" content="{{ DEFAULT_LANG }}">
|
||||
<meta property="og:title" content="{{ title }}">
|
||||
<meta property="og:description" content="{{ description }}">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="{{ SITEURL }}">
|
||||
<link rel="canonical" href="{{ SITEURL }}">
|
||||
<!--
|
||||
<meta property="og:image" content="{{ SITEURL }}/theme/images/###">
|
||||
<link rel="shortcut icon" type="image/x-icon" href="{{ SITEURL }}/theme/images/favicon.ico">
|
||||
-->
|
||||
{% assets filters="postcss", output="css/style.min.css", "css/tachyons.min.css", "css/styles.css", "css/fonts.css" %}
|
||||
<link rel="stylesheet" href="/{{ ASSET_URL }}">
|
||||
{% endassets %}
|
||||
<!--
|
||||
<link rel="preload" href="/theme/fonts/Poppins-Regular.woff2" as="font" crossorigin>
|
||||
<link rel="preload" href="/theme/fonts/Poppins-Bold.woff2" as="font" crossorigin>
|
||||
-->
|
||||
</head>
|
||||
{% endblock %}
|
||||
<body class="poppins f4 trackedWide lh-title no-js colorSalmon bgColorWine">
|
||||
|
||||
<main class="w-100">
|
||||
{% block content %}{% endblock %}
|
||||
</main>
|
||||
|
||||
<script>
|
||||
document.body.classList.remove('no-js');
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
256
website/theme/templates/index.html
Normal file
256
website/theme/templates/index.html
Normal file
@ -0,0 +1,256 @@
|
||||
{% extends "page.html" %}
|
||||
{% set index = True %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<!-- HEADER -->
|
||||
|
||||
<div class="splashContent">
|
||||
|
||||
<div class="w-100 mw9-ns center-ns h3">
|
||||
<h1 class="f4 ma0 pt3 ml3 ml5-l">
|
||||
<span class="fw4">offen.</span><span class="fw7">software</span>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div class="w-100 bgColorOrange">
|
||||
<div class="mw7 center">
|
||||
<img src="/theme/images/gfx-index.svg" alt="pattern" width="768px" height="448px" class="db imageCrop">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mw7 center paddingSplash mt4">
|
||||
<h2 class="f4 f2-ns 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>
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="splashCta bgColorWine">
|
||||
<div class="flex justify-center pb5">
|
||||
<a class="link dim br1 f5 fw7 ttu tc trackedExtraWide h3 w5 buttonPadding colorWhite bgColorOrange" href="###" rel="noopener">Learn more</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- FOLD 1 -->
|
||||
|
||||
<div class="w-100 colorWine bgColorOrange">
|
||||
|
||||
<div class="w-100 bgColorOrange">
|
||||
<div class="mw7 center">
|
||||
<img src="/theme/images/gfx-content-1.svg" alt="pattern" width="768px" height="192px" class="db imageCrop">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mw7 center mv5 ph3 ph0-l">
|
||||
|
||||
<p class="ma0 mb4 ml6-l">
|
||||
The world is in flux, and it’s a unique opportunity to <span class="fw7 f4 f2-l">facilitate change for the better.</span>
|
||||
</p>
|
||||
<p class="ma0 mr4 mr6-l">
|
||||
We want to enable the makers that are driving this change by providing them with <span class="fw7 f4 f2-l">independent, fair and tailor made software </span>that meet the highest standards when it comes to transparency, integrity and privacy.
|
||||
</p>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="w-100 bgColorOrange">
|
||||
<div class="mw7 center">
|
||||
<img src="/theme/images/gfx-content-2.svg" alt="pattern" width="768px" height="192px" class="db imageCrop">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mw7 center mt5 ph3 ph0-l">
|
||||
|
||||
<p class="ma0 mb4 ml6-l">
|
||||
<span class="fw7 f4 f2-l">Located in Berlin</span>, we’re a small, reliable and well-rehearsed team of seniors that can take care of your software project from first brainstorming to going live.
|
||||
</p>
|
||||
<p class="ma0 mb4 mr6-l">
|
||||
<span class="fw7 f4 f2-l">Working fully open source </span>allows us to be transparent, keep in touch with the community, and contribute back to an ever growing common body of freely available knowledge.
|
||||
</p>
|
||||
<p class="ma0 ml6-l">
|
||||
Our clients value <span class="fw7 f4 f2-l">simple, resilient and accessible tools </span>that are effortless to run and maintain, and that everyone can use, reuse and benefit from.
|
||||
</p>
|
||||
<div class="flex justify-center pv5">
|
||||
<a class="link dim br1 f5 fw7 ttu tc trackedExtraWide h3 w5 buttonPadding colorWhite bgColorWine" href="###" rel="noopener">Work with us</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- FOLD 2 -->
|
||||
|
||||
<div class="w-100 mw9-l center-l mv5-l">
|
||||
|
||||
<div class="flex flex-wrap justify-center">
|
||||
|
||||
<img src="/theme/images/gfx-detail-1.svg" alt="pattern" width="64px" height="64px" class="db self-start pl5 pa0-l">
|
||||
|
||||
<div class="w-100 w-auto-l flex flex-column-l flex-wrap justify-center">
|
||||
<div class="wExtra32 h-auto h5-l colorSalmon bgColorWine ph3 pv4 pa4-l">
|
||||
<div class="mw6-m center-m">
|
||||
<p class="fw7 f4 f2-l ma0 mb3">
|
||||
We offer
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
Web Application and website development
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
Independent infrastructure solutions
|
||||
</p>
|
||||
<p class="ma0 ml4-ns ">
|
||||
Support and guidance with self hosting
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<img src="/theme/images/gfx-detail-1.svg" alt="pattern" width="64px" height="64px" class="db ml5 ma0-l">
|
||||
</div>
|
||||
|
||||
<img src="/theme/images/gfx-detail-1.svg" alt="pattern" width="64px" height="64px" class="db self-end pr5 pa0-l">
|
||||
<img src="/theme/images/gfx-detail-3.svg" alt="pattern" width="64px" height="64px" class="db self-end pr5 pa0-l">
|
||||
|
||||
<div class="wExtra24 h-auto h5-l colorSalmon bgColorWine ph3 pv4 pa4-l">
|
||||
<div class="mw6-m center-m">
|
||||
<p class="fw7 f4 f2-l ma0 mb3">
|
||||
We created
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
Offen Fair Web Analytics
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
analytics.txt
|
||||
</p>
|
||||
<p class="ma0 ml4-ns">
|
||||
docker-volume-backup
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img src="/theme/images/gfx-detail-2.svg" alt="pattern" width="64px" height="128px" class="db self-start pl5 pa0-l">
|
||||
|
||||
<div class="wExtra24 h-auto h5-l colorSalmon bgColorWine ph3 pv4 pa4-l">
|
||||
<div class="mw6-m center-m">
|
||||
<p class="fw7 f4 f2-l ma0 mb3">
|
||||
We worked with
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
NLNet
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
RBB
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
Ecosia
|
||||
</p>
|
||||
<p class="ma0 ml4-ns">
|
||||
Wikimedia
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img src="/theme/images/gfx-detail-2.svg" alt="pattern" width="64px" height="128px" class="db self-start pl5 pa0-l">
|
||||
<img src="/theme/images/gfx-detail-1.svg" alt="pattern" width="64px" height="64px" class="db self-end pr5 pa0-l">
|
||||
|
||||
<div class="w-100 w-auto-l flex flex-column-l flex-wrap justify-center">
|
||||
<div class="wExtra32 hExtra20 colorSalmon bgColorWine ph3 pv4 pa4-l">
|
||||
<div class="mw6-m center-m">
|
||||
<p class="fw7 f4 f2-l ma0 mb3">
|
||||
We are
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
Frederik Ring, interested in
|
||||
</p>
|
||||
<p class="ma0 ml5-ns ml2 mb2">
|
||||
Minimal Kubernetes distributions
|
||||
</p>
|
||||
<p class="ma0 ml5-ns ml2 mb2">
|
||||
Open Source Tomato Seeds
|
||||
</p>
|
||||
<p class="ma0 ml5-ns ml2">
|
||||
Psychological aspects of Software Development
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<img src="/theme/images/gfx-detail-1.svg" alt="pattern" width="64px" height="64px" class="db mr5 ma0-l">
|
||||
</div>
|
||||
|
||||
<img src="/theme/images/gfx-detail-3.svg" alt="pattern" width="64px" height="64px" class="db self-start pr5 pa0-l">
|
||||
<img src="/theme/images/gfx-detail-1.svg" alt="pattern" width="64px" height="64px" class="db self-start pl5 pa0-l">
|
||||
|
||||
<div class="wExtra32 hExtra20 colorSalmon bgColorWine ph3 pv4 pa4-l">
|
||||
<div class="mw6-m center-m">
|
||||
<p class="fw7 f4 f2-l ma0 mb3">
|
||||
We are
|
||||
</p>
|
||||
<p class="ma0 ml4-ns mb2">
|
||||
Hendrik Niefeld, interested in
|
||||
</p>
|
||||
<p class="ma0 ml5-ns ml2 mb2">
|
||||
Make things look good
|
||||
</p>
|
||||
<p class="ma0 ml5-ns ml2 mb2">
|
||||
Literal present tense in Korean
|
||||
</p>
|
||||
<p class="ma0 ml5-ns ml2">
|
||||
Generative systems
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img src="/theme/images/gfx-detail-2.svg" alt="pattern" width="64px" height="128px" class="db self-end pr5 pa0-l">
|
||||
<img src="/theme/images/gfx-detail-3.svg" alt="pattern" width="64px" height="64px" class="db self-start pr5 pa0-l">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- FOOTER -->
|
||||
|
||||
<div class="w-100 colorWine bgColorOrange">
|
||||
|
||||
<div class="w-100 mw9-ns center-ns flex flex-wrap justify-between pt5 pb6 ph3 ph5-l">
|
||||
|
||||
<div class="w-100 h3">
|
||||
<h1 class="f2 ma0">
|
||||
<span class="fw4">offen.</span><span class="fw7">software</span>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div class="w-100 w-50-ns">
|
||||
<p class="ma0 mb2">
|
||||
hi@offen.software
|
||||
</p>
|
||||
<p class="ma0 mb2">
|
||||
LinkedIn
|
||||
</p>
|
||||
<p class="ma0 mb2">
|
||||
Imprint
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="w-100 w-50-ns">
|
||||
<p class="ma0 mb2 tl tr-ns">
|
||||
Source code for this website
|
||||
</p>
|
||||
<p class="fw7 ma0 tl tr-ns">
|
||||
Work with us
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="w-100 bgColorOrange">
|
||||
<div class="mw7 center">
|
||||
<img src="/theme/images/gfx-content-3.svg" alt="pattern" width="768px" height="128px" class="db imageCrop">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
{% endblock %}
|
||||
@ -1,9 +1,10 @@
|
||||
{% extends "_layout.html" %}
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% set href = page.href %}
|
||||
{% set title = page.title %}
|
||||
{% set description = page.description %}
|
||||
{% set href = page.save_as.replace('index.html', '') %}
|
||||
{% set template = page.template %}
|
||||
|
||||
{% block body %}
|
||||
{% block content %}
|
||||
{{ page.content }}
|
||||
{% endblock %}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user