master #9
|
|
@ -1,3 +1,4 @@
|
|||
resources
|
||||
public
|
||||
.env
|
||||
.idea
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
/**!
|
||||
Navigation Button Toggle class
|
||||
*/
|
||||
(function() {
|
||||
|
||||
// old browser or not ?
|
||||
if ( !('querySelector' in document && 'addEventListener' in window) ) {
|
||||
return;
|
||||
}
|
||||
window.document.documentElement.className += ' js-enabled';
|
||||
|
||||
function toggleNav() {
|
||||
|
||||
// Define targets by their class or id
|
||||
var button = document.querySelector('.nav-button');
|
||||
var target = document.querySelector('.layout > nav');
|
||||
|
||||
// click-touch event
|
||||
if ( button ) {
|
||||
button.addEventListener('click',
|
||||
function (e) {
|
||||
button.classList.toggle('is-active');
|
||||
target.classList.toggle('is-opened');
|
||||
e.preventDefault();
|
||||
}, false );
|
||||
}
|
||||
} // end toggleNav()
|
||||
toggleNav();
|
||||
}());
|
||||
|
|
@ -1,2 +1,4 @@
|
|||
.container
|
||||
padding: 1rem
|
||||
main
|
||||
padding-bottom: 2*$space
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
.footer
|
||||
background-color: black
|
||||
color: white
|
||||
display: flex
|
||||
flex-wrap: wrap
|
||||
text-align: center
|
||||
padding: 1rem
|
||||
position: absolute
|
||||
bottom: 0
|
||||
left: 0
|
||||
right: 0
|
||||
|
||||
.license
|
||||
|
||||
.contact
|
||||
flex-grow: 1
|
||||
text-align: right
|
||||
|
||||
button
|
||||
border: 1px solid white
|
||||
background-color: black
|
||||
color: white
|
||||
padding: 0.4rem
|
||||
|
||||
.slogan
|
||||
font-size: 0.8rem
|
||||
|
||||
@media screen and (min-width: 800px)
|
||||
.footer
|
||||
align-items: center
|
||||
|
||||
.license
|
||||
order: 1
|
||||
width: auto
|
||||
|
||||
.contact
|
||||
order: 3
|
||||
width: auto
|
||||
|
||||
.slogan
|
||||
order: 2
|
||||
padding: 0 1rem
|
||||
width: auto
|
||||
flex-grow: 1
|
||||
|
|
@ -1,9 +1,13 @@
|
|||
/* Box sizing rules */
|
||||
*,*::before,*::after
|
||||
box-sizing: border-box
|
||||
|
||||
html
|
||||
/*-webkit-font-smoothing: antialiased*/
|
||||
/*--moz-osx-font-smoothing: grayscale*/
|
||||
scroll-behavior: smooth
|
||||
/* 18px */
|
||||
font-size: 112.5%
|
||||
font-size: $font-size
|
||||
|
||||
body
|
||||
font-weight: 400
|
||||
|
|
|
|||
|
|
@ -3,3 +3,23 @@
|
|||
@import "./html"
|
||||
@import "./a11y"
|
||||
@import "./content"
|
||||
@import "./menu"
|
||||
@import "./footer"
|
||||
|
||||
body
|
||||
background-color: #f0f0f0
|
||||
|
||||
.layout
|
||||
background-color: white
|
||||
min-height: 100vh
|
||||
position: relative
|
||||
padding: 1rem
|
||||
h1
|
||||
text-align: center
|
||||
font-size: 1rem
|
||||
|
||||
@media screen and (min-width: 60rem)
|
||||
.layout
|
||||
width: $content-width
|
||||
margin: 0 auto
|
||||
box-shadow: 8px 0 6px #ddd
|
||||
|
|
|
|||
|
|
@ -0,0 +1,112 @@
|
|||
nav
|
||||
position: fixed
|
||||
top: 4*$space
|
||||
right: 50%
|
||||
margin-right: $content-width/2
|
||||
width: 6*$space
|
||||
font-family: $font-family-monospace
|
||||
ul
|
||||
list-style: none
|
||||
li
|
||||
padding-left: 15px
|
||||
text-transform: capitalize
|
||||
font-size: 0.8*$font-size
|
||||
&.active
|
||||
font-weight: $active
|
||||
a
|
||||
text-decoration: none
|
||||
color: $color-primary
|
||||
&:hover
|
||||
font-weight: $active
|
||||
|
||||
.nav-button
|
||||
display: none
|
||||
|
||||
@media screen and (max-width: 80rem)
|
||||
body
|
||||
padding-bottom: 2*$space
|
||||
nav
|
||||
display: none
|
||||
z-index: 10
|
||||
top: 0
|
||||
left: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
background: $color-secondary
|
||||
&.is-opened
|
||||
display: block
|
||||
ul
|
||||
list-style: none
|
||||
padding: $space
|
||||
position: absolute
|
||||
bottom: $space
|
||||
right: 0
|
||||
width: 100%
|
||||
li
|
||||
line-height: 1.5*$space
|
||||
font-size: 1.2*$font-size
|
||||
text-align: right
|
||||
border-left: 0
|
||||
padding: 0
|
||||
a
|
||||
text-decoration: none
|
||||
color: $color-primary
|
||||
font-weight: 400
|
||||
&:hover
|
||||
font-weight: 700
|
||||
&.active a
|
||||
font-weight: 700
|
||||
.nav-button
|
||||
z-index: 20
|
||||
display: inherit
|
||||
border: 0
|
||||
padding: 0
|
||||
position: fixed
|
||||
bottom: 0.5*$space
|
||||
right: $space
|
||||
background: transparent !important
|
||||
&:before
|
||||
content: 'menu'
|
||||
text-transform: uppercase
|
||||
background: $color-secondary
|
||||
position: fixed
|
||||
left: 0
|
||||
width: 100%
|
||||
height: 2*$space
|
||||
bottom: 0
|
||||
padding: 0.9*$space 2*$space 0.6*$space 0
|
||||
line-height: 0.5*$space
|
||||
text-align: right
|
||||
font-size: 0.8*$font-size
|
||||
&.is-active:before
|
||||
content: ''
|
||||
& > *
|
||||
display: inline-flex
|
||||
vertical-align: top
|
||||
flex-direction: column
|
||||
justify-content: space-between
|
||||
align-items: stretch
|
||||
height: 0.4*$space
|
||||
width: 0.6*$space
|
||||
background-image: linear-gradient(#333,#333)
|
||||
background-position: 50%
|
||||
background-repeat: no-repeat
|
||||
background-origin: content-box
|
||||
background-size: 100% 1px
|
||||
transition: .25s
|
||||
transition-property: transform,background
|
||||
will-change: transform,background
|
||||
& > ::before,& > ::after
|
||||
content: ""
|
||||
height: 1px
|
||||
background: #333
|
||||
transition: .25s
|
||||
transition-property: transform,top
|
||||
will-change: transform,top
|
||||
&.is-active > *
|
||||
background-image: none
|
||||
justify-content: center
|
||||
&.is-active > ::before
|
||||
transform: translateY(50%) rotate(45deg)
|
||||
&.is-active > ::after
|
||||
transform: translateY(-50%) rotate(-45deg)
|
||||
|
|
@ -1,3 +1,7 @@
|
|||
$color-primary: black
|
||||
$color-secondary: white
|
||||
$space: 2.75rem
|
||||
$font-size: 112.5%
|
||||
$font-family-monospace: Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace
|
||||
$content-width: 800px
|
||||
$active: 600
|
||||
|
|
|
|||
|
|
@ -15,3 +15,10 @@ params:
|
|||
description: Histoire d'un pied est une série de livres témoignant de mon combat face au handicap
|
||||
keywords: lowtech, ecoconception, web, server
|
||||
# socialImage: accueil/bienvenue.png
|
||||
|
||||
menu:
|
||||
main:
|
||||
- identifier: accueil_id
|
||||
name: 🏠 accueil
|
||||
url: /
|
||||
weight: 1
|
||||
|
|
@ -1,3 +1,7 @@
|
|||
---
|
||||
title: 🏡 Accueil
|
||||
---
|
||||
|
||||
Nous recherchons des profils qui souhaitent créer des technologies web low-tech et résilientes. Nous créons un collectif pour chercher des solutions alternatives afin de créer un internet plus humain et moins énergivore.
|
||||
|
||||
Si vous êtes intéressé, contactez-nous par émail : {{< cloakemail address="contact@lowtechweb.com" >}}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
---
|
||||
title: Annuaires des acteurs
|
||||
weight: 2
|
||||
menu:
|
||||
main:
|
||||
name: 📔 Annuaires
|
||||
weight: 20
|
||||
---
|
||||
|
||||
## Acteurs des low-tech :
|
||||
|
|
@ -16,3 +19,4 @@ weight: 2
|
|||
* [Simon Constans](http://sconstans.fr/)
|
||||
* [Gaëtan Janssens](https://low.plopcom.fr/)
|
||||
* [Pikselkraft](https://www.pikselkraft.com/)
|
||||
* [Xavier Viricel](https://www.xave-corp.com)
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
---
|
||||
title: Manifesto
|
||||
weight: 1
|
||||
menu:
|
||||
main:
|
||||
name: 🔥 Manifesto
|
||||
weight: 10
|
||||
---
|
||||
|
||||
# Intro site
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
---
|
||||
title: Outils et ressources
|
||||
weight: 3
|
||||
menu:
|
||||
main:
|
||||
name: 🛠 Outils & ressources
|
||||
weight: 30
|
||||
---
|
||||
|
||||
## Ressources
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
version: "3.7"
|
||||
version: "3.8"
|
||||
|
||||
volumes:
|
||||
lowtechweb-log:
|
||||
|
|
@ -19,6 +19,9 @@ services:
|
|||
GIT_REPOSITORY: ${GIT_REPOSITORY}
|
||||
DOWNLOAD_URL: ${DOWNLOAD_URL}
|
||||
WEBDAV_URL: ${WEBDAV_URL}
|
||||
volumes:
|
||||
- /etc/timezone:/etc/timezone:ro
|
||||
- /etc/localtime:/etc/localtime:ro
|
||||
labels:
|
||||
com.centurylinklabs.watchtower.enable: true
|
||||
|
||||
|
|
@ -31,6 +34,8 @@ services:
|
|||
volumes:
|
||||
- lowtechweb-log:/var/log/nginx
|
||||
- lowtechweb-stats:/usr/share/nginx/html/stats
|
||||
- /etc/timezone:/etc/timezone:ro
|
||||
- /etc/localtime:/etc/localtime:ro
|
||||
labels:
|
||||
com.centurylinklabs.watchtower.enable: true
|
||||
|
||||
|
|
@ -38,23 +43,16 @@ services:
|
|||
container_name: ${NAME}
|
||||
image: registry.weko.io/lowtechweb
|
||||
restart: always
|
||||
environment:
|
||||
- TZ=${TIMEZONE}
|
||||
volumes:
|
||||
- lowtechweb-log:/var/log/nginx
|
||||
- lowtechweb-stats:/usr/share/nginx/html/stats
|
||||
- /etc/timezone:/etc/timezone:ro
|
||||
- /etc/localtime:/etc/localtime:ro
|
||||
labels:
|
||||
traefik.enable: "true"
|
||||
|
||||
traefik.http.routers.lowtechweb.rule: "Host(`${URL}`)"
|
||||
traefik.http.routers.lowtechweb.entrypoints: "websecure"
|
||||
traefik.http.routers.lowtechweb.tls.certResolver: "letsencrypt"
|
||||
|
||||
# Redirect https://www to https://
|
||||
traefik.http.routers.lowtechweb-redirect-www.rule: "Host(`www.${URL}`)"
|
||||
traefik.http.routers.lowtechweb-redirect-www.entrypoints: "websecure"
|
||||
traefik.http.routers.lowtechweb-redirect-www.tls.certResolver: "letsencrypt"
|
||||
traefik.http.routers.lowtechweb-redirect-www.middlewares: "redirect-www@docker"
|
||||
traefik.http.routers.lowtechweb.entrypoints: "web"
|
||||
|
||||
com.centurylinklabs.watchtower.enable: true
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="{{ .Site.Language.Lang }}">
|
||||
{{ partial "head.html" . }}
|
||||
<body>
|
||||
<div class="layout">
|
||||
{{ partial "menu.html" . }}
|
||||
{{ partial "header.html" . }}
|
||||
<main role="main" id="content">
|
||||
{{ block "main" . }}{{ end }}
|
||||
</main>
|
||||
{{ partial "footer.html" . }}
|
||||
</div>
|
||||
{{ partial "js.html" . }}
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<footer class="footer">
|
||||
<div class="license">
|
||||
<img src="/creativecommons.png" alt="Creative Commons Attribution CC BY" />
|
||||
</div>
|
||||
<div class="contact">
|
||||
<button>contact@lowtechweb.com</button>
|
||||
</div>
|
||||
<div class="slogan">
|
||||
codé et hébergé avec 💓 par la low tech web team
|
||||
</div>
|
||||
</footer>
|
||||
|
|
@ -4,18 +4,3 @@
|
|||
│└┤┼││││░││┴┤─┤│││││││┴┤┼│
|
||||
└─┴─┴──┘░└┴─┴─┴┴┘└─┴─┴─┴─┘
|
||||
</pre></h1>
|
||||
<nav>
|
||||
{{ $title := .Title }}
|
||||
{{ $section := .CurrentSection.Title }}
|
||||
{{ $pages := where site.RegularPages "Type" "in" "page" }}
|
||||
{{ $pages := $pages | intersect (where site.RegularPages "Params.headless" "!=" true) }}
|
||||
{{ $pages := $pages | union (where site.Pages "Kind" "in" "section") }}
|
||||
<ul>
|
||||
<li><a href="/">Accueil</a></li>
|
||||
{{ range $pages.ByWeight }}
|
||||
<li class="{{ if or (eq .Title $title) (eq .Title $section) }}active{{ end }}">
|
||||
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
{{ $script := resources.Get "js/app.js" }}
|
||||
<script src="{{ $script.Permalink }}"></script>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!-- navigation -->
|
||||
<nav>
|
||||
<ul>
|
||||
{{ $currentPage := . }}
|
||||
{{ range .Site.Menus.main }}
|
||||
<li class="{{ if $currentPage.IsMenuCurrent "main" . }}active{{ end }} {{ .Pre }}">
|
||||
<a href="{{ .URL }}" >{{ .Name }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
<button class="nav-button" type="button" role="button" aria-label="open/close navigation"><i></i></button>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Loading…
Reference in New Issue