diff --git a/src/adventskalender.pug b/src/adventskalender.pug index 8efc8ecc94a..1007229832f 100644 --- a/src/adventskalender.pug +++ b/src/adventskalender.pug @@ -3,10 +3,10 @@ include includes/mixins block vars - const pageTitle = "Adventskalender" - const pageDescription = "🎄 Wir wünschen euch mit unserem Adventskalender bullishe All Time Highnachten! 🎅" - - const pageCard = "/img/adventskalender.png" + - const pageCard = "/img/card/adventskalender.png" -html(lang="en") +html(lang="de") head include includes/_head link(href=assetPath("/css/adventskalender.css") rel="stylesheet") diff --git a/src/css/sections/meetups.css b/src/css/sections/meetups.css index c2820739fc5..b726fa9936d 100644 --- a/src/css/sections/meetups.css +++ b/src/css/sections/meetups.css @@ -4,97 +4,94 @@ 3% { transform: scale(.75); } } -#meetups, -#kurse { - & #map { - @media (--up_to_L) { - margin-top: var(--space-xl); +#map { + @media (--up_to_L) { + margin-top: var(--space-xl); - & img, - & .dot, - & .tooltip { - display: none; - } - } - - @media (--L_and_up) { - position: relative; - margin-top: var(--space-xxl); - - & h2 { - display: none; - } - - & img { - display: block; - width: 100%; - opacity: .5; - } - - & ul { - margin: 0; - list-style: none; - } - - & li { - position: absolute; - z-index: 1; - font-size: .65rem; - - &.unmapped { - display: none; - } - - &.official { - color: var(--color-accent); - } - - &:not(.official) { - color: var(--color-secondary); - } - - & a { - color: inherit; - display: inline-block; - margin-top: .3rem; - } - - & .dot { - content: ''; - position: absolute; - top: .375rem; - left: -1rem; - background: radial-gradient(currentColor 0%, rgba(255, 255, 255, 0) 100%); - animation-timing-function: linear; - animation-iteration-count: infinite; - will-change: transform; - transform-origin: 50%; - border-radius: 50%; - width: .8rem; - height: .8rem; - transform: scale(.75); - animation-name: pulse; - } - } - - & .tooltip { - position: absolute; - z-index: 2; - min-width: 7rem; - font-size: .65rem; - padding: var(--space-xs) var(--space-m); - background: var(--color-overlay-bg); - border-radius: var(--space-m); - } + & img, + & .dot, + & .tooltip { + display: none; } } - & #unmapped { - @media (--up_to_L) { + @media (--L_and_up) { + position: relative; + margin-top: var(--space-xxl); + + & h2 { display: none; } - @media (--L_and_up) { - margin-top: var(--space-xxl); + + & img { + display: block; + width: 100%; + opacity: .5; + } + + & ul { + margin: 0; + list-style: none; + } + + & li { + position: absolute; + z-index: 1; + font-size: .65rem; + + &.unmapped { + display: none; + } + + &.official { + color: var(--color-accent); + } + + &:not(.official) { + color: var(--color-secondary); + } + + & a { + color: inherit; + display: inline-block; + margin-top: .3rem; + } + + & .dot { + content: ''; + position: absolute; + top: .375rem; + left: -1rem; + background: radial-gradient(currentColor 0%, rgba(255, 255, 255, 0) 100%); + animation-timing-function: linear; + animation-iteration-count: infinite; + will-change: transform; + transform-origin: 50%; + border-radius: 50%; + width: .8rem; + height: .8rem; + transform: scale(.75); + animation-name: pulse; + } + } + + & .tooltip { + position: absolute; + z-index: 2; + min-width: 7rem; + font-size: .65rem; + padding: var(--space-xs) var(--space-m); + background: var(--color-overlay-bg); + border-radius: var(--space-m); } } } + +#unmapped { + @media (--up_to_L) { + display: none; + } + @media (--L_and_up) { + margin-top: var(--space-xxl); + } +} diff --git a/src/includes/mixins.pug b/src/includes/mixins.pug index 5685f9a7350..792450a506b 100644 --- a/src/includes/mixins.pug +++ b/src/includes/mixins.pug @@ -32,6 +32,50 @@ mixin member(m) if m.text !=markdown(m.text) +mixin map(m) + - const filterOfficial = (list, official) => list.filter(meetup => (meetup.name.startsWith('Einundzwanzig') || meetup.name.startsWith('Einezwänzg')) === official) + - const filterUnmapped = (list) => list.filter(meetup => !meetup.top || !meetup.left) + - const style = m => m.top && m.left ? `top:${m.top}%;left:${m.left}%;` : null + - const clss = m => m.top && m.left ? null : 'unmapped' + - let j = 0 + #map + h2 Einundzwanzig Meetups + ul.meetups + each m in filterOfficial(meetups, true) + li.official(class=clss(m) style=style(m)) + a(href=m.url target="_blank" rel="nofollow noopener") + .dot(style=`animation-delay:${((j*2000) + random(3000))}ms;animation-duration:${meetups.length*2}s;`) + = m.name.replace('Einundzwanzig ', '').replace('Einezwänzg ', '') + if m.members + = ' ' + small.members= `(${m.members})` + - j++ + + h2 Weitere Meetups + ul.meetups + each m in filterOfficial(meetups, false) + li(class=clss(m) style=style(m)) + a(href=m.url target="_blank" rel="nofollow noopener") + .dot(style=`animation-delay:${((j*2000) + random(3000))}ms;animation-duration:${meetups.length*2}s;`) + = m.name.replace('Bitcoin ', '') + if m.members + = ' ' + small.members= `(${m.members})` + - j++ + + img#dach(src=assetPath('/img/dach.svg') alt="DE, AT, CH") + #tooltip.tooltip(hidden) + #unmapped + h2 Weitere Meetups + ul.meetups + each m in filterUnmapped(meetups) + li(class=clss(m) style=style(m)) + a(href=m.url target="_blank" rel="nofollow noopener") + = m.name + if m.members + = ' ' + small.members= `(${m.members})` + mixin spende(d, trunc = false) .spende(id=d.id)&attributes(attributes) .inner diff --git a/src/includes/template.pug b/src/includes/template.pug index e3bef3ff750..3193ff82ff3 100644 --- a/src/includes/template.pug +++ b/src/includes/template.pug @@ -10,7 +10,7 @@ block vars - const themeColor = site.meta.themeColor -html(lang="en") +html(lang="de") head include _head body @@ -46,8 +46,6 @@ html(lang="en") a(href="/team/" class=(navCurrent === 'team' && 'current')) Team a(href="/verein/" class=(navCurrent === 'verein' && 'current')) Verein a(href="/kontakt/" class=(navCurrent === 'kontakt' && 'current')) Kontakt - //- .navItem - //- a(href=site.meta.shopUrl target="_blank") Shop button(type="button").theme +sprite("theme") diff --git a/src/meetups.pug b/src/meetups.pug index d6416261b66..922e4dbbfb1 100644 --- a/src/meetups.pug +++ b/src/meetups.pug @@ -4,11 +4,6 @@ block vars - const title = 'Bitcoin-Meetups' - const description = 'Eine Liste von Bitcoin-Meetups und Einundzwanzig-Treffen im D/A/CH/S/LI/LU-Raum.' - const cardImage = '/img/card/meetups.png' - - const filterOfficial = (list, official) => list.filter(meetup => (meetup.name.startsWith('Einundzwanzig') || meetup.name.startsWith('Einezwänzg')) === official) - - const filterUnmapped = (list) => list.filter(meetup => !meetup.top || !meetup.left) - - const style = m => m.top && m.left ? `top:${m.top}%;left:${m.left}%;` : null - - const clss = m => m.top && m.left ? null : 'unmapped' - - let j = 0 block main #meetups.wrap @@ -27,41 +22,4 @@ block main Die Vorlage für das Telegram-Gruppenbild findest du im [Media Kit](/media). - #map - h2 Einundzwanzig Meetups - ul.meetups - each m in filterOfficial(meetups, true) - li.official(class=clss(m) style=style(m)) - a(href=m.url target="_blank" rel="nofollow noopener") - .dot(style=`animation-delay:${((j*2000) + random(3000))}ms;animation-duration:${meetups.length*2}s;`) - = m.name.replace('Einundzwanzig ', '').replace('Einezwänzg ', '') - if m.members - = ' ' - small.members= `(${m.members})` - - j++ - - h2 Weitere Meetups - ul.meetups - each m in filterOfficial(meetups, false) - li(class=clss(m) style=style(m)) - a(href=m.url target="_blank" rel="nofollow noopener") - .dot(style=`animation-delay:${((j*2000) + random(3000))}ms;animation-duration:${meetups.length*2}s;`) - = m.name.replace('Bitcoin ', '') - if m.members - = ' ' - small.members= `(${m.members})` - - j++ - - img#dach(src=assetPath('/img/dach.svg') alt="DE, AT, CH") - #tooltip.tooltip(hidden) - - #unmapped - h2 Weitere Meetups - ul.meetups - each m in filterUnmapped(meetups) - li(class=clss(m) style=style(m)) - a(href=m.url target="_blank" rel="nofollow noopener") - = m.name - if m.members - = ' ' - small.members= `(${m.members})` + +map(meetups) diff --git a/static/img/adventskalender.png b/static/img/card/adventskalender.png similarity index 100% rename from static/img/adventskalender.png rename to static/img/card/adventskalender.png