hq/basspistol.com
hq/basspistol.com
4
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

stash

Browse source
This commit is contained in:
Set Hallstrom 2020-09-08 18:07:38 +02:00
parent b747089fca
commit 5113069605
171 changed files with 9868 additions and 10786 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

94
404.html
View file

@ -1,92 +1,8 @@
--- ---
layout: nil title: 404
title: Error 404 This is not a page description: >-
description: The page you are looking for has moved to the darknet. Wrong page.
image: /images/kaur-kristjan-cppf4w5pb1c-unsplash.jpg image: /images/openpension-banner.svg
layout: page
sitemap: false sitemap: false
--- ---
<!DOCTYPE HTML>
<!--
Based on _Story_ by html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Remixed and Jekyllified by Setto
-->
<html lang="en">
<head>
{% include seo.html %}
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" />
<link rel="stylesheet" href="/assets/css/main20200710.css" />
<noscript><link rel="stylesheet" href="/assets/css/noscript20200710.css" /></noscript>
</head>
<body id="body">
<span id="top" style="display: none;"></span>
<!-- Wrapper -->
<div id="wrapper" class="divided">
<!-- Banner -->
<section class="banner onload-image-fade-in onload-content-fade-right style2 fullscreen content-align-center image-position-center" style="min-height:100vh;background-color: rgba(13,13,13,0.85);">
<div class="content editable">
<h1 class="editable">{{ page.title }}</h1>
<p>{{ page.description }}</p>
<ul class="actions stacked">
<li><a href="/" class="button small wide">Take me back!</a></li>
</ul>
</div>
<div class="image">
<img src="{{ page.image }}" alt="unfound page" />
</div>
</section>
<!-- Footer -->
<footer id="footer" class="wrapper style1 align-center">
<div class="footflex">
<div>
<h4>{{ site.title }}</h4>
<p>{{ site.description }}
</div>
<div>
<ul>
<li><a href="{{ relBase }}/">{{ site.data.translations[page.lang].home }}</a></li>
{% for entry in site.data.navigation %}
<li><a href="{{ entry.url }}">{{ entry.name }}</a></li>
{% endfor %}
</ul>
</div>
<div><img src="/assets/panix-logo-dark.svg" style="max-width:300px" /></div>
</div>
<div class="inner">
<p>&copy;2020 Basspistol | <a href="/webcreds/">Credits</a> | <a href="/cookies/">Cookies & Privacy</a></p>
</div>
</footer>
</div>
{% include navigation.html %}
<!-- Scripts -->
<script src="/assets/js/jquery.min.js"></script>
<script src="/assets/js/jquery.scrollex.min.js"></script>
<script src="/assets/js/jquery.scrolly.min.js"></script>
<script src="/assets/js/browser.min.js"></script>
<script src="/assets/js/breakpoints.min.js"></script>
<script src="/assets/js/util.js"></script>
<script src="/assets/js/main.js"></script>
<script src="/assets/js/set.js"></script>
{% include cookie-consent.html %}
</body>
</html>

4
Gemfile
View file

@ -1,9 +1,9 @@
source 'https://rubygems.org' source 'https://rubygems.org'
gem 'jekyll', '4.0.0' gem 'jekyll', '4.1.1'
group :jekyll_plugins do group :jekyll_plugins do
gem 'jekyll-seo-tag', '2.6.1'
gem 'jekyll-sitemap', '1.4.0' gem 'jekyll-sitemap', '1.4.0'
gem 'jekyll-last-modified-at','1.1.0' gem 'jekyll-last-modified-at','1.1.0'
# gem 'jekyll-pwa-plugin'
end end

21
Gemfile.lock
View file

@ -4,7 +4,7 @@ GEM
addressable (2.7.0) addressable (2.7.0)
public_suffix (>= 2.0.2, < 5.0) public_suffix (>= 2.0.2, < 5.0)
colorator (1.1.0) colorator (1.1.0)
concurrent-ruby (1.1.6) concurrent-ruby (1.1.7)
em-websocket (0.5.1) em-websocket (0.5.1)
eventmachine (>= 0.12.9) eventmachine (>= 0.12.9)
http_parser.rb (~> 0.6.0) http_parser.rb (~> 0.6.0)
@ -12,19 +12,19 @@ GEM
ffi (1.13.1) ffi (1.13.1)
forwardable-extended (2.6.0) forwardable-extended (2.6.0)
http_parser.rb (0.6.0) http_parser.rb (0.6.0)
i18n (1.8.3) i18n (1.8.5)
concurrent-ruby (~> 1.0) concurrent-ruby (~> 1.0)
jekyll (4.0.0) jekyll (4.1.1)
addressable (~> 2.4) addressable (~> 2.4)
colorator (~> 1.0) colorator (~> 1.0)
em-websocket (~> 0.5) em-websocket (~> 0.5)
i18n (>= 0.9.5, < 2) i18n (~> 1.0)
jekyll-sass-converter (~> 2.0) jekyll-sass-converter (~> 2.0)
jekyll-watch (~> 2.0) jekyll-watch (~> 2.0)
kramdown (~> 2.1) kramdown (~> 2.1)
kramdown-parser-gfm (~> 1.0) kramdown-parser-gfm (~> 1.0)
liquid (~> 4.0) liquid (~> 4.0)
mercenary (~> 0.3.3) mercenary (~> 0.4.0)
pathutil (~> 0.9) pathutil (~> 0.9)
rouge (~> 3.0) rouge (~> 3.0)
safe_yaml (~> 1.0) safe_yaml (~> 1.0)
@ -34,8 +34,6 @@ GEM
posix-spawn (~> 0.3.9) posix-spawn (~> 0.3.9)
jekyll-sass-converter (2.1.0) jekyll-sass-converter (2.1.0)
sassc (> 2.0.1, < 3.0) sassc (> 2.0.1, < 3.0)
jekyll-seo-tag (2.6.1)
jekyll (>= 3.3, < 5.0)
jekyll-sitemap (1.4.0) jekyll-sitemap (1.4.0)
jekyll (>= 3.7, < 5.0) jekyll (>= 3.7, < 5.0)
jekyll-watch (2.2.1) jekyll-watch (2.2.1)
@ -48,16 +46,16 @@ GEM
listen (3.2.1) listen (3.2.1)
rb-fsevent (~> 0.10, >= 0.10.3) rb-fsevent (~> 0.10, >= 0.10.3)
rb-inotify (~> 0.9, >= 0.9.10) rb-inotify (~> 0.9, >= 0.9.10)
mercenary (0.3.6) mercenary (0.4.0)
pathutil (0.16.2) pathutil (0.16.2)
forwardable-extended (~> 2.6) forwardable-extended (~> 2.6)
posix-spawn (0.3.14) posix-spawn (0.3.15)
public_suffix (4.0.5) public_suffix (4.0.5)
rb-fsevent (0.10.4) rb-fsevent (0.10.4)
rb-inotify (0.10.1) rb-inotify (0.10.1)
ffi (~> 1.0) ffi (~> 1.0)
rexml (3.2.4) rexml (3.2.4)
rouge (3.20.0) rouge (3.22.0)
safe_yaml (1.0.5) safe_yaml (1.0.5)
sassc (2.4.0) sassc (2.4.0)
ffi (~> 1.9) ffi (~> 1.9)
@ -69,9 +67,8 @@ PLATFORMS
ruby ruby
DEPENDENCIES DEPENDENCIES
jekyll (= 4.0.0) jekyll (= 4.1.1)
jekyll-last-modified-at (= 1.1.0) jekyll-last-modified-at (= 1.1.0)
jekyll-seo-tag (= 2.6.1)
jekyll-sitemap (= 1.4.0) jekyll-sitemap (= 1.4.0)
BUNDLED WITH BUNDLED WITH

117
_config-reference.yml
View file

@ -1,117 +0,0 @@
# ----
# Site
title : pax:nion
description: PHI, Panix Heavy Industries
url : https://paxnion.basspistol.com
# banner should be 1024x1024
banner: /siteicon.png
icon: /siteicon.png
logo: /siteicon.png
author:
name: pax:nion
publisher:
name: Basspistol
domain: basspistol.com
mail: info@basspistol.com
plugins:
- jekyll-sitemap
- jekyll-seo-tag
- jekyll-last-modified-at
# GEO
geo:
timezone: "Europe/Stockholm"
lat: '59.333759'
long: '18.052554'
region: 'SE-AB'
town: 'Stockholm'
collections:
albums:
output: true
permalink: /albums/:name/
tracks:
output: true
permalink: /albums/:path/
# Defaults
permalink: pretty
categories:
- release
- rambling
exclude:
- changelog.md
- '*.*~'
- '*.xcf'
- '*.blend*'
- Gemfile
- Gemfile.lock
- README.md
- LICENCE
- '*.mp3'
sass:
sass_dir: _sass
defaults:
- scope:
path: ""
values:
lang: en
- scope:
path: ""
type: "tracks"
values:
layout: "track"
lang: en
seo:
type: "AudioObject"
- scope:
path: ""
type: "pages"
values:
layout: "default"
lang: en
_options:
image:
width: 1024
height: 720
resize_style: cover
uploads_dir: "/images"
content:
width: 720
height: 720
resize_style: cover
uploads_dir: "/images"
- scope:
path: ""
type: "posts"
values:
layout: "post"
lang: en
permalink: /:title/
_options:
image:
width: 1024
height: 720
resize_style: cover
uploads_dir: "/images"
content:
width: 720
height: 720
resize_style: cover
uploads_dir: "/images"
# ---------
# Translate
lang: en

8
_config.yml
View file

@ -48,7 +48,7 @@ categories:
collections: collections:
albums: albums:
output: true output: false
permalink: /albums/:name/ permalink: /albums/:name/
tracks: tracks:
output: true output: true
@ -105,7 +105,7 @@ defaults:
values: values:
layout: "post" layout: "post"
lang: en lang: en
permalink: /:title/ permalink: /:categories/:slug/
_options: _options:
image: image:
width: 1024 width: 1024
@ -116,4 +116,6 @@ defaults:
width: 720 width: 720
height: 720 height: 720
resize_style: cover resize_style: cover
uploads_dir: "/images" uploads_dir: "/images"

10
_data/colors.yml Normal file
View file

@ -0,0 +1,10 @@
bg_color: 'rgb(27, 34, 65)'
bg-alt_color: 'rgba(27, 34, 65, 0.95)'
fg_color: 'rgba(178, 211, 168, 1)'
fg-alt_color: 'rgba(178, 211, 168, 0.75)'
border_color: 'rgb(33, 42, 24)'
border-alt_color: 'rgba(33, 42, 24, 0.75)'
accent2_color: 'rgba(82, 183, 136, 1)'
accent2-alt_color: 'rgba(82, 183, 136, 0.75)'
accent1_color: 'rgba(237, 229, 166, 1)'
accent1-alt_color: 'rgba(237, 229, 166, 0.75)'

12
_data/navigation.yml
View file

@ -1,24 +1,24 @@
- icon: fa-disc - icon: 💽
url: /discography/ url: /discography/
name: Discog name: Discog
external_site: false external_site: false
- icon: fa-radio - icon: 📻
url: /radio/ url: /radio/
name: Radio name: Radio
external_site: false external_site: false
- icon: fa-newspaper - icon: 📰
url: /highlights/ url: /highlights/
name: Hi-lights name: Hi-lights
external_site: false external_site: false
- icon: fa-people - icon: 🧑🏾‍🤝‍🧑🏼🧑🏻‍🤝‍🧑🏽
url: /artists/ url: /artists/
name: Artists name: Artists
external_site: false external_site: false
- icon: fa-finger-print - icon: ☔
url: /about/ url: /about/
name: About name: About
external_site: false external_site: false
- icon: fa-link - icon: 🔗
url: /links/ url: /links/
name: Links name: Links
external_site: false external_site: false

6
_includes/analytics.js
View file

@ -11,9 +11,9 @@
(function() { (function() {
var u="https://terminalnetwork.matomo.cloud/"; var u="https://terminalnetwork.matomo.cloud/";
_paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '3']); _paq.push(['setSiteId', '{{ site.matomo_site_id }}']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src='//cdn.matomo.cloud/terminalnetwork.matomo.cloud/matomo.js'; s.parentNode.insertBefore(g,s); g.type='text/javascript'; g.async=true; g.defer=true; g.src='https://cdn.matomo.cloud/terminalnetwork.matomo.cloud/matomo.js'; s.parentNode.insertBefore(g,s);
})(); })();
//* End Matomo *// //* End Matomo *//
@ -26,7 +26,7 @@
var _mtm = _mtm || []; var _mtm = _mtm || [];
_mtm.push({'mtm.startTime': (new Date().getTime()), 'event': 'mtm.Start'}); _mtm.push({'mtm.startTime': (new Date().getTime()), 'event': 'mtm.Start'});
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src='https://cdn.matomo.cloud/terminalnetwork.matomo.cloud/container_fHO88MfH.js'; s.parentNode.insertBefore(g,s); g.type='text/javascript'; g.async=true; g.defer=true; g.src='https://cdn.matomo.cloud/terminalnetwork.matomo.cloud/container_{{ site.matomo_container }}.js'; s.parentNode.insertBefore(g,s);
//* End Matomo Tag Manager *// //* End Matomo Tag Manager *//
{% endif %} {% endif %}

69
_includes/author.html
View file

@ -1,34 +1,41 @@
{% assign author_id = page.author | prepend: "/staff_members/" | append: "/" %} {% assign author_id = page.author | prepend: "/authors/" | append: "/" %}
{% assign author = site.staff_members | where: "url", author_id | first %} {% assign author = site.authors | where: "url", author_id | first %}
<header id="author"> <div id="author">
<div class="bio"> <div class="bio">
{% if page.collection == 'posts' %} {% if page.collection == 'posts' %}
<div alt="Picture of {{ author.name }}" <div class="author-image" alt="Picture of {{ author.name }}" style="background-image:url({{ author.image }});">
style="margin-right: 10px;background-image:url({{ author.image }});background-repeat: no-repeat;background-size:cover; border-radius:150px; width:150px; height:150px;"> </div>
<br />
<p><a href="mailto:{{ author.email }}"><strong>{{ author.name }}</strong></a></p>
<p>{{ author.position }}{% if author.gpg != nil %} | <a target="_blank" rel="noopener"
href="{{ author.gpg }}">GPG</a>{% endif %}</p>
<p class="date">
Published the
{% include dates.html %}
</p>
{% endif %}
<h6>
Share this page:
</h6>
<ul>
<a target="_blank" rel="nofollow noopener" title="Share to facebook" alt="Share to facebook"
href="https://touch.facebook.com/sharer.php?u={{ site.url }}{{ page.url | xml_escape }}&amp;quote={{ page.title | xml_escape }}%20by%20{{ site.title xml_escape }}%20via%20{{ site.url }}"
class="icon smaller fab fa-facebook-f"><span class="label">Facebook</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to twitter" alt="Share to twitter"
href="https://twitter.com/share?url={{ site.url }}{{ page.url | xml_escape }}&amp;text={{ page.title | xml_escape }}%20by%20{{ site.title xml_escape }}%20&amp;hashtags=basspistol"
class="icon smaller fab fa-twitter"><span class="label">Twitter</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to telegram" alt="Share to telgram"
href="https://telegram.me/share/url?url={{ site.url }}{{ page.url }}&amp;text={{ page.title | xml_escape }}%20by%20{{ site.title xml_escape }}"
class="icon smaller fab fa-telegram"><span class="label ">Telegram</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to reddit" alt="Share to reddit"
href="https://reddit.com/submit/?url={{ site.url }}{{ page.url }}&amp;title={{ page.title | xml_escape }}%20by%20{{ site.title xml_escape }}"
class="icon smaller fab fa-reddit"><span class="label">Reddit</span></a>
</ul>
</div> </div>
<br /> </div>
<p style="font-style: normal;"><a href="mailto:{{ author.email }}"><strong>{{ author.name }}</strong></a></p>
<p style="font-style: normal;">{{ author.position }}{% if author.gpg != nil %} | <a target="_blank" rel="noopener" href="{{ author.gpg }}">GPG</a>{% endif %}</p>
<p style="font-size:14px;font-style: normal;">
Published the
{% include dates.html %}
</p>
{% endif %}
<h6>
Share this page:
</h6>
<ul class="icons">
<li><a target="_blank" rel="nofollow noopener" title="Share to facebook" alt="Share to facebook" href="https://touch.facebook.com/sharer.php?u={{ site.url }}{{ page.url | xml_escape }}&amp;quote={{ page.title | xml_escape }}%20by%20{{ site.title xml_escape }}%20via%20{{ site.url }}" class="icon brands style1 fa-facebook-f"><span class="label">Facebook</span></a></li>
<li><a target="_blank" rel="nofollow noopener" title="Share to twitter" alt="Share to twitter" href="https://twitter.com/share?url={{ site.url }}{{ page.url | xml_escape }}&amp;text={{ page.title | xml_escape }}%20by%20{{ site.title xml_escape }}%20&amp;hashtags=paxNion" class="icon brands style1 fa-twitter"><span class="label">Twitter</span></a></li>
<li><a target="_blank" rel="nofollow noopener" title="Share to telegram" alt="Share to telgram" href="https://telegram.me/share/url?url={{ site.url }}{{ page.url }}&amp;text={{ page.title | xml_escape }}%20by%20{{ site.title xml_escape }}" class="icon brands style1 fa-telegram"><span class="label">Telegram</span></a></li>
<li><a target="_blank" rel="nofollow noopener" title="Share to reddit" alt="Share to reddit" href="https://reddit.com/submit/?url={{ site.url }}{{ page.url }}&amp;title={{ page.title | xml_escape }}%20by%20{{ site.title xml_escape }}" class="icon brands style1 fa-reddit"><span class="label">Reddit</span></a></li>
</ul>
{% if page.collection == 'tracks' %}
<a href="{{ relBase }}/albums/{{ page.albumSlug }}" class="button smaller"> Back to Album</a><br /><br />
{% endif %}
</div>
</header>

77
_includes/contact.html
View file

@ -1,42 +1,47 @@
<!-- Contact --> <!-- BEGIN contact.html -->
<section id="contact" class="wrapper style1 align-center"> <section id="contact">
<div class="inner medium"> <div>
<h2 class="editable"> <form action="{{ relBase }}/contact-success/" method="post" class="contact-form">
<div>
</h2> <h2>Kontakta oss!</h2>
<form action="{{ site.baseurl }}/contact-success/" method="post"> <input type="hidden" name="_to" value="{{ site.publisher.mail }}" /><br />
<input type="hidden" name="_to" value="setto@basspistol.com" /><br /> <input type="text" name="_gotcha" style="display: none;" />
<input type="text" name="_gotcha" style="display: none;" />
<div class="fields">
<div class="field half">
<label for="name">{{ site.data.translations[page.lang].name }}</label>
<input type="text" name="name" id="name" placeholder="{{ site.data.translations[page.lang].name }} {{ site.data.translations[page.lang].lastname }}" />
</div>
<div class="field half">
<label for="email">{{ site.data.translations[page.lang].email }}</label>
<input type="email" name="email" placeholder="{{ site.data.translations[page.lang].required }}" required />
</div>
<div class="field">
<label for="message">{{ site.data.translations[page.lang].message }}</label>
<textarea name="message" id="message" rows="6" placeholder="{{ site.data.translations[page.lang].write-msg }}"></textarea>
</div>
</div> </div>
<div style="text-align: left;"> <div class="contact-info">
<input type="checkbox" name="consent" id="consent" required /> <label for="email">Email</label>
<label for="consent">{{ site.data.translations[page.lang].privacy }} <input type="email" name="email" id="email" placeholder="Email..." required class="contact" />
</label> {% if page.url == '/fr-fretag/' %}
<br /><br /> <label for="phone">Phone</label>
<input type="tel" name="telephone" id="telephone" placeholder="Telefonnumer..." required
<input type="checkbox" name="newsletter" id="newsletter" /> class="contact" />
<label for="newsletter">{{ site.data.translations[page.lang].newsletter }} <label for="name">Name</label>
<input type="name" name="name" id="name" placeholder="Namn och efternamn..." required class="contact" />
<label for="company">Företag</label>
<input type="company" name="company" id="company" placeholder="Företag..." required
class="contact" />
{% endif %}
</div>
<div>
<label for="message">Meddelande</label><br />
<textarea name="message" id="message" placeholder="Skriv ditt meddelande här..." required
class="contact textspace"></textarea>
</div>
<br />
<div>
<input type="checkbox" name="consent" id="consent" required class="css-checkbox lrg klaus" /><label
for="consent" class="css-label lrg klaus">Jag godkänner <a href="/cookies/">integritets policyn</a>
</label> </label>
</div> </div>
<br /> <br />
<ul class="actions special"> <div>
<li><input type="submit" name="submit" id="submit" value="{{ site.data.translations[page.lang].send }}" /></li> <input type="checkbox" name="news" id="news" class="css-checkbox lrg klaus" /><label for="news"
</ul> class="css-label lrg klaus">Jag vill ha nyheter</label>
</div>
<br />
<div>
<input type="submit" class="button" value="Send Message" />
</div>
</form> </form>
</div> </div>
</section> </section>
<!-- END Contact --> <!-- END contact.html -->

12
_includes/cookie-consent.html
View file

@ -1,7 +1,13 @@
<div id="cookie-notice"> <div id="cookie-notice">
{{ site.data.translations[page.lang].cookies }}
<a class="button small yes" href="#" id="cookie-notice-accept">{{ site.data.translations[page.lang].cookie-agree }}</a> <p>Vi använder bara cookies om du går med på det. Hjälp oss förbättra våran marknadsföring!
<br />Klicka <a href="#" id="cookie-notice-decline">här</a> om du inte vill hjälpa till.
<br />Läs mer om <a href="/cookies/">hur vi använder cookies,</a>
</p>
<a class="button yes" href="#"
id="cookie-notice-accept">Jag hjälper gärna!</a>
</div> </div>
<script> <script>
@ -12,7 +18,7 @@
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toUTCString(); expires = "; expires=" + date.toUTCString();
} }
document.cookie = name + "=" + value + expires + "; path=/"; document.cookie = name + "=" + value + expires + "; path=/;SameSite=Strict";
} }
function readCookie(name) { function readCookie(name) {
var nameEQ = name + "="; var nameEQ = name + "=";

172
_includes/ethoicon-selector.html Normal file
View file

@ -0,0 +1,172 @@
{% case include.icon %}
{% when "alcohol" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M366.85,190.69v-29.3h-31.71v28.06c0,0,0,0,0,0c0.31,0.88,0.59,1.76,0.86,2.65c0.03,0.09,0.05,0.17,0.08,0.26 c0.25,0.83,0.48,1.66,0.7,2.49c0.04,0.16,0.09,0.33,0.13,0.49c0.2,0.77,0.38,1.55,0.55,2.33c0.05,0.25,0.11,0.5,0.16,0.74 c0.15,0.72,0.29,1.43,0.41,2.15c0.06,0.34,0.11,0.68,0.17,1.01c0.1,0.65,0.21,1.3,0.29,1.95c0.06,0.44,0.1,0.89,0.15,1.33 c0.06,0.56,0.13,1.13,0.18,1.69c0.05,0.59,0.09,1.19,0.12,1.78c0.03,0.43,0.06,0.87,0.08,1.3c0.05,1.04,0.07,2.09,0.07,3.14v22.46 h44.56v80.98h-44.56v26.85v5.99h23.85h36.9v-36.9v-38.38v-46.4C399.86,208.32,385.4,192.63,366.85,190.69z"
/>
<rect
x="335.14"
y="137.02"
width="31.71"
height="12.96"
/>
<path
d="M160.89,316.22h-44.56v-80.98h44.56v-22.46c0-1.05,0.03-2.09,0.07-3.14c0.02-0.44,0.06-0.87,0.08-1.3 c0.04-0.59,0.07-1.19,0.12-1.78c0.05-0.57,0.12-1.13,0.18-1.69c0.05-0.44,0.1-0.89,0.15-1.33c0.09-0.65,0.19-1.3,0.29-1.95 c0.05-0.34,0.11-0.68,0.17-1.01c0.13-0.72,0.27-1.44,0.41-2.15c0.05-0.25,0.1-0.5,0.16-0.74c0.17-0.78,0.35-1.56,0.55-2.33 c0.04-0.17,0.08-0.33,0.13-0.49c0.22-0.84,0.45-1.67,0.7-2.49c0.03-0.09,0.05-0.17,0.08-0.26c0.27-0.89,0.56-1.77,0.86-2.65 c0,0,0,0,0,0v-28.06h-31.71v29.3c-18.55,1.94-33.01,17.63-33.01,36.7v46.4v38.38v36.9h36.9h23.85v-5.99V316.22z"
/>
<rect
x="133.15"
y="137.02"
width="31.71"
height="12.96"
/>
<path
d="M274.37,156.37v-43.04h-48.73v43.04c-28.51,2.99-50.74,27.1-50.74,56.4v71.31v58.99v56.72h56.72h36.78h56.72 v-56.72v-58.99v-71.31C325.11,183.47,302.88,159.36,274.37,156.37z M300.21,349.31H199.79V224.84h100.41V349.31z"
/>
<rect
x="225.63"
y="75.42"
width="48.73"
height="19.92"
/>
</svg>
{% when "fossile" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M399.93,235.6c-1.34-13.13-3.23-44.55-42.91-92.29c-2.75,64.22-111.81,127.38-74.85-72.37 c-81.51,27.67-104.42,88.03-117.43,129.97c-8.38,27.01-42.67,41.09-52.23-3.55c-12.89,33.91-13.8,72.5,0.31,108.35 c30.1,76.48,117.09,113.89,193.03,84c41.76-16.44,72.09-49.74,86.13-89.03C399.33,280.1,402.21,257.89,399.93,235.6z M247.53,347.17 c-15.92,0-30.16-7.2-39.65-18.51c-3.57-3.81-6.39-8.4-8.34-13.88c-2.41-5.98-3.75-12.51-3.75-19.35c0-52.9,37.71-94.6,37.71-94.6 s-5.1,34.56,4.78,50.48c23.46,37.79,61,15.55,61,44.12S276.1,347.17,247.53,347.17z"
/>
</svg>
{% when "gambling" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M250,90c-88.37,0-160,71.63-160,160s71.63,160,160,160s160-71.63,160-160S338.37,90,250,90z M390,250.17 c-13.42,0-26.56,0-39.85,0c-0.31-21.64-6.68-41.08-19.07-58.58c10.92-7.94,21.61-15.72,32.41-23.58c17.21,23.71,26.5,52.14,26.5,82 C390,250.06,390,250.11,390,250.17z M171.25,250.46c-0.03-43.48,35.23-78.83,78.66-78.86c43.47-0.03,78.83,35.23,78.86,78.66 c0.03,43.47-35.23,78.83-78.66,78.86C206.64,329.15,171.29,293.89,171.25,250.46z M293.34,116.81c-4.21,12.9-8.34,25.56-12.5,38.3 c-20.77-6.44-41.12-6.35-61.65-0.02c-4.19-12.83-8.32-25.49-12.49-38.28c13.81-4.47,28.38-6.8,43.31-6.8 C264.94,110,279.52,112.33,293.34,116.81z M136.51,167.99c10.92,7.95,21.63,15.74,32.46,23.62 c-12.56,17.65-18.77,37.16-19.13,58.76c-13.39,0-26.53,0-39.84,0c0-0.12,0-0.25,0-0.37C110,220.13,119.3,191.7,136.51,167.99z M136.94,332.6c10.78-7.82,21.24-15.41,31.14-22.59c8.11,7.46,15.1,15.14,23.34,21.11c8.3,6.02,17.84,10.33,27.19,15.58 c-3.81,11.77-7.77,23.99-11.83,36.52c-20.8-6.73-39.86-18.32-55.76-34.23C145.86,343.85,141.17,338.36,136.94,332.6z M293.26,383.21c-4.08-12.6-8.11-25.06-12.19-37.66c20.5-6.99,36.93-19.04,49.89-36.27c10.77,7.82,21.4,15.53,32.11,23.3 c-4.23,5.77-8.93,11.25-14.08,16.41C333.1,364.89,314.05,376.49,293.26,383.21z"
/>
<rect
x="212.86"
y="212.86"
transform="matrix(0.7071 -0.7071 0.7071 0.7071 -103.5534 250)"
width="74.28"
height="74.28"
/>
</svg>
{% when "gmo" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M283.83,427.61c10.73-1.98,21.32-4.92,31.62-8.83c0.49-15.49,4.34-30.89,11.57-44.99 c-12.49,7.87-25.92,13.67-39.8,17.39C284.48,403.14,283.36,415.4,283.83,427.61z"
/>
<path
d="M323.77,324.73L323.77,324.73c-41.13,41.13-108,41.2-149.22,0.21c-5.57-5.6-10.63-11.41-14.69-17.83 l139.79-139.79c-10.14-6.12-21.16-10.23-32.48-12.32L146.53,275.64c-5.93-24.49-3.05-50.69,8.66-73.51 c-12.49,7.87-25.92,13.67-39.8,17.39c-10.24,44.6,1.84,93.42,36.42,128.15c53.76,53.52,141.03,53.45,194.69-0.22l0,0 c20.21-20.21,46.64-30.5,73.18-30.88c4.18-10.38,7.36-21.07,9.55-31.92C391.32,282.48,352.67,295.83,323.77,324.73z"
/>
<path
d="M214.61,72.93c-10.73,1.98-21.32,4.92-31.62,8.83c-0.49,15.49-4.34,30.89-11.57,44.99 c12.49-7.87,25.92-13.67,39.8-17.39C213.96,97.4,215.08,85.14,214.61,72.93z"
/>
<path
d="M174.67,175.81L174.67,175.81c41.13-41.13,108.26-41.45,149.48-0.47c5.57,5.6,10.37,11.67,14.43,18.08 L198.79,333.21c10.14,6.12,21.16,10.23,32.48,12.32L351.91,224.9c5.93,24.49,3.05,50.69-8.66,73.51 c12.49-7.87,25.92-13.67,39.8-17.39c10.24-44.6-1.92-93.34-36.5-128.07c-53.76-53.52-140.95-53.53-194.62,0.14l0,0 c-20.21,20.21-46.64,30.5-73.18,30.88c-4.18,10.38-7.36,21.07-9.55,31.92C107.11,218.06,145.77,204.71,174.67,175.81z"
/>
</svg>
{% when "nuclear" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M225.87,206.36l-48.55-88.25c-46.37,25.56-77.79,74.91-77.79,131.61h100.22 C200.07,231.25,210.58,214.9,225.87,206.36z"
/>
<path
d="M300.07,249.72h99.83c0-57.19-31.97-106.91-79.01-132.28l-47.66,88.57 C288.94,214.44,299.76,230.99,300.07,249.72z"
/>
<path
d="M249.82,300.65c-8.97,0-17.41-2.4-24.73-6.59l-48.31,86.97c21.6,12.03,46.47,18.89,72.95,18.89 c25.76,0,49.99-6.49,71.18-17.91l-47.06-87.46C266.69,298.43,258.5,300.65,249.82,300.65z"
/>
<path
d="M249.86,276.03c14.11,0,25.66-11.45,25.66-25.56c0-14.02-11.55-25.76-25.66-25.76 c-14.02,0-25.56,11.74-25.56,25.76C224.3,264.58,235.85,276.03,249.86,276.03z"
/>
</svg>
{% when "meat" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M348.94,153.25c-14.61-30.67-53.4-52.6-98.94-52.6c-45.53,0-84.3,21.91-98.93,52.57 c-33.83-15-70.55-7.81-70.55-7.81s17.68,33.28,51.94,49.22c5.38,2.51,10.72,4.71,15.91,6.6c6.44-5.1,18.01-4.08,27.7,2.94 c11.02,7.98,9.86,28.39,9.86,28.39s-15.32,6.01-26.43,1.48l23.59,86.07l26.66-88.33c0,0,2.25,31.81,2.25,48.19 c0,20.82-17.8,39.1-26.99,47.15l0.08,0.3c-2.74,7.09-4.11,14.78-4.11,22.73c0,32.4,13.32,50.41,69,50.41c55.68,0,69-18.01,69-50.41 c0-7.91-1.36-15.56-4.07-22.61l0.13-0.46c-9.21-8.07-26.93-26.32-26.93-47.1c0-16.39,2.25-48.19,2.25-48.19L317,319.99L340.58,234 c-11.11,4.6-26.51-1.44-26.51-1.44s-1.16-20.41,9.86-28.39c9.7-7.03,21.29-8.03,27.72-2.92c5.21-1.9,10.56-4.11,15.97-6.62 c34.26-15.94,51.94-49.22,51.94-49.22S382.8,138.21,348.94,153.25z M217.25,366.57c-3.85,0.73-7.69-3.99-8.57-10.55 c-0.88-6.56,1.53-12.47,5.38-13.21c3.85-0.73,7.69,3.99,8.57,10.55S221.11,365.84,217.25,366.57z M291.32,356.02 c-0.88,6.56-4.72,11.28-8.57,10.55c-3.85-0.73-6.26-6.65-5.38-13.21s4.72-11.28,8.57-10.55 C289.79,343.55,292.2,349.46,291.32,356.02z"
/>
</svg>
{% when "pesticide" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M191.24,327.05l-39.8-39.8l-41.47,41.47l62.66,62.66l25.99-25.99c-5.08-8.75-8.01-18.9-8.01-29.73 C190.61,332.73,190.83,329.86,191.24,327.05z"
/>
<path
d="M390.03,328.71l-41.47-41.47l-39.8,39.8c0.41,2.81,0.63,5.68,0.63,8.6c0,10.83-2.93,20.98-8.01,29.73 l25.99,25.99L390.03,328.71z"
/>
<path
d="M250,276.26c22.92,0,42.84,13.06,52.73,32.12c34.57-18.75,58.04-55.35,58.04-97.44 c0-61.18-49.59-110.77-110.77-110.77s-110.77,49.59-110.77,110.77c0,42.09,23.47,78.69,58.04,97.44 C207.16,289.32,227.08,276.26,250,276.26z M297.28,161.32c18.4,0,33.32,18.04,33.32,40.3s-14.92,40.3-33.32,40.3 s-33.32-18.04-33.32-40.3S278.88,161.32,297.28,161.32z M169.4,201.62c0-22.26,14.92-40.3,33.32-40.3s33.32,18.04,33.32,40.3 s-14.92,40.3-33.32,40.3S169.4,223.88,169.4,201.62z"
/>
<ellipse
cx="250"
cy="335.62"
rx="46.71"
ry="46.71"
/>
</svg>
{% when "processed" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M124.37,221.51h-5.17c-0.67,0-1.3,0.18-1.96,0.25c-2.76,0.29-5.36,1.13-7.75,2.54 c-7.77,4.56-13.17,14.31-13.17,25.7c0,10.67,4.77,19.86,11.75,24.74c2.31,1.62,4.84,2.77,7.57,3.31c1.17,0.23,2.35,0.45,3.58,0.45 h3.57h0.83h15.44h29.23h192.67h15.45h0.83h3.58c1.22,0,2.4-0.21,3.56-0.45c2.73-0.53,5.26-1.68,7.57-3.3 c6.98-4.88,11.76-14.07,11.76-24.74c0-11.4-5.41-21.15-13.19-25.7c-2.39-1.4-5.01-2.24-7.75-2.53c-0.65-0.07-1.28-0.25-1.95-0.25 h-5.18h-2.25h-16.61H172.84h-29.62h-16.61H124.37z M133.8,238.98c8.49-3.49,18.02-3.64,28.89,0.85c2.71,1.12,5.46,2.92,8.3,4.71 c6.92,4.34,14.35,8.62,22.94,2.91c4.34-2.89,9.52-6.84,14.88-7.72c10.6-1.76,20.21-1.61,29.51,4.56 c16.1,10.68,30.12,13.57,46.9,2.29c7.13-4.78,15.81-10.93,24.96-10.46c10.97,0.57,20.63,4.7,30.06,10.2 c11.58,6.74,18.07,6.64,27.44-0.37c1.43-1.07,2.92-2.27,4.51-3.66c2.45-2.14,5.34-1.86,7.52-0.49c0.45,0.28,0.89,0.54,1.26,0.91 c1.91,1.89,2.53,4.72,0.75,7.17c-0.27,0.37-0.44,0.76-0.84,1.11c-0.2,0.17-0.38,0.31-0.59,0.49c-4.39,3.79-8.56,6.81-12.71,9 c-9.24,4.86-18.43,5.26-30.19-1.58c-14.54-8.48-27.34-14.22-42.66-3.92c-8.07,5.42-16.84,11.27-26.88,11.94 c-12.47,0.83-21.55-2.62-31.83-9.44c-18.57-12.3-29.44-1.02-46.43,5.66c-8.35,3.28-13.97-0.94-19.67-5.23 c-2.73-2.06-5.49-4.14-8.57-5.42c-12.62-5.23-21.46-4.19-29.53,1.93c-3.34,2.53-6.56,5.85-9.85,10.09 c-0.47,0.6-0.99,0.96-1.51,1.3c-0.3,0.2-0.59,0.37-0.9,0.49c-2.26,0.85-4.65-0.29-6.16-2.33c-1.52-2.05-2.03-4.88-0.45-7.48 c0.14-0.23,0.17-0.45,0.33-0.68c1.61-2.07,3.26-4.01,4.96-5.8c0.51-0.53,1.04-0.94,1.55-1.45 C124.13,244.33,128.78,241.05,133.8,238.98z"
/>
<path
d="M148,338.68c5.24,1.74,10.69,2.77,16.32,2.77h171.36c25.76,0,48.22-19.41,60.13-48.05h-5.61h-23.29H151.63 h-18.55h-23.29h-5.6C113.49,315.79,129.25,332.44,148,338.68z"
/>
<path
d="M148,161.32c5.24-1.74,10.69-2.77,16.32-2.77h171.36c25.76,0,48.22,19.41,60.13,48.05h-5.61h-23.29H151.63 h-18.55h-23.29h-5.6C113.49,184.21,129.25,167.56,148,161.32z"
/>
</svg>
{% when "tobak" %}
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<rect
x="130.78"
y="267.87"
width="171.39"
height="57.76"
/>
<path
d="M342.82,209c7.81-8.02,12.55-18.56,12.55-30.11c0-25.13-22.42-45.5-50.08-45.5c-3.51,0-6.94,0.33-10.25,0.96 c-11.31-19.74-34.01-33.22-60.2-33.22c-37.47,0-67.84,27.59-67.84,61.63s30.37,61.63,67.84,61.63c0.75,0,1.48-0.03,2.22-0.05 c0.35,0.01,0.72,0.02,1.11,0.02c0.01,0,0.71,0,1.79,0c-0.01-0.02-0.02-0.03-0.03-0.05c-3.15-5.97-1.71-12.62,0.11-20.96 c-11.64-1.35-20.52-8.61-25.3-13.13c-7.71-7.28-12.13-17.44-12.12-27.89c-0.01-9.42,3.28-18.89,9.01-25.98 c4.9-6.05,13.87-13.24,28.97-13.53c0,0-25.1,9.29-25.1,39.51c0,24.51,41.26,28.42,47.28,29.27c-5.84,8.36-8.5,30.05,6.77,32.76 c10.27,0,23.36,0,34.7,0c0.35,0.01,0.69,0.02,1.04,0.02c0.35,0,0.7-0.02,1.05-0.02c13.01,0,23.21,0,23.22,0 c17.54,0.04,21.26,9.98,21.29,18.29v82.84h17.78v-82.87C368.58,225.21,360.35,211.15,342.82,209z"
/>
<polygon
points="317.86,325.4 335.89,325.49 335.89,267.05 317.86,266.95 "
/>
</svg>
{% when "weapon" %}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 500 500">
<path
d="M250,399.91c65.42,0,119.03-50.59,123.85-114.78h-247.7C130.97,349.32,184.58,399.91,250,399.91z"
/>
<path
d="M294.61,159.76v-52.42h-74.17c-12.8-12.02-30-19.4-48.91-19.4c-39.44,0-71.53,32.09-71.53,71.53 c0,12.95,3.48,25.1,9.53,35.59c-12.8,21.59-19.43,45.24-19.43,69.96h20c0-18.79,4.31-36.55,12.85-53.13 c4.45,4.13,9.42,7.7,14.8,10.6c-6.22,13.11-10.22,27.48-11.5,42.63h247.5C369.68,216.87,338.03,176.48,294.61,159.76z M116,159.47 c0-30.62,24.91-55.53,55.53-55.53c12.74,0,24.48,4.32,33.86,11.56v8.56h-15.44l-1.95,0.87c-1,0.45-24.8,11.2-48.75,33.59 c-7.24,6.77-13.7,13.88-19.38,21.29C117.39,173.51,116,166.65,116,159.47z M131.42,197.81c5.83-8.44,12.85-16.53,21.05-24.26 c17.95-16.9,36.19-26.66,41.88-29.49h11.04v15.7c-24.76,9.53-45.69,26.76-59.86,48.75C140.26,205.71,135.51,202.09,131.42,197.81z"
/>
</svg>
{% endcase %}

31
_includes/ethos.html Normal file
View file

@ -0,0 +1,31 @@
<section id="ethossection">
<h2 class="editable">
Kategorier
</h2>
<p style="text-align:center" class="editor-link"><a href="cloudcannon:collections/_data/ethos_ordning.yml" rel="nofollow" class="btn"><strong>&#9998;</strong>
Edit order</a></p><br />
<div class="ethos-flex">
{% for etho_name in site.data.ethos_ordning %}{% for etho in site.ethos %}
{% capture name -%}{{ etho.relative_path | replace_first: etho.collection, '' | replace_first: '_/', '' | replace_first: '.md', '' }}{%- endcapture %}
{% if name == etho_name %}
<div class="ethos">
<div class="icon">
<a href="{{ etho.url }}" alt="{{ etho.title }}" class="st1">
{% capture name -%}{{ etho.relative_path | replace_first: etho.collection, '' | replace_first: '_/', '' | replace_first: '.md', '' }}{%- endcapture %}
{% include ethoicon-selector.html icon=name %}
</a>
</div>
<div class="cartouche">
<h3>{{ etho.title }}</h3>
<p>{{ etho.description }}</p>
<p class="editor-link"><a href="cloudcannon:collections/{{ etho.path }}" rel="nofollow" class="btn"><strong>&#9998;</strong>
Edit Ethos</a></p>
</div>
</div>
{% break %} {% endif %} {% endfor %} {% endfor %}
</div>
</section>

32
_includes/footer.html
View file

@ -1,33 +1,27 @@
{% include streamer.html %} {% include streamer.html %}
<!-- Footer --> <!-- Footer -->
<footer id="footer" class="wrapper style1 align-center"> <footer>
<div class="footflex"> <div class="footframe">
<div>
<h4>{{ site.title }}</h4>
<p>{{ site.description }}
<br /><a href="mailto:{{ site.author.email }}">{{ site.author.email }}</a></p>
</div>
<div> <div>
<h3>{{ site.title }}</h3>
<p>{{ site.description }}</p>
<ul> <ul>
{% if page.url != '/' %} {% if page.url != '/' %}
<li><a href="{{ relBase }}/">{{ site.data.translations[page.lang].home }}</a></li> <li><a href="{{ relBase }}/">🏡 Home</a></li>
{% endif %} {% endif %}
{% for entry in site.data.navigation %} {% for entry in site.data.navigation %}
<li><a href="{{ entry.url }}">{{ entry.name }}</a></li> <li><a href="{{ entry.url }}" {% if entry.external_site == true %} target="_blank" rel="noopener"
{% endif %}>{{ entry.icon }} {{ entry.name }}</a></li>
{% endfor %} {% endfor %}
</ul> </ul>
</div> </div>
<div><img src="{{ relBase }}{{ site.logo }}" style="max-width:300px" alt="{{ site.title }} Logo" /></div> <div><a href="#main-wrapper"><img src="{{ relBase }}{{ site.icon }}" alt="{{ site.title }} Logo" /></a></div>
</div>
<div class="inner">
<ul class="icons">
{% for nw in site.data.social %}
<li><a target="_blank" alt="{{ site.title }} on {{ nw.name }}" title="{{ site.title }} on {{ nw.name }}" rel="{% if nw.url contains 'mastodon.art' %}me {% endif %}noopener" href="{{ nw.url }}" class="icon brands style2 {{ nw.icon }}"><span class="label">{{ nw.name }}</span></a></li> <small>
{% endfor %} <p>&copy;{{ site.time | date: '%Y' }} {{ site.publisher.name }} | <a href="{{ relBase }}/webcreds/">Credits</a> |
<!-- <li><a href="mailto:{{ site.author.email }}" class="icon style2 fa-envelope"><span class="label">Email</span></a></li> --> <a href="{{ relBase }}/cookies/">Cookies & Privacy</a>
</ul> <br />This page was last updated on {{ page.last_modified_at | date: "%A, %b %d, %Y" }}</p>
<p>&copy;{{ site.time | date: '%Y' }} {{ site.publisher.name }} | <a href="{{ relBase }}/webcreds/">Credits</a> | <a href="{{ relBase }}/cookies/">Cookies & Privacy</a></p> </small>
</div> </div>
</footer> </footer>

21
_includes/forloop-dates.html Normal file
View file

@ -0,0 +1,21 @@
{% assign d = post.date | date: "%-d" %}
{% case d %}
{% when '1' or '21' or '31' %}{{ d }}:st
{% when '2' or '22' %}{{ d }}:nd
{% when '3' or '23' %}{{ d }}:rd
{% else %}{{ d }}:th
{% endcase %} of
{% assign m = post.date | date: "%-m" %}
{% case m %}
{% when '1' %}January
{% when '2' %}February
{% when '3' %}March
{% when '4' %}April
{% when '5' %}May
{% when '6' %}June
{% when '7' %}July
{% when '8' %}August
{% when '9' %}September {% when '10' %}October {% when '11' %}November {% when '12' %}December
{% endcase %}
{{ post.date | date: "%Y" }}

26
_includes/header.html Normal file
View file

@ -0,0 +1,26 @@
{% include relBase.html %}
<header class="hero" id="top"
style="{% unless page.video_path %}background-image: url({{ page.image }});{% endunless %}">
<div class="imagecontainer">
</div>
</header> {% unless page.collection == 'posts' %}
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="{{ site.logo }}" width="240px" alt="{{ site.title }} Logo" />
</div>
<div>
<h1>{{ page.title }}</h1>
<p>{{ page.description }}</p>
</div>
</div>
</section>
{% endunless %}

17
_includes/matomo.html
View file

@ -1,17 +0,0 @@
<!-- Matomo -->
<script type="text/javascript">
var _paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(["setDocumentTitle", document.domain + "/" + document.title]);
_paq.push(["disableCookies"]);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://terminalnetwork.matomo.cloud/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '3']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src='//cdn.matomo.cloud/terminalnetwork.matomo.cloud/matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->

4
_includes/matomo.js
View file

@ -7,7 +7,7 @@ _paq.push(['enableLinkTracking']);
(function() { (function() {
var u="https://terminalnetwork.matomo.cloud/"; var u="https://terminalnetwork.matomo.cloud/";
_paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '3']); _paq.push(['setSiteId', '{{ site.matomo_site_id }}']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src='//cdn.matomo.cloud/terminalnetwork.matomo.cloud/matomo.js'; s.parentNode.insertBefore(g,s); g.type='text/javascript'; g.async=true; g.defer=true; g.src='https://cdn.matomo.cloud/terminalnetwork.matomo.cloud/matomo.js'; s.parentNode.insertBefore(g,s);
})(); })();

51
_includes/navigation.html
View file

@ -1,28 +1,33 @@
<!-- Navigation --> <!-- Navigation -->
<div id="logo" class="logo"> <div id="sticky" class="logo{% if page.collection == 'tracks' %} sticky{% endif %}">
<a href="/"><img width="100em" src="{{ site.logo }}" alt="{{ site.name }} Logo" /></a>
&nbsp;&nbsp;&nbsp;<a href="#navbar" onclick="blurBody()" alt="Navigation Menu" title="Navigation Menu"><span style="font-size: 34px;" class="icon solid fa-bars"></span></a>
</div>
<div id="navbar" style="display: block;" class="modalDialog">
<a href="#close" onclick="removeBlur()" alt="Close Menu" title="Close Menu"><div id="closearea"> </div></a>
<nav>
<a href="#close" title="Close" onclick="removeBlur()" class="close-button close" style="margin: 0 auto;">X</a>
<ul>
{% if page.url != '/' %}
<li><a href="{{ relBase }}/" class="button smaller">{{ site.data.translations[page.lang].home }}</a></li>
{% endif %}
{% for entry in site.data.navigation %}
{% if entry.external_site == false %}
<li><a href="{{ relBase }}{{ entry.url }}" class="button smaller">{{ entry.name }}</a></li>
{% else %}
<li><a href="{{ entry.url }}" target="_blank" rel="noopener" class="button smaller">{{ entry.name }}</a></li>
{% endif %}
{% endfor %}
</ul> <a id="logo" {% if page.url != '/' %}href="/"{% else %}href="#top"{% endif %}><img height="40px" src="{{ site.logo }}" alt="{{ site.title }} Logo" /></a>
</nav> <a href="#navbar" onclick="blurBody()" alt="Navigation Menu" title="Navigation Menu"><span
</div> class="fas fa-bars navmenu"></span></a>
</div>
<div id="navbar" class="modalDialog">
<a href="#close" onclick="removeBlur()" alt="Close Menu" title="Close Menu">
<div id="closearea"> </div>
</a>
<nav>
<a href="#close" title="Close" onclick="removeBlur()" class="close-button">X</a>
<ul>
{% if page.url != '/' %}
<li><a href="{{ relBase }}/" onclick="removeBlur()" class="button">home</a></li>
{% endif %}
{% for entry in site.data.navigation %}
{% if entry.external_site == false %}
<li><a href="{{ relBase }}{{ entry.url }}" onclick="removeBlur()" class="button">{{ entry.name }}</a></li>
{% else %}
<li><a href="{{ entry.url }}" target="_blank" rel="noopener" onclick="removeBlur()" class="button">{{ entry.name }}</a></li>
{% endif %}
{% endfor %}
</ul>
</nav>
</div>
<!-- End Navigation --> <!-- End Navigation -->

9
_includes/scripts.html
View file

@ -1,10 +1,3 @@
<!-- Scripts --> <!-- Scripts -->
{% include relBase.html %} {% include relBase.html %}
<script src="{{ relBase }}/assets/js/jquery.min.js"></script> <script src="{{ relBase }}/assets/js/set-20200805.js"></script>
<script src="{{ relBase }}/assets/js/jquery.scrollex.min.js"></script>
<script src="{{ relBase }}/assets/js/jquery.scrolly.min.js"></script>
<script src="{{ relBase }}/assets/js/browser.min.js"></script>
<script src="{{ relBase }}/assets/js/breakpoints.min.js"></script>
<script src="{{ relBase }}/assets/js/util.js"></script>
<script src="{{ relBase }}/assets/js/main.js"></script>
<script src="{{ relBase }}/assets/js/set.js"></script>

269
_includes/seo.html
View file

@ -1,146 +1,15 @@
<!-- <meta charset="utf-8" />
..............................................
..............................................
...........'';,...............................
.........'',,;:o:,............................
.......',;;::::::;;;,.........................
.....,;:ooooooooooo;,,''''....................
....,;ooooooooooooooo;,'..'''''...............
...,:ooooooooooooooooo;''......'''............
..,;:ooooooooooooooooo',,.........,'.......... _______ _ _ __
..,,;:,ooooo;;:ooo;o,:;,',.........;,''....... \____ \____ _____ __________ |_| ______/ |_ ___ | |
..,'..,,;:o,''.,;;'''..'';,,,,,,''',;'''...... | | _/\__ \/ __// __/\___ \| |/ __/\ _\/ \| |
..,'......':ooo:.......'';,'''''''',;,,,...... | | _/\__ \/ __// __/\___ \| |/ __/\ _\/ \| |
..,,.......,:o:'.......,'oooo:::::;:,.',;,.... | | _/\__ \/ __// __/\___ \| |/ __/\ _\/ \| |
..','.................',,..'',,,;;;;;;,.,:.... | | \ / _ \__ \ \__ \ | |_> > |\__ \ | | ( <> ) |__
...,,'...............',;oooooooooo:;;:,;oo,... |____ /(___ /___ >___ >| __/|_/____ > |_| \___/|____/
....,,'.............,,;ooooooooo;,..'',oooo,.. \/ \/ \/ \/ |_| \/
.....',,'........',,;ooo::;;,'........'oooo;..
.......'',,'''',,;;;,,'...............';;;'... All you saw was sound!
...........'''''..............................
..............................................
..............................................
..............................................
..............................................
-->
{% if page.collection == 'tracks' %}
<!-- BEGIN seo.html -->
<title>Play {{ page.common.title }} by {{ page.common.artist }} | {{ site.title }}</title>
<meta name="title" content="Play &quot;{{ page.common.title| strip_html }}&quot; by {{ page.common.artist }}" />
<meta name="description" content="A track by {{ page.common.artist }} named &quot;{{ page.common.title | strip_html }}&quot; published on {{ site.title }}" />
<meta name="dc.date.modified" scheme="ISO8601" content="{{ page.last_modified_at | date_to_xmlschema }}" />
<meta name="robots" content="index" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="canonical" href="{{ site.url }}{{ page.url }}" />
<link rel="alternate" hreflang="x-default" href="{{ site.url }}{{ page.url }}" />
<meta name="geo.region" content="{{ site.geo.region }}" />
<meta name="geo.placename" content="{{ site.geo.town }}" />
<meta name="geo.position" content="{{ site.geo.lat }};{{ site.geo.long }}" />
<meta name="ICBM" content="{{ site.geo.lat }}, {{ site.geo.long }}" />
<meta name="author" content="{{ site.title }}" />
<meta name="generator" content="Jekyll v4.0.0" />
<!-- Dublin Core basic info --> {% if page.collection == 'posts' %}
<meta name="dcterms.Identifier" content="{{ site.url }}" />
<meta name="dcterms.Format" content="text/html" />
<meta name="dcterms.Relation" content="{{ site.title }}" />
<meta name="dcterms.Publisher" content="{{ site.publisher.name }}" />
<meta name="dcterms.Type" content="text/html" />
<meta name="dcterms.Coverage" content="{{ site.url }}/" />
<meta name="dcterms.Rights" content="Copyright &copy;{{ site.time | date: '%Y' }} {{ site.title }}." />
<meta name="dcterms.Subject" content="A track by {{ page.common.artist }} named &quot;{{ page.common.title| strip_html }}&quot; published on {{ site.title }}" />
<meta name="dcterms.Title" content="Play &quot;{{ page.common.title| strip_html }}&quot; by {{ page.common.artist }}" />
<meta name="dcterms.Contributor" content="{{ site.title }}" />
<meta name="dcterms.Date" content="{{ page.last_modified_at | date: '%Y-%m-%d' }}" />
<meta name="dcterms.Description" content="Listen and to a track by {{ page.common.artist | strip_html }} from the release &quot;{{ page.common.album | strip_html }}&quot; and support your remote artist!" />
<!-- Facebook -->
<meta property="og:title" content="{{ page.common.title }}" />
<meta property="og:locale" content="en" />
<meta property="og:description" content="Listen and to a track by {{ page.common.artist | strip_html }} from the release &quot;{{ page.common.album | strip_html }}&quot; and support your remote artist!" />
<meta property="og:url" content="{{ site.url }}{{ page.url }}" />
<meta property="og:site_name" content="{{ site.title }}" />
<meta property="og:type" content="music:album:track" />
<meta property="og:audio" content="{{ site.mediaurl }}/{{ page.slug }}.mp3" />
<meta property="article:published_time" content="{{ page.last_modified_at | date_to_xmlschema }}" />
<meta property="og:image" content="{{ site.mediaurl }}/{{ page.slug }}.jpeg" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="{{ page.common.title }} | {{ site.title }}" />
<meta name="twitter:description" content="Listen and to a track by {{ page.common.artist | strip_html }} from the release &quot;{{ page.common.album | strip_html }}&quot; and support your remote artist!" />
<meta name="twitter:image" content="{{ site.mediaurl }}/{{ page.slug }}.jpeg" />
{% elsif page.collection == 'albums' %}
<!-- BEGIN seo.html -->
{% capture namelist %}{% for art in page.artists %}{{ art }}{% unless forloop.last %}, {% endunless %}{% endfor %}{% endcapture %}
{% capture artist %}{{ namelist }}{% endcapture %}
<title>Play &quot;{{ page.name }}&quot; by {{ artist | uniq }} | {{ site.title }}</title>
<meta name="title" content="Play &quot;{{ page.name | strip_html }}&quot; by {{ artist | uniq }}" />
<meta name="description" content="A release by {{ artist | uniq }} named &quot;{{ page.name | strip_html }}&quot; published on {{ site.title }}" />
<meta name="dc.date.modified" scheme="ISO8601" content="{{ page.last_modified_at | date_to_xmlschema }}" />
<meta name="robots" content="index" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="canonical" href="{{ site.url }}{{ page.url }}" />
<link rel="alternate" hreflang="x-default" href="{{ site.url }}{{ page.url }}" />
<meta name="geo.region" content="{{ site.geo.region }}" />
<meta name="geo.placename" content="{{ site.geo.town }}" />
<meta name="geo.position" content="{{ site.geo.lat }};{{ site.geo.long }}" />
<meta name="ICBM" content="{{ site.geo.lat }}, {{ site.geo.long }}" />
<meta name="author" content="{{ site.title }}" />
<meta name="generator" content="Jekyll v4.0.0" />
<!-- Dublin Core basic info -->
<meta name="dcterms.Identifier" content="{{ site.url }}" />
<meta name="dcterms.Format" content="text/html" />
<meta name="dcterms.Relation" content="{{ site.title }}" />
<meta name="dcterms.Publisher" content="{{ site.publisher.name }}" />
<meta name="dcterms.Type" content="text/html" />
<meta name="dcterms.Coverage" content="{{ site.url }}/" />
<meta name="dcterms.Rights" content="Copyright &copy;{{ site.time | date: '%Y' }} {{ site.title }}." />
<meta name="dcterms.Subject" content="A release by {{ artist | uniq }} named &quot;{{ page.name | strip_html }}&quot; published on {{ site.title }}" />
<meta name="dcterms.Title" content="Play &quot;{{ page.name | strip_html }}&quot; by {{ artist | uniq }}" />
<meta name="dcterms.Contributor" content="{{ site.title }}" />
<meta name="dcterms.Date" content="{{ page.last_modified_at | date: '%Y-%m-%d' }}" />
<meta name="dcterms.Description" content="Listen and to a release by {{ artist | uniq }} named &quot;{{ page.name | strip_html }}&quot; and support your remote artist!" />
<!-- Facebook -->
<meta property="og:title" content="{{ page.name }} by {{ artist | uniq }}" />
<meta property="og:locale" content="en" />
<meta property="og:description" content="Listen and to a release by {{ artist | uniq }} named &quot;{{ page.name | strip_html }}&quot; and support your remote artist!" />
<meta property="og:url" content="{{ site.url }}{{ page.url }}" />
<meta property="og:site_name" content="{{ site.title }}" />
<meta property="og:type" content="music:album" />
{% for track in page.tracks %}<meta property="og:audio" content="{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.mp3" />
{% endfor %}
<meta property="article:published_time" content="{{ page.last_modified_at | date_to_xmlschema }}" />
<meta property="og:image" content="{{ site.mediaurl }}/{{ page.tracks[0].slug }}.jpeg" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="{{ page.name }} | {{ site.title }}" />
<meta name="twitter:description" content="Listen and to a release by {{ artist | uniq }} named &quot;{{ page.name | strip_html }}&quot; and support your remote artist!" />
<meta name="twitter:image" content="{{ site.mediaurl }}/{{ page.tracks[0].slug }}.jpeg" />
{% else %}
<!-- BEGIN seo.html --> <!-- BEGIN seo.html -->
<title>{{ page.title }} | {{ site.title }}</title> <title>{{ page.title }} | {{ site.title }}</title>
<meta name="title" content="{{ page.title }} | {{ site.title }}" /> <meta name="title" content="{{ page.title | xml_escape }} | {{ site.title | xml_escape }}" />
<meta name="description" content="{{ page.description }}" /> <meta name="description" content="{{ page.description }}" />
<meta name="dc.date.modified" scheme="ISO8601" content="{{ page.last_modified_at | date_to_xmlschema }}" /> <meta name="dc.date.modified" scheme="ISO8601" content="{{ page.last_modified_at | date_to_xmlschema }}" />
<meta name="robots" content="index" /> <meta name="robots" content="index" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="canonical" href="{{ site.url }}{{ page.url }}" /> <link rel="canonical" href="{{ site.url }}{{ page.url }}" />
<link rel="alternate" hreflang="x-default" href="{{ site.url }}{{ page.url }}" /> <link rel="alternate" hreflang="x-default" href="{{ site.url }}{{ page.url }}" />
<meta name="geo.region" content="{{ site.geo.region }}" /> <meta name="geo.region" content="{{ site.geo.region }}" />
@ -154,50 +23,50 @@
<meta name="dcterms.Identifier" content="{{ site.url }}" /> <meta name="dcterms.Identifier" content="{{ site.url }}" />
<meta name="dcterms.Format" content="text/html" /> <meta name="dcterms.Format" content="text/html" />
<meta name="dcterms.Relation" content="{{ site.title }}" /> <meta name="dcterms.Relation" content="{{ site.title | xml_escape }}" />
<meta name="dcterms.Publisher" content="{{ site.publisher.name }}" /> <meta name="dcterms.Publisher" content="{{ site.publisher.name | xml_escape }}" />
<meta name="dcterms.Type" content="text/html" /> <meta name="dcterms.Type" content="text/html" />
<meta name="dcterms.Coverage" content="{{ site.url }}/" /> <meta name="dcterms.Coverage" content="{{ site.url }}/" />
<meta name="dcterms.Rights" content="Copyright &copy;{{ site.time | date: '%Y' }} {{ site.title }}." /> <meta name="dcterms.Rights" content="Copyright &copy;{{ site.time | date: '%Y' }} {{ site.title }}." />
<meta name="dcterms.Subject" content="{{ page.description }}" /> <meta name="dcterms.Subject" content="{{ page.description | xml_escape }}" />
<meta name="dcterms.Title" content="{{ page.title }}" /> <meta name="dcterms.Title" content="{{ page.title | xml_escape }}" />
<meta name="dcterms.Contributor" content="{{ site.title }}" /> <meta name="dcterms.Contributor" content="{{ site.title | xml_escape }}" />
<meta name="dcterms.Date" content="{{ page.last_modified_at | date: '%Y-%m-%d' }}" /> <meta name="dcterms.Date" content="{{ page.date | date: '%Y-%m-%d' }}" />
<meta name="dcterms.Description" content="{{ page.description }}" /> <meta name="dcterms.Description" content="{{ page.description | xml_escape }}" />
<!-- Facebook --> <!-- Facebook -->
<meta property="og:title" content="{{ page.title }} | {{ site.title }}" /> <meta property="og:title" content="{{ page.title | xml_escape }} | {{ site.title | xml_escape }}" />
<meta property="og:locale" content="en" /> <meta property="og:locale" content="en" />
<meta property="og:description" content="{{ page.description }}" /> <meta property="og:description" content="{{ page.description | xml_escape }}" />
<meta property="og:url" content="{{ site.url }}{{ page.url }}" /> <meta property="og:url" content="{{ site.url }}{{ page.url }}" />
<meta property="og:site_name" content="{{ site.title }}" /> <meta property="og:site_name" content="{{ site.title | xml_escape }}" />
<meta property="og:type" content="webpage" /> <meta property="og:type" content="webpage" />
<meta property="article:published_time" content="{{ page.last_modified_at | date_to_xmlschema }}" /> <meta property="article:published_time" content="{{ page.date | date_to_xmlschema }}" />
<meta property="og:image" content="{{ site.url }}{{ page.image }}" /> <meta property="og:image" content="{{ site.url }}{{ page.image }}" />
<!-- Twitter Card --> <!-- Twitter Card -->
<meta name="twitter:card" content="summary" /> <meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="{{ page.name }} | {{ site.title }}" /> <meta name="twitter:title" content="{{ page.title | xml_escape }} | {{ site.title | xml_escape }}" />
<meta name="twitter:description" content="{{ page.description }}" /> <meta name="twitter:description" content="{{ page.description | xml_escape }}" />
<meta name="twitter:image" content="{{ site.url }}{{ page.image }}" /> <meta name="twitter:image" content="{{ site.url }}{{ page.image }}" />
{% endif %}
<script type='application/ld+json'> <script type='application/ld+json'>
{ {
"@context": "http://www.schema.org", "@context": "http://www.schema.org",
"@type": "Organization", "@type": "Organization",
"name": "{{ site.title }}", "name": "{{ site.title | xml_escape }}",
"url": "{{ site.url }}", "url": "{{ site.url | xml_escape }}",
"sameAs": [ "sameAs": [
{% for social in site.social.links %}"{{ social }}"{% unless forloop.last %},{% endunless %}{% endfor %} {% for social in site.social.links %}"{{ social }}"{% unless forloop.last %},{% endunless %}{% endfor %}
], ],
"logo": "{{ site.url }}{{ site.banner }}", "logo": "{{ site.url }}/siteicon.png",
"image": "{{ site.url }}{{ site.banner }}", "image": "{{ site.url }}{{ page.image }}",
"description": "{{ site.description | strip_html }}", "description": "{{ site.description | xml_escape }}",
"address": { "address": {
"@type": "PostalAddress", "@type": "PostalAddress",
"addressLocality": "{{ site.geo.town }}", "addressLocality": "{{ site.geo.town }}",
@ -208,48 +77,82 @@
} }
</script> </script>
{% else %}
<!-- BEGIN seo.html -->
<title>{{ page.title }} | {{ site.title }}</title>
<meta name="title" content="{{ page.title | xml_escape }} | {{ site.title | xml_escape }}" />
<meta name="description" content="{{ page.description }}" />
<meta name="dc.date.modified" scheme="ISO8601" content="{{ page.last_modified_at | date_to_xmlschema }}" />
<meta name="robots" content="index" />
<link rel="canonical" href="{{ site.url }}{{ page.url }}" />
<link rel="alternate" hreflang="x-default" href="{{ site.url }}{{ page.url }}" />
<meta name="geo.region" content="{{ site.geo.region }}" />
<meta name="geo.placename" content="{{ site.geo.town }}" />
<meta name="geo.position" content="{{ site.geo.lat }};{{ site.geo.long }}" />
<meta name="ICBM" content="{{ site.geo.lat }}, {{ site.geo.long }}" />
<meta name="author" content="{{ site.title }}" />
<meta name="generator" content="Jekyll v4.0.0" />
<!-- Dublin Core basic info -->
<meta name="dcterms.Identifier" content="{{ site.url }}" />
<meta name="dcterms.Format" content="text/html" />
<meta name="dcterms.Relation" content="{{ site.title | xml_escape }}" />
<meta name="dcterms.Publisher" content="{{ site.publisher.name | xml_escape }}" />
<meta name="dcterms.Type" content="text/html" />
<meta name="dcterms.Coverage" content="{{ site.url }}/" />
<meta name="dcterms.Rights" content="Copyright &copy;{{ site.time | date: '%Y' }} {{ site.title }}." />
<meta name="dcterms.Subject" content="{{ page.description | xml_escape }}" />
<meta name="dcterms.Title" content="{{ page.title | xml_escape }}" />
<meta name="dcterms.Contributor" content="{{ site.title | xml_escape }}" />
<meta name="dcterms.Date" content="{{ page.last_modified_at | date: '%Y-%m-%d' }}" />
<meta name="dcterms.Description" content="{{ page.description | xml_escape }}" />
<!-- Facebook -->
<meta property="og:title" content="{{ page.title | xml_escape }} | {{ site.title | xml_escape }}" />
<meta property="og:locale" content="en" />
<meta property="og:description" content="{{ page.description | xml_escape }}" />
<meta property="og:url" content="{{ site.url }}{{ page.url }}" />
<meta property="og:site_name" content="{{ site.title | xml_escape }}" />
<meta property="og:type" content="webpage" />
<meta property="article:published_time" content="{{ page.last_modified_at | date_to_xmlschema }}" />
<meta property="og:image" content="{{ site.url }}{{ page.image }}" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="{{ page.title | xml_escape }} | {{ site.title | xml_escape }}" />
<meta name="twitter:description" content="{{ page.description | xml_escape }}" />
<meta name="twitter:image" content="{{ site.url }}{{ page.image }}" />
{% if page.url == '/radio/' or page.url == '/' %}
<script type='application/ld+json'> <script type='application/ld+json'>
{ {
"@context": "http://www.schema.org", "@context": "http://www.schema.org",
"@type": "RadioStation", "@type": "Organization",
"name": "Basspistol Libre Radio", "name": "{{ site.title | xml_escape }}",
"url": "{{ site.url }}/radio", "url": "{{ site.url | xml_escape }}",
"logo": "{{ site.url }}{{ site.logo }}", "sameAs": [
"image": "{{ site.url }}{{ site.logo }}", {% for social in site.social.links %}"{{ social }}"{% unless forloop.last %},{% endunless %}{% endfor %}
"description": "Unexpected and Impossible Music. Live interventions and special guests. This is Libre music!", ],
"logo": "{{ site.url }}/siteicon.png",
"image": "{{ site.url }}{{ page.image }}",
"description": "{{ site.description | xml_escape }}",
"address": { "address": {
"@type": "PostalAddress", "@type": "PostalAddress",
"addressLocality": "{{ site.geo.town }}", "addressLocality": "{{ site.geo.town }}",
"addressRegion": "{{ site.geo.region }}", "addressRegion": "{{ site.geo.region }}",
"postalCode": "{{ site.geo.postalcode }}", "postalCode": "{{ site.geo.postalcode }}",
"addressCountry": "{{ site.geo.country }}" "addressCountry": "{{ site.geo.country }}"
},
"geo": {
"@type": "GeoCoordinates",
"latitude": "{{ site.geo.lat }}",
"longitude": "{{ site.geo.long }}"
} }
} }
</script>
<script type="text/javascript">
function getData() {
$.getJSON('https://radio.basspistol.com/status-json.xsl', function(json) {
output = "<p>" + "<span style='font-size:14px;'>Now Playing:</span> " + "<br/>";
output += "<strong>" + json.icestats.source[1].title + "</strong> by <strong>" + json.icestats.source[1].artist + "</strong></p>";
output += "<p style='font-size:14px;'>" + json.icestats.source[0].listeners + " peers are listening in MP3 <br />";
output += json.icestats.source[1].listeners + " peers are listening in OGG</p>";
document.getElementById("radioPlaceholder").innerHTML=output;
});
}
setInterval(getData, 7000);
$(function() {
getData();
});
</script> </script>
{% endif %} {% endif %}
<link rel="alternate" type="application/rss+xml" href="{{ site.url}}/feed.xml" title="{{ site.title }}" />
<!-- END seo.html --> <!-- END seo.html -->

251
_includes/streamer.html
View file

@ -1,205 +1,88 @@
{% if page.collection == 'posts' %} {% if page.collection == 'posts' %}
{% if page.category == 'releases' %} {% if page.category == 'releases' %}
{% if page.check_this_if_cannot_be_bought == false %} {% if page.check_this_if_cannot_be_bought == false %}
<section class="streambox" style="padding: 40px;"> <section class="streambox">
<h2 style="text-align: center;display: block;">Get this release</h2> <h2>Get this release</h2>
<div class="streamer">
{% for shop in page.stores %}
{% if shop.download == true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
<p style="text-align: center;display: block;margin-top:40px;">Stream it, follow, like and subscribe!</p>
<div class="streamer">
{% for shop in page.stores %}
{% if shop.download != true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" style="flex: 0 0 45px;margin:10px; font-size: 45px;" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="icon style2 brands {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
{% endif %}
{% endfor %}
</div>
</section>
{% else %}
<section class="streambox" style="padding: 40px;">
<h2 style="text-align: center;display: block;">This release can't be obtained</h2>
<p>Stream, follow, like and subscribe!</p>
<div class="streamer">
{% for shop in site.data.stores %}
{% if shop.download == true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
<h2 style="text-align: center;display: block;">&nbsp;</h2>
<div class="streamer">
{% for shop in site.data.stores %}
{% if shop.download != true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
</section>
{% endif %}
{% else %}
{% if page.check_this_if_cannot_be_bought == false %}
<section class="streambox" style="padding: 40px;">
<h2 style="text-align: center;display: block;">Get this release</h2>
<div class="streamer"> <div class="streamer">
{% for shop in page.stores %} {% for shop in page.stores %}
{% if shop.download == true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a> <a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" title="Stream from {{ shop.name }}" class="icon fab {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
{% endif %}
{% endfor %} {% endfor %}
</div> </div>
</section>
<p style="text-align: center;display: block;margin-top:40px;">Stream it, follow, like and subscribe!</p> {% else %}
<section class="streambox">
<h2>This release can't be obtained</h2>
<p>Stream, follow, like and subscribe!</p>
<div class="streamer"> <div class="streamer">
{% for shop in site.data.stores %}
{% for shop in page.stores %}
{% if shop.download != true %} <a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" title="Stream from {{ shop.name }}" class="icon fab {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" style="flex: 0 0 45px;margin:10px; font-size: 45px;" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="icon style2 brands {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
{% endif %}
{% endfor %} {% endfor %}
</div> </div>
</section> </section>
{% else %} {% endif %}
{% endif %} {% else %}
{% endif %} {% if page.check_this_if_cannot_be_bought == false %}
<section class="streambox">
<h2>Get this release</h2>
<div class="streamer">
{% for shop in page.stores %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" title="Stream from {{ shop.name }}" class="icon fab {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
{% endfor %}
</div>
</section>
{% else %}
{% endif %}
{% endif %}
{% elsif page.collection == 'tracks' %} {% elsif page.collection == 'tracks' %}
<section class="streambox">
<section class="streambox" style="padding: 40px;"> {% for post in site.posts %}
{% if post.album == page.albumSlug %}
{% if post.check_this_if_cannot_be_bought == false %}
{% for post in site.posts %} <h2>Get this track</h2>
{% if post.album == page.albumSlug %} <div class="streamer">
{% if post.check_this_if_cannot_be_bought == false %} {% for shop in post.stores %}
<h2 style="text-align: center;display: block;">Get this track</h2> <a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" title="Stream from {{ shop.name }}" class="icon fab {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
<div class="streamer">
{% for shop in post.stores %} {% endfor %}
{% if shop.download == true %} </div>
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a> {% else %}
<h2>This track can't be obtained</h2>
<p>Stream, follow, like and subscribe!</p>
<div class="streamer">
{% for shop in site.data.stores %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" title="Stream from {{ shop.name }}" class="icon fab {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
{% endfor %}
</div>
{% break %}
{% endif %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</div> </section>
<p style="text-align: center;display: block;margin-top:40px;">Stream it, follow, like and subscribe!</p>
<div class="streamer">
{% for shop in post.stores %}
{% if shop.download != true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" style="flex: 0 0 45px;margin:10px; font-size: 45px;" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="icon style2 brands {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
{% endif %}
{% endfor %}
</div>
{% else %}
<h2 style="text-align: center;display: block;">This track can't be obtained</h2>
<p>Stream, follow, like and subscribe!</p>
<div class="streamer">
{% for shop in site.data.stores %}
{% if shop.download == true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
<h2 style="text-align: center;display: block;">&nbsp;</h2>
<div class="streamer">
{% for shop in site.data.stores %}
{% if shop.download != true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
{% break %}
{% endif %}
{% endif %}
{% endfor %}
</section>
{% elsif page.collection == 'albums' %}
<section class="streambox" style="padding: 40px;">
{% for post in site.posts %}
{% if post.album == page.slug %}
{% if post.check_this_if_cannot_be_bought == false %}
<h2 style="text-align: center;display: block;">Get this album</h2>
<div class="streamer">
{% for shop in post.stores %}
{% if shop.download == true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
<p style="text-align: center;display: block;margin-top:40px;">Stream it, follow, like and subscribe!</p>
<div class="streamer">
{% for shop in post.stores %}
{% if shop.download != true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" style="flex: 0 0 45px;margin:10px; font-size: 45px;" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="icon style2 brands {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
{% endif %}
{% endfor %}
</div>
{% else %}
<h2 style="text-align: center;display: block;">This album can't be obtained</h2>
<p>Stream, follow, like and subscribe!</p>
<div class="streamer">
{% for shop in site.data.stores %}
{% if shop.download == true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
<h2 style="text-align: center;display: block;">&nbsp;</h2>
<div class="streamer">
{% for shop in site.data.stores %}
{% if shop.download != true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
{% break %}
{% endif %}
{% endif %}
{% endfor %}
</section>
{% else %} {% else %}
<section class="streambox" style="padding: 40px;"> <section class="streambox">
<h2 style="text-align: center;display: block;">Support {{ site.title }}</h2> <h2>Support {{ site.title }}</h2>
<p>Stream, follow, like and subscribe!</p> <p>Stream, follow, like and subscribe!</p>
<div class="streamer"> <div class="streamer">
{% for shop in site.data.stores %} {% for shop in site.data.stores %}
{% if shop.download == true %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a>
{% endif %}
{% endfor %}
</div>
<h2 style="text-align: center;display: block;">&nbsp;</h2>
<div class="streamer"> <a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" title="Stream from {{ shop.name }}" class="icon fab {{ shop.icon }}"><span class="label">{{ shop.name }}</span></a>
{% for shop in site.data.stores %}
{% if shop.download != true %} {% endfor %}
<a onclick="_paq.push(['trackEvent', 'StoreLink', '{{ shop.name | remove: " " }}']);" target="_blank" rel="noopener" href="{{ shop.url }}" alt="Stream from {{ shop.name }}" title="Stream from {{ shop.name }}" class="button small icon brands {{ shop.icon }}">{{ shop.name }}</a> </div>
{% endif %} </section>
{% endfor %}
</div>
</section>
{% endif %} {% endif %}

121
_includes/svg/hyperlogo.svg
View file

@ -1,121 +0,0 @@
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg927"
version="1.1"
width="416.57043"
height="91.665543"
viewBox="0 0 110.21759 24.253175">
<g
id="g1355">
<path
id="path825"
d="m 18.776752,19.26664 c -0.84149,-0.23758 -1.5619,-0.48815 -1.6009,-0.55683 -0.13389,-0.23576 1.17519,-6.64433 1.38113,-6.76129 0.1714,-0.0973 2.18286,1.83925 2.58728,2.49098 0.13901,0.22399 -0.53248,5.08585 -0.71688,5.19057 -0.0664,0.0377 -0.80914,-0.12586 -1.65063,-0.36343 z m -7.71412,3.6497 c -0.11943,-0.10151 -0.46471,-0.76441 -0.76727,-1.47311 l -0.55013,-1.28856 3.0905,-1.82263 c 1.69978,-1.00245 3.13215,-1.7493 3.18305,-1.65966 0.16047,0.28255 -0.35523,3.62001 -0.60662,3.9259 -0.46822,0.56974 -4.11797,2.51485 -4.34953,2.31806 z m -6.3649,-3.70632 c -1.25796,-0.50119 -2.32429,-0.97659 -2.36964,-1.05643 -0.0913,-0.16071 1.26536,-2.75645 1.5146,-2.89799 0.1698,-0.0964 5.98831,2.32745 6.40084,2.66648 0.2054,0.1688 -0.0672,0.38679 -1.50386,1.20269 l -1.75474,0.99652 z m 16.18215,-7.2164 c -0.50323,-0.2754 -4.16428,-5.03379 -3.96153,-5.14894 0.032,-0.0182 0.92215,-0.0526 1.97817,-0.0766 l 1.92003,-0.0436 1.47937,1.66712 c 1.05116,1.18456 1.45442,1.75759 1.39322,1.97969 -0.10705,0.38842 -2.51888,1.78126 -2.80926,1.62235 z M 4.112442,13.68166 2.484422,12.9594 1.886542,10.71411 C 1.557712,9.4792 1.304552,8.41117 1.323962,8.34071 c 0.0194,-0.0705 0.75331,-0.23119 1.63087,-0.35719 1.75007,-0.25126 1.80708,-0.21501 2.16317,1.37546 0.12108,0.54084 0.41232,1.84403 0.64718,2.89598 0.23486,1.05195 0.32538,1.96581 0.20115,2.0308 -0.12423,0.065 -0.95848,-0.20686 -1.85389,-0.6041 z m 10.30409,-8.18967 c -1.67351,-0.0303 -3.09954,-0.15056 -3.16895,-0.26719 -0.0694,-0.11662 0.30683,-0.87455 0.83608,-1.68429 l 0.96229,-1.47226 2.06111,-0.0348 c 3.31853,-0.0561 3.09724,-0.18375 2.91885,1.68397 -0.084,0.87994 -0.24591,1.6516 -0.35972,1.71482 -0.11384,0.0632 -1.57615,0.0901 -3.24966,0.0598 z m -7.77928,3.31209 c -0.25432,-0.48092 -1.2349,-3.29514 -1.1932,-3.42443 0.15114,-0.46861 2.47205,-4.02087 2.65002,-4.05596 0.21024,-0.0415 2.33773,1.6074 2.54508,1.97252 0.079,0.13916 -3.46469,5.63381 -3.731,5.78505 -0.0526,0.0299 -0.17449,-0.0949 -0.2709,-0.27718 z"
/>
<path
id="path927"
d="m 45.243829,12.21324 q 0,0.0489 -0.01967,0.0782 L 43.1624,14.3532 h -5.071341 q -0.0293,0 -0.07816,-0.0293 -0.03908,-0.0293 -0.03908,-0.0684 v -2.11062 q 0,-0.0197 0.03908,-0.0586 0.03908,-0.0391 0.05864,-0.0391 h 7.07447 q 0.04886,0 0.06842,0.0586 0.0293,0.0586 0.0293,0.1075 z M 40.573114,9.39908 q -0.02931,0 -0.07817,-0.0391 -0.03908,-0.0391 -0.03908,-0.0684 V 7.18097 q 0,-0.0197 0.03908,-0.0586 0.03908,-0.0391 0.05864,-0.0391 h 2.628497 l 2.061759,2.06176 v 2.60895 q 0,0.0293 -0.04886,0.0782 -0.03908,0.0391 -0.06839,0.0391 h -2.07153 q -0.01967,0 -0.07816,-0.0293 -0.04886,-0.0391 -0.04886,-0.0684 V 9.39913 Z M 40.035691,4.60134 h 5.110423 q 0.03908,0 0.06842,0.0489 0.0293,0.0391 0.0293,0.0684 v 2.07153 q 0,0.0197 -0.04886,0.0782 -0.04886,0.0489 -0.06839,0.0489 h -4.836827 v 2.3549 q 0,0.0197 -0.05864,0.0684 -0.04886,0.0489 -0.06839,0.0489 h -2.07153 q -0.02931,0 -0.07816,-0.0293 -0.03908,-0.0293 -0.03908,-0.0684 V 6.66328 Z" />
<path
id="path929"
d="m 45.494679,14.33362 q -0.0097,-0.01 -0.03908,-0.0293 -0.01967,-0.0293 -0.01967,-0.0489 V 12.1448 q 0,-0.0197 0.03908,-0.0586 0.03908,-0.0391 0.05864,-0.0391 h 7.074467 q 0.0391,0 0.0684,0.0489 0.0293,0.0391 0.0293,0.0684 v 2.07153 q 0,0.0293 -0.0489,0.0782 -0.0391,0.0391 -0.0684,0.0391 h -7.03526 q -0.03908,0 -0.05864,-0.0197 z m 4.709797,-5.20813 q 0.0197,0.0197 0.0197,0.0586 0,0.0293 0,0.0489 0,0.0391 -0.0391,0.1075 -0.0293,0.0586 -0.0782,0.0586 h -2.35501 v 2.3549 q 0,0.0197 -0.05864,0.0684 -0.04886,0.0489 -0.06842,0.0489 H 45.5533 q -0.02931,0 -0.07816,-0.0293 -0.03908,-0.0293 -0.03908,-0.0684 V 7.18104 q 0,-0.0197 0.03908,-0.0586 0.03908,-0.0391 0.05864,-0.0391 h 2.618725 z M 45.43605,6.74127 q 0,-0.0197 0,-0.0489 0,-0.0293 0.01967,-0.0489 l 2.042214,-2.04221 h 5.110422 q 0.0391,0 0.0684,0.0489 0.0293,0.0391 0.0293,0.0684 v 2.07153 q 0,0.0293 -0.0489,0.0782 -0.0391,0.0391 -0.0684,0.0391 h -7.035494 q -0.06842,0 -0.09772,-0.0489 -0.01967,-0.0586 -0.01967,-0.11725 z" />
<path
id="path931"
d="m 55.438726,14.33362 q -0.01,-0.01 -0.0391,-0.0293 -0.0197,-0.0293 -0.0197,-0.0489 V 7.18095 q 0,-0.0197 0.0391,-0.0586 0.0391,-0.0391 0.0586,-0.0391 h 2.11062 q 0.0391,0 0.0684,0.0489 0.0293,0.0391 0.0293,0.0684 v 7.03538 q 0,0.0293 -0.0489,0.0782 -0.0391,0.0391 -0.0684,0.0391 h -2.0714 q -0.0391,0 -0.0586,-0.0197 z m 4.7098,-7.69006 q 0.0197,0.0197 0.0197,0.0586 0,0.0293 0,0.0489 0,0.0489 -0.0391,0.10749 -0.0293,0.0489 -0.0782,0.0489 h -7.03539 q -0.0293,0 -0.0782,-0.0293 -0.0391,-0.0293 -0.0391,-0.0684 V 4.69914 q 0,-0.0197 0.0391,-0.0586 0.0391,-0.0391 0.0586,-0.0391 h 5.11042 z" />
<path
id="path933"
d="m 62.900846,14.33362 q -0.01,-0.01 -0.0391,-0.0293 -0.0197,-0.0293 -0.0197,-0.0489 V 7.18095 q 0,-0.0197 0.0391,-0.0586 0.0391,-0.0391 0.0586,-0.0391 h 2.11062 q 0.0391,0 0.0684,0.0489 0.0293,0.0391 0.0293,0.0684 v 7.03538 q 0,0.0293 -0.0489,0.0782 -0.0391,0.0391 -0.0684,0.0391 h -2.07153 q -0.0391,0 -0.0586,-0.0197 z m 4.7098,-7.69006 q 0.0197,0.0197 0.0197,0.0586 0,0.0293 0,0.0489 0,0.0489 -0.0391,0.10749 -0.0293,0.0489 -0.0782,0.0489 h -7.03538 q -0.0293,0 -0.0782,-0.0293 -0.0391,-0.0293 -0.0391,-0.0684 V 4.69914 q 0,-0.0197 0.0391,-0.0586 0.0391,-0.0391 0.0586,-0.0391 h 5.11043 z" />
<path
id="path935"
d="m 74.994586,12.03735 q 0.0489,0 0.0684,0.0684 0.0293,0.0684 0.0293,0.1075 0,0.0489 -0.0197,0.0782 l -2.06176,2.06176 h -5.07134 q -0.0293,0 -0.0782,-0.0293 -0.0391,-0.0293 -0.0391,-0.0684 V 7.18104 q 0,-0.0197 0.0391,-0.0586 0.0391,-0.0391 0.0586,-0.0391 h 2.11062 q 0.0293,0 0.0684,0.0489 0.0391,0.0391 0.0391,0.0684 v 4.83683 z m -7.05492,-5.12019 q -0.0684,0 -0.0977,-0.0586 -0.0197,-0.0684 -0.0197,-0.11725 0,-0.0197 0,-0.0489 0,-0.0293 0.0197,-0.0489 l 2.04221,-2.04221 h 5.11043 q 0.0391,0 0.0684,0.0489 0.0293,0.0391 0.0293,0.0684 v 7.03539 q 0,0.0293 -0.0489,0.0782 -0.0391,0.0391 -0.0684,0.0391 h -2.07153 q -0.0197,0 -0.0782,-0.0293 -0.0489,-0.0391 -0.0489,-0.0684 V 6.91722 Z" />
<path
d="M 31.960938,2.9921875 C 31.844555,3.0038686 31.755926,3.1017828 31.755859,3.21875 V 4.6074219 H 29.238281 C 29.111919,4.6070424 29.009386,4.709575 29.009766,4.8359375 V 5.625 c -3.8e-4,0.1263625 0.102153,0.2288951 0.228515,0.2285156 h 2.517578 v 1.2324219 h -3.15039 c -0.126363,-3.801e-4 -0.228896,0.1021527 -0.228516,0.2285156 v 0.8125 c -3.8e-4,0.1263629 0.102153,0.2288958 0.228516,0.2285157 h 3.234375 v 4.2343752 c -0.584997,-0.319354 -1.073779,-0.812555 -1.408203,-1.732422 0.09241,-0.52829 0.175541,-1.0770292 0.222656,-1.6660158 0.01054,-0.1250496 -0.08202,-0.23508 -0.207031,-0.2460937 l -0.886719,-0.072266 c -0.12646,-0.010489 -0.237119,0.084361 -0.246094,0.2109375 -0.135017,1.89039 -0.558199,3.344885 -1.429687,4.314454 V 7.6367188 c 0.373879,-0.5048007 0.741434,-1.023037 1.029296,-1.5507813 0.06735,-0.123488 0.0078,-0.2779045 -0.125,-0.3242187 L 27.988281,5.4824219 c -0.104187,-0.03624 -0.21937,0.00737 -0.273437,0.1035156 -0.696612,1.2397318 -1.849185,2.4885894 -2.925782,3.28125 -0.105191,0.077402 -0.123919,0.2272092 -0.04102,0.328125 0.134722,0.1658015 0.415341,0.6143464 0.480469,0.7539063 0.06233,0.1330422 0.232428,0.1731772 0.347656,0.082031 0.34174,-0.2698009 0.672235,-0.6096667 1.003906,-0.9414072 v 5.2578132 c -3.79e-4,0.125601 0.100963,0.227817 0.226563,0.228516 h 0.851562 c 0.1256,-6.99e-4 0.226942,-0.102915 0.226563,-0.228516 v -0.265625 c 0.194918,0.144078 0.464827,0.350485 0.541015,0.433594 0.08868,0.09543 0.23917,0.0972 0.330078,0.0039 0.551829,-0.56309 0.905062,-1.296129 1.205079,-2.091797 0.452628,0.693062 0.967875,1.257003 1.625,1.541016 0.760499,0.328692 1.63416,0.425781 2.609374,0.425781 h 1.931641 c 0.107857,-2.1e-4 0.200789,-0.07602 0.222656,-0.18164 0.04503,-0.213909 0.163827,-0.602259 0.263672,-0.765625 0.09576,-0.154642 -0.01938,-0.353622 -0.201172,-0.347657 -0.397544,0.01155 -1.864653,0.01172 -2.15625,0.01172 -0.387448,0 -0.750891,-0.03168 -1.097656,-0.08008 v -2.0625 h 2.566406 c 0.126363,3.8e-4 0.228896,-0.102153 0.228516,-0.228516 V 9.9375 C 35.952421,9.8119025 35.850208,9.7105611 35.724609,9.7109375 H 33.158203 V 8.3554688 h 3.078125 c 0.1256,-6.989e-4 0.226942,-0.1029148 0.226563,-0.2285157 v -0.8125 C 36.46327,7.1888522 36.361927,7.0866364 36.236328,7.0859375 H 33.074219 V 5.8535156 h 2.589843 C 35.790425,5.8538957 35.892958,5.7513629 35.892578,5.625 V 4.8359375 C 35.892958,4.7095746 35.790425,4.6070418 35.664062,4.6074219 H 33.074219 V 3.21875 C 33.07352,3.0931506 32.971304,2.9918083 32.845703,2.9921875 h -0.863281 c -0.0072,-3.377e-4 -0.01432,-3.377e-4 -0.02148,0 z m -4.34961,0.023437 c -0.07518,0.00329 -0.143893,0.043491 -0.183594,0.1074219 -0.505675,0.8044738 -1.57791,1.8468269 -2.484375,2.4589843 -0.118931,0.079624 -0.135854,0.2478982 -0.03516,0.3496094 0.124901,0.1248938 0.351801,0.4427333 0.470707,0.6210943 0.07154,0.1071241 0.217596,0.1336796 0.322266,0.058594 1.045776,-0.7469829 2.196798,-1.8845904 2.933594,-2.933594 0.08496,-0.1227448 0.0309,-0.2926709 -0.109375,-0.34375 L 27.699219,3.0292969 c -0.02811,-0.010287 -0.05798,-0.014933 -0.08789,-0.013672 z"
id="path925" />
<path
d="m 79.542969,4.4355469 c -0.131457,0.013346 -0.223948,0.1354704 -0.201172,0.265625 0.05751,0.3334207 0.08203,0.7241382 0.08203,1.078125 v 1.8847656 c -1.187925,0.2227552 -2.288455,0.4198441 -2.787108,0.4863281 -0.129992,0.016339 -0.219374,0.1387916 -0.195313,0.2675782 L 76.636719,9.4375 c 0.02395,0.1264335 0.147881,0.2078758 0.273437,0.1796875 0.434852,-0.097842 1.438423,-0.3097079 2.513672,-0.5253906 v 3.3867191 c 0,0.626753 0.120756,1.170353 0.578125,1.521484 0.457369,0.351131 1.170186,0.488281 2.318359,0.488281 1.526641,0 2.752644,-0.09729 3.841797,-0.24414 0.10904,-0.01452 0.19208,-0.104964 0.197266,-0.214844 l 0.04883,-1.042969 c 0.0072,-0.147818 -0.126306,-0.263116 -0.271484,-0.234375 -1.201697,0.228328 -2.347554,0.347656 -3.742188,0.347656 -0.714225,0 -1.119575,-0.07877 -1.300781,-0.199218 -0.0906,-0.06022 -0.138348,-0.124119 -0.175781,-0.228516 -0.03743,-0.104397 -0.05664,-0.253619 -0.05664,-0.449219 V 8.8046875 c 1.010764,-0.2054422 2.03848,-0.4136185 2.839844,-0.5761719 0.53376,-0.108271 0.704917,-0.1434696 0.984375,-0.2011718 -0.424729,0.7306214 -1.041021,1.7093552 -1.777344,2.3769532 -0.112815,0.102343 -0.09519,0.284472 0.03516,0.363281 l 0.84961,0.509766 c 0.09093,0.05473 0.207624,0.03933 0.28125,-0.03711 0.998771,-1.036228 1.947567,-2.5621607 2.511719,-3.5800778 3e-6,-6.5e-4 3e-6,-0.0013 0,-0.00195 0.07695,-0.1429856 0.211309,-0.3490179 0.291015,-0.4628906 0.06976,-0.099439 0.04912,-0.2361357 -0.04688,-0.31055 L 86.113281,6.328125 C 86.040141,6.27106 85.939682,6.264105 85.859375,6.310547 85.755131,6.371328 85.535503,6.4456752 85.279297,6.5039063 84.80162,6.6062362 82.803364,7.0149861 80.861328,7.3945313 V 5.7792969 c 0,-0.3414128 0.02474,-0.7454399 0.08203,-1.078125 0.02358,-0.139003 -0.08362,-0.2657801 -0.224608,-0.265625 h -1.152344 c -0.0078,-4.027e-4 -0.01563,-4.027e-4 -0.02344,0 z"
id="path937" />
<path
d="m 93.927734,6.8261719 c -0.0226,5.865e-4 -0.04498,0.00454 -0.06641,0.011719 L 92.974609,7.140625 c -0.128693,0.043621 -0.190722,0.1895728 -0.132812,0.3125 0.239305,0.5128205 0.809448,2.0899602 0.931641,2.589844 0.03122,0.13145 0.169414,0.206914 0.296874,0.162109 L 94.96875,9.8886719 C 95.083074,9.8484013 95.145769,9.7255882 95.111328,9.609375 94.944591,9.0449828 94.359749,7.4712472 94.144531,6.9648438 94.107852,6.8782717 94.021708,6.8231706 93.927734,6.8261719 Z m 3.333985,0.3515625 c -0.106637,0.010851 -0.191245,0.094645 -0.203125,0.2011718 -0.177,1.5102565 -0.797555,3.0192998 -1.625,4.0332028 -6.71e-4,6.63e-4 -0.0013,0.0013 -0.002,0.002 -0.957777,1.203066 -2.4668,2.10687 -3.828125,2.494141 -0.167251,0.04626 -0.223253,0.255193 -0.101563,0.378906 l 0.800781,0.824219 c 0.06316,0.06534 0.159141,0.08684 0.244141,0.05469 1.392796,-0.534726 2.906436,-1.502185 4.052734,-2.958985 0.898452,-1.123067 1.430629,-2.4488726 1.763672,-3.800781 0.05136,-0.1670755 0.09748,-0.354903 0.179688,-0.6015625 C 98.583285,7.6843909 98.517386,7.554288 98.396484,7.515625 L 97.351562,7.1875 c -0.02899,-0.00923 -0.05954,-0.012552 -0.08984,-0.00977 z m -6.134766,0.2539064 c -0.03069,-9.065e-4 -0.06125,0.00441 -0.08984,0.015625 L 90.138672,7.8007812 C 90.009515,7.8511856 89.955063,8.0043887 90.023438,8.125 c 0.202412,0.3542574 0.887146,2.085369 1.058593,2.679688 0.03658,0.127777 0.174414,0.197145 0.298828,0.15039 l 0.921875,-0.339844 C 92.419992,10.571742 92.480178,10.441776 92.4375,10.324219 92.203262,9.6831847 91.579821,8.1097694 91.326172,7.5644531 91.290305,7.4860021 91.213164,7.434575 91.126953,7.4316408 Z"
id="path939" />
<path
d="m 102.38086,4.421875 c -0.14305,3.925e-4 -0.25027,0.1311197 -0.22266,0.2714844 0.0668,0.3451475 0.0918,0.889798 0.0918,1.21875 v 7.0624996 c 0,0.440767 -0.0243,1.034932 -0.0703,1.404297 -0.0171,0.136149 0.0893,0.25632 0.22656,0.25586 h 1.16406 c 0.13722,4.66e-4 0.24363,-0.119707 0.22657,-0.25586 -0.0461,-0.380619 -0.0723,-1.025459 -0.0723,-1.404297 l -0.01,-3.6660152 c 1.33315,0.438253 3.21551,1.1581242 4.43164,1.8164062 0.12029,0.06517 0.27048,0.01022 0.32032,-0.117188 l 0.41211,-1.0312495 c 0.0434,-0.1095234 -0.004,-0.2340884 -0.10913,-0.2871094 C 107.50079,9.055083 105.31846,8.231509 103.71289,7.734375 V 5.9121094 c 0,-0.343862 0.0476,-0.8648807 0.084,-1.2402344 0.0133,-0.1339388 -0.092,-0.2500683 -0.22657,-0.25 z"
id="path941" />
<path
d="m 26.652537,17.87435 c 0.0093,-0.12957 0.06016,-0.24526 0.120314,-0.32392 0.120313,-0.15271 0.273019,-0.17585 0.39796,-0.17585 0.379451,0 0.52753,0.25451 0.52753,0.52753 0,0.27765 -0.161961,0.40722 -0.259138,0.45812 -0.09718,0.0509 -0.231372,0.074 -0.351686,0.0648 v 0.30542 c 0.120314,-0.005 0.25451,0.0185 0.351686,0.0648 0.236,0.10643 0.305412,0.34243 0.305412,0.51827 0,0.34244 -0.263765,0.62471 -0.606196,0.62471 -0.194353,0 -0.374823,-0.0833 -0.476627,-0.23137 -0.06016,-0.0833 -0.09718,-0.19898 -0.111059,-0.31004 h -0.342431 c 0.0046,0.11106 0.02314,0.21286 0.06941,0.32392 0.166589,0.39796 0.541412,0.53216 0.860706,0.53216 0.527529,0 0.948627,-0.35169 0.948627,-0.93012 0,-0.53216 -0.337804,-0.70337 -0.444235,-0.74502 0.314667,-0.15733 0.397961,-0.46275 0.397961,-0.68486 0,-0.42573 -0.286902,-0.83294 -0.869961,-0.83294 -0.185098,0 -0.513647,0.0416 -0.717255,0.36094 -0.07867,0.12494 -0.134196,0.28227 -0.14345,0.45349 z"
id="path1019" />
<path
d="m 30.971941,20.25286 c 0.245255,0 0.555294,-0.12032 0.791294,-0.46275 0.203608,-0.29616 0.310039,-0.69412 0.310039,-1.13372 0,-0.43961 -0.106431,-0.83757 -0.310039,-1.13373 -0.236,-0.34243 -0.546039,-0.46274 -0.791294,-0.46274 -0.245255,0 -0.555294,0.12031 -0.791294,0.46274 -0.203608,0.29616 -0.310039,0.69412 -0.310039,1.13373 0,0.4396 0.106431,0.83756 0.310039,1.13372 0.236,0.34243 0.546039,0.46275 0.791294,0.46275 z m 0,-2.87828 c 0.157333,0 0.370196,0.0833 0.532157,0.34243 0.166588,0.26377 0.226745,0.61545 0.226745,0.93938 0,0.32392 -0.06016,0.6756 -0.226745,0.93937 -0.161961,0.25914 -0.374824,0.34243 -0.532157,0.34243 -0.157333,0 -0.370196,-0.0833 -0.532157,-0.34243 -0.166588,-0.26377 -0.226745,-0.61545 -0.226745,-0.93937 0,-0.32393 0.06016,-0.67561 0.226745,-0.93938 0.161961,-0.25913 0.374824,-0.34243 0.532157,-0.34243 z"
id="path1021" />
<path
d="m 34.17331,20.19733 h 0.342431 v -3.08651 h -0.680235 l -0.18047,0.32392 h 0.518274 z"
id="path1023" />
<path
d="m 37.246412,20.27137 1.050431,-1.45302 c 0.231372,-0.3193 0.254509,-0.59232 0.254509,-0.708 0,-0.48589 -0.342431,-1.05043 -1.068941,-1.05043 -0.61545,0 -1.059686,0.44423 -1.059686,1.05968 0,0.57381 0.407216,1.01804 0.99953,1.01804 0.09718,0 0.185098,-0.0139 0.273019,-0.0416 l -0.708,0.98565 z m 0.240627,-2.89679 c 0.430353,0 0.721882,0.32392 0.721882,0.73577 0,0.40259 -0.296157,0.71262 -0.717255,0.71262 -0.421098,0 -0.726509,-0.30078 -0.726509,-0.71262 0,-0.41647 0.296157,-0.73577 0.721882,-0.73577 z"
id="path1025" />
<path
d="m 43.928097,18.41576 c -0.09255,-0.0648 -0.291529,-0.1851 -0.596941,-0.1851 -0.592313,0 -1.027293,0.43035 -1.027293,1.01804 0,0.57843 0.430352,1.00416 1.027293,1.00416 0.180471,0 0.402589,-0.0463 0.610824,-0.19898 v -0.39796 c -0.175843,0.21286 -0.421098,0.30078 -0.620078,0.30078 -0.342432,0 -0.675608,-0.24526 -0.675608,-0.71263 0,-0.46737 0.323921,-0.71725 0.680235,-0.71725 0.171216,0 0.425725,0.0648 0.601568,0.2869 z"
id="path1027" />
<path
d="m 45.559605,21.26164 h 0.370196 l 1.411373,-2.9847 h -0.370196 l -0.624706,1.37435 -0.680235,-1.37435 h -0.379451 l 0.883843,1.73992 z"
id="path1029" />
<path
d="m 49.145916,19.92893 c 0.14345,0.1851 0.36094,0.32393 0.67098,0.32393 0.58306,0 0.92087,-0.47663 0.92087,-1.00416 0,-0.51827 -0.33318,-1.01804 -0.93475,-1.01804 -0.13882,0 -0.43035,0.0324 -0.6571,0.31467 v -1.72141 h -0.333173 v 3.37341 h 0.333173 z m 0.62471,0.0278 c -0.39333,0 -0.64322,-0.31929 -0.64322,-0.71263 0,-0.46274 0.32855,-0.71725 0.63859,-0.71725 0.31004,0 0.62934,0.24988 0.62934,0.72188 0,0.38408 -0.236,0.708 -0.62471,0.708 z"
id="path1031" />
<path
d="m 53.784766,19.55411 c -0.0417,0.0926 -0.11106,0.18973 -0.19898,0.26377 -0.11106,0.0925 -0.236,0.13882 -0.39334,0.13882 -0.33317,0 -0.60619,-0.25451 -0.61082,-0.65247 h 1.49467 c 0.009,-0.25451 -0.0602,-0.55067 -0.18048,-0.72188 -0.11568,-0.16659 -0.35168,-0.35169 -0.7265,-0.35169 -0.57844,0 -0.93012,0.44424 -0.93012,1.01804 0,0.71263 0.48588,1.00416 0.94863,1.00416 0.24525,0 0.46274,-0.0787 0.63858,-0.236 0.0972,-0.0879 0.18047,-0.20361 0.236,-0.31004 z m -1.18,-0.52753 c 0.0509,-0.2869 0.28227,-0.49976 0.56455,-0.49976 0.28227,0 0.50901,0.19898 0.56454,0.49976 z"
id="path1033" />
<path
d="m 55.698396,20.19733 h 0.33318 v -1.01341 c 0,-0.31467 0.0555,-0.44424 0.11106,-0.51828 0.0509,-0.0648 0.13419,-0.12031 0.26839,-0.12031 0.0509,0 0.12031,0.0139 0.19435,0.0648 l 0.15734,-0.30078 c -0.0833,-0.0417 -0.19436,-0.0787 -0.29616,-0.0787 -0.25914,0 -0.40259,0.20361 -0.43498,0.25451 v -0.20823 h -0.33318 z"
id="path1035" />
<path
d="m 59.197806,18.57772 c -0.15271,-0.32855 -0.42573,-0.34706 -0.52753,-0.34706 -0.32392,0 -0.55992,0.19898 -0.55992,0.53678 0,0.0972 0.0139,0.18973 0.0879,0.28228 0.0879,0.10643 0.236,0.18047 0.46737,0.28227 0.18047,0.0787 0.31004,0.13883 0.31004,0.3193 0,0.14345 -0.0972,0.30541 -0.31467,0.30541 -0.24062,0 -0.35168,-0.21286 -0.3887,-0.31467 l -0.2869,0.12032 c 0.16196,0.48125 0.59231,0.49051 0.67098,0.49051 0.37019,0 0.66172,-0.22675 0.66172,-0.62934 0,-0.10643 -0.0185,-0.20823 -0.1018,-0.31004 -0.074,-0.0925 -0.20361,-0.18047 -0.48126,-0.29615 -0.21749,-0.0925 -0.31004,-0.1342 -0.31004,-0.27302 0,-0.14808 0.11106,-0.21749 0.23138,-0.21749 0.12494,0 0.22211,0.0833 0.26839,0.19435 z"
id="path1037" />
<path
d="m 61.773596,20.25286 c 0.58306,0 1.01804,-0.42573 1.01804,-1.00879 0,-0.58306 -0.43035,-1.01341 -1.01804,-1.01341 -0.58768,0 -1.01804,0.43035 -1.01804,1.01341 0,0.58306 0.43499,1.00879 1.01804,1.00879 z m 0,-1.72604 c 0.35169,0 0.67561,0.24525 0.67561,0.71725 0,0.46737 -0.32855,0.71263 -0.67561,0.71263 -0.34243,0 -0.6756,-0.24063 -0.6756,-0.71263 0,-0.46737 0.32392,-0.71725 0.6756,-0.71725 z"
id="path1039" />
<path
d="m 64.746776,18.27694 h -0.33317 v 1.15686 c 0,0.236 0.0231,0.41184 0.17584,0.57843 0.17121,0.18047 0.39796,0.24063 0.58769,0.24063 0.18972,0 0.41647,-0.0602 0.58768,-0.24063 0.15271,-0.16659 0.17584,-0.34243 0.17584,-0.57843 v -1.15686 h -0.33317 v 1.11984 c 0,0.13419 0,0.29153 -0.0926,0.41184 -0.0509,0.0648 -0.15271,0.14808 -0.3378,0.14808 -0.1851,0 -0.28691,-0.0833 -0.33781,-0.14808 -0.0926,-0.12031 -0.0926,-0.27765 -0.0926,-0.41184 z"
id="path1041" />
<path
d="m 67.689226,16.82392 v 3.37341 h 0.33318 v -3.37341 z"
id="path1043" />
<path
d="m 75.188236,16.4676 -0.24526,0.10643 c 0.12495,0.17122 0.27765,0.44424 0.3702,0.62934 l -0.0787,-0.0463 c -0.074,0.0278 -0.18047,0.0417 -0.30541,0.0417 h -1.24941 c 0.0324,-0.0555 0.0648,-0.11106 0.0925,-0.16196 0.0463,-0.0879 0.12957,-0.24526 0.20824,-0.36557 l -0.4211,-0.1342 c -0.0278,0.12032 -0.10181,0.28228 -0.14808,0.36557 -0.21286,0.4211 -0.68949,1.11985 -1.48541,1.61498 l 0.31004,0.236 c 0.51827,-0.35631 0.93011,-0.8098 1.22627,-1.22164 h 1.56408 c -0.0926,0.37945 -0.32855,0.87458 -0.62933,1.2818 -0.32393,-0.22675 -0.67098,-0.45349 -0.9764,-0.62933 l -0.24988,0.25913 c 0.29616,0.1851 0.65247,0.42573 0.98102,0.66636 -0.41184,0.44886 -1.00878,0.87458 -1.79082,1.11058 l 0.33317,0.29153 c 0.78204,-0.29615 1.35122,-0.71725 1.76306,-1.17537 0.19436,0.14808 0.36557,0.29153 0.50439,0.41647 l 0.27302,-0.31929 c -0.14807,-0.12032 -0.32854,-0.25914 -0.52753,-0.40259 0.34706,-0.472 0.60157,-1.01804 0.72651,-1.44376 0.0231,-0.074 0.0694,-0.18048 0.10644,-0.24526 l -0.21749,-0.12957 0.24525,-0.11106 c -0.0972,-0.18972 -0.26376,-0.46737 -0.37945,-0.63396 z m 0.50902,-0.1851 -0.24526,0.10181 c 0.12957,0.17584 0.28228,0.43498 0.38408,0.63859 l 0.24988,-0.11106 c -0.0879,-0.17122 -0.26839,-0.46275 -0.3887,-0.62934 z"
id="path1045" />
<path
d="m 77.863236,18.19364 v 0.45349 c 0.14345,-0.0139 0.3887,-0.0231 0.64321,-0.0231 h 2.54047 c 0.20824,0 0.40259,0.0185 0.49514,0.0231 v -0.45349 c -0.1018,0.009 -0.26839,0.0231 -0.49977,0.0231 h -2.53584 c -0.25914,0 -0.50439,-0.0139 -0.64321,-0.0231 z"
id="path1047" />
<path
d="m 85.619166,16.6018 -0.43035,-0.13883 c -0.0278,0.12032 -0.0972,0.28691 -0.14345,0.36557 -0.19898,0.41647 -0.6571,1.08745 -1.45302,1.56408 l 0.31929,0.24063 c 0.5044,-0.3378 0.8931,-0.74965 1.17538,-1.13835 h 1.56407 c -0.0972,0.42109 -0.37945,1.01804 -0.74039,1.44376 -0.4211,0.49051 -0.99953,0.91161 -1.84635,1.16149 l 0.33318,0.30078 c 0.86996,-0.31929 1.42062,-0.74501 1.84172,-1.25866 0.41184,-0.49977 0.69875,-1.12447 0.82369,-1.59184 0.0231,-0.074 0.0694,-0.18047 0.10643,-0.24526 l -0.31004,-0.18972 c -0.074,0.0324 -0.17584,0.0463 -0.30078,0.0463 h -1.25404 c 0.0416,-0.0648 0.0787,-0.12957 0.11106,-0.19435 0.0416,-0.0879 0.12494,-0.24526 0.2036,-0.36557 z"
id="path1049" />
<path
d="m 91.380676,16.49074 h -0.44424 c 0.0185,0.14345 0.0231,0.24988 0.0231,0.34706 v 0.43035 h -1.02266 c -0.16197,0 -0.29616,-0.005 -0.43036,-0.0185 0.0139,0.10181 0.0139,0.25914 0.0139,0.35631 v 0.81444 c 0,0.0879 -0.005,0.21286 -0.0139,0.29615 h 0.40259 c -0.0139,-0.074 -0.0185,-0.19435 -0.0185,-0.27764 v -0.82832 h 2.58675 c -0.0417,0.39796 -0.18973,0.95788 -0.43961,1.35122 -0.28228,0.43498 -0.7913,0.78204 -1.25404,0.93012 -0.14808,0.0555 -0.32392,0.10643 -0.48126,0.12956 l 0.30079,0.34706 c 0.84682,-0.23137 1.48541,-0.70337 1.83247,-1.30957 0.25914,-0.44423 0.39333,-1.02266 0.45349,-1.39286 0.0185,-0.0879 0.0463,-0.20823 0.0694,-0.27765 l -0.24988,-0.15733 c -0.0602,0.0231 -0.14808,0.037 -0.3193,0.037 h -1.03655 v -0.43035 c 0,-0.0972 0.005,-0.20361 0.0278,-0.34706 z"
id="path1051" />
<path
d="m 95.564226,17.80494 v 0.37019 c 0.0972,-0.009 0.24525,-0.0139 0.31929,-0.0139 h 0.85145 v 1.7029 h -1.06431 c -0.10643,0 -0.22675,-0.009 -0.33318,-0.0231 v 0.38871 c 0.11106,-0.009 0.23137,-0.0139 0.33318,-0.0139 h 2.55898 c 0.074,0 0.21749,0.005 0.31004,0.0139 v -0.38871 c -0.0925,0.0139 -0.19898,0.0231 -0.31004,0.0231 h -1.11985 v -1.7029 h 0.90236 c 0.10643,0 0.22674,0.005 0.32855,0.0139 v -0.37019 c -0.0972,0.009 -0.21287,0.0185 -0.32855,0.0185 h -2.12863 c -0.074,0 -0.22212,-0.005 -0.31929,-0.0185 z"
id="path1053" />
<path
d="m 103.86157,16.35192 -0.25451,0.10643 c 0.10644,0.14808 0.24063,0.37482 0.33781,0.55529 -0.0694,0.0139 -0.13883,0.0139 -0.19898,0.0139 h -2.31835 c -0.15271,0 -0.33781,-0.0139 -0.46275,-0.0324 v 0.41184 c 0.11569,-0.005 0.27765,-0.0139 0.45812,-0.0139 h 2.36925 c -0.0648,0.44424 -0.27765,1.08745 -0.60619,1.50855 -0.38871,0.49514 -0.90698,0.88847 -1.80471,1.11059 l 0.31467,0.34706 c 0.84682,-0.26377 1.39749,-0.69412 1.82321,-1.23553 0.36557,-0.47663 0.58769,-1.22165 0.68949,-1.70753 0.0185,-0.0925 0.037,-0.16659 0.0694,-0.23137 l -0.22674,-0.14345 0.17584,-0.0787 c -0.0925,-0.17584 -0.25913,-0.45349 -0.36557,-0.61082 z m 0.59232,-0.12032 -0.25451,0.10643 c 0.12494,0.16196 0.27764,0.42573 0.37945,0.61545 l 0.25451,-0.11105 c -0.0972,-0.17585 -0.26377,-0.45349 -0.37945,-0.61083 z"
id="path1055" />
</g>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 24 KiB

15
_includes/svg/playercontrol.svg
View file

@ -1,15 +0,0 @@
<svg id="remoteControl" version="1.1" viewBox="0 0 151 55" xmlns="http://www.w3.org/2000/svg">
<g fill="#0f0">
<path d="m43.79 44.97c-2.048-0.5781-3.801-1.188-3.896-1.355-0.3258-0.5737 2.86-16.17 3.361-16.45 0.4171-0.2368 5.312 4.476 6.296 6.061 0.3383 0.545-1.296 12.38-1.744 12.63-0.1616 0.09174-1.969-0.3063-4.017-0.8844zm-18.77 8.881c-0.2906-0.247-1.131-1.86-1.867-3.585l-1.339-3.136 7.52-4.435c4.136-2.439 7.622-4.257 7.746-4.039 0.3905 0.6875-0.8644 8.809-1.476 9.553-1.139 1.386-10.02 6.12-10.58 5.641zm-15.49-9.019c-3.061-1.22-5.656-2.376-5.766-2.571-0.2222-0.3911 3.079-6.707 3.686-7.052 0.4132-0.2346 14.57 5.664 15.58 6.489 0.4998 0.4108-0.1635 0.9412-3.659 2.927l-4.27 2.425zm39.38-17.56c-1.225-0.6701-10.13-12.25-9.64-12.53 0.07787-0.04429 2.244-0.128 4.814-0.1864l4.672-0.1061 3.6 4.057c2.558 2.882 3.539 4.277 3.39 4.817-0.2605 0.9452-6.129 4.334-6.836 3.948zm-40.8 4.108-3.962-1.758-1.455-5.464c-0.8002-3.005-1.416-5.604-1.369-5.775 0.04721-0.1716 1.833-0.5626 3.968-0.8692 4.259-0.6114 4.397-0.5232 5.264 3.347 0.2946 1.316 1.003 4.487 1.575 7.047s0.7918 4.784 0.4895 4.942c-0.3023 0.1582-2.332-0.5034-4.511-1.47zm25.07-19.93c-4.072-0.07373-7.542-0.3664-7.711-0.6502-0.1689-0.2838 0.7466-2.128 2.034-4.098l2.342-3.583 5.015-0.08468c8.075-0.1365 7.537-0.4471 7.103 4.098-0.2044 2.141-0.5984 4.019-0.8753 4.173-0.277 0.1538-3.835 0.2192-7.908 0.1455zm-18.93 8.06c-0.6189-1.17-3.005-8.018-2.903-8.333 0.3678-1.14 6.015-9.784 6.448-9.87 0.5116-0.101 5.689 3.911 6.193 4.8 0.1922 0.3386-8.431 13.71-9.079 14.08-0.128 0.07276-0.4246-0.2309-0.6592-0.6745z"/>
<path id="play" d="m23.48 20.4c-0.7423-0.0171-1.353 0.5798-1.354 1.322v11.75c0.0011 1.018 1.103 1.653 1.984 1.145l10.18-5.875c0.8836-0.5089 0.8836-1.784 0-2.293l-10.18-5.875c-0.1921-0.1112-0.409-0.1723-0.6309-0.1777z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" shape-rendering="auto" solid-color="#000000"/>
<path id="pause" d="m25.08 20.4a1.323 1.323 0 0 0-1.322 1.322v11.75a1.323 1.323 0 0 0 1.322 1.322h1.107a1.323 1.323 0 0 0 1.322-1.322v-11.75a1.323 1.323 0 0 0-1.322-1.322zm5.822 0a1.323 1.323 0 0 0-1.324 1.322v11.75a1.323 1.323 0 0 0 1.324 1.322h1.105a1.323 1.323 0 0 0 1.322-1.322v-11.75a1.323 1.323 0 0 0-1.322-1.322z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" shape-rendering="auto" solid-color="#000000"/>
</g>
<g id="rwdButton">
<path id="skipRwd" d="m79.91 12.38-8.592 10.77 3.059 13.43 12.41 5.983 12.41-5.972 3.072-13.43-8.584-10.77zm-0.9978 7.89h1.108a1.323 1.323 0 0 1 1.322 1.322v11.75a1.323 1.323 0 0 1-1.322 1.322h-1.108a1.323 1.323 0 0 1-1.322-1.322v-11.75a1.323 1.323 0 0 1 1.322-1.322zm8.308 0c0.747-0.02382 1.365 0.5752 1.365 1.322v11.75c-0.0021 1.273-1.625 1.809-2.385 0.7872l-4.358-5.877c-0.3461-0.4678-0.3461-1.107 0-1.574l4.358-5.877c0.2403-0.3247 0.616-0.5221 1.02-0.5353zm7.409 0c0.747-0.02382 1.365 0.5752 1.365 1.322v11.75c-0.0021 1.273-1.625 1.809-2.385 0.7872l-4.358-5.877c-0.3461-0.4678-0.3461-1.107 0-1.574l4.358-5.877c0.2403-0.3247 0.616-0.5221 1.02-0.5353z" fill="#0f0" stroke-width=".2646"/>
<rect x="72.4" y="13.44" width="28.33" height="27.86" fill="none"/>
</g>
<g id="ffwButton">
<path id="skipFfw" d="m127.5 12.38-8.594 10.77 3.059 13.43 12.41 5.983 12.41-5.972 3.072-13.43-8.584-10.77zm-0.9555 7.89c0.4038 0.0134 0.7792 0.2107 1.02 0.5353l4.358 5.877c0.3461 0.4678 0.3461 1.107 0 1.574l-4.358 5.877c-0.7597 1.022-2.382 0.4861-2.385-0.7872v-11.75c6e-5 -0.7472 0.6181-1.346 1.365-1.322zm7.409 0c0.4038 0.0134 0.7792 0.2107 1.02 0.5353l4.358 5.877c0.3461 0.4678 0.3461 1.107 0 1.574l-4.358 5.877c-0.7597 1.022-2.383 0.4861-2.385-0.7872v-11.75c7e-5 -0.7472 0.6186-1.346 1.365-1.322zm7.202 0h1.108a1.323 1.323 0 0 1 1.322 1.322v11.75a1.323 1.323 0 0 1-1.322 1.322h-1.108a1.323 1.323 0 0 1-1.322-1.322v-11.75a1.323 1.323 0 0 1 1.322-1.322z" fill="#0f0" stroke-width=".2646"/>
<rect x="120" y="13.45" width="28.33" height="27.86" fill="none"/>
</g>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 3.9 KiB

554
_layouts/album.html
View file

@ -1,300 +1,306 @@
--- ---
lang: en layout: default
--- ---
<!DOCTYPE HTML> <script src="{{ relBase }}/assets/js/jquery-3.5.1.min.js"></script>
<!-- {% include header.html %}
Based on _Story_ by html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Remixed and Jekyllified by Setto
-->
<html lang="{% if page.lang != site.lang %}{{ page.lang }}{% else %}{{ site.lang }}{% endif %}">
<head>
<link type="application/atom+xml" rel="alternate" href="{{ site.url }}/feed.xml" title="{{ site.name }}" /> <section>
{% include seo.html %} <div class="album-player">
{% include relBase.html %} <!-- HERE BEGINS MADNESS -->
<meta charset="utf-8" /> {% for album in site.albums %}
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" /> {% if page.album == album.slug %}
<link rel="stylesheet" href="{{ relBase }}/assets/css/main20200710.css" /> {% assign onetracker = album.tracks | size %}
<link rel="apple-touch-icon" href="{{ site.url }}/apple-touch-icon.png"> <div class="player-wrap">
<link rel="icon" type="image/png" href="{{ site.url }}/touch-icon.png" sizes="192x192">
<link rel="shortcut icon" href="{{ site.url }}{{ site.icon }}" type="image/png" />
<noscript><link rel="stylesheet" href="{{ relBase }}/assets/css/noscript20200710.css" /></noscript>
</head>
<body id="body">
<span id="top" style="display: none;"></span>
<!-- Wrapper -->
<div id="wrapper" class="divided">
<!-- Banner --> <div id="plwrap">
<section <h2>Track list</h2>
class="banner onload-image-fade-in onload-content-fade-right style2 fullscreen content-align-center image-position-center" <ul id="plList">
style="min-height:100vh;"> {% for track in album.tracks %}
<div class="content editable"> <li class="" {% if onetracker == 1 %}style="border-radius: 5px;"{% endif %}>
<h1 class="editable">{{ page.title }}</h1> <div class="plItem">
<p>by <strong>{{ page.artists }}</strong> <div class="plNum">{{ track.common.track.no }}.</div>
<br />{{ page.date | date: '%Y' }} <div class="plTitle">{{ track.common.title }}</div>
</p> <div class="plLength">
<ul class="actions stacked"> {% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}
<li><a href="#moe" class="button small smooth-scroll icon solid fa-volume-up">Listen</a></li>
</ul>
</div>
<div class="image">
<img src="{{ page.cover }}" alt="{{ page.title }}" />
</div>
</section>
<!-- Content -->
<section class="wrapper style1 align-center">
<div class="inner" style="padding-top: 40px;">
<div class="index align-left">
<!-- Author -->
<section style="padding-top:40px;" id="moe">
{% include author.html %}
<!-- Content -->
<div class="content">
<!-- HERE BEGINS MADNESS -->
<!-- Content -->
<div class="content">
<div id="mainwrap">
<div id="nowPlay">
<p class="right" id="npTitle" style="font-weight: bold;"></p>
<p class="left" id="npAction">Paused...</p>
</div>
<div id="audiowrap">
<div id="audio0">
<audio id="audio1" preload="metadata" controls="controls">Your browser does not support HTML5
Audio!</audio>
</div>{% assign onetracker = page.tracks | size %}
{% if onetracker > 1 %}
<div id="tracks">
<a id="btnPrev"><span class="icon solid fa-fast-backward"></span></a>
<a id="btnNext"><span class="icon solid fa-fast-forward"></span></a>
</div>
{% endif %}
</div>
<div id="plwrap">
<ul id="plList">
{% for track in page.tracks %}
<li class="">
<div class="plItem">
<div class="plNum">{{ track.common.track.no }}.</div>
<div class="plTitle">{{ track.common.title }}</div>
<div class="plLength">{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}</div>
</div>
</li>
{% endfor %}
</ul>
</div>
</div>
<div id="noJSalbum">
{% for track in page.tracks %}
<div class="plItem">
<div class="plNum">{{ track.common.track.no }}.</div>
<div class="plTitle"><a href="{{ track.audio }}">{{ track.common.title }} </a></div>
<div class="plLength">{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}</div>
</div>
{% endfor %}
</div>
</div>
<div class="content" style="font-size: 16px;margin-top:60px;">
{{ content }}
<p>{{ page.credits }}</p>
</div> </div>
</div> </div>
</section> </li>
</div> {% endfor %}
</div>
</section>
<!-- HERE ENDS MADNESS -->
{% include streamer.html %}
<section class="wrapper style1 align-center">
<div class="inner">
<h2>Track list</h2>
<p>Use thses pages to share one song in particular</p>
</div>
</section>
{% for track in page.tracks %}
<section
class="spotlight style4 orient-{% cycle 'left', 'right' %} content-align-{% cycle 'right', 'left' %} image-position-center onscroll-image-fade-in"
{% if forloop.index == 1 %}style="box-shadow: none;" {% endif %}>
<div class="content">
<h3>{{ track.common.title }}</h3>
<p>
{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}
<br /><strong>{{ track.common.genre }}</strong>
<br />{{ track.common.year }}</p>
<ul class="actions stacked">
<li><a href="{{ relBase }}/tracks/{{ track.slug }}/" class="button small icon solid fa-play">Play</a></li>
</ul> </ul>
</div> </div>
<div class="image"> </div>
<img src="{{ track.cover }}" alt="{{ track.common.title }}" /> <div class="noJSalbum">
<div class="coverartwrapper">
<div class="coverartwrapped" style="background-image: url({{ page.image }});"></div>
</div> </div>
{% for track in album.tracks %}
<div class="plItem">
<div class="plNum">{{ track.common.track.no }}.</div>
<div class="plTitle"><a href="{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.mp3" target="_blank"
rel="noopener">{{ track.common.title }} </a></div>
<div class="plLength">
{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}
</div>
</div>
{% endfor %}
</div>
<div class="coverart">
<div class="coverartwrapper">
<div id="npImage" class="coverartwrapped"></div>
</div>
{% assign author_id = page.author | prepend: "/authors/" | append: "/" %}
{% assign author = site.authors | where: "url", author_id | first %}
<div id="author">
<div class="bio">
<p><a href="mailto:{{ author.email }}"><strong>{{ author.name }}</strong></a></p>
<p>{{ author.position }}{% if author.gpg != nil %} | <a target="_blank" rel="noopener"
href="{{ author.gpg }}">GPG</a>{% endif %}</p>
<p class="date">
Published the
{% include dates.html %}
</p>
<h6>
Share this page:
</h6>
<ul>
<a target="_blank" rel="nofollow noopener" title="Share to facebook" alt="Share to facebook"
href="https://touch.facebook.com/sharer.php?u={{ site.url }}{{ page.url | xml_escape }}&amp;quote={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}%20via%20{{ site.url }}"
class="icon smaller fab fa-facebook-f"><span class="label">Facebook</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to twitter" alt="Share to twitter"
href="https://twitter.com/share?url={{ site.url }}{{ page.url | xml_escape }}&amp;text={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}%20&amp;hashtags=basspistol"
class="icon smaller fab fa-twitter"><span class="label">Twitter</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to telegram" alt="Share to telgram"
href="https://telegram.me/share/url?url={{ site.url }}{{ page.url }}&amp;text={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}"
class="icon smaller fab fa-telegram"><span class="label ">Telegram</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to reddit" alt="Share to reddit"
href="https://reddit.com/submit/?url={{ site.url }}{{ page.url }}&amp;title={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}"
class="icon smaller fab fa-reddit"><span class="label">Reddit</span></a>
</ul>
</div>
</div>
</div>
</div>
</section>
<section class="info">
<div class="container">
{{ content }}
</div>
</section>
<div id="fixedPlayer" class="showplayer hideplayer">
<div id="audiowrap">
<div id="audio0">
<audio id="audio1" preload="metadata" controls="controls">
Your browser does not support HTML5 Audio!
</audio>
</div>
</div>
<div id="nowPlay">
{% if onetracker > 1 %}
<div id="tracks">
<a id="btnPrev"><span class="fas fa-fast-backward"></span></a>
<a id="btnNext"><span class="fas fa-fast-forward"></span></a>
</div>
{% endif %}
<p class="right" id="npTitle" style="font-weight: bold;"></p>
<p class="left" id="npAction">Paused...</p>
</div>
</div>
{% include streamer.html %}
{% if onetracker > 1 %}
<!-- Tracks -->
{% for track in album.tracks %}
<section class="track-picker">
<div class="full-image" style="background-image:url({{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.jpeg);">
</div>
<div>
<h2>{{ track.common.title }}</h2>
<p>
{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}
| <strong>{{ track.common.genre }}</strong></p>
<p>{{ track.common.year }}</p>
<p><a href="{{ relBase }}/albums/{{ track.slug }}/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section> </section>
{% endfor %} {% endfor %}
<!-- END Tracks -->
{% endif %}
{% break %} {% endif %} {% endfor %}
<!-- HERE ENDS MADNESS -->
<!-- post Naviation -->
<section class="post-navigation">
<section class="wrapper style1 align-center"> {% if page.previous.url or page.next.url %}
<div class="inner">
<div class="index align-left">
<!-- Author -->
<section> <h2>Check out more</h2>
<div class="post-nav">
<!-- Content --> {% if page.previous.url %}
<div class="content"> <h3><a href="{{page.previous.url}}" alt="Read {{page.previous.title}}" title="Read {{page.previous.title}}"><span
<!-- post Naviation --> class="fas fa-arrow-left"></span>&nbsp;{{page.previous.title}}</a></h3>
<div style="text-align: center;"> <p>{{ page.previous.description }}</p>
<h3>More releases</h3>
</div> {% endif %}
<div class="post-nav"> </div>
<div> <div class="post-nav-next">
{% if page.previous.url and page.lang == page.previous.lang %} {% if page.next.url%}
<h4><a href="{{page.previous.url}}" alt="Read {{page.previous.title}}" title="Read {{page.previous.title}}"><i class="fas fa-arrow-left"></i></a> <a
href="{{page.previous.url}}">&nbsp;{{page.previous.title}}</a></h4> <h3><a href="{{page.next.url}}">{{page.next.title}}&nbsp;<span class="fas fa-arrow-right"></span></a></h3>
<p style="margin-right: 20px">{{ page.previous.description }}</p> <p>{{ page.next.description }}</p>
{% endif %}
</div> {% endif %}
<div class="post-nav-next">
{% if page.next.url and page.lang == page.next.lang %}
<h4><a href="{{page.next.url}}">&nbsp;{{page.next.title}}</a> <a href="{{page.next.url}}" alt="Read {{page.next.title}}" title="Read {{page.next.title}}"><i
class="fas fa-arrow-right"></i></a></h4>
<p style="margin-left: 20px">{{ page.next.description }}</p>
{% endif %}
</div>
</div>
<!-- End Post Navigation -->
</div>
</section>
</div>
</div>
</section>
{% include footer.html %}
</div> </div>
{% include navigation.html %}
{% include scripts.html %}
<script type="text/javascript">
// html5media enables <video> and <audio> tags in all major browsers {% endif %}
// External File: http://api.html5media.info/1.1.8/html5media.min.js
// Add user agent as an attribute on the <html> tag...
// Inspiration: http://css-tricks.com/ie-10-specific-styles/ </section>
var b = document.documentElement; <!-- End Post Navigation -->
b.setAttribute('data-useragent', navigator.userAgent);
b.setAttribute('data-platform', navigator.platform);
// HTML5 audio player + playlist controls... <script type="text/javascript">
// Inspiration: http://jonhall.info/how_to/create_a_playlist_for_html5_audio // html5media enables <video> and <audio> tags in all major browsers
// Mythium Archive: https://archive.org/details/mythium/ // External File: http://api.html5media.info/1.1.8/html5media.min.js
jQuery(function ($) {
var supportsAudio = !!document.createElement('audio').canPlayType;
if (supportsAudio) { // Add user agent as an attribute on the <html> tag...
var index = 0, // Inspiration: http://css-tricks.com/ie-10-specific-styles/
playing = false, // var b = document.documentElement;
mediaPath = '', // b.setAttribute('data-useragent', navigator.userAgent);
extension = '', // b.setAttribute('data-platform', navigator.platform);
tracks = [{% for track in page.tracks %}{
"track": {{ track.common.track.no }},
"name": "{{ track.common.title }}", // HTML5 audio player + playlist controls...
"length": "{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{{ round_seconds | minus: leftover_seconds }}", // Inspiration: http://jonhall.info/how_to/create_a_playlist_for_html5_audio
"file": "{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}" // Mythium Archive: https://archive.org/details/mythium/
}{% unless forloop.last %},{% endunless %}{% endfor %}], jQuery(function ($) {
trackCount = tracks.length, var supportsAudio = !!document.createElement('audio').canPlayType;
npAction = $('#npAction'), if (supportsAudio) {
npTitle = $('#npTitle'), var index = 0,
audio = $('#audio1').bind('play', function () { playing = false,
playing = true; mediaPath = '',
npAction.text('Playing...'); extension = '',
}).bind('pause', function () { tracks = [{% for album in site.albums %}{% if page.album == album.slug %}{% for track in album.tracks %}{
playing = false; "track": {{ track.common.track.no }},
npAction.text('Paused...'); "name": "{{ track.common.title }}",
}).bind('ended', function () { "length": "{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{{ round_seconds | minus: leftover_seconds }}",
npAction.text('Paused...'); "file": "{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}",
if ((index + 1) < trackCount) { "image": "{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}"
index++; }{% unless forloop.last %},{% endunless %}{% endfor %}{% break %} {% endif %}{% endfor %}],
loadTrack(index); trackCount = tracks.length,
npAction = $('#npAction'),
npTitle = $('#npTitle'),
npImage = $('#npImage'),
audio = $('#audio1').bind('play', function () {
playing = true;
npAction.text('Playing...');
$('#fixedPlayer').removeClass('hideplayer');
$("#npImage").addClass('spinnit');
}).bind('pause', function () {
playing = false;
npAction.text('Paused...');
$("#npImage").removeClass('spinnit');
}).bind('ended', function () {
npAction.text('Paused...');
if ((index + 1) < trackCount) {
index++;
loadTrack(index);
playTrack(index);
audio.play();
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}).get(0),
btnPrev = $('#btnPrev').click(function () {
if ((index - 1) > -1) {
index--;
loadTrack(index);
playTrack(index);
if (playing) {
audio.play();
}
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}),
btnNext = $('#btnNext').click(function () {
if ((index + 1) < trackCount) {
index++;
loadTrack(index);
playTrack(index);
if (playing) {
audio.play();
}
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}),
li = $('#plList li').click(function () {
var id = parseInt($(this).index());
if (id !== index || playing == false) {
playTrack(id);
}else {
audio.pause();
}
}),
loadTrack = function (id) {
npTitle.text(tracks[id].name);
index = id;
audio.src = mediaPath + tracks[id].file + extension;
$('audio').attr("data-matomo-title", tracks[id].name);
$("#npImage").attr('style', 'background-image:url(' + tracks[id].image + '.jpeg)');
},
playTrack = function (id) {
$('.plSel').removeClass('plSel');
$('#plList li:eq(' + id + ')').addClass('plSel');
loadTrack(id);
audio.play(); audio.play();
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}).get(0),
btnPrev = $('#btnPrev').click(function () {
if ((index - 1) > -1) {
index--;
loadTrack(index);
if (playing) {
audio.play();
}
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}),
btnNext = $('#btnNext').click(function () {
if ((index + 1) < trackCount) {
index++;
loadTrack(index);
if (playing) {
audio.play();
}
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}),
li = $('#plList li').click(function () {
var id = parseInt($(this).index());
if (id !== index) {
playTrack(id);
}
}),
loadTrack = function (id) {
$('.plSel').removeClass('plSel');
$('#plList li:eq(' + id + ')').addClass('plSel');
npTitle.text(tracks[id].name);
index = id;
audio.src = mediaPath + tracks[id].file + extension;
$('audio').attr("data-matomo-title", tracks[id].name);
},
playTrack = function (id) {
loadTrack(id);
audio.play();
};
extension = audio.canPlayType('audio/mpeg') ? '.mp3' : audio.canPlayType('audio/ogg') ? '.ogg' : '';
loadTrack(index);
}
});
</script> };
extension = audio.canPlayType('audio/mpeg') ? '.mp3' : audio.canPlayType('audio/ogg') ? '.ogg' : '';
loadTrack(index);
}
});
{% include cookie-consent.html %} </script>
</body>
</html>

3
_layouts/blog.html
View file

@ -1,3 +0,0 @@
---
layout: default
---

59
_layouts/default.html
View file

@ -2,33 +2,56 @@
--- ---
<!DOCTYPE HTML> <!DOCTYPE HTML>
<!-- <!--
Based on _Story_ by html5up.net | @ajlkn Publikatorized by Sakrecoer
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Remixed and Jekyllified by Setto
--> -->
<html lang="{% if page.lang != site.lang %}{{ page.lang }}{% else %}{{ site.lang }}{% endif %}"> <html lang="{{ site.lang }}">
<head> <head>
{% include seo.html %} {% include seo.html %}
{% include relBase.html %} {% include relBase.html %}
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" />
<link rel="stylesheet" href="{{ relBase }}/assets/css/main20200710.css" /> <link rel="stylesheet" href="{{ relBase }}/assets/css/all.min.css" />
<link rel="stylesheet" href="{{ relBase }}/assets/css/colors.css" />
<link rel="stylesheet" href="{{ relBase }}/assets/css/main-20200812.css" />
<link rel="apple-touch-icon" href="{{ site.url }}/apple-touch-icon.png"> <link rel="apple-touch-icon" href="{{ site.url }}/apple-touch-icon.png">
<link rel="icon" type="image/png" href="{{ site.url }}/touch-icon.png" sizes="192x192"> <link rel="icon" type="image/png" href="{{ site.url }}/touch-icon.png" sizes="192x192">
<link rel="shortcut icon" href="{{ site.url }}{{ site.icon }}" type="image/png" /> <link rel="shortcut icon" href="{{ site.url }}{{ site.icon }}" type="image/png" />
<noscript><link rel="stylesheet" href="{{ relBase }}/assets/css/noscript20200710.css" /></noscript> <noscript><link rel="stylesheet" href="{{ relBase }}/assets/css/noscripts-20200812.css" /></noscript>
<meta name="theme-color" content="{{ site.data.colors.bg }}"/>
</head> </head>
<body id="body"> <body>
<span id="top" style="display: none;"></span> <!-- Wrapper -->
<!-- Wrapper -->
<div id="wrapper" class="divided"> <div id="main-wrapper">
{{ content }}
</div> {{ content }}
{% include navigation.html %} <!-- Footer -->
{% include scripts.html %} {% unless page.collection == 'tracks' or page.url == '/radio/' %}
{% include cookie-consent.html %} {% include footer.html %}
{% endunless %}
<!-- END Footer -->
</div>
<!-- END Wrapper -->
{% unless page.collection == 'traks' %}
{% include navigation.html %}
{% endunless %}
{% include cookie-consent.html %}
{% include scripts.html %}
{% if page.video_path %}
<div class="fullscreen-bg">
<video autoplay muted loop poster="{{ page.image }}" class="fullscreen-bg__video">
<source src="{{ page.video_path }}" type="video/mp4">
</video>
</div>
{% endif %}
</body> </body>
</html> </html>

44
_layouts/page.html
View file

@ -1,43 +1,13 @@
--- ---
layout: default layout: default
--- ---
{% include relBase.html %} {% include relBase.html %}
{% include header.html %}
<!-- Banner --> <section class="info" id="read">
<section class="banner onload-image-fade-in onload-content-fade-right style2 fullscreen content-align-center image-position-center" style="min-height:100vh;"> <div class="info-pages">
{{ content }}
<div class="content">
<h1>{{ page.title }}</h1>
<p>{{ page.description }}</p>
</div>
<div class="image">
<img src="{{ page.image }}" alt="unfound page" />
</div> </div>
</section> </section>
<!-- Content --> {% if page.url == '/fr-fretag/' %}
<section class="wrapper style1 align-center"> {% include contact.html %}
<div class="inner"> {% endif %}
<div class="index align-left">
<!-- Author -->
<section>
{% if page.url != '/cookies/' %}
{% if page.url != '/webcreds/' %}
{% include author.html %}
{% endif %}{% endif %}
<!-- Content -->
<div class="content">
{{ content }}
</div>
</section>
</div>
</div>
</section>
{% include footer.html %}

663
_layouts/post.html
View file

@ -1,404 +1,333 @@
--- ---
layout: default
--- ---
{% if page.category == 'releases' %} {% if page.category == 'releases' %}
<!DOCTYPE HTML> <script src="{{ relBase }}/assets/js/jquery-3.5.1.min.js"></script>
<!-- {% include header.html %}
Based on _Story_ by html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Remixed and Jekyllified by Setto
-->
<html lang="{% if page.lang != site.lang %}{{ page.lang }}{% else %}{{ site.lang }}{% endif %}">
<head>
<link type="application/atom+xml" rel="alternate" href="{{ site.url }}/feed.xml" title="{{ site.name }}" /> <section>
{% include seo.html %} <div class="album-player">
{% include relBase.html %} <!-- HERE BEGINS MADNESS -->
<meta charset="utf-8" /> {% for album in site.albums %}
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" /> {% if page.album == album.slug %}
<link rel="stylesheet" href="{{ relBase }}/assets/css/main20200710.css" /> {% assign onetracker = album.tracks | size %}
<link rel="apple-touch-icon" href="{{ site.url }}/apple-touch-icon.png"> <div class="player-wrap">
<link rel="icon" type="image/png" href="{{ site.url }}/touch-icon.png" sizes="192x192">
<link rel="shortcut icon" href="{{ site.url }}{{ site.icon }}" type="image/png" />
<noscript><link rel="stylesheet" href="{{ relBase }}/assets/css/noscript20200710.css" /></noscript>
</head>
<body id="body">
<span id="top" style="display: none;"></span>
<!-- Wrapper -->
<div id="wrapper" class="divided">
<!-- Banner --> <div id="plwrap">
<section <h2>Track list</h2>
class="banner onload-image-fade-in onload-content-fade-right style2 fullscreen content-align-center image-position-center" <ul id="plList">
style="min-height:100vh;"> {% for track in album.tracks %}
<div class="content editable"> <li class="" {% if onetracker == 1 %}style="border-radius: 5px;"{% endif %}>
<h1 class="editable">{{ page.title }}</h1> <div class="plItem">
<p>{{ page.description }}</p> <div class="plNum">{{ track.common.track.no }}.</div>
<ul class="actions stacked"> <div class="plTitle">{{ track.common.title }}</div>
<li><a href="#moe" class="button small smooth-scroll">cheggit!</a></li> <div class="plLength">
</ul> {% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}
</div>
<div class="image">
<img src="{{ relBase }}{{ page.image }}" alt="{{ page.title }}" class="editable" />
</div>
</section>
<!-- Content -->
<section class="wrapper style1 align-center">
<div class="inner" style="padding-top: 40px;">
<div class="index align-left">
<!-- Author -->
<section style="padding-top:40px;" id="moe">
{% include author.html %}
<!-- Content -->
<div class="content">
<!-- HERE BEGINS MADNESS -->
{% for album in site.albums %}
{% if page.album == album.slug %}
<!-- Content -->
<div class="content">
<div id="mainwrap">
<div id="nowPlay">
<p class="right" id="npTitle" style="font-weight: bold;"></p>
<p class="left" id="npAction">Paused...</p>
</div>
<div id="audiowrap">
<div id="audio0">
<audio id="audio1" preload="metadata" controls="controls">Your browser does not support HTML5
Audio!</audio>
</div>{% assign onetracker = album.tracks | size %}
{% if onetracker > 1 %}
<div id="tracks">
<a id="btnPrev"><span class="icon solid fa-fast-backward"></span></a>
<a id="btnNext"><span class="icon solid fa-fast-forward"></span></a>
</div>
{% endif %}
</div>
<div id="plwrap">
<ul id="plList">
{% for track in album.tracks %}
<li class="">
<div class="plItem">
<div class="plNum">{{ track.common.track.no }}.</div>
<div class="plTitle">{{ track.common.title }}</div>
<div class="plLength">{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}</div>
</div>
</li>
{% endfor %}
</ul>
</div>
</div>
<div id="noJSalbum">
{% for track in album.tracks %}
<div class="plItem">
<div class="plNum">{{ track.common.track.no }}.</div>
<div class="plTitle"><a href="{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.mp3">{{ track.common.title }} </a></div>
<div class="plLength">{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{{ round_seconds | minus: leftover_seconds }}</div>
</div>
{% endfor %}
</div>
</div>
<div class="content" style="font-size: 16px;margin-top:60px;">
{{ content }}
<p>{{ page.credits }}</p>
</div> </div>
</div> </div>
</section> </li>
</div> {% endfor %}
</div>
</section>
{% include streamer.html %}
<!-- Tracks -->
{% for track in album.tracks %}
<section
class="spotlight style4 orient-{% cycle 'left', 'right' %} content-align-left image-position-center onscroll-image-fade-in"
{% if forloop.index == 1 %}style="box-shadow: none;" {% endif %}>
<div class="content">
<h3>{{ track.common.title }}</h3>
<p>
{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{{ round_seconds | minus: leftover_seconds }}
<br /><strong>{{ track.common.genre }}</strong>
<br />{{ track.common.year }}</p>
<ul class="actions stacked">
<li><a href="{{ relBase }}/tracks/{{ track.slug }}/" class="button small icon solid fa-play">Play</a></li>
</ul> </ul>
</div> </div>
<div class="image"> </div>
<img src="{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.jpeg" alt="{{ track.common.title }}" /> <div class="noJSalbum">
<div class="coverartwrapper">
<div class="coverartwrapped" style="background-image: url({{ page.image }});"></div>
</div> </div>
{% for track in album.tracks %}
<div class="plItem">
<div class="plNum">{{ track.common.track.no }}.</div>
<div class="plTitle"><a href="{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.mp3" target="_blank"
rel="noopener">{{ track.common.title }} </a></div>
<div class="plLength">
{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}
</div>
</div>
{% endfor %}
</div>
<div class="coverart">
<div class="coverartwrapper">
<div id="npImage" class="coverartwrapped"></div>
</div>
{% assign author_id = page.author | prepend: "/authors/" | append: "/" %}
{% assign author = site.authors | where: "url", author_id | first %}
<div id="author">
<div class="bio">
<p><a href="mailto:{{ author.email }}"><strong>{{ author.name }}</strong></a></p>
<p>{{ author.position }}{% if author.gpg != nil %} | <a target="_blank" rel="noopener"
href="{{ author.gpg }}">GPG</a>{% endif %}</p>
<p class="date">
Published the
{% include dates.html %}
</p>
<h6>
Share this page:
</h6>
<ul>
<a target="_blank" rel="nofollow noopener" title="Share to facebook" alt="Share to facebook"
href="https://touch.facebook.com/sharer.php?u={{ site.url }}{{ page.url | xml_escape }}&amp;quote={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}%20via%20{{ site.url }}"
class="icon smaller fab fa-facebook-f"><span class="label">Facebook</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to twitter" alt="Share to twitter"
href="https://twitter.com/share?url={{ site.url }}{{ page.url | xml_escape }}&amp;text={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}%20&amp;hashtags=basspistol"
class="icon smaller fab fa-twitter"><span class="label">Twitter</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to telegram" alt="Share to telgram"
href="https://telegram.me/share/url?url={{ site.url }}{{ page.url }}&amp;text={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}"
class="icon smaller fab fa-telegram"><span class="label ">Telegram</span></a>
<a target="_blank" rel="nofollow noopener" title="Share to reddit" alt="Share to reddit"
href="https://reddit.com/submit/?url={{ site.url }}{{ page.url }}&amp;title={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}"
class="icon smaller fab fa-reddit"><span class="label">Reddit</span></a>
</ul>
</div>
</div>
</div>
</div>
</section>
<section class="info">
<div class="container">
{{ content }}
</div>
</section>
<div id="fixedPlayer" class="showplayer hideplayer">
<div id="audiowrap">
<div id="audio0">
<audio id="audio1" preload="metadata" controls="controls">
Your browser does not support HTML5 Audio!
</audio>
</div>
</div>
<div id="nowPlay">
{% if onetracker > 1 %}
<div id="tracks">
<a id="btnPrev"><span class="fas fa-fast-backward"></span></a>
<a id="btnNext"><span class="fas fa-fast-forward"></span></a>
</div>
{% endif %}
<p class="right" id="npTitle" style="font-weight: bold;"></p>
<p class="left" id="npAction">Paused...</p>
</div>
</div>
{% include streamer.html %}
{% if onetracker > 1 %}
<!-- Tracks -->
{% for track in album.tracks %}
<section class="track-picker">
<div class="full-image" style="background-image:url({{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.jpeg);">
</div>
<div>
<h2>{{ track.common.title }}</h2>
<p>
{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}
| <strong>{{ track.common.genre }}</strong></p>
<p>{{ track.common.year }}</p>
<p><a href="{{ relBase }}/tracks/{{ track.slug }}/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section> </section>
{% endfor %} {% endfor %}
<!-- END Tracks --> <!-- END Tracks -->
{% endif %}
{% break %} {% endif %} {% endfor %} {% break %} {% endif %} {% endfor %}
<!-- HERE ENDS MADNESS --> <!-- HERE ENDS MADNESS -->
<section class="wrapper style1 align-center">
<div class="inner">
<div class="index align-left">
<!-- Author -->
<section>
<!-- Content -->
<div class="content">
<!-- post Naviation -->
<div style="text-align: center;">
<h3>{{ site.data.translations[page.lang].post-nav}}</h3>
</div>
<div class="post-nav">
<div>
{% if page.previous.url and page.lang == page.previous.lang %}
<h4><a href="{{page.previous.url}}" alt="Read {{page.previous.title}}" title="Read {{page.previous.title}}"><i class="fas fa-arrow-left"></i></a> <a
href="{{page.previous.url}}">&nbsp;{{page.previous.title}}</a></h4>
<p style="margin-right: 20px">{{ page.previous.description }}</p>
{% endif %}
</div>
<div class="post-nav-next">
{% if page.next.url and page.lang == page.next.lang %}
<h4><a href="{{page.next.url}}">&nbsp;{{page.next.title}}</a> <a href="{{page.next.url}}" alt="Read {{page.next.title}}" title="Read {{page.next.title}}"><i
class="fas fa-arrow-right"></i></a></h4>
<p style="margin-left: 20px">{{ page.next.description }}</p>
{% endif %}
</div>
</div>
<!-- End Post Navigation -->
</div>
</section>
<!-- post Naviation -->
<section >
<div class="post-navigation">
{% if page.previous.url or page.next.url %}
<h2>Check out more</h2>
<div class="post-nav">
{% if page.previous.url %}
<h3><a href="{{page.previous.url}}" alt="Read {{page.previous.title}}" title="Read {{page.previous.title}}"><span
class="fas fa-arrow-left"></span>&nbsp;{{page.previous.title}}</a></h3>
<p>{{ page.previous.description }}</p>
{% endif %}
</div> </div>
<div class="post-nav-next">
{% if page.next.url%}
<h3><a href="{{page.next.url}}">{{page.next.title}}&nbsp;<span class="fas fa-arrow-right"></span></a></h3>
<p>{{ page.next.description }}</p>
{% endif %}
</div>
{% endif %}
</div> </div>
</section> </section>
<!-- End Post Navigation -->
{% include footer.html %} <script type="text/javascript">
</div> // html5media enables <video> and <audio> tags in all major browsers
{% include navigation.html %} // External File: http://api.html5media.info/1.1.8/html5media.min.js
{% include scripts.html %}
<script type="text/javascript"> // Add user agent as an attribute on the <html> tag...
// html5media enables <video> and <audio> tags in all major browsers // Inspiration: http://css-tricks.com/ie-10-specific-styles/
// External File: http://api.html5media.info/1.1.8/html5media.min.js // var b = document.documentElement;
// b.setAttribute('data-useragent', navigator.userAgent);
// b.setAttribute('data-platform', navigator.platform);
// Add user agent as an attribute on the <html> tag... // HTML5 audio player + playlist controls...
// Inspiration: http://css-tricks.com/ie-10-specific-styles/ // Inspiration: http://jonhall.info/how_to/create_a_playlist_for_html5_audio
var b = document.documentElement; // Mythium Archive: https://archive.org/details/mythium/
b.setAttribute('data-useragent', navigator.userAgent); jQuery(function ($) {
b.setAttribute('data-platform', navigator.platform); var supportsAudio = !!document.createElement('audio').canPlayType;
if (supportsAudio) {
var index = 0,
playing = false,
mediaPath = '',
extension = '',
tracks = [{% for album in site.albums %}{% if page.album == album.slug %}{% for track in album.tracks %}{
"track": {{ track.common.track.no }},
"name": "{{ track.common.title }}",
"length": "{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{{ round_seconds | minus: leftover_seconds }}",
"file": "{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}",
"image": "{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}"
}{% unless forloop.last %},{% endunless %}{% endfor %}{% break %} {% endif %}{% endfor %}],
trackCount = tracks.length,
npAction = $('#npAction'),
npTitle = $('#npTitle'),
npImage = $('#npImage'),
audio = $('#audio1').bind('play', function () {
playing = true;
npAction.text('Playing...');
$('#fixedPlayer').removeClass('hideplayer');
$("#npImage").addClass('spinnit');
}).bind('pause', function () {
playing = false;
npAction.text('Paused...');
$("#npImage").removeClass('spinnit');
}).bind('ended', function () {
npAction.text('Paused...');
if ((index + 1) < trackCount) {
index++;
loadTrack(index);
playTrack(index);
audio.play();
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}).get(0),
btnPrev = $('#btnPrev').click(function () {
if ((index - 1) > -1) {
index--;
loadTrack(index);
playTrack(index);
if (playing) {
audio.play();
}
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}),
btnNext = $('#btnNext').click(function () {
if ((index + 1) < trackCount) {
index++;
loadTrack(index);
playTrack(index);
if (playing) {
audio.play();
}
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}),
li = $('#plList li').click(function () {
var id = parseInt($(this).index());
if (id !== index || playing == false) {
playTrack(id);
}else {
audio.pause();
}
}),
loadTrack = function (id) {
npTitle.text(tracks[id].name);
index = id;
audio.src = mediaPath + tracks[id].file + extension;
$('audio').attr("data-matomo-title", tracks[id].name);
$("#npImage").attr('style', 'background-image:url(' + tracks[id].image + '.jpeg)');
// HTML5 audio player + playlist controls...
// Inspiration: http://jonhall.info/how_to/create_a_playlist_for_html5_audio
// Mythium Archive: https://archive.org/details/mythium/ },
jQuery(function ($) { playTrack = function (id) {
var supportsAudio = !!document.createElement('audio').canPlayType; $('.plSel').removeClass('plSel');
if (supportsAudio) { $('#plList li:eq(' + id + ')').addClass('plSel');
var index = 0, loadTrack(id);
playing = false,
mediaPath = '',
extension = '',
tracks = [{% for album in site.albums %}{% if page.album == album.slug %}{% for track in album.tracks %}{
"track": {{ track.common.track.no }},
"name": "{{ track.common.title }}",
"length": "{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{{ round_seconds | minus: leftover_seconds }}",
"file": "{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}"
}{% unless forloop.last %},{% endunless %}{% endfor %}{% break %} {% endif %}{% endfor %}],
trackCount = tracks.length,
npAction = $('#npAction'),
npTitle = $('#npTitle'),
audio = $('#audio1').bind('play', function () {
playing = true;
npAction.text('Playing...');
}).bind('pause', function () {
playing = false;
npAction.text('Paused...');
}).bind('ended', function () {
npAction.text('Paused...');
if ((index + 1) < trackCount) {
index++;
loadTrack(index);
audio.play(); audio.play();
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}).get(0),
btnPrev = $('#btnPrev').click(function () {
if ((index - 1) > -1) {
index--;
loadTrack(index);
if (playing) {
audio.play();
}
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}),
btnNext = $('#btnNext').click(function () {
if ((index + 1) < trackCount) {
index++;
loadTrack(index);
if (playing) {
audio.play();
}
} else {
audio.pause();
index = 0;
loadTrack(index);
}
}),
li = $('#plList li').click(function () {
var id = parseInt($(this).index());
if (id !== index) {
playTrack(id);
}
}),
loadTrack = function (id) {
$('.plSel').removeClass('plSel');
$('#plList li:eq(' + id + ')').addClass('plSel');
npTitle.text(tracks[id].name);
index = id;
audio.src = mediaPath + tracks[id].file + extension;
$('audio').attr("data-matomo-title", tracks[id].name);
},
playTrack = function (id) {
loadTrack(id);
audio.play();
};
extension = audio.canPlayType('audio/mpeg') ? '.mp3' : audio.canPlayType('audio/ogg') ? '.ogg' : '';
loadTrack(index);
}
});
</script> };
extension = audio.canPlayType('audio/mpeg') ? '.mp3' : audio.canPlayType('audio/ogg') ? '.ogg' : '';
loadTrack(index);
}
});
</script>
{% include cookie-consent.html %}
</body>
</html>
{% else %} {% else %}
{% include header.html %}
<!DOCTYPE HTML>
<!-- <section class="info" id="read">
Based on _Story_ by html5up.net | @ajlkn <div class="info-pages">
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) <h1>{{ page.title }}</h1>
Remixed and Jekyllified by Setto {{ content }}
-->
<html lang="{% if page.lang != site.lang %}{{ page.lang }}{% else %}{{ site.lang }}{% endif %}">
<head>
<link type="application/atom+xml" rel="alternate" href="{{ site.url }}/feed.xml" title="{{ site.name }}" />
{% include seo.html %}
{% include relBase.html %}
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" />
<link rel="stylesheet" href="{{ relBase }}/assets/css/main20200710.css" />
<link rel="apple-touch-icon" href="{{ site.url }}/apple-touch-icon.png">
<link rel="icon" type="image/png" href="{{ site.url }}/touch-icon.png" sizes="192x192">
<link rel="shortcut icon" href="{{ site.url }}{{ site.icon }}" type="image/png" />
<noscript><link rel="stylesheet" href="{{ relBase }}/assets/css/noscript20200710.css" /></noscript>
</head>
<body id="body">
<span id="top" style="display: none;"></span>
<!-- Wrapper -->
<div id="wrapper" class="divided">
<!-- Banner -->
<section class="banner onload-image-fade-in onload-content-fade-right style2 fullscreen content-align-center image-position-center" style="min-height:85vh;">
<div class="content">
<h1>{{ page.title }}</h1>
<p>{{ page.description }}</p>
</div>
<div class="image">
<img src="{{ page.image }}" alt="unfound page" />
</div>
</section>
<!-- Content -->
<section class="wrapper style1 align-center">
<div class="inner">
<div class="index align-left">
<!-- Author -->
<section>
{% if page.url != '/cookies/' %}
{% if page.url != '/webcreds/' %}
{% include author.html %}
{% endif %}{% endif %}
<!-- Content -->
<div class="content">
{{ content }}
{% if page.link != nil %}
<ul class="actions stacked">
<li><a href="{{ page.link }}?ref=TheOuthernationalMusicSyndicate" target="_blank" rel="noopener" class="button small icon solid fa-external-link-alt">Let's go!</a></li>
</ul>
{% endif %}
</div>
</section>
</div> </div>
</div> </section>
</section>
{% include streamer.html %}
<section class="wrapper style1 align-center">
<div class="inner">
<div class="index align-left">
<!-- Author -->
<section>
<!-- Content -->
<div class="content">
<!-- post Naviation -->
<div style="text-align: center;">
<h3>{{ site.data.translations[page.lang].post-nav}}</h3>
</div>
<div class="post-nav">
<div>
{% if page.previous.url and page.lang == page.previous.lang %}
<h4><a href="{{page.previous.url}}" alt="Read {{page.previous.title}}" title="Read {{page.previous.title}}"><i class="fas fa-arrow-left"></i></a> <a
href="{{page.previous.url}}">&nbsp;{{page.previous.title}}</a></h4>
<p style="margin-right: 20px">{{ page.previous.description }}</p>
{% endif %}
</div>
<div class="post-nav-next">
{% if page.next.url and page.lang == page.next.lang %}
<h4><a href="{{page.next.url}}">&nbsp;{{page.next.title}}</a> <a href="{{page.next.url}}" alt="Read {{page.next.title}}" title="Read {{page.next.title}}"><i
class="fas fa-arrow-right"></i></a></h4>
<p style="margin-left: 20px">{{ page.next.description }}</p>
{% endif %}
</div>
</div>
<!-- End Post Navigation -->
</div>
</section>
<!-- post Naviation -->
<section >
<div class="post-navigation">
{% if page.previous.url or page.next.url %}
<h2>Check out more</h2>
<div class="post-nav">
{% if page.previous.url %}
<h3><a href="{{page.previous.url}}" alt="Read {{page.previous.title}}" title="Read {{page.previous.title}}"><span
class="fas fa-arrow-left"></span>&nbsp;{{page.previous.title}}</a></h3>
<p>{{ page.previous.description }}</p>
{% endif %}
</div>
<div class="post-nav-next">
{% if page.next.url%}
<h3><a href="{{page.next.url}}">{{page.next.title}}&nbsp;<span class="fas fa-arrow-right"></span></a></h3>
<p>{{ page.next.description }}</p>
{% endif %}
</div>
{% endif %}
</div> </div>
</div> </section>
</section>
{% include footer.html %}
</div>
{% include navigation.html %}
{% include scripts.html %}
{% include cookie-consent.html %}
</body>
</html>
{% endif %} {% endif %}

254
_layouts/track.html
View file

@ -4,124 +4,154 @@ layout: default
{% include relBase.html %} {% include relBase.html %}
<!-- Banner --> <!-- Banner -->
<section {% for album in site.albums %}
class="banner onload-image-fade-in onload-content-fade-right style3 fullscreen content-align-center image-position-center" style="background-image:url('{{ site.mediaurl }}/{{ page.slug }}.jpeg');background-size: cover; background-repeat: no-repeat;"> {% if album.slug == page.albumSlug %}
<div style="z-index:0;position:absolute; top:0; left:0; width:100%;min-height:100%;background-color: rgba(13, 13 ,13, 0.5);"></div> {% assign onetracker = album.tracks | size %}
<div id="mainwrap" class="content" style="z-index:1"> {% endif %}
<h1 style="margin-top:80px">{{ page.common.title }}</h1> {% endfor %}
<p><strong>{% for style in page.common.genre %}{{ style }}{% endfor %}</strong> by <strong>{{ page.common.artist }}</strong>
<br />{{ page.common.year }}
</p>
<p><strong><span id="tracktime"></span></strong><span id="{{ page.common.title | slugify | remove: '-' }}"></span></strong></p> <div id="trackArt">
<section>
<script type="text/javascript"> <div class="coverartwrapper">
var {{ page.common.title | slugify | remove: '-' }}timestamp = {{ page.format.duration | round }}; <div class="coverartwrapped" id="coverart" style="background-image: url({{ site.mediaurl }}/{{ page.slug }}.jpeg);"></div>
var {{ page.common.title | slugify | remove: '-' }}hours = Math.floor({{ page.common.title | slugify | remove: '-' }}timestamp / 60 / 60);
var {{ page.common.title | slugify | remove: '-' }}minutes = Math.floor({{ page.common.title | slugify | remove: '-' }}timestamp / 60) - ({{ page.common.title | slugify | remove: '-' }}hours * 60);
var {{ page.common.title | slugify | remove: '-' }}seconds = {{ page.common.title | slugify | remove: '-' }}timestamp % 60;
var {{ page.common.title | slugify | remove: '-' }}formatted = {{ page.common.title | slugify | remove: '-' }}hours.toString().padStart(2, '0') + ':' + {{ page.common.title | slugify | remove: '-' }}minutes.toString().padStart(2, '0') + ':' + {{ page.common.title | slugify | remove: '-' }}seconds.toString().padStart(2, '0');
var theSpan = document.getElementById("{{ page.common.title | slugify | remove: '-' }}");
theSpan.innerHTML = {{ page.common.title | slugify | remove: '-' }}formatted;
</script>
<ul class="actions stacked">
<li><button id="mu_pause" class="button small icon solid fa-play">Play!</button></li>
</ul>
</div> </div>
<div id="noJSalbum" class="content" style="z-index:1"> <div class="playbutton hideWhenNoJS">
<h1 style="margin-top:80px">{{ page.common.title }}</h1> <a id="mu_pause" class="button">Play!</a>
<p><strong>{% for style in page.common.genre %}{{ style }}{% endfor %}</strong> by <strong>{{ page.common.artist }}</strong> </div>
<br />{{ page.common.year }} <h1>{{ page.common.title }}</h1>
</p>
<p><strong>{% assign round_seconds = page.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}</strong></p>
</p>
<ul class="actions stacked">
<li><a class="button small icon solid fa-play" target="_blank" rel="noopener" href="{{ site.mediaurl }}/{{ page.albumSlug }}/{{ page.trackSlug }}.mp3">Play dat!</a></li>
</ul>
</div>
<div class="image">
<img src="{{ site.mediaurl }}/{{ page.slug }}.jpeg" alt="{{ page.title }} logo" id="coverart" />
</div>
</section> </section>
</div>
<!-- Content -->
<div id="trackInfo">
<section>
<p>{% for style in page.common.genre %}{{ style }}{% endfor %} by <strong>{{ page.common.artist }}</strong></p>
{% for post in site.posts %}
{% if post.album == page.albumSlug %}
<p>From the {{ page.common.year }} {% if onetracker > 1 %}release{% else %}single{% endif %} <a href="{{ relBase }}{{ post.url }}">&quot;{{ page.common.album }}&quot;</a></p>
{% endif %}
{% endfor %}
<p><strong>{% assign round_seconds = page.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }}</strong></p>
{% include author.html %}
<p class="noJSalbum"><a class="button" target="_blank" rel="noopener" href="{{ site.mediaurl }}/{{ page.albumSlug }}/{{ page.trackSlug }}.mp3"><span class="fas fa-play"></span> Play!</a></p>
<!-- Content --> <!-- Content -->
<section class="wrapper style1 align-center">
<div class="inner" style="padding-top:40px"> {% if page.all.UNSYNCEDLYRICS and page.all.USLT %}
<div class="index align-left"> <div class="info">
<section style="padding-top:40px"> <p>
{% include author.html %} {{ page.all.USLT.text | newline_to_br }}
<!-- Content --> </p>
<div class="content">
{% if page.all.UNSYNCEDLYRICS and page.all.USLT %}
<p style="font-size:16px;">
{{ page.all.USLT.text | newline_to_br }}
</p>
{% elsif page.all.USLT and page.all.UNSYNCEDLYRICS == nil %}
<p style="font-size:16px;">
{{ page.all.USLT.text | newline_to_br }}
</p>
{% elsif page.all.UNSYNCEDLYRICS and page.all.USLT == nil %}
<p style="font-size:16px;">
{{ page.all.UNSYNCEDLYRICS | newline_to_br }}
</p>
{% endif %}
<p>
{{ page.all.Comment }}
</p>
</div>
</section>
</div>
</div> </div>
{% elsif page.all.USLT and page.all.UNSYNCEDLYRICS == nil %}
<div class="info">
<p>
{{ page.all.USLT.text | newline_to_br }}
</p>
</div>
{% elsif page.all.UNSYNCEDLYRICS and page.all.USLT == nil %}
<div class="info">
<p>
{{ page.all.UNSYNCEDLYRICS | newline_to_br }}
</p>
</div>
{% endif %}
<p>
{{ page.all.Comment }}
</p>
{% for albumurl in site.posts %}
{% if albumurl.album == page.albumSlug %}
<p><a href="{{ relBase }}{{ albumurl.url }}" class="button">See release page</a></p>
{% endif %}
{% endfor %}
</section> </section>
{% for post in site.posts %} {% for post in site.posts %}
{% if post.album == page.albumSlug %} {% if post.album == page.albumSlug %}
{% include streamer.html %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}
<!-- Page navigation --> <!-- post Naviation -->
<section class="wrapper style1 align-center"> <section class="post-navigation">
<div class="inner">
<div class="index align-left">
<!-- Author -->
<section>
<!-- Content -->
<div class="content">
<!-- post Naviation -->
<div style="text-align: center;">
<h3>Play more songs grom this release</h3>
</div>
<div class="post-nav">
<div>
<h4><a href="{{ relBase }}/tracks/{{ page.previousTrack.slug }}/" alt="Read {{ page.previousTrack.common.title }}" title="Read {{ page.previousTrack.common.title }}"><i class="fas fa-arrow-left"></i></a> <a {% if page.previous.url or page.next.url %}
href="{{ relBase }}/tracks/{{ page.previousTrack.slug }}/">&nbsp;{{ page.previousTrack.common.title }}</a>
</h4>
</div> <h2>Track Navigation</h2>
<div class="post-nav-next">
<h4><a href="{{ relBase }}/tracks/{{ page.nextTrack.slug }}/">&nbsp;{{ page.nextTrack.common.title }}</a> <a <div class="post-nav">
href="{{ relBase }}/tracks/{{ page.nextTrack.slug }}/" alt="Read {{ page.nextTrack.common.title }}" title="Read {{ page.nextTrack.common.title }}"><i class="fas fa-arrow-right"></i></a></h4>
</div> {% if page.previous.url %}
</div> <h4><a href="{{ relBase }}{{ page.previous.url }}" alt="Read {{ page.previous.title }}" title="Read {{ page.previous.title }}"><span
<!-- End Post Navigation --> class="fas fa-arrow-left"></span>&nbsp;Previous</a></h4>
</div> <h3>{{ page.previous.common.title }}</h3>
</section> <p>{{ page.previous.description }}</p>
{% endif %}
</div> </div>
</div> <div class="post-nav-next">
{% if page.next.url%}
<h4><a href="{{ page.next.url }}">Next&nbsp;<span class="fas fa-arrow-right"></span></a></h4>
<h3>{{ page.next.common.title }}</h3>
<p>{{ page.next.description }}</p>
{% endif %}
</div>
{% endif %}
</section> </section>
{% include footer.html %}
<!-- End Post Navigation -->
</div>
<!-- Audio player--> <!-- Audio player-->
<audio autoplay preload="metadata" data-matomo-title="{{ page.common.title }}">
<source src="{{ site.mediaurl }}/{{ page.slug }}.mp3" type="audio/mpeg" ontimeupdate='updateTrackTime(this);' />
<h1>Your browser isn't ready for so much hotness. Use the download-link instead.</h1>.
</audio> <div id="fixedPlayer" class="showplayer hideplayer">
{% include footer.html %} <div id="audiowrap">
<div id="audio0">
<audio controls autoplay preload="metadata" data-matomo-title="{{ page.common.title }}">
<source src="{{ site.mediaurl }}/{{ page.slug }}.mp3" type="audio/mpeg" ontimeupdate='updateTrackTime(this);' />
<h1>Your browser isn't ready for so much hotness. Use the download-link instead.</h1>.
</audio>
</div>
</div>
<div id="nowPlay">
<div id="tracks">
{% if page.previous.url %}
<a id="btnPrev" href="{{ relBase }}{{ page.previous.url }}"><span class="fas fa-fast-backward"></span></a>
{% endif %}
{% if page.next.url %}
<a id="btnNext" href="{{ relBase }}{{ page.next.url }}"><span class="fas fa-fast-forward"></span></a>
{% endif %}
</div>
<p id="npTitle" style="font-weight: bold;">{{ page.common.title }} </p>
</div>
</div>
<script type="text/javascript"> <script type="text/javascript">
function loadUrl(newLocation) { function loadUrl(newLocation) {
@ -132,19 +162,18 @@ layout: default
var mu = document.getElementsByTagName("audio")[0]; var mu = document.getElementsByTagName("audio")[0];
var pauseButton = document.getElementById("mu_pause"); var pauseButton = document.getElementById("mu_pause");
var spincover = document.getElementById("coverart"); var spincover = document.getElementById("coverart");
var fixedplayer = document.getElementById("fixedPlayer");
mu.addEventListener('ended', function () { mu.addEventListener('ended', function () {
// only functional if "loop" is removed // only functional if "loop" is removed
mu.pause(); mu.pause();
mu.currentTime = 0; mu.currentTime = 0;
loadUrl("{{ relBase }}/tracks/{{ page.nextTrack.slug }}/"); return false; loadUrl("{{ relBase }}{{ page.next.url }}"); return false;
}); });
mu.onplaying = function() { mu.onplaying = function() {
pauseButton.innerHTML = "Pause"; pauseButton.innerHTML = "Pause";
pauseButton.classList.remove("fa-play"); fixedplayer.classList.remove("hideplayer");
pauseButton.classList.add("fa-pause");
spincover.classList.add("spinnit");
spincover.classList.remove("paused");
}; };
pauseButton.addEventListener("click", function () { pauseButton.addEventListener("click", function () {
@ -154,21 +183,18 @@ layout: default
} }
else { else {
mu.pause(); mu.pause();
pauseButton.innerHTML = "Resume";
pauseButton.classList.add("fa-play");
pauseButton.classList.remove("fa-pause");
spincover.classList.add("paused");
} }
}); });
mu.addEventListener('playing', function () {
mu.addEventListener('timeupdate', function () { spincover.classList.add("spinnit");
var timestamp = Math.floor(mu.currentTime); spincover.classList.remove("paused");
var hours = Math.floor(timestamp / 60 / 60); });
var minutes = Math.floor(timestamp / 60) - (hours * 60); mu.addEventListener('pause', function () {
var seconds = timestamp % 60; spincover.classList.add("paused");
var formatted = hours.toString().padStart(2, '0') + ':' + minutes.toString().padStart(2, '0') + ':' + seconds.toString().padStart(2, '0'); pauseButton.innerHTML = "Resume";
var thecurrentSpan = document.getElementById("tracktime");
thecurrentSpan.innerHTML = formatted + ' / ';
}); });
</script> </script>

2
_posts/2011-01-07-holyhertzkicknbase.md
View file

@ -34,7 +34,7 @@ stores:
icon: fa-creative-commons-sampling icon: fa-creative-commons-sampling
download: true download: true
--- ---
This record got tremendous attention in the middle east capital cities.A journey from one end of the Kick'N'Base musical genre spectrum to the other, this record was produced during 2010 and was intended for kangaroos and happy ravers. A journey from one end of the Kick'N'Base musical genre spectrum to the other, this record was produced during 2010 and was intended for kangaroos and happy ravers.
<p>Credits</p> <p>Credits</p>
<p>(1) feat science futurst David Apfel<br /> <p>(1) feat science futurst David Apfel<br />

2
_posts/2019-04-02-spark-master-tape.md
View file

@ -13,7 +13,7 @@ description: >-
Paperplattunes and the uncertain future of free publications implicating links Paperplattunes and the uncertain future of free publications implicating links
to data in a semi-regulated data-market is kinda uncertain #SWOUP to data in a semi-regulated data-market is kinda uncertain #SWOUP
uid: sparktapeculrywolverine uid: sparktapeculrywolverine
image: /assets/img/Screenshot at 2019-04-02 17-42-40.png image: '/assets/img/Screenshot-at-2019-04-02-17-42-40.png'
download: download:
link: 'https://smt.xxx/' link: 'https://smt.xxx/'
album: album:

63
_sass/_cookies.scss Normal file
View file

@ -0,0 +1,63 @@
/* cookies */
#cookie-notice {
display: none;
text-align: right;
position: fixed;
bottom: 0;
width: 100%;
background-color: var(--bg);
flex-wrap: wrap;
justify-content: space-evenly;
align-content: center;
align-items: center;
z-index: 10000000;
-webkit-box-shadow: 0px -12px 32px -25px var(--border-alt);
-moz-box-shadow: 0px -12px 32px -25px var(--border-alt);
box-shadow: 0px -12px 32px -25px var(--border-alt);
p {
flex: 1 0 250px;
margin: 40px 20px 40px 40px;
font-size: 1em;
font-family: _font(family);
font-weight: 300;
}
@media only screen and (max-width: 651px) {
p {
text-align: center;
margin: 40px 40px 20px 40px;
}
.yes {
margin: 20px 40px 40px 40px;
}
}
}
.yes {
flex: 0 0 250px;
-moz-transition: all var(--anim-speed) ease-in-out;
-webkit-transition: all var(--anim-speed) ease-in-out;
-ms-transition: all var(--anim-speed) ease-in-out;
transition: all var(--anim-speed) ease-in-out;
text-align: center;
background-position-x: 0%;
background-position-y: 0%;
background-repeat: repeat;
background-attachment: scroll;
background-image: linear-gradient(228deg, var(--accent1-alt), var(--accent2-alt));
background-origin: padding-box;
background-clip: border-box;
background-size: 400% 400%;
-webkit-animation: backgroundBlink 2s ease infinite;
-moz-animation: backgroundBlink 2s ease infinite;
animation: backgroundBlink 2s ease infinite;
margin: 40px 40px 40px 20px;
}
.yes:hover {
// color: #000 !important;
-moz-transition: all var(--anim-speed) ease-in-out;
-webkit-transition: all var(--anim-speed) ease-in-out;
-ms-transition: all var(--anim-speed) ease-in-out;
transition: all var(--anim-speed) ease-in-out;
}

374
_sass/_elements.scss Normal file
View file

@ -0,0 +1,374 @@
// Basic Elements
h1, h2, h3, h4, h5, h6 {
font-family: _font(title);
}
h1 {
font-size: 2.5em;
}
h2 {
font-size: 1.75em;
}
h3 {
font-size: 1.5em;
}
strong {
font-weight: 500;
}
a {
text-decoration-style: wavy;
text-decoration-color: transparent;
color: var(--accent2);
-moz-transition: all var(--anim-speed) ease-in-out, color var(--anim-speed) ease-in-out;
-webkit-transition: all var(--anim-speed) ease-in-out, color var(--anim-speed) ease-in-out;
-ms-transition: all var(--anim-speed) ease-in-out, color var(--anim-speed) ease-in-out;
transition: all var(--anim-speed) ease-in-out, color var(--anim-speed) ease-in-out;
}
a:hover {
color: var(--accent1);
text-decoration-style: wavy;
text-decoration-color: unset;
}
// Buttons
.button {
background-color: var(--accent2);
padding: 1em;
display: inline-block;
border-radius: var(--border-radius);
text-align: center;
text-decoration: none;
text-transform: uppercase;
font-weight: 500;
color: var(--bg);
-webkit-box-shadow: 0px 0px 0px -3px var(--border-alt);
-moz-box-shadow: 0px 0px 0px -3px var(--border-alt);
box-shadow: 0px 0px 0px -3px var(--border-alt);
-webkit-transition: all var(--anim-speed) ease-in-out;
-moz-transition: all var(--anim-speed) ease-in-out;
-ms-transition: all var(--anim-speed) ease-in-out;
transition: all var(--anim-speed) ease-in-out;
}
.button:hover {
background-color: var(--accent1);
color: var(--bg);
-webkit-box-shadow: 0px 11px 10px -3px var(--border-alt);
-moz-box-shadow: 0px 11px 10px -3px var(--border-alt);
box-shadow: 0px 11px 10px -3px var(--border-alt);
-webkit-transition: all var(--anim-speed) ease-in-out;
-moz-transition: all var(--anim-speed) ease-in-out;
-ms-transition: all var(--anim-speed) ease-in-out;
transition: all var(--anim-speed) ease-in-out;
}
.button:active {
-webkit-box-shadow: 0px 0px 0px -3px var(--border-alt);
-moz-box-shadow: 0px 0px 0px -3px var(--border-alt);
box-shadow: 0px 0px 0px -3px var(--border-alt);
}
.normal-section {
display:flex;
flex-wrap: wrap;
justify-content: space-around;
padding: 20px;
-webkit-box-shadow: unset;
-moz-box-shadow: unset;
box-shadow: unset;
h2 {
flex: 0 0 100%;
margin: 20px;
}
p {
margin-top: 20px;
}
ul{
width: 100%;
}
.icon {
flex: 0 0 100px;
margin: 0 0 20px 0;
display: inline-block;
width: 100px;
height: 100px;
border-radius: 200px;
font-size: 40px;
line-height: 100px;
text-align: center;
}
img {
width:100%;
height: 100%;
object-fit: cover;
border-radius: var(--border-radius);
}
}
// icon
.label {
display: none;
}
.icon {
flex: 0 0 45px;
margin:20px;
font-size: 45px;
border-radius: 100px;
width: 100px;
height: 100px;
line-height: 100px;
border: 1px solid var(--accent2);
text-align: center;
text-decoration: none;
-moz-transition: border var(--anim-speed) ease-in-out, color var(--anim-speed) ease-in-out;
-webkit-transition: border var(--anim-speed) ease-in-out, color var(--anim-speed) ease-in-out;
-ms-transition: border var(--anim-speed) ease-in-out, color var(--anim-speed) ease-in-out;
transition: border var(--anim-speed) ease-in-out, color var(--anim-speed) ease-in-out;
}
.icon:hover {
border: 1px solid var(--accent1);
}
.small {
border-radius: 80px;
width: 70px;
height: 70px;
line-height: 70px;
font-size: 45px;
margin-left: 0;
}
.smaller {
border-radius: 30px;
width: 30px;
height: 30px;
line-height: 30px;
font-size: 18px;
margin: 10px 10px 10px 0;
}
// Content Author
#author {
flex: 0 0 280px;
margin: 20px;
.date {
font-size:.85em;
}
.author-image {
margin-right: 10px;
background-repeat: no-repeat;
background-size:cover;
border-radius:150px;
width:150px;
height:150px;
}
}
.info{
padding: 40px;
margin: auto;
.info-pages {
padding-top: 40px;
max-width: var(--max-width);
margin: auto;
}
p {
margin: 20px 0;
}
h2, h3, h4, h5, h6 {
text-align: left;
}
}
.news, .links {
margin-top: 40px;
padding: 0;
display: flex;
flex-wrap: wrap;
h2 {
flex: 0 0 100%;
margin-bottom: 20px;
}
> div {
background-size: cover;
background-repeat: no;
background-position: center center;
flex: 1 1 512px;
min-height: 80vh;
padding: 40px;
box-sizing: border-box;
text-align: left;
}
.description {
h2, p, a {
text-align: center;
}
p {
margin-top: 20px;
}
p:last-child {
margin-bottom: 40px;
}
min-height: unset;
}
}
.news:nth-child(even), .links:nth-child(even) {
flex-direction: row-reverse;
}
.links {
> div {
min-height: unset;
}
}
.linksbg {
background-size: 100%;
background: var(--bg);
background: linear-gradient(180deg, var(--bg) 26%, var(--accent2-alt) 100%);
}
.front-section {
flex-direction: row-reverse;
-webkit-box-shadow: unset;
-moz-box-shadow: unset;
box-shadow: unset;
padding: 0;
display: flex;
flex-wrap: wrap;
p, h1, h2, h3, h4 {
text-align: left;
margin-top: 20px;
max-width: 570px;
}
p:last-child {
margin-bottom: 40px;
}
> div {
background-size: cover;
background-repeat: no;
background-position: center center;
flex: 1 1 380px;
min-height: 50vh;
padding: 20px;
box-sizing: border-box;
text-align: left;
}
.description {
min-height: unset;
}
.container {
max-width: 460px;
margin: 0 20px 0 auto;
}
@media only screen and (max-width: 1080px) {
.container {
margin: 0 20px 0 20px;
}
}
}
.front-section:nth-child(even) {
flex-direction: row;
.container {
margin: 0 auto 0 20px;
}
@media only screen and (max-width: 1000px) {
.container {
margin: 0 20px 0 20px;
}
}
}
.front-section:first-of-type {
margin-top: 40px;
}
.splash {
.container {
display: flex;
flex-wrap: wrap;
padding: 40px;
align-items: flex-start;
max-width: var(--max-width);
margin: auto;
h1, h2 {
font-size: 2em;
}
p, h1, h2, h3, h4 {
text-align: left;
margin-top: 20px;
}
h1:first-child {
margin-top: 0;
}
div {
max-width: unset;
margin: 0;
flex: 1 1 300px;
padding: 0 0 0 80px;
}
.splash-logo {
padding: 0;
margin: 0;
}
@media only screen and (max-width: 759px) {
div {
min-width: 100%;
padding: 20px 0;
}
.splash-logo {
padding: 20px 0;
}
}
}
}
#contact {
padding: 20px;
> div {
max-width: var(--max-width);
margin: auto;
padding: 40px 20px;
}
h2 {
padding-top: 20px;
}
}
.normal-section {
display:flex;
flex-wrap: wrap;
justify-content: space-around;
padding: 20px;
-webkit-box-shadow: unset;
-moz-box-shadow: unset;
box-shadow: unset;
}

125
_sass/_forms.scss Normal file
View file

@ -0,0 +1,125 @@
.textspace {
height: 100px;
}
input, textarea, select {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: var(--border-radius);
box-sizing: border-box;
font-family: _font(family);
font-size: 1em;
}
input[type=submit] {
width: 200px;
background-image: linear-gradient(223deg, var(--accent1), var(--accent2));
background-size: 800% 800%;
-webkit-animation: backgroundBlink 2s ease infinite;
-moz-animation: backgroundBlink 2s ease infinite;
animation: backgroundBlink 2s ease infinite;
color: var(--bg);
padding: 14px 20px;
margin: 8px 0;
border: none;
border-radius: var(--border-radius);
cursor: pointer;
}
input[type=submit]:hover {
background-image: linear-gradient(223deg, var(--accent2),var(--accent1));
background-size: 800% 800%;
-webkit-animation: backgroundBlink 2s ease infinite;
-moz-animation: backgroundBlink 2s ease infinite;
animation: backgroundBlink 2s ease infinite;
}
.contact-info {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
label {
display: none;
}
input {
flex: 1 1 330px;
min-width: 240px;
}
}
/*specific classes related to Checkbox skins*/
/* CSS Created by CSS CHECKBOX */
/**********************************/
/**** www.CSScheckbox.com *********/
/*general styles for all CSS Checkboxes*/
label {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
display: none;
}
input[type=checkbox].css-checkbox {
position: absolute;
overflow: hidden;
clip: rect(0 0 0 0);
height:1px;
width:1px;
margin:-1px;
padding:0;
border:0;
}
input[type=checkbox].css-checkbox + label.css-label {
padding-left:20px;
height:15px;
display:inline-block;
background-repeat:no-repeat;
background-position: 0 0;
font-size:1em;
vertical-align:middle;
cursor:pointer;
}
input[type=checkbox].css-checkbox:checked + label.css-label {
background-position: 0 -15px;
}
.css-label{
background-image:url(/assets/img/check.png);
}
input[type=checkbox].css-checkbox.lrg + label.css-label.lrg {
padding-left:22px;
height:20px;
display:inline-block;
line-height:20px;
background-repeat:no-repeat;
background-position: 0 0;
font-size:1em;
vertical-align:middle;
cursor:pointer;
}
input[type=checkbox].css-checkbox.lrg:checked + label.css-label.lrg{
background-position: 0 -20px;
}

257
_sass/_layout.scss Normal file
View file

@ -0,0 +1,257 @@
html,
body {
margin:0;
padding:0;
background-color: var(--bg);
}
body {
height: 100vh;
width: 100%;
font-family: _font(family);
font-weight: 300;
color: var(--fg);
letter-spacing: _font(kerning);
background-color: var(--bg);
}
#main-wrapper {
display: flex;
flex-wrap: wrap;
width: 100%;
-webkit-transition: filter var(--anim-speed) ease-in;
-moz-transition: filter var(--anim-speed) ease-in;
-ms-transition: filter var(--anim-speed) ease-in-out;
transition: filter var(--anim-speed) ease-in;
z-index: 1;
}
.content-wrapper {
max-width: var(--max-width);
margin: auto;
}
.wrapper {
margin: 20px 40px;
}
.hero {
display: flex;
flex-wrap: wrap;
flex-direction: row;
align-content: center;
background-color: transparent;
justify-content: center;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 40px;
position: relative;
min-height: 80vh;
width: 100vw;
.textcontainer {
background-color: var(--bg-alt);
border-radius: var(--border-radius);
max-width: 700px;
padding: 20px 20px 40px 20px;
}
div {
z-index: 10;
h1, p {
flex: 1 0 100%;
width: 100%;
z-index: 10;
color: var(--fg);
max-width: var(--max-width);
margin-top: 40px;
}
h1 {
font-size: 1.8em;
}
}
.imagecontainer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('../img/vignette.svg');
background-size: 240px;
background-repeat: repeat-x;
background-position: bottom;
z-index: 1;
}
}
section {
.container {
max-width: var(--max-width);
margin: 0 auto;
}
flex: 1 1 100%;
background-color: var(--bg);
-webkit-box-shadow: inset 0px 12px 32px -25px var(--border-alt);
-moz-box-shadow: inset 0px 12px 32px -25px var(--border-alt);
box-shadow: inset 0px 12px 32px -25px var(--border-alt);
z-index: 2;
h2 {
text-align: center;
padding: 40px 0;
}
}
section:first-of-type {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
margin-top:0;
padding-top: 40px;
}
.section-title {
padding: 80px;
}
footer {
width: 100%;
padding: 160px 20px 200px 20px;
background-color: var(--fg);
color: var(--bg);
background-image: url('../img/vignette-footer.svg');
background-size: 400px;
background-repeat: repeat-x;
background-position: top;
box-sizing: border-box;
z-index: 2;
.footframe {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: var(--max-width);
margin: auto;
padding: 20px;
div {
flex: 0 1 300px;
margin-bottom: 80px;
img {
margin: auto;
display: block;
width: 100%;
}
li {
border-bottom: 1px solid var(--bg-alt);
line-height: 2;
font-size: 1.5em;
a {
font-weight: 700;
text-decoration: none;
color: var(--bg)
}
}
}
small {
flex: 0 0 100%;
box-sizing: border-box;
margin: 0;
text-align: center;
font-size: 0.8em;
.label {
display: none;
}
}
}
@media only screen and (max-width: 679px) {
.footframe {
justify-content: center;
div {
flex-grow: 1;
}
}
}
}
.post-navigation {
padding: 80px 0 160px 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: var(--max-width);
margin: 0 auto;
h2 {
flex: 0 0 100%;
margin-top: 40px;
text-align: center;
}
.post-nav, .post-nav-next {
flex: 1 0 250px;
h4 {
font-size: 2em;
justify-self: right;
}
}
.post-nav {
margin: 0 40px 0 0;
}
.post-nav-next {
margin: 0 0 0 40px;
}
}
// album index
.releases {
padding: 80px 0;
.container {
max-width: var(--max-width);
margin: 0 auto;
padding: 40px;
display:flex;
flex-wrap: wrap;
justify-content: space-between;
h2 {
flex: 0 0 100%;
margin: 20px;
}
article {
flex: 0 1 280px;
max-width: 480px;
margin: 20px 0;
}
img {
width:100%;
height: 100%;
object-fit: cover;
border-radius: 5px;
}
}
}
// Streambox
.streambox {
text-align: center;
line-height: 2em;
}
.streamer {
max-width: var(--max-width);
margin: 80px auto;
padding: 0 40px;
text-align: center;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
p {
text-align: center !important;
}
.icon {
flex: 0 0 100px;
margin: 0;
justify-self: center;
}
}

164
_sass/_navigation.scss Normal file
View file

@ -0,0 +1,164 @@
/* NAVIGATION */
#navbar {
z-index: 10000;
display: block;
}
.logo {
filter: blur(20px);
opacity: 0;
text-decoration: none;
position: fixed;
top:0;
width: 100%;
height: 60px;
z-index: 100;
-webkit-transition: all var(--anim-speed) ease-in;
-moz-transition: all var(--anim-speed) ease-in;
-ms-transition: all var(--anim-speed) ease-in;
transition: all var(--anim-speed) ease-in;
background-color: transparent;
background-repeat: no-repeat;
background-position: center center;
background-size: 95% 95%;
-webkit-box-shadow: 0px 12px 32px -25px var(--border-alt);
-moz-box-shadow: 0px 12px 32px -25px var(--border-alt);
box-shadow: 0px 12px 32px -25px var(--border-alt);
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
align-items: center;
> a {
height: 40px;
}
}
.logo:hover {
filter: blur(0px);
opacity: 1;
-webkit-transition: all var(--anim-speed) ease-in;
-moz-transition: all var(--anim-speed) ease-in;
-ms-transition: all var(--anim-speed) ease-in;
transition: all var(--anim-speed) ease-in;
background-color: var(--bg);
}
.sticky {
filter: blur(0px);
opacity: 1;
background-color: var(--bg);
-webkit-transition: all var(--anim-speed) ease-in;
-moz-transition: all var(--anim-speed) ease-in;
-ms-transition: all var(--anim-speed) ease-in;
transition: all var(--anim-speed) ease-in;
}
.navmenu {
margin: 0 40px 0 20px;
font-size: 34px;
color:var(--accent1);
}
nav {
position: absolute;
width: 300px;
max-height: 90vh;
max-width: 90vw;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: var(--bg);
border-radius: var(--border-radius);
display: flex;
flex-wrap: wrap;
ul {
padding: 20px;
width: 100%
}
li {
list-style-type: none;
margin: 20px;
padding: 0;
a {
display: block;
font-size: 14px
}
.button {
display: block;
}
}
}
//.blurredout {
// filter: blur(5px);
// -webkit-transition: filter var(--anim-speed) ease-in;
// -moz-transition: filter var(--anim-speed) ease-in;
// transition: filter var(--anim-speed) ease-in;
// }
.modalDialog {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: var(--bg-alt);
z-index: 10;
opacity:0;
-webkit-transition: opacity var(--anim-speed) ease-in;
-moz-transition: opacity var(--anim-speed) ease-in;
-ms-transition: opacity var(--anim-speed) ease-in;
transition: opacity var(--anim-speed) ease-in;
pointer-events: none;
}
.modalDialog:target {
opacity:1;
pointer-events: auto;
}
.modalDialog > div {
display: flex;
align-items: center;
position: relative;
margin: 100px auto;
padding: 20px;
border-radius: var(--border-radius);
}
.close-button {
background-color: var(--accent2);
color: var(--accent1);
margin: 0 auto;
line-height: 48px;
position: absolute;
right: -12px;
text-align: center;
top: -10px;
width: 48px;
height: 48px;
text-decoration: none;
font-weight: bold;
border-radius: 48px;
-webkit-transition: all var(--anim-speed) ease-in;
-moz-transition: all var(--anim-speed) ease-in;
-ms-transition: all var(--anim-speed) ease-in;
transition: all var(--anim-speed) ease-in;
}
.close-button:hover {
background-color: var(--accent1);
color: var(--accent2);
}
#closearea {
position: fixed;
width: 100%;
height: 100%;
}

39
_sass/_noscripts.scss Normal file
View file

@ -0,0 +1,39 @@
// NAvigation
.logo, #sticky {
filter: blur(0px);
opacity: 1;
background-color: var(--bg);
}
.blurredout {
filter: blur(0px);
opacity: 1;
background-color: var(--bg);
-webkit-transition: all var(--anim-speed) ease-in;
-moz-transition: all var(--anim-speed) ease-in;
-ms-transition: all var(--anim-speed) ease-in;
transition: all var(--anim-speed) ease-in;
}
.hero {
padding-top: 120px;
}
// Player link
.player-wrap {
display: none;
}
.noJSalbum {
display: unset;
flex: 0 1 400px;
border-radius: var(--border-radius);
width: 100%;
}
#fixed-player {
display: unset;
height: unset;
}
.hideWhenNoJS {
display: none;
}

335
_sass/_player.scss Normal file
View file

@ -0,0 +1,335 @@
/* Audio Player Styles
================================================== */
/* Default / Desktop / Firefox */
.album-player {
display: flex;
flex-wrap: wrap;
padding: 0 40px;
justify-content: space-evenly;
flex-direction: row-reverse;
align-items: center;
max-width: var(--max-width);
margin: auto;
> div {
margin: 20px;
}
}
audio {
margin: 0;
width: 100%;
}
.player-wrap {
flex: 1 1 400px;
max-width: 700px;
border-radius: 5px;
width: 100%;
}
#plwrap {
ul {
list-style: none;
padding: 0;
li {
border-top: solid 1px var(--fg-alt);
}
li:first-child {
border-radius: 5px 5px 0 0 ;
}
li:last-child {
border-radius: 0 0 5px 5px;
border-bottom: solid 1px var(--fg-alt);
}
}
}
#audiowrap {
background-color: var(--bg);
margin: 0 auto 0 auto;
}
#plwrap {
margin: 0 auto;
}
#tracks {
flex: 1 0 200px;
min-height: 65px;
position: relative;
text-align: center;
text-decoration: none;
padding-top: 20px;
}
#nowPlay {
display: flex;
width: 100%;
height: 80px;
flex-wrap: unset;
justify-content: flex-start;
align-items: center;
background-color: var(--bg);
}
#npTitle {
flex: 1 1 100%;
margin: 0;
padding: 21px;
}
#npAction {
display: none;
margin: 0;
padding: 21px;
font-size: 12px;
}
#plList {
margin: 0;
}
#plList li {
background-color: var(--bg);
cursor: pointer;
margin: 0;
padding: 21px 0;
border-left: 1px solid var(--fg-alt);
border-right: 1px solid var(--fg-alt);
border-top: 0;
transition: all 400ms ease-in-out;
}
#plList li:hover {
background-color: var(--accent1);
color: var(--bg);
transition: all 400ms ease-in-out;
}
.plItem {
position: relative;
}
.plTitle {
left: 75px;
overflow: hidden;
position: absolute;
right: 65px;
text-overflow: ellipsis;
top: 0;
white-space: nowrap;
font-weight: bold;
padding-right: 10px;
}
.plNum {
padding-left: 21px;
width: 65px;
}
.plLength {
padding-left: 21px;
position: absolute;
right: 21px;
top: 0;
}
.plSel {
background-color: var(--fg-alt)!important;
cursor: pointer!important;
}
.plSel:hover {
background-color: var(--accent1)!important;
}
a[id^="btn"] {
font-size: 1.5em;
color: var(--fg);
cursor: pointer;
margin: 0;
padding: 0 27px 0 21px;
text-decoration: none;
}
a[id^="btn"]::-moz-focus-inner {
border: 0;
padding: 0;
}
.coverart {
flex: 1 1 400px;
justify-content: center;
display: flex;
flex-wrap: wrap;
max-width: 700px;
#author {
margin: 40px 0 0 0;
flex: 1 1 auto;
text-align: center;
}
}
.coverartwrapper {
width: 70%;
padding-top: 70%; /* 1:1 Aspect Ratio */
position: relative; /* If you want text inside of it */
}
.coverartwrapped {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
border-radius: 100%;
padding-bottom: 0;
background-size: cover;
}
.spinnit {
-webkit-animation: infiniteRotate 2s linear infinite; /* Safari */
-moz-animation: infiniteRotate 2s linear infinite;
animation: infiniteRotate 2s linear infinite;
}
.paused {
animation-play-state: paused;
}
.track-picker {
display: flex;
flex-wrap: wrap;
margin:0;
padding:0;
background-color: var(--accent1);
margin: 0;
padding: 0;
min-height: 50vw;
text-align: left;
.button {
background-color: var(--accent1);
color: var(--bg);
}
.button:hover {
background-color: var(--accent2);
color: var(--fg);
}
> div {
flex: 1 1 auto;
width: 50%;
min-width: 280px;
margin: 0;
padding: 0;
background-color: var(--bg);
-webkit-box-shadow: inset 0px 23px 25px -25px var(--border-alt);
-moz-box-shadow: inset 0px 23px 25px -25px var(--border-alt);
box-shadow: inset 0px 23px 25px -25px var(--border-alt);
> h2, p {
text-align: left;
margin: 20px 40px;
}
p:last-child {
margin-bottom: 40px;
}
}
.full-image {
width: 50%;
min-width: 280px;
min-height: 50vw;
background-color: transparent;
background-size: cover;
background-position: center;
}
}
.track-picker:nth-child(even) {
flex-direction: row-reverse;
background-color: var(--accent2);
text-align: right;
.button {
background-color: var(--accent2);
color: var(--fg);
}
.button:hover{
background-color: var(--accent1);
color: var(--bg);
}
> div {
> h2, a, p {
text-align: right;
}
}
}
#fixedPlayer {
background-color: var(--bg);
margin: 0;
padding:0;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 100000;
-webkit-box-shadow: 0px 3px 35px 2px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 3px 35px 2px rgba(0,0,0,0.3);
box-shadow: 0px 3px 35px 2px rgba(0,0,0,0.3);
-webkit-transition: all 400ms ease-in;
-moz-transition: all 400ms ease-in;
transition: all 400ms ease-in;
}
.showplayer {
height: 120px;
}
.hideplayer {
height: 0;
}
@media only screen and (max-width: 559px) {
.track-picker {
background-size: 100%;
.full-image {
min-height: 100vw;
}
}
#nowPlay {
align-items: baseline;
padding-bottom: 20px;
}
#tracks {
flex: 1 0 100px;
width: 100px;
position: relative;
text-align: center;
text-decoration: none;
}
a[id^="btn"] {
font-size: 1em;
color: var(--fg);
cursor: pointer;
margin: 0;
padding: 0 0 0 20px;
text-decoration: none;
}
#npTitle{
font-size: 0.8em;
text-decoration: none;
margin: 0;
padding: 0 0 0 20px;
}
}

452
_sass/_set.scss
View file

@ -1,331 +1,12 @@
//* Cloudcannon *//
/* Animation */
@-webkit-keyframes infiniteRotate {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes infinite-rotate {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes infinite-rotate {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes backgroundBlink {
0%{background-position:73% 0%}
50%{background-position:28% 100%}
100%{background-position:73% 0%}
}
@-moz-keyframes backgroundBlink {
0%{background-position:73% 0%}
50%{background-position:28% 100%}
100%{background-position:73% 0%}
}
@keyframes backgroundBlink {
0%{background-position:73% 0%}
50%{background-position:28% 100%}
100%{background-position:73% 0%}
}
@-webkit-keyframes BackgroundFlow {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@-moz-keyframes BackgroundFlow {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@keyframes BackgroundFlow {
0%{background-position:0% 100%}
50%{background-position:100% 0%}
100%{background-position:0% 100%}
}
.slow-background {
-webkit-animation: BackgroundFlow 200s ease infinite;
-moz-animation: BackgroundFlow 200s ease infinite;
animation: BackgroundFlow 200s ease infinite;
}
.spinnit {
-webkit-animation: infiniteRotate 2s linear infinite; /* Safari */
-moz-animation: infiniteRotate 2s linear infinite;
animation: infiniteRotate 2s linear infinite;
}
.paused {
animation-play-state: paused;
}
/* NAVIGATION */
/* Style the navbar */
#navbar {
z-index: 100000;
}
#logo {
padding:10px;
z-index: 10000;
-webkit-transition: filter 400ms ease-in;
-moz-transition: filter 400ms ease-in;
transition: filter 400ms ease-in;
}
.logo:hover {
filter: blur(0px);
-webkit-transition: filter 400ms ease-in;
-moz-transition: filter 400ms ease-in;
transition: filter 400ms ease-in;
}
.logo {
filter: blur(20px);
text-decoration: none;
position: fixed;
top:20px;
left: 50%;
transform: translateX(-50%);
width: 300px;
height: 95px;
background-color: transparent;
background-repeat: no-repeat;
background-position: center center;
background-size: 95% 95%;
-webkit-transition: all 400ms ease-in;
-moz-transition: all 400ms ease-in;
transition: all 400ms ease-in;
box-shadow: none;
border-radius: 20px;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.sticky {
filter: blur(0px);
-webkit-transition: filter 400ms ease-in;
-moz-transition: filter 400ms ease-in;
transition: filter 400ms ease-in;
background-repeat: no-repeat;
background-position: center center;
background-size: 95% 95%;
-webkit-transition: all 400ms ease-in;
-moz-transition: all 400ms ease-in;
transition: all 400ms ease-in;
}
nav {
position: absolute;
width: 300px;
max-height: 90vh;
max-width: 90vw;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: _palette(bg);
border-radius: 20px;
padding: 20px;
display: flex;
flex-wrap: wrap;
ul {
margin: auto;
width: 100%
}
li {
list-style-type: none;
margin: 10px;
width: 80%;
padding: 0;
a {
width: 100%;
display: block;
margin: auto !important;
font-size: 14px
}
}
}
.blurredout {
filter: blur(5px);
-webkit-transition: filter 400ms ease-in;
-moz-transition: filter 400ms ease-in;
transition: filter 400ms ease-in;
}
#wrapper {
-webkit-transition: filter 400ms ease-in;
-moz-transition: filter 400ms ease-in;
transition: filter 400ms ease-in;
}
.modalDialog {
position: fixed;
font-family: Arial, Helvetica, sans-serif;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: _palette(fg-light);
z-index: 11;
opacity:0;
-webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
pointer-events: none;
}
.modalDialog:target {
opacity:1;
pointer-events: auto;
}
.modalDialog > div {
width: 80%;
max-width: 1100px;
max-height: 80vh;
display: flex;
align-items: center;
position: relative;
margin: 100px auto;
padding: 20px;
border-radius: 3px;
background: rgb(0, 31, 36);
background: -moz-linear-gradient(#000, rgb(0, 31, 36));
background: -webkit-linear-gradient(#000, rgb(0, 31, 36));
background: -o-linear-gradient(#000, rgb(0, 31, 36));
}
.close-button {
background-color: #FFFFFF;
color: _palette(accent-dark);
line-height: 48px;
position: absolute;
right: -12px;
text-align: center;
top: -10px;
width: 48px;
height: 48px;
text-decoration: none;
font-weight: bold;
-webkit-border-radius: 48px;
-moz-border-radius: 48px;
border-radius: 48px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
transition: all 400ms ease-in;
}
.close-button:hover {
background-color: _palette(accent);
color: #FFFFFF;
}
#closearea {
position: fixed;
width: 100%;
height: 100%;
}
//* POSTS *//
#post-text {
padding-top: 1rem;
}
//* FOOTER *//
#footer {
background-color: _palette(fg);
color: _palette(bg);
box-shadow: inset 0 10px 10px 0 rgba(0, 45, 107, 0.25) !important;
h1, h2, h3, h4, h5, p, a, strong {
color: _palette(bg);
}
a {
text-decoration: none;
}
.footflex {
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
div {
text-align: left;
flex: 0 1 300px;
max-width: 300px;
margin: 80px 80px 0 80px;
ul {
margin: 0;
padding: 0;
}
li {
list-style: none;
border-bottom: 1px solid _palette(bg);
line-height: 3em;
margin: 0;
padding: 0;
}
}
}
.style2 {
&:before {
box-shadow: inset 0 0 0 _size(border-width) _palette(bg);
}
}
.style2:hover {
&:before {
box-shadow: inset 0 0 0 _size(border-width) _palette(accent);
}
}
}
/* AUTHOR */
#author {
.bio {
padding-right: 20px;
}
}
/* Content images */
div.content {
img {
width: 100%;
height: auto;
}
}
/* Cloudcannon editor links */
.editor-link { .editor-link {
display: none; display: none;
margin-top: 0; margin-top: 0;
padding-top: 30px; padding-top: 30px;
.btn { .btn {
border: 0; border: 0;
border-radius: 2px; border-radius: var(--border-radius);
width: 100%; width: 100%;
max-width: 500px; max-width: 500px;
box-sizing: border-box; box-sizing: border-box;
@ -337,7 +18,6 @@ div.content {
background-color: #f7e064; background-color: #f7e064;
color: #333; color: #333;
box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2); box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2);
&:hover { &:hover {
background-color: #f4d525; background-color: #f4d525;
color: #333; color: #333;
@ -349,128 +29,6 @@ div.content {
display: block; display: block;
} }
/* cookies */ .noJSalbum {
#cookie-notice {
padding: 15px;
display: none; display: none;
text-align: right;
position: fixed;
bottom: 0;
width: 100%;
background-color: _palette(accent-dark);
flex-wrap: wrap;
justify-content: space-evenly;
align-content: center;
align-items: center;
z-index: 1000;
p {
flex: 1 0 250px;
margin: 0;
font-size: 12px;
font-family: _font(family-fixed);
}
@media only screen and (max-width: 569px) {
p {
text-align: center;
}
}
}
.yes {
flex: 0 0 250px;
-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
border-radius: 0.375em;
border: 0;
color: #000 !important;
background-position-x: 0%;
background-position-y: 0%;
background-repeat: repeat;
background-attachment: scroll;
background-image: linear-gradient(228deg, _palette(bg), _palette(fg));
background-origin: padding-box;
background-clip: border-box;
background-size: 400% 400%;
-webkit-animation: backgroundBlink 2s ease infinite;
-moz-animation: backgroundBlink 2s ease infinite;
animation: backgroundBlink 2s ease infinite;
margin: 20px;
}
.yes:hover {
color: #000 !important;
}
/* Background Video */
.fullscreen-bg {
position: absolute;
height: 100%;
width: 100%;
overflow: hidden;
z-index: -100;
background: #fff;
}
.fullscreen-bg__video {
background: #fff;
position: relative;
left: 50%;
top:50%;
transform: translate(-50%, -50%);
width: 100%;
}
/* Post Navigation */
.post-nav {
/* Insert your custom styling here. Example:
font-size: 14px;
margin-bottom: 1em;
*/
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.post-nav div {
/* flex-grow, flex-shrink, flex-basis */
flex: 0 1 300px;
}
.post-nav-next {
text-align: right;
}
/* Stream links */
.streambox {
display: block;
text-align: center;
.streamer {
list-style-type:none;
display:flex;
justify-content: center;
flex-wrap: wrap;
a {
flex: 1 0 150px;
margin:10px;
}
.button {
display: block;
flex: unset;
}
h3 {
flex: unset;
}
}
} }

33
_sass/_videos.scss Normal file
View file

@ -0,0 +1,33 @@
/* Background Video */
.fullscreen-bg {
position: absolute;
height: 100%;
width: 100%;
overflow: hidden;
z-index: 0;
background: var(--bg);
top: 0;
left: 0;
right: 0;
z-index: 0;
}
.fullscreen-bg__video {
object-fit: cover;
width: 100vw;
height: 100vh;
position: absolute;
top: 0;
left: 0;
}
#myVideo {
position: absolute;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
}

234
_sass/base/_typography.scss
View file

@ -1,234 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Type */
html {
font-size: 18pt;
@include breakpoint('<=xlarge') {
font-size: 20pt;
}
@include breakpoint('<=large') {
font-size: 18pt;
}
@include breakpoint('<=small') {
font-size: 17pt;
}
@include breakpoint('<=xxsmall') {
font-size: 17pt;
}
}
body {
background-size: 20%;
background-repeat: repeat;
color: _palette(fg);
}
body, input, select, textarea {
font-family: _font(family-fixed);
font-size: 0.75rem;
font-weight: _font(weight);
line-height: 1.45;
}
a {
@include vendor('transition', 'color #{_duration(transition)} ease-in-out');
text-decoration: underline;
&:hover {
text-decoration: none;
}
}
strong, b {
font-weight: _font(weight-bold);
}
em, i {
font-style: italic;
}
p {
margin: 0 0 _size(element-margin) 0;
&.major {
font-size: 1.25rem;
}
}
h1, h2, h3, h4, h5, h6 {
font-weight: _font(weight-bold);
line-height: 1.375;
letter-spacing: _font(kerning);
margin: 0 0 (_size(element-margin) * 0.5) 0;
font-family: _font(family);
a {
color: inherit;
text-decoration: none;
}
}
h1 {
font-size: 3.5rem;
line-height: 1.2;
}
h2 {
font-size: 2.25rem;
}
h3 {
font-size: 1.5rem;
}
h4 {
font-size: 1.1rem;
}
h5 {
font-size: 0.9rem;
}
h6 {
font-size: 0.7rem;
}
sub {
font-size: 0.8rem;
position: relative;
top: 0.5rem;
}
sup {
font-size: 0.8rem;
position: relative;
top: -0.5rem;
}
blockquote {
border-left: solid (_size(border-width) * 4);
font-style: italic;
margin: 0 0 _size(element-margin) 0;
padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);
}
code {
border-radius: _size(border-radius);
font-family: _font(family-fixed);
font-size: 0.9em;
margin: 0 0.25rem;
padding: 0.25rem 0.325rem;
}
pre {
-webkit-overflow-scrolling: touch;
font-family: _font(family-fixed);
font-size: 0.9em;
margin: 0 0 _size(element-margin) 0;
code {
display: block;
line-height: 1.5;
padding: 0.75rem 1rem;
overflow-x: auto;
}
}
hr {
border: 0;
border-bottom: solid _size(border-width);
margin: (_size(element-margin) * 1.25) 0;
&.major {
margin: (_size(element-margin) * 1.75) 0;
}
}
.align-left {
text-align: left;
}
.align-center {
text-align: center;
}
.align-right {
text-align: right;
}
@include breakpoint('<=small') {
p {
&.major {
font-size: 1.1rem;
}
}
h1 {
font-size: 2.5rem;
}
h2 {
font-size: 2rem;
}
h3 {
font-size: 1.25rem;
}
h4 {
font-size: 1rem;
}
}
@mixin color-typography($p: null) {
@if $p != null {
background-color: _palette($p, bg);
color: _palette($p, fg);
}
input, select, textarea {
color: _palette($p, fg-bold);
}
a {
color: _palette($p, fg-bold);
&:hover {
color: _palette($p, accent);
}
}
strong, b {
color: _palette($p, fg-bold);
}
h1, h2, h3, h4, h5, h6 {
color: _palette($p, fg-bold);
}
blockquote {
border-left-color: _palette($p, border);
}
code {
background: _palette($p, border-bg);
border-color: _palette($p, border);
}
hr {
border-bottom-color: _palette($p, border);
}
}
@include color-typography;

990
_sass/components/_banner.scss
View file

@ -1,990 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Banner (transitions) */
.banner {
// Mixin.
@mixin transition-banner($event) {
$x: null;
$y: null;
@if ($event == 'load') {
$x: 'body.is-preload &';
$y: _duration(on-load);
}
@else if ($event == 'scroll') {
$x: '&.is-inactive';
$y: _duration(on-scroll);
}
// Content.
&.on#{$event}-content-fade-up {
.content {
@include vendor('transition', (
'opacity #{$y} ease-in-out',
'transform #{$y} ease-in-out'
));
}
#{$x} {
.content {
@include vendor('transform', 'translateY(1rem)');
opacity: 0;
}
}
}
&.on#{$event}-content-fade-down {
.content {
@include vendor('transition', (
'opacity #{$y} ease-in-out',
'transform #{$y} ease-in-out'
));
}
#{$x} {
.content {
@include vendor('transform', 'translateY(-1rem)');
opacity: 0;
}
}
}
&.on#{$event}-content-fade-left {
.content {
@include vendor('transition', (
'opacity #{$y} ease-in-out',
'transform #{$y} ease-in-out'
));
}
#{$x} {
.content {
@include vendor('transform', 'translateX(1rem)');
opacity: 0;
}
}
}
&.on#{$event}-content-fade-right {
.content {
@include vendor('transition', (
'opacity #{$y} ease-in-out',
'transform #{$y} ease-in-out'
));
}
#{$x} {
.content {
@include vendor('transform', 'translateX(-1rem)');
opacity: 0;
}
}
}
&.on#{$event}-content-fade-in {
.content {
@include vendor('transition', 'opacity #{$y} ease-in-out');
}
#{$x} {
.content {
opacity: 0;
}
}
}
// Image.
&.on#{$event}-image-fade-up {
.image {
@include vendor('transition', (
'opacity #{$y} ease-in-out',
'transform #{$y} ease-in-out'
));
img {
@include vendor('transition', 'opacity #{$y} ease-in-out');
@include vendor('transition-delay', '#{$y * 0.75}');
}
}
#{$x} {
.image {
@include vendor('transform', 'translateY(1rem)');
opacity: 0;
img {
opacity: 0;
}
}
}
}
&.on#{$event}-image-fade-down {
.image {
@include vendor('transition', (
'opacity #{$y} ease-in-out',
'transform #{$y} ease-in-out'
));
img {
@include vendor('transition', 'opacity #{$y} ease-in-out');
@include vendor('transition-delay', '#{$y * 0.75}');
}
}
#{$x} {
.image {
@include vendor('transform', 'translateY(-1rem)');
opacity: 0;
img {
opacity: 0;
}
}
}
}
&.on#{$event}-image-fade-left {
.image {
@include vendor('transition', (
'opacity #{$y} ease-in-out',
'transform #{$y} ease-in-out'
));
img {
@include vendor('transition', 'opacity #{$y} ease-in-out');
@include vendor('transition-delay', '#{$y * 0.75}');
}
}
#{$x} {
.image {
@include vendor('transform', 'translateX(1rem)');
opacity: 0;
img {
opacity: 0;
}
}
}
}
&.on#{$event}-image-fade-right {
.image {
@include vendor('transition', (
'opacity #{$y} ease-in-out',
'transform #{$y} ease-in-out'
));
img {
@include vendor('transition', 'opacity #{$y} ease-in-out');
@include vendor('transition-delay', '#{$y * 0.75}');
}
}
#{$x} {
.image {
@include vendor('transform', 'translateX(-1rem)');
opacity: 0;
img {
opacity: 0;
}
}
}
}
&.on#{$event}-image-fade-in {
.image {
img {
@include vendor('transition', 'opacity #{$y} ease-in-out');
}
}
#{$x} {
.image {
img {
opacity: 0;
}
}
}
}
}
// On Load.
@include transition-banner('load');
// On Scroll.
@include transition-banner('scroll');
}
/* Banner (style1) */
.banner.style1 {
@include vendor('align-items', 'stretch');
@include vendor('display', 'flex');
@include vendor('flex-direction', 'row');
@include vendor('justify-content', 'flex-end');
position: relative;
text-align: left;
overflow-x: hidden;
.content {
@include padding(_size(padding, default), _size(padding, default));
@include vendor('align-self', 'center');
@include vendor('flex-grow', '1');
@include vendor('flex-shrink', '1');
width: 50%;
max-width: (_size(inner) * 0.75);
margin: 0 auto;
}
.image {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
border-radius: 0;
width: 50%;
img {
@include vendor('object-fit', 'cover');
@include vendor('object-position', 'center');
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 0;
}
}
@include breakpoint('<=xlarge') {
.content {
@include padding(_size(padding, xlarge), _size(padding, xlarge));
}
}
@include breakpoint('<=large') {
.content {
@include padding(_size(padding, large), _size(padding, large));
}
}
@include breakpoint('<=medium') {
.content {
@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
}
}
@include breakpoint('<=small') {
.content {
@include padding(_size(padding, small) * 1.25, _size(padding, small));
}
}
@include orientation(portrait) {
@include vendor('flex-direction', 'column-reverse');
text-align: center;
.content {
@include vendor('display', 'flex');
@include vendor('flex-direction', 'column');
@include vendor('justify-content', 'center');
width: 100%;
max-width: 100%;
}
.image {
width: 100%;
max-width: 100%;
height: 45vh;
}
}
// Modifiers.
// Size.
&.fullscreen {
min-height: 100vh;
@include orientation(portrait) {
.content {
min-height: 50vh;
}
.image {
height: 50vh;
}
}
}
// Orientation.
&.orient-left {
// ...
}
&.orient-right {
@include vendor('flex-direction', 'row-reverse');
@include orientation(portrait) {
@include vendor('flex-direction', 'column-reverse');
}
}
// Content Alignment.
&.content-align-left {
// ...
}
&.content-align-center {
text-align: center;
}
&.content-align-right {
text-align: right;
@include orientation(portrait) {
text-align: center;
}
}
// Image Position.
&.image-position-left {
.image {
img {
@include vendor('object-position', 'left');
}
}
}
&.image-position-center {
.image {
img {
// ...
}
}
}
&.image-position-right {
.image {
img {
@include vendor('object-position', 'right');
}
}
}
}
/* Banner (style2) */
.banner.style2 {
@include padding(_size(padding, default) * 0.75, _size(padding, default) * 0.75);
@include vendor('align-items', 'center');
@include vendor('display', 'flex');
@include vendor('justify-content', 'center');
background-color: _palette(border-darken);
position: relative;
text-align: center;
overflow-x: hidden;
.content {
@include padding(_size(padding, default) * 0.75, _size(padding, default) * 0.75);
position: relative;
width: (_size(inner) * 0.625);
max-width: 100%;
background-color: inherit;
border-radius: _size(border-radius-alt);
margin-bottom: _size(element-margin);
z-index: 1;
}
.image {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
border-radius: 0;
img {
@include vendor('object-fit', 'cover');
@include vendor('object-position', 'center');
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 0;
}
}
@include breakpoint('<=xlarge') {
@include padding(_size(padding, xlarge) * 0.75, _size(padding, xlarge) * 0.75);
.content {
@include padding(_size(padding, xlarge) * 0.75, _size(padding, xlarge) * 0.75);
}
}
@include breakpoint('<=large') {
@include padding(_size(padding, large), _size(padding, large) * 0.75);
.content {
@include padding(_size(padding, large), _size(padding, large) * 0.75);
}
}
@include breakpoint('<=medium') {
@include padding(_size(padding, medium), _size(padding, medium));
.content {
@include padding(_size(padding, medium) * 1.25, _size(padding, medium) * 0.75);
}
}
@include breakpoint('<=small') {
@include padding(_size(padding, small), _size(padding, small));
.content {
@include padding(_size(padding, small) * 1.25, _size(padding, small) * 0.75);
}
}
// Modifiers.
// Size.
&.fullscreen {
min-height: 80vh;
}
// Orientation.
&.orient-left {
@include vendor('justify-content', 'flex-start');
padding-left: 0;
.content {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
}
&.orient-center {
// ...
}
&.orient-right {
@include vendor('justify-content', 'flex-end');
padding-right: 0;
.content {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
}
// Content Alignment.
&.content-align-left {
text-align: left;
}
&.content-align-center {
// ...
}
&.content-align-right {
text-align: right;
}
// Image Position.
&.image-position-left {
.image {
img {
@include vendor('object-position', 'left');
}
}
}
&.image-position-center {
.image {
img {
// ...
}
}
}
&.image-position-right {
.image {
img {
@include vendor('object-position', 'right');
}
}
}
}
/* Banner (style3) */
.banner.style3 {
$image-size: 21rem;
$content-size: (_size(inner) * 0.875) - $image-size - (_size(element-margin) * 1.75);
@include padding(_size(padding, default), _size(padding, default));
@include vendor('align-items', 'center');
@include vendor('display', 'flex');
@include vendor('flex-direction', 'row-reverse');
@include vendor('justify-content', 'center');
position: relative;
text-align: left;
overflow-x: hidden;
.content {
width: $content-size;
max-width: 100%;
}
.image {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
width: $image-size;
height: $image-size;
border-radius: 100%;
margin: 0 (_size(element-margin) * 1.75) _size(element-margin) 0;
img {
@include vendor('object-fit', 'cover');
@include vendor('object-position', 'center');
display: block;
width: 100%;
height: 100%;
border-radius: 100%;
}
}
@include breakpoint('<=xlarge') {
@include padding(_size(padding, xlarge), _size(padding, xlarge));
}
@include breakpoint('<=large') {
@include padding(_size(padding, large), _size(padding, large));
}
@include breakpoint('<=medium') {
@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
.image {
width: ($image-size * 0.875);
height: ($image-size * 0.875);
}
}
@include breakpoint('<=small') {
@include padding(_size(padding, small) * 1.25, _size(padding, small));
@include vendor('align-items', 'flex-start');
.image {
width: ($image-size * 0.75);
height: ($image-size * 0.75);
margin: 0 (_size(element-margin) * 1) _size(element-margin) 0;
}
}
@include orientation(portrait) {
@include vendor('align-items', 'center');
@include vendor('flex-direction', 'column-reverse');
text-align: center;
.content {
width: 34rem;
max-width: 100%;
}
.image {
margin-right: 0;
}
}
// Modifiers.
// Size.
&.fullscreen {
min-height: 100vh;
}
// Orientation.
&.orient-left {
@include vendor('flex-direction', 'row');
.image {
margin: 0 0 _size(element-margin) (_size(element-margin) * 1.75);
}
@include breakpoint('<=small') {
.image {
margin: 0 0 _size(element-margin) (_size(element-margin) * 1);
}
}
@include orientation(portrait) {
@include vendor('flex-direction', 'column-reverse');
.image {
margin-left: 0;
}
}
}
&.orient-right {
// ...
}
// Content Alignment.
&.content-align-left {
// ...
}
&.content-align-center {
text-align: center;
}
&.content-align-right {
text-align: right;
}
// Image Position.
&.image-position-left {
.image {
img {
@include vendor('object-position', 'left');
}
}
}
&.image-position-center {
// ...
}
&.image-position-right {
.image {
img {
@include vendor('object-position', 'right');
}
}
}
}
/* Banner (style4) */
.banner.style4 {
$image-width: 13rem;
$content-size: (_size(inner) * 0.75) - $image-width - (_size(element-margin) * 1.75);
@include padding(_size(padding, default), _size(padding, default));
@include vendor('align-items', 'center');
@include vendor('display', 'flex');
@include vendor('flex-direction', 'row-reverse');
@include vendor('justify-content', 'center');
position: relative;
text-align: left;
overflow-x: hidden;
.content {
width: $content-size;
max-width: 100%;
}
.image {
@include phone($image-width);
margin-right: (_size(element-margin) * 1.75);
}
@include breakpoint('<=xlarge') {
@include padding(_size(padding, xlarge), _size(padding, xlarge));
}
@include breakpoint('<=large') {
@include padding(_size(padding, large), _size(padding, large));
}
@include breakpoint('<=medium') {
@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
.image {
@include resize-phone($image-width, 0.875);
}
}
@include breakpoint('<=small') {
@include padding(_size(padding, small) * 1.25, _size(padding, small));
@include vendor('align-items', 'flex-start');
.image {
@include resize-phone($image-width, 0.625);
}
}
@include orientation(portrait) {
@include vendor('align-items', 'center');
@include vendor('flex-direction', 'column-reverse');
text-align: center;
.content {
width: 34rem;
max-width: 100%;
}
.image {
margin-right: 0;
margin-left: 0;
}
}
// Modifiers.
// Size.
&.fullscreen {
min-height: 100vh;
}
// Variant.
&.iphone {
// ...
}
&.android {
// ...
}
// Orientation.
&.orient-left {
@include vendor('flex-direction', 'row');
.image {
margin-right: 0;
margin-left: (_size(element-margin) * 1.75);
}
@include orientation(portrait) {
@include vendor('flex-direction', 'column-reverse');
.image {
margin-right: 0;
margin-left: 0;
}
}
}
&.orient-right {
// ...
}
// Content Alignment.
&.content-align-left {
// ...
}
&.content-align-center {
text-align: center;
}
&.content-align-right {
text-align: right;
}
// Image Position.
&.image-position-left {
.image {
img {
@include vendor('object-position', 'left');
}
}
}
&.image-position-center {
// ...
}
&.image-position-right {
.image {
img {
@include vendor('object-position', 'right');
}
}
}
}
/* Banner (style5) */
.banner.style5 {
@include padding(_size(padding, default), _size(padding, default));
@include vendor('align-items', 'center');
@include vendor('display', 'flex');
@include vendor('justify-content', 'center');
background-color: inherit;
position: relative;
text-align: center;
overflow-x: hidden;
.content {
position: relative;
width: (_size(inner) * 0.625);
max-width: 100%;
margin-bottom: _size(element-margin);
z-index: 1;
}
.image {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
border-radius: 0;
opacity: 0.1;
img {
@include vendor('object-fit', 'cover');
@include vendor('object-position', 'center');
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 0;
}
}
@include breakpoint('<=xlarge') {
@include padding(_size(padding, xlarge), _size(padding, xlarge));
}
@include breakpoint('<=large') {
@include padding(_size(padding, large), _size(padding, large));
}
@include breakpoint('<=medium') {
@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
}
@include breakpoint('<=small') {
@include padding(_size(padding, small) * 1.25, _size(padding, small));
}
// Modifiers.
// Size.
&.fullscreen {
min-height: 80vh;
}
// Content Alignment.
&.content-align-left {
text-align: left;
}
&.content-align-center {
// ...
}
&.content-align-right {
text-align: right;
}
// Image Position.
&.image-position-left {
.image {
img {
@include vendor('object-position', 'left');
}
}
}
&.image-position-center {
// ...
}
&.image-position-right {
.image {
img {
@include vendor('object-position', 'right');
}
}
}
}
// Mixin
@mixin color-banner($p: null) {
.banner {
.image {
background-color: transparentize(_palette($p, fg-bold), 0.875);
}
@if ($p != 'invert') {
&.invert {
.image {
background-color: transparentize(_palette(invert, fg-bold), 0.875);
}
}
}
}
.banner.style4 {
.image {
@include color-phone($p);
}
// Variant.
&.iphone {
.image {
@include color-phone-variant('iphone', $p);
}
}
&.android {
.image {
@include color-phone-variant('android', $p);
}
}
@if ($p != 'invert') {
&.invert {
.image {
@include color-phone(invert);
}
// Variant.
&.iphone {
.image {
@include color-phone-variant('iphone', invert);
}
}
&.android {
.image {
@include color-phone-variant('android', invert);
}
}
}
}
}
}
@include color-banner;

34
_sass/components/_box.scss
View file

@ -1,34 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Box */
.box {
border-radius: _size(border-radius);
border: solid _size(border-width);
margin-bottom: _size(element-margin);
padding: 1.5rem;
> :last-child,
> :last-child > :last-child,
> :last-child > :last-child > :last-child {
margin-bottom: 0;
}
&.alt {
border: 0;
border-radius: 0;
padding: 0;
}
}
@mixin color-box($p: null) {
.box {
border-color: _palette($p, border);
}
}
@include color-box;

121
_sass/components/_button.scss
View file

@ -1,121 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Button */
input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
@include vendor('appearance', 'none');
@include vendor('transition', (
'background-color #{_duration(transition)} ease-in-out',
'box-shadow #{_duration(transition)} ease-in-out',
'color #{_duration(transition)} ease-in-out'
));
border: 0;
cursor: pointer;
display: inline-block;
font-weight: _font(weight-bold);
font-family: _font(family-fixed);
letter-spacing: _font(kerning-alt);
text-align: center;
text-decoration: none;
text-transform: uppercase;
white-space: nowrap;
font-size: 0.75rem;
max-width: 20rem;
height: 3.75em;
line-height: 3.75em;
border-radius: 7px;
padding: 0 2.5em;
text-overflow: ellipsis;
overflow: hidden;
&.icon {
&:before {
margin-right: 0.5rem;
}
}
&.fit {
width: 100%;
}
&.small {
font-size: 0.7rem;
height: 3.325em;
line-height: 3.325em;
border-radius: 7px;
padding: 0 2em;
}
&.smaller {
font-size: 0.5rem;
height: 2.75em;
line-height: 2.75em;
border-radius: 7px;
padding: 0 2em;
}
&.large {
font-size: 0.8rem;
height: 4em;
line-height: 4em;
border-radius: 7px;
padding: 0 3em;
}
&.wide {
min-width: 14em;
}
&.disabled,
&:disabled {
@include vendor('pointer-events', 'none');
opacity: 0.25;
}
}
@mixin color-button($p: null) {
input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
background-color: _palette(fg);
box-shadow: inset 0 0 5px _size(border-width) _palette($p, border-darken);
color: _palette($p, bg) !important;
&:hover {
box-shadow: inset 0 0 5px _size(border-width) _palette($p, border);
color: _palette($p, fg) !important;
background-color: _palette(border-darken);
}
&:active {
background-color: transparentize(_palette($p, accent), 0.8);
box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
color: _palette($p, accent) !important;
}
&.primary {
background-color: _palette($p, fg-bold);
box-shadow: none;
color: _palette($p, bg) !important;
&:hover {
background-color: _palette($p, accent);
}
&:active {
background-color: darken(_palette($p, accent), 12);
}
}
}
}
@include color-button;

287
_sass/components/_form.scss
View file

@ -1,287 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Form */
form {
margin: 0 0 _size(element-margin) 0;
> :last-child {
margin-bottom: 0;
}
> .fields {
$gutter: (_size(element-margin) * 0.75);
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
width: calc(100% + #{$gutter * 2});
margin: ($gutter * -1) 0 _size(element-margin) ($gutter * -1);
> .field {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
padding: $gutter 0 0 $gutter;
width: calc(100% - #{$gutter * 1});
&.half {
width: calc(50% - #{$gutter * 0.5});
}
&.third {
width: calc(#{100% / 3} - #{$gutter * (1 / 3)});
}
&.quarter {
width: calc(25% - #{$gutter * 0.25});
}
}
}
@include breakpoint('<=xsmall') {
> .fields {
$gutter: (_size(element-margin) * 0.75);
width: calc(100% + #{$gutter * 2});
margin: ($gutter * -1) 0 _size(element-margin) ($gutter * -1);
> .field {
padding: $gutter 0 0 $gutter;
width: calc(100% - #{$gutter * 1});
&.half {
width: calc(100% - #{$gutter * 1});
}
&.third {
width: calc(100% - #{$gutter * 1});
}
&.quarter {
width: calc(100% - #{$gutter * 1});
}
}
}
}
}
label {
display: block;
font-size: 0.9rem;
font-weight: _font(weight-bold);
margin: 0 0 (_size(element-margin) * 0.5) 0;
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="url"],
select,
textarea {
@include vendor('appearance', 'none');
background-color: _palette(bg-transparent);
border-radius: _size(border-radius);
border: none;
border: solid _size(border-width);
color: inherit;
display: block;
outline: 0;
padding: 0 0.825rem;
text-decoration: none;
width: 100%;
box-shadow: inset 0 0 5px 1px _palette(border);
&:invalid {
box-shadow: none;
}
}
select {
background-size: 1.25rem;
background-repeat: no-repeat;
background-position: calc(100% - 1rem) center;
height: _size(element-height);
padding-right: _size(element-height);
text-overflow: ellipsis;
&:focus {
&::-ms-value {
background-color: transparent;
}
}
&::-ms-expand {
display: none;
}
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="url"],
select {
height: _size(element-height);
}
textarea {
padding: 0.75rem 1rem;
}
input[type="checkbox"],
input[type="radio"], {
@include vendor('appearance', 'none');
display: block;
float: left;
margin-right: -2rem;
opacity: 0;
width: 1rem;
z-index: -1;
& + label {
@include icon(false, solid);
@include vendor('user-select', 'none');
cursor: pointer;
display: inline-block;
font-size: 1rem;
font-weight: _font(weight);
padding-left: (_size(element-height) * 0.6) + 0.75rem;
padding-right: 0.75rem;
position: relative;
margin-bottom: 0;
&:before {
border-radius: _size(border-radius);
border: solid _size(border-width);
content: '';
display: inline-block;
font-size: 0.8rem;
height: (_size(element-height) * 0.6);
left: 0;
line-height: (_size(element-height) * 0.6);
position: absolute;
text-align: center;
top: 0;
width: (_size(element-height) * 0.6);
}
}
&:checked + label {
&:before {
content: '\f00c';
}
}
}
input[type="checkbox"] {
& + label {
&:before {
border-radius: _size(border-radius);
}
}
}
input[type="radio"] {
& + label {
&:before {
border-radius: 100%;
}
}
}
::-webkit-input-placeholder {
opacity: 1.0;
}
:-moz-placeholder {
opacity: 1.0;
}
::-moz-placeholder {
opacity: 1.0;
}
:-ms-input-placeholder {
opacity: 1.0;
}
@mixin color-form($p: null) {
label {
color: _palette($p, fg-bold);
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="url"],
select,
textarea {
border-color: _palette($p, border);
&:focus {
border-color: _palette($p, accent);
box-shadow: 0 0 0 _size(border-width) _palette($p, accent);
}
}
select {
background-image: svg-url("<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'><path d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='#{_palette(border)}' /></svg>");
option {
color: _palette(fg-bold);
background: _palette(bg);
}
}
input[type="checkbox"],
input[type="radio"], {
& + label {
color: _palette($p, fg);
&:before {
border-color: _palette($p, fg-light);
}
}
&:checked + label {
&:before {
background-color: _palette($p, fg-bold);
border-color: _palette($p, fg-bold);
color: _palette($p, bg);
}
}
&:focus + label {
&:before {
border-color: _palette($p, accent);
box-shadow: 0 0 0 _size(border-width) _palette($p, accent);
}
}
}
::-webkit-input-placeholder {
color: _palette($p, fg-light) !important;
}
:-moz-placeholder {
color: _palette($p, fg-light) !important;
}
::-moz-placeholder {
color: _palette($p, fg-light) !important;
}
:-ms-input-placeholder {
color: _palette($p, fg-light) !important;
}
}
@include color-form;

616
_sass/components/_gallery.scss
View file

@ -1,616 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Gallery (transitions) */
.gallery {
// Mixin.
@mixin transition-gallery($event) {
$x: null;
$y: null;
@if ($event == 'load') {
$x: 'body.is-preload &';
$y: _duration(on-load);
}
@else if ($event == 'scroll') {
$x: '&.is-inactive';
$y: _duration(on-scroll);
}
&.on#{$event}-fade-in {
article {
.image {
img {
@include vendor('transition', 'opacity #{$y} ease-in-out');
@include vendor('transition-delay', '#{_misc(gallery-limit) * _duration(gallery-delay)}');
}
}
@for $i from 0 through _misc(gallery-limit) {
&:nth-child(#{$i + 1}) {
.image {
img {
@include vendor('transition-delay', '#{$i * _duration(gallery-delay)}');
}
}
}
}
}
#{$x} {
article {
.image {
img {
opacity: 0;
}
}
}
}
}
}
// On Load.
@include transition-gallery('load');
// On Scroll.
@include transition-gallery('scroll');
}
/* Gallery (style1) */
.gallery.style1 {
@include color-typography(invert);
@include color-button(invert);
@include vendor('align-items', 'center');
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
@include vendor('justify-content', 'center');
position: relative;
width: 100%;
background-color: transparent;
> .forward, >.backward {
display: none;
}
> .inner {
@include vendor('align-items', 'inherit');
@include vendor('display', 'inherit');
@include vendor('flex-wrap', 'inherit');
@include vendor('justify-content', 'inherit');
}
article {
overflow: hidden;
position: relative;
width: 25%;
.image {
@include vendor('transition', 'opacity #{_duration(transition)} ease-in-out');
display: block;
width: 100%;
border-radius: 0;
img {
display: block;
width: 100%;
border-radius: 0;
}
}
.caption {
@include vendor('align-items', 'center');
@include vendor('display', 'flex');
@include vendor('flex-direction', 'column');
@include vendor('justify-content', 'center');
@include vendor('pointer-events', 'none');
@include vendor('transition', 'opacity #{_duration(transition)} ease-in-out');
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: transparentize(_palette(invert, bg), 1 - _misc(overlay-opacity));
opacity: 0;
padding: 2rem;
z-index: 1;
font-size: 0.8rem;
a {
@include vendor('pointer-events', 'auto');
}
h2, h3, h4, h5, h6 {
font-size: 1.25rem;
margin-bottom: 0.25rem;
}
> * {
max-width: 100%;
margin-bottom: 1rem;
}
> :last-child {
margin-bottom: 0;
}
}
&:hover {
.caption {
opacity: 1;
}
}
}
@include breakpoint('<=large') {
article {
width: (100% / 3);
.caption {
padding: 1rem;
}
}
}
@include breakpoint('<=medium') {
article {
width: 50%;
.caption {
padding: 1rem;
}
}
}
@include breakpoint('<=xsmall') {
article {
width: 100%;
.caption {
padding: 1rem;
}
}
}
// Modifiers.
// size
&.small {
article {
width: 20%;
.caption {
padding: 1rem;
}
}
@include breakpoint('<=large') {
article {
width: 25%;
.caption {
padding: 1rem;
}
}
}
@include breakpoint('<=medium') {
article {
width: (100% / 3);
.caption {
padding: 1rem;
}
}
}
@include breakpoint('<=xsmall') {
article {
width: 50%;
.caption {
padding: 1rem;
}
}
}
}
&.medium {
// ...
}
&.big {
article {
width: (100% / 3);
.caption {
padding: 3rem;
}
}
@include breakpoint('<=large') {
article {
width: 50%;
.caption {
padding: 2rem;
}
}
}
@include breakpoint('<=medium') {
article {
width: 50%;
.caption {
padding: 2rem;
}
}
}
@include breakpoint('<=xsmall') {
article {
width: 100%;
.caption {
padding: 1rem;
}
}
}
}
}
/* Gallery (style2) */
.gallery.style2 {
@include color-typography(invert);
@include color-button(invert);
@include vendor('display', 'flex');
-webkit-overflow-scrolling: touch;
position: relative;
background-color: transparent;
> .forward, >.backward {
@include icon(false, solid);
@include vendor('transition', 'opacity #{_duration(transition)} ease-in-out');
position: absolute;
top: 0;
width: 5rem;
height: 100%;
cursor: pointer;
opacity: 0;
z-index: 2;
&:before {
display: block;
top: calc(50% - 1.5rem);
width: 4rem;
height: 3rem;
line-height: 1em;
font-size: 3rem;
position: absolute;
text-align: center;
}
}
&:hover {
> .forward, > .backward {
opacity: 1;
}
}
> .forward {
right: 0;
background-image: linear-gradient(to left, rgba(0,0,0,0.25) 15%, rgba(0,0,0,0));
&:before {
content: '\f105';
right: 0;
}
}
> .backward {
left: 0;
background-image: linear-gradient(to right, rgba(0,0,0,0.25) 15%, rgba(0,0,0,0));
&:before {
content: '\f104';
left: 0;
}
}
> .inner {
@include vendor('display', 'inherit');
overflow-x: auto;
overflow-y: hidden;
position: relative;
width: 100%;
}
article {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
display: block;
position: relative;
overflow: hidden;
width: 22.5rem;
max-width: 75vw;
.image {
display: block;
width: 100%;
border-radius: 0;
img {
display: block;
width: 100%;
border-radius: 0;
}
}
.caption {
@include vendor('align-items', 'center');
@include vendor('display', 'flex');
@include vendor('flex-direction', 'column');
@include vendor('justify-content', 'center');
@include vendor('pointer-events', 'none');
@include vendor('transition', 'opacity #{_duration(transition)} ease-in-out');
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: transparentize(_palette(invert, bg), 1 - _misc(lightbox-opacity));
opacity: 0;
padding: 3rem;
z-index: 1;
font-size: 1rem;
a {
@include vendor('pointer-events', 'auto');
}
h2, h3, h4, h5, h6 {
font-size: 1.25rem;
margin-bottom: 0.25rem;
}
> * {
max-width: 100%;
margin-bottom: 1rem;
}
> :last-child {
margin-bottom: 0;
}
}
&:hover {
.caption {
opacity: 1;
}
}
}
@include breakpoint('<=medium') {
article {
.caption {
padding: 2rem;
}
}
}
@include breakpoint('<=small') {
article {
.caption {
padding: 2rem;
}
}
}
// Modifiers.
// size
&.small {
article {
width: 17.5rem;
.caption {
padding: 2rem;
}
}
@include breakpoint('<=medium') {
article {
.caption {
padding: 2rem;
}
}
}
@include breakpoint('<=small') {
article {
.caption {
padding: 2rem;
}
}
}
}
&.medium {
// ...
}
&.big {
article {
width: 30rem;
.caption {
padding: 4rem;
}
}
@include breakpoint('<=medium') {
article {
.caption {
padding: 3rem;
}
}
}
@include breakpoint('<=small') {
article {
.caption {
padding: 2rem;
}
}
}
}
}
/* Gallery (lightbox) */
@include keyframes('gallery-modal-spinner') {
0% {
@include vendor('transform', 'rotate(0deg)');
}
100% {
@include vendor('transform', 'rotate(360deg)');
}
}
.gallery.lightbox {
.modal {
@include vendor('display', 'flex');
@include vendor('align-items', 'center');
@include vendor('justify-content', 'center');
@include vendor('pointer-events', 'none');
@include vendor('user-select', 'none');
@include vendor('transition', (
'opacity #{_duration(gallery-lightbox)} ease',
'visibility #{_duration(gallery-lightbox)}',
'z-index #{_duration(gallery-lightbox)}'
));
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
outline: 0;
background-color: transparentize(_palette(invert, bg), 1 - _misc(lightbox-opacity));
visibility: none;
opacity: 0;
z-index: 0;
&:before {
@include vendor('animation', 'gallery-modal-spinner 1s infinite linear');
@include vendor('transition', 'opacity #{_duration(gallery-lightbox) * 0.5} ease');
@include vendor('transition-delay', '#{_duration(gallery-lightbox)}');
content: '';
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 4rem;
height: 4rem;
margin: -2rem 0 0 -2rem;
background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="96px" height="96px" viewBox="0 0 96 96" zoomAndPan="disable"><style>circle {fill: transparent; stroke: #{_palette(invert, fg-bold)}; stroke-width: 1.5px; }</style><defs><clipPath id="corner"><polygon points="0,0 48,0 48,48 96,48 96,96 0,96" /></clipPath></defs><g clip-path="url(#corner)"><circle cx="48" cy="48" r="32"/></g></svg>');
background-position: center;
background-repeat: no-repeat;
background-size: 4rem;
opacity: 0;
}
&:after {
content: '';
display: block;
position: absolute;
top: 0.5rem;
right: 0.5rem;
width: 4rem;
height: 4rem;
cursor: pointer;
background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="64px" viewBox="0 0 64 64" zoomAndPan="disable"><style>line {stroke: #{_palette(invert, fg-bold)};stroke-width: 1.5px;}</style><line x1="20" y1="20" x2="44" y2="44" /><line x1="20" y1="44" x2="44" y2="20" /></svg>');
background-position: center;
background-repeat: no-repeat;
background-size: 3rem;
}
.inner {
@include vendor('transform', 'translateY(0.75rem)');
@include vendor('transition', (
'opacity #{_duration(gallery-lightbox) * 0.5} ease',
'transform #{_duration(gallery-lightbox) * 0.5} ease'
));
opacity: 0;
img {
display: block;
max-width: 90vw;
max-height: 85vh;
box-shadow: 0 1rem 3rem 0 rgba(0, 0, 0, 0.35);
}
}
&.visible {
@include vendor('pointer-events', 'auto');
visibility: visible;
opacity: 1;
z-index: _misc(z-index-base) + 1;
&:before {
opacity: 1;
}
}
&.loaded {
.inner {
@include vendor('transform', 'translateY(0)');
@include vendor('transition', (
'opacity #{_duration(gallery-lightbox)} ease',
'transform #{_duration(gallery-lightbox)} ease'
));
opacity: 1;
}
&:before {
@include vendor('transition-delay', '0s');
opacity: 0;
}
}
}
@include breakpoint('<=medium') {
.modal {
.inner {
img {
max-width: 100vw;
}
}
}
}
}
// Mixin
@mixin color-gallery($p: null) {
.gallery {
article {
.image {
background-color: transparentize(_palette($p, fg-bold), 0.875);
}
}
}
}
@include color-gallery;

103
_sass/components/_icon.scss
View file

@ -1,103 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Icon */
.icon {
@include icon;
border-bottom: none;
position: relative;
text-align: center;
> .label {
display: none;
}
&:before {
line-height: inherit;
}
&.solid {
&:before {
font-weight: 900;
}
}
&.brands {
&:before {
font-family: 'Font Awesome 5 Brands';
}
}
&.style2 {
&:before {
border-radius: 2.75em;
display: inline-block;
height: 2.75em;
line-height: 2.75em;
width: 2.75em;
}
}
&.major {
display: block;
margin: 0 0 (_size(element-margin) * 0.5) 0;
&:before {
font-size: 1.25rem;
}
}
}
a.icon {
&.style2 {
&:before {
@include vendor('transition', (
'background-color #{_duration(transition)} ease-in-out',
'box-shadow #{_duration(transition)} ease-in-out',
'color #{_duration(transition)} ease-in-out'
));
}
}
}
@mixin color-icon($p: null) {
.icon {
&.style2 {
&:before {
box-shadow: inset 0 0 0 _size(border-width) _palette($p, border);
}
}
}
.player {
&.style2 {
&:before {
box-shadow: inset 0 0 0 _size(border-width) _palette($p, fg-light);
}
}
}
a.icon {
&.style2 {
&:hover {
&:before {
box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
color: _palette($p, accent);
}
}
&:active {
&:before {
background-color: transparentize(_palette($p, accent), 0.9);
box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
color: _palette($p, accent);
}
}
}
}
}
@include color-icon;

61
_sass/components/_image.scss
View file

@ -1,61 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Image */
.image {
border: 0;
border-radius: _size(border-radius);
display: inline-block;
position: relative;
img {
display: block;
border-radius: _size(border-radius);
}
&.left,
&.right {
width: 40%;
max-width: 10rem;
img {
width: 100%;
}
}
&.left {
float: left;
margin: 0 1.5rem 1rem 0;
top: 0.25rem;
}
&.right {
float: right;
margin: 0 0 1rem 1.5rem;
top: 0.25rem;
}
&.fit {
display: block;
margin: 0 0 _size(element-margin) 0;
width: 100%;
img {
width: 100%;
}
}
&.main {
display: block;
margin: 0 0 (_size(element-margin) * 1.5) 0;
width: 100%;
img {
width: 100%;
}
}
}

66
_sass/components/_index.scss
View file

@ -1,66 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Index */
.index {
> * {
@include padding(3rem, 0);
@include vendor('display', 'flex');
border-top: solid 1px;
> header {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
width: 15rem;
}
> .content {
@include vendor('flex-grow', '1');
@include vendor('flex-shrink', '1');
}
}
> :first-child {
border-top: 0;
}
@include breakpoint('<=medium') {
> * {
> header {
width: 11rem;
}
}
}
@include breakpoint('<=small') {
> * {
> header {
width: 10rem;
}
}
}
@include breakpoint('<=xsmall') {
> * {
@include vendor('flex-direction', 'column');
> header {
width: 100%;
}
}
}
}
@mixin color-index($p: null) {
.index {
> * {
border-top-color: _palette($p, border);
}
}
}
@include color-index;

338
_sass/components/_items.scss
View file

@ -1,338 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Items (transitions) */
.items {
// Mixin.
@mixin transition-items($event) {
$x: null;
$y: null;
@if ($event == 'load') {
$x: 'body.is-preload &';
$y: _duration(on-load);
}
@else if ($event == 'scroll') {
$x: '&.is-inactive';
$y: _duration(on-scroll);
}
&.on#{$event}-fade-in {
> * {
> .inner {
@include vendor('transition', 'opacity #{$y} ease-in-out');
@include vendor('transition-delay', '#{_misc(items-limit) * _duration(items-delay)}');
}
@for $i from 0 through _misc(items-limit) {
&:nth-child(#{$i + 1}) {
> .inner {
@include vendor('transition-delay', '#{$i * _duration(items-delay)}');
}
}
}
}
#{$x} {
> * {
> .inner {
opacity: 0;
}
}
}
}
}
// On Load.
@include transition-items('load');
// On Scroll.
@include transition-items('scroll');
}
/* Items (style1) */
@mixin items-style1-size($name, $size, $padding) {
&.#{$name} {
> * {
@include padding($padding, $padding);
width: #{100% / $size};
&:nth-child(-n + #{$size}) {
border-top-width: 0;
}
&:nth-child(#{$size}n + 1) {
border-left-width: 0;
}
}
}
}
@mixin items-style1-size-reset($name, $size) {
&.#{$name} {
> * {
&:nth-child(-n + #{$size}) {
border-top-width: _size(border-width);
}
&:nth-child(#{$size}n + 1) {
border-left-width: _size(border-width);
}
}
}
}
.items.style1 {
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
@include vendor('justify-content', 'center');
margin: (_size(element-margin) * 1.5) 0;
position: relative;
> * {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
border-style: solid;
border-left-width: _size(border-width);
border-top-width: _size(border-width);
}
// Modifiers.
// Size.
@include items-style1-size(big, 2, _size(gutter));
@include items-style1-size(medium, 3, _size(gutter) * 0.625);
@include items-style1-size(small, 4, _size(gutter) * 0.375);
@include breakpoint('<=large') {
@include items-style1-size-reset(small, 4);
@include items-style1-size(small, 3, _size(gutter) * 0.625);
}
@include breakpoint('<=medium') {
@include items-style1-size-reset(medium, 3);
@include items-style1-size(medium, 2, _size(gutter));
@include items-style1-size-reset(small, 3);
@include items-style1-size(small, 2, _size(gutter));
}
@include breakpoint('<=xsmall') {
@include items-style1-size-reset(big, 2);
@include items-style1-size(big, 1, _size(gutter) * 0.75);
@include items-style1-size-reset(medium, 2);
@include items-style1-size(medium, 1, _size(gutter) * 0.75);
@include items-style1-size-reset(small, 2);
@include items-style1-size(small, 1, _size(gutter) * 0.75);
&.big,
&.medium,
&.small {
> * {
padding-left: 0;
padding-right: 0;
}
> :first-child {
padding-top: 0;
}
> :last-child {
padding-bottom: 0;
> .inner {
> :last-child {
margin-bottom: 0;
}
}
}
}
}
}
/* Items (style2) */
@mixin items-style2-size($name, $size, $padding) {
&.#{$name} {
> * {
@include padding($padding, $padding);
width: #{100% / $size};
&:nth-child(-n + #{$size}) {
border-top-width: 0;
}
&:nth-child(#{$size}n + 1) {
border-left-width: 0;
}
}
}
}
@mixin items-style2-size-reset($name, $size) {
&.#{$name} {
> * {
&:nth-child(-n + #{$size}) {
border-top-width: _size(border-width);
}
&:nth-child(#{$size}n + 1) {
border-left-width: _size(border-width);
}
}
}
}
.items.style2 {
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
@include vendor('justify-content', 'center');
margin: (_size(element-margin) * 1.5) 0;
position: relative;
border: solid _size(border-width);
border-radius: _size(border-radius);
> * {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
border-style: solid;
border-left-width: _size(border-width);
border-top-width: _size(border-width);
}
// Modifiers.
// Size.
@include items-style2-size(big, 2, _size(gutter));
@include items-style2-size(medium, 3, _size(gutter) * 0.625);
@include items-style2-size(small, 4, _size(gutter) * 0.375);
@include breakpoint('<=large') {
@include items-style2-size-reset(small, 4);
@include items-style2-size(small, 3, _size(gutter) * 0.625);
}
@include breakpoint('<=medium') {
@include items-style2-size-reset(medium, 3);
@include items-style2-size(medium, 2, _size(gutter));
@include items-style2-size-reset(small, 3);
@include items-style2-size(small, 2, _size(gutter));
}
@include breakpoint('<=xsmall') {
@include items-style2-size-reset(big, 2);
@include items-style2-size(big, 1, _size(gutter) * 0.75);
@include items-style2-size-reset(medium, 2);
@include items-style2-size(medium, 1, _size(gutter) * 0.75);
@include items-style2-size-reset(small, 2);
@include items-style2-size(small, 1, _size(gutter) * 0.75);
}
}
/* Items (style3) */
@mixin items-style3-size($name, $size, $padding) {
&.#{$name} {
> * {
@include padding($padding, $padding);
width: #{100% / $size};
}
}
}
.items.style3 {
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
@include vendor('justify-content', 'center');
margin: (_size(element-margin) * 1.5) 0;
position: relative;
> * {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
}
// Modifiers.
// Size.
@include items-style3-size(big, 2, _size(gutter) * 0.5);
@include items-style3-size(medium, 3, _size(gutter) * 0.5 * 0.625);
@include items-style3-size(small, 4, _size(gutter) * 0.5 * 0.375);
@include breakpoint('<=large') {
@include items-style3-size(small, 3, _size(gutter) * 0.5 * 0.625);
}
@include breakpoint('<=medium') {
@include items-style3-size(medium, 2, _size(gutter) * 0.5);
@include items-style3-size(small, 2, _size(gutter) * 0.5);
}
@include breakpoint('<=small') {
margin: _size(element-margin) 0;
}
@include breakpoint('<=xsmall') {
@include items-style3-size(big, 1, _size(gutter) * 0.5 * 0.75);
@include items-style3-size(medium, 1, _size(gutter) * 0.5 * 0.75);
@include items-style3-size(small, 1, _size(gutter) * 0.5 * 0.75);
&.big,
&.medium,
&.small {
> * {
padding-left: 0;
padding-right: 0;
}
> :first-child {
padding-top: 0;
}
> :last-child {
padding-bottom: 0;
> .inner {
> :last-child {
margin-bottom: 0;
}
}
}
}
}
}
// Mixin
@mixin color-items($p: null) {
.items.style1 {
> * {
border-color: _palette($p, #fff);
}
}
.items.style2 {
border-color: _palette($p, border);
> * {
border-color: _palette($p, border);
}
}
}
@include color-items;

86
_sass/components/_list.scss
View file

@ -1,86 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* List */
ol {
list-style: decimal;
margin: 0 0 _size(element-margin) 0;
padding-left: 1.25rem;
li {
padding-left: 0.25rem;
}
}
ul {
list-style: disc;
margin: 0 0 _size(element-margin) 0;
padding-left: 1rem;
li {
padding-left: 0.5rem;
}
&.alt {
list-style: none;
padding-left: 0;
li {
border-top: solid _size(border-width);
padding: 0.5rem 0;
&:first-child {
border-top: 0;
padding-top: 0;
}
}
}
}
dl {
margin: 0 0 _size(element-margin) 0;
dt {
display: block;
font-weight: _font(weight-bold);
margin: 0 0 (_size(element-margin) * 0.5) 0;
}
dd {
margin-left: _size(element-margin);
}
&.style2 {
dt {
width: 25%;
float: left;
}
dd {
width: 70%;
float: left;
}
&:after {
content: '';
display: block;
clear: both;
}
}
}
@mixin color-list($p: null) {
ul {
&.alt {
li {
border-top-color: _palette($p, border);
}
}
}
}
@include color-list;

35
_sass/components/_row.scss
View file

@ -1,35 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Row */
.row {
@include html-grid(2rem);
@include breakpoint('<=xlarge') {
@include html-grid(2rem, 'xlarge');
}
@include breakpoint('<=large') {
@include html-grid(2rem, 'large');
}
@include breakpoint('<=medium') {
@include html-grid(2rem, 'medium');
}
@include breakpoint('<=small') {
@include html-grid(2rem, 'small');
}
@include breakpoint('<=xsmall') {
@include html-grid(2rem, 'xsmall');
}
@include breakpoint('<=xxsmall') {
@include html-grid(2rem, 'xxsmall');
}
}

49
_sass/components/_section.scss
View file

@ -1,49 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Section/Article */
section, article {
&.special {
text-align: center;
}
}
header {
p {
position: relative;
margin: (_size(element-margin) * -0.325) 0 (_size(element-margin) * 0.75) 0;
font-style: italic;
}
h1 + p {
font-size: 1.375rem;
}
h2 + p {
font-size: 1.25rem;
}
h3 + p {
font-size: 1.1rem;
}
h4 + p,
h5 + p,
h6 + p {
font-size: 0.9rem;
}
}
@mixin color-section($p: null) {
header {
p {
color: _palette($p, fg-light);
}
}
}
@include color-section;

1012
_sass/components/_spotlight.scss
View file

File diff suppressed because it is too large Load diff

137
_sass/components/_table.scss
View file

@ -1,137 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Table */
.table-wrapper {
-webkit-overflow-scrolling: touch;
margin: 0 0 _size(element-margin) 0;
overflow-x: auto;
> table {
margin-bottom: 0;
}
}
table {
margin: 0 0 _size(element-margin) 0;
width: 100%;
tbody {
tr {
border: solid _size(border-width);
border-left: 0;
border-right: 0;
}
}
td {
padding: 0.75rem 0.75rem;
}
th {
font-size: 0.9rem;
font-weight: _font(weight-bold);
padding: 0 0.75rem 0.75rem 0.75rem;
text-align: left;
}
thead {
border-bottom: solid (_size(border-width) * 2);
}
tfoot {
border-top: solid (_size(border-width) * 2);
}
&.alt {
border-collapse: separate;
tbody {
tr {
td {
border: solid _size(border-width);
border-left-width: 0;
border-top-width: 0;
&:first-child {
border-left-width: _size(border-width);
}
}
&:first-child {
td {
border-top-width: _size(border-width);
}
}
}
}
thead {
border-bottom: 0;
}
tfoot {
border-top: 0;
}
}
&.fixed {
table-layout: fixed;
}
}
@mixin color-table($p: null) {
table {
tbody {
tr {
border-color: _palette($p, border);
&:nth-child(2n + 1) {
background-color: _palette($p, border-bg);
}
&.alt {
background-color: _palette($p, border-bg) !important;
}
}
}
th {
color: _palette($p, fg-bold);
}
thead {
border-bottom-color: _palette($p, border);
}
tfoot {
border-top-color: _palette($p, border);
}
&.alt {
tbody {
tr {
td {
border-color: _palette($p, border);
}
}
}
}
&.uniform {
tbody {
tr {
&:nth-child(2n + 1) {
background-color: transparent;
}
}
}
}
}
}
@include color-table;

120
_sass/components/_wrapper.scss
View file

@ -1,120 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Wrapper (style1) */
.wrapper.style1 {
> .inner {
@include padding(_size(padding, default), _size(padding, default) * 0.5);
margin: 0 auto;
max-width: 100%;
width: _size(inner);
&.medium {
width: _size(inner) * 0.75;
}
&.small {
width: _size(inner) * 0.5;
}
}
@include breakpoint('<=xlarge') {
> .inner {
@include padding(_size(padding, xlarge), _size(padding, xlarge) * 0.5);
}
}
@include breakpoint('<=large') {
> .inner {
@include padding(_size(padding, large), _size(padding, large));
}
}
@include breakpoint('<=medium') {
> .inner {
@include padding(_size(padding, medium) * 1.5, _size(padding, medium));
}
}
@include breakpoint('<=small') {
> .inner {
@include padding(_size(padding, small) * 1.5, _size(padding, small));
}
}
}
/* Wrapper (style2) */
.wrapper.style2 {
padding: _size(padding, default);
background-color: _palette(bg-alt);
> .inner {
@include padding(_size(padding, default) * 0.75, _size(padding, default) * 0.5);
background-color: _palette(bg);
border-radius: _size(border-radius-alt);
margin: 0 auto;
max-width: 100%;
position: relative;
width: _size(inner);
z-index: 1;
&.medium {
width: _size(inner) * 0.75;
}
&.small {
width: _size(inner) * 0.5;
}
}
@include breakpoint('<=xlarge') {
padding: _size(padding, xlarge);
> .inner {
@include padding(_size(padding, xlarge) * 0.75, _size(padding, xlarge) * 0.5);
}
}
@include breakpoint('<=large') {
padding: _size(padding, large);
> .inner {
@include padding(_size(padding, large) * 0.75, _size(padding, large) * 0.5);
}
}
@include breakpoint('<=medium') {
padding: _size(padding, medium) * 0.75;
> .inner {
@include padding(_size(padding, medium), _size(padding, medium) * 0.75);
}
}
@include breakpoint('<=small') {
padding: _size(padding, small) * 0.75;
> .inner {
@include padding(_size(padding, small), _size(padding, small) * 0.75);
}
}
}
#wrapper {
> .wrapper.style2 {
&.invert {
&:not(.color1):not(.color2):not(.color3):not(.color4):not(.color5):not(.color6):not(.color7) {
background-color: _palette(invert, bg-alt);
}
> .inner {
background-color: _palette(invert, bg);
}
}
}
}

98
_sass/ethos.scss Normal file
View file

@ -0,0 +1,98 @@
#ethossection {
padding: 80px 40px;
.ethos-flex {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
max-width: var(--max-width);
margin: auto;
}
.ethos {
flex: 1 1 320px;
min-width: 450px;
height: 100%;
flex-direction: row;
-webkit-transition: all var(--anim-speed) ease-in;
-moz-transition: all var(--anim-speed) ease-in;
-ms-transition: all var(--anim-speed) ease-in;
transition: all var(--anim-speed) ease-in;
margin-top: 40px;
display: flex;
align-items: flex-start;
align-self: baseline;
justify-content: flex-start;
.mobile-hide{
display: none;
}
.cartouche, {
background-color: var(--bg);
width: 100%;
height: unset;
margin: 20px 0 20px 20px;
display: block;
border-radius: var(--border-radius);
}
.icon {
flex: 0 0 100px;
width: 100px;
height: 100px;
border-radius: 200px;
margin: 20px 20px 20px 0;
}
}
.ethos:nth-child(odd) {
.cartouche {
padding-right: 20px;
}
}
@media only screen and (max-width: 769px) {
.ethos {
flex: 0 0 auto;
flex-wrap: wrap;
min-width: unset;
max-width: unset;
justify-content: space-between;
margin: 20px;
.cartouche {
display: none;
}
.icon {
margin:0;
flex: 0 0 70px;
width: 70px;
height: 70px;
border-radius: 200px;
}
}
}
.st1 {
fill:var(--accent2);
-webkit-transition: all var(--anim-speed) ease-in;
-moz-transition: all var(--anim-speed) ease-in;
-ms-transition: all var(--anim-speed) ease-in;
transition: all var(--anim-speed) ease-in;
}
.st1:hover {
fill:var(--accent1);
}
.st2 {animation: col 15s ease-in-out infinite;}
@keyframes col {
0% {fill:var(--accent2);}
50% {fill:var(--accent1);}
100% {fill:var(--accent2);}
}
}

49
_sass/layout/_wrapper.scss
View file

@ -1,49 +0,0 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Wrapper */
@mixin wrapper-color($n) {
> .color#{$n} {
background-color: _palette(color#{$n});
}
}
#wrapper {
background-color: inherit;
width: 100%;
overflow-x: hidden;
> .invert {
@include color(invert);
}
@include wrapper-color(1);
@include wrapper-color(2);
@include wrapper-color(3);
@include wrapper-color(4);
@include wrapper-color(5);
@include wrapper-color(6);
@include wrapper-color(7);
&.divided {
> * {
box-shadow: inset 0 10px 10px 0 _palette(border-alt);
&:first-child {
box-shadow: none !important;
}
}
> .invert {
box-shadow: inset 0 1px 0 0 _palette(invert, border-alt);
&:first-child {
box-shadow: none !important;
}
}
}
}

46
_sass/libs/_animations.scss Normal file
View file

@ -0,0 +1,46 @@
// Animation
@-webkit-keyframes infiniteRotate {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes infiniteRotate {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes infiniteRotate {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes backgroundBlink {
0%{background-position:73% 0%}
50%{background-position:28% 100%}
100%{background-position:73% 0%}
}
@-moz-keyframes backgroundBlink {
0%{background-position:73% 0%}
50%{background-position:28% 100%}
100%{background-position:73% 0%}
}
@keyframes backgroundBlink {
0%{background-position:73% 0%}
50%{background-position:28% 100%}
100%{background-position:73% 0%}
}
@-webkit-keyframes backgroundSize {
0%{background-size:100% 150%}
50%{background-size:150% 100%}
100%{background-size:100% 150%}
}
@-moz-keyframes backgroundSize {
0%{background-size:100% 150%}
50%{background-size:150% 100%}
100%{background-size:100% 150%}
}
@keyframes backgroundSize {
0%{background-size:100% 150%}
50%{background-size:150% 100%}
100%{background-size:100% 150%}
}

8
_sass/libs/_fonts.scss
View file

@ -1,8 +0,0 @@
/* latin */
@font-face {
font-family: 'Astloch';
font-style: normal;
font-weight: 700;
src: local('Astloch Bold'), local('Astloch-Bold'), url(/assets/fonts/Staatliches/Staatliches-Regular.ttf) format('truetype');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

149
_sass/libs/_html-grid.scss
View file

@ -1,149 +0,0 @@
// html-grid.scss v1.0 | @ajlkn | MIT licensed */
// Mixins.
/// Initializes the current element as an HTML grid.
/// @param {mixed} $gutters Gutters (either a single number to set both column/row gutters, or a list to set them individually).
/// @param {mixed} $suffix Column class suffix (optional; either a single suffix or a list).
@mixin html-grid($gutters: 1.5em, $suffix: '') {
// Initialize.
$cols: 12;
$multipliers: 0, 0.25, 0.5, 1, 1.50, 2.00;
$unit: 100% / $cols;
// Suffixes.
$suffixes: null;
@if (type-of($suffix) == 'list') {
$suffixes: $suffix;
}
@else {
$suffixes: ($suffix);
}
// Gutters.
$guttersCols: null;
$guttersRows: null;
@if (type-of($gutters) == 'list') {
$guttersCols: nth($gutters, 1);
$guttersRows: nth($gutters, 2);
}
@else {
$guttersCols: $gutters;
$guttersRows: 0;
}
// Row.
display: flex;
flex-wrap: wrap;
box-sizing: border-box;
align-items: stretch;
// Columns.
> * {
box-sizing: border-box;
}
// Gutters.
&.gtr-uniform {
> * {
> :last-child {
margin-bottom: 0;
}
}
}
// Alignment.
&.aln-left {
justify-content: flex-start;
}
&.aln-center {
justify-content: center;
}
&.aln-right {
justify-content: flex-end;
}
&.aln-top {
align-items: flex-start;
}
&.aln-middle {
align-items: center;
}
&.aln-bottom {
align-items: flex-end;
}
// Step through suffixes.
@each $suffix in $suffixes {
// Suffix.
@if ($suffix != '') {
$suffix: '-' + $suffix;
}
@else {
$suffix: '';
}
// Row.
// Important.
> .imp#{$suffix} {
order: -1;
}
// Columns, offsets.
@for $i from 1 through $cols {
> .col-#{$i}#{$suffix} {
width: $unit * $i;
}
> .off-#{$i}#{$suffix} {
margin-left: $unit * $i;
}
}
// Step through multipliers.
@each $multiplier in $multipliers {
// Gutters.
$class: null;
@if ($multiplier != 1) {
$class: '.gtr-' + ($multiplier * 100);
}
&#{$class} {
margin-top: ($guttersRows * $multiplier * -1);
margin-left: ($guttersCols * $multiplier * -1);
> * {
padding: ($guttersRows * $multiplier) 0 0 ($guttersCols * $multiplier);
}
// Uniform.
&.gtr-uniform {
margin-top: $guttersCols * $multiplier * -1;
> * {
padding-top: $guttersCols * $multiplier;
}
}
}
}
}
}

78
_sass/libs/_reset.scss Normal file
View file

@ -0,0 +1,78 @@
///
/// Story by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
// Reset.
// Based on meyerweb.com/eric/tools/css/reset (v2.0 | 20110126 | License: public domain)
html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
html {
scroll-behavior: smooth;
}
body {
line-height: 1.75;
}
ol, ul {
list-style:none;
}
blockquote, q {
quotes: none;
&:before,
&:after {
content: '';
content: none;
}
}
table {
border-collapse: collapse;
border-spacing: 0;
}
body {
-webkit-text-size-adjust: none;
}
mark {
background-color: transparent;
color: inherit;
}
input::-moz-focus-inner {
border: 0;
padding: 0;
}
input, select, textarea {
-moz-appearance: none;
-webkit-appearance: none;
-ms-appearance: none;
appearance: none;
}

233
_sass/libs/_vars.scss
View file

@ -1,85 +1,162 @@
// Misc. /// Removes a specific item from a list.
$misc: ( /// @author Hugo Giraudel
z-index-base: 10000, /// @param {list} $list List.
overlay-opacity: 0.75, /// @param {integer} $index Index.
lightbox-opacity: 0.75, /// @return {list} Updated list.
gallery-limit: 32, @function remove-nth($list, $index) {
items-limit: 16
);
// Duration. $result: null;
$duration: (
menu: 0.5s,
transition: 0.2s,
gallery-lightbox: 0.5s,
gallery-delay: 0.15s,
items-delay: 0.15s,
on-load: 0.75s,
on-scroll: 0.75s
);
// Size. @if type-of($index) != number {
$size: ( @warn "$index: #{quote($index)} is not a number for `remove-nth`.";
border-radius: 4px, }
border-radius-alt: 0.5rem, @else if $index == 0 {
border-width: 1px, @warn "List index 0 must be a non-zero integer for `remove-nth`.";
element-height: 2.75rem, }
element-margin: 2rem, @else if abs($index) > length($list) {
gutter: 3.5rem, @warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`.";
inner: 64rem, }
padding: ( @else {
default: 7rem,
xlarge: 5rem,
large: 4rem,
medium: 3rem,
small: 2rem
)
);
// Font. $result: ();
$font: ( $index: if($index < 0, length($list) + $index + 1, $index);
family: ('Astloch', Helvetica, sans-serif),
family-fixed: ('Lucida Console', Monaco, monospace),
weight: 400,
weight-bold: 700,
kerning: -0.025em,
kerning-alt: 0.125em
);
// Palette. @for $i from 1 through length($list) {
$palette: (
color1: #30363d, @if $i != $index {
color2: #db8992, $result: append($result, nth($list, $i));
color3: #ab7aad, }
color4: #897cad,
color5: #7794ce, }
color6: #64abb4,
color7: #6ba78c, }
@return $result;
}
/// Gets a value from a map.
/// @author Hugo Giraudel
/// @param {map} $map Map.
/// @param {string} $keys Key(s).
/// @return {string} Value.
@function val($map, $keys...) {
@if nth($keys, 1) == null {
$keys: remove-nth($keys, 1);
}
@each $key in $keys {
$map: map-get($map, $key);
}
@return $map;
}
/// Gets a font value.
/// @param {string} $keys Key(s).
/// @return {string} Value.
@function _font($keys...) {
@return val($font, $keys...);
}
// /// Gets a palette value.
// /// @param {string} $keys Key(s).
// /// @return {string} Value.
// @function _palette($keys...) {
// @return val($palette, $keys...);
// }
bg: rgb(49, 61, 38),
bg-alt: rgb(168, 255, 238),
bg-transparent: rgba(135, 153, 118, 0.5),
fg: rgb(254, 236, 237),
fg-bold: rgb(254, 236, 237),
fg-light: rgba(135, 153, 118, 0.75),
border: rgba(44, 55, 104, 0.2),
border-alt: rgba(44, 55, 104, 0.075),
border-bg: rgba(44, 55, 104, 0.05),
border-darken: rgba(29, 36, 22, 0.85),
border-dark: rgba(44, 55, 104, 0.85),
accent: rgba(244, 91, 105, 1),
accent-dark: rgb(31, 39, 24),
invert: ( @font-face {
bg: rgb(49, 61, 38), font-family: 'Jetbrain-regular';
bg-alt: #222222, font-style: normal;
fg: #ffffff, font-weight: 400;
fg-bold: #ffffff, src: local('Jetbrain Regular'), local('Jetbrain-Regular'), url(/assets/fonts/jetBrainsMono/JetBrainsMono_Regular.ttf) format('truetype'), url(/assets/fonts/jetBrainsMono/JetBrainsMono-Regular.woff) format('woff'), url(/assets/fonts/jetBrainsMono/JetBrainsMono-Regular.woff2) format('woff2');
fg-light: #ffffff, unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
border: rgb(27, 34, 65), }
border-alt: rgba(238, 238, 238, 0.25), @font-face {
border-bg: rgba(44, 55, 104, 0.125), font-family: 'Jetbrain-regular';
accent: #47D3E5, font-style: italic;
), font-weight: 400;
); src: local('Jetbrain Regular'), local('Jetbrain-Regular'), url(/assets/fonts/jetBrainsMono/JetBrainsMono_Italic.ttf) format('truetype'), url(/assets/fonts/jetBrainsMono/JetBrainsMono-Italic.woff) format('woff'), url(/assets/fonts/jetBrainsMono/JetBrainsMono-Italic.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Jetbrain-Extrabold';
font-style: normal;
font-weight: 700;
src: local('Jetbrain ExtraBold'), local('Jetbrain-ExtraBold'), url(/assets/fonts/jetBrainsMono/JetBrainsMono_ExtraBold.ttf) format('truetype'), url(/assets/fonts/jetBrainsMono/JetBrainsMono-ExtraBold.woff) format('woff'), url(/assets/fonts/jetBrainsMono/JetBrainsMono-ExtraBold.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Jetbrain-Extrabold';
font-style: italic;
font-weight: 700;
src: local('Jetbrain ExtraBold'), local('Jetbrain-ExtraBold'), url(/assets/fonts/JetBrainsMono_ExtraBold_Italic.ttf) format('truetype'), url(/assets/fonts/jetBrainsMono/JetBrainsMono-ExtraBold-Italic.woff) format('woff'), url(/assets/fonts/jetBrainsMono/JetBrainsMono-ExtraBold-Italic.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Poppins';
font-style: normal;
font-weight: 300;
src: local('Poppins Light'), local('Poppins-Light'), url(/assets/fonts/poppins/Poppins-Light.ttf) format('truetype'), url(/assets/fonts/poppins/popin-light.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Poppins';
font-style: italic;
font-weight: 300;
src: local('Poppins Light'), local('Poppins-Light'), url(/assets/fonts/poppins/Poppins-LightItalic.ttf) format('truetype'), url(/assets/fonts/poppins/popin-light-italic.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Poppins';
font-style: normal;
font-weight: 500;
src: local('Poppins Medium'), local('Poppins-Medium'), url(/assets/fonts/poppins/Poppins-Medium.ttf) format('truetype'), url(/assets/fonts/poppins/popin-medium.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Poppins';
font-style: italic;
font-weight: 500;
src: local('Poppins Medium'), local('Poppins-Medium'), url(/assets/fonts/poppins/Poppins-MediumItalic.ttf) format('truetype'), url(/assets/fonts/poppins/popin-medium-italic.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
$font: (
title: ('Jetbrain-Extrabold', 'Lucida Console', Monaco, monospace),
family: ('Poppins', 'Arial', 'Helvetica', sans-serif),
family-fixed: ('Jetbrain-Regular', 'Lucida Console', Monaco, monospace),
weight: 400,
weight-bold: 700,
kerning: 0em,
kerning-alt: 0.125em
);
:root {
--border-radius: 3px;
--max-width: 1000px;
--anim-speed: 200ms;
}
// // Palette.
// $palette: (
// bg: #0C0F0A,
// bg-alt: rgba(12, 15, 10, 0.5),
// fg: #FFFFFF,
// fg-alt: rgba(255, 255, 255, 0.5),
// border: #000000,
// border-alt: rgba(0, 0, 0, 0.75),
// accent1: #41EAD4,
// accent1-alt:rgba(65, 234, 212, 0.75),
// accent2: #FF206E,
// accent2-alt:rgba(255, 32, 110, 0.75),
// );

31
_sass/base/_page.scss → _sass/photos/base/_page.scss
View file

@ -1,5 +1,5 @@
/// ///
/// Story by HTML5 UP /// Lens by HTML5 UP
/// html5up.net | @ajlkn /// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
/// ///
@ -7,14 +7,11 @@
/* Basic */ /* Basic */
// MSIE: Required for IEMobile. // MSIE: Required for IEMobile.
/*
@-ms-viewport { @-ms-viewport {
width: device-width; width: device-width;
} }
*/
// MSIE: Prevents scrollbar from overlapping content.
body {
-ms-overflow-style: scrollbar;
}
// Ensures page width is always >=320px. // Ensures page width is always >=320px.
@include breakpoint('<=xsmall') { @include breakpoint('<=xsmall') {
@ -23,6 +20,14 @@
} }
} }
// Stops initial animations until page loads.
body.is-preload-0 {
*, *:before, *:after {
@include vendor('animation', 'none !important');
@include vendor('transition', 'none !important');
}
}
// Set box model to border-box. // Set box model to border-box.
// Based on css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice // Based on css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice
html { html {
@ -33,15 +38,7 @@
box-sizing: inherit; box-sizing: inherit;
} }
body { html, body {
background: _palette(bg); background-color: _palette(page-bg);
overflow: hidden;
// Stops initial animations until page loads.
&.is-preload {
*, *:before, *:after {
@include vendor('animation', 'none !important');
@include vendor('transition', 'none !important');
}
}
} }

2
_sass/base/_reset.scss → _sass/photos/base/_reset.scss
View file

@ -1,5 +1,5 @@
/// ///
/// Story by HTML5 UP /// Lens by HTML5 UP
/// html5up.net | @ajlkn /// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
/// ///

153
_sass/photos/base/_typography.scss Normal file
View file

@ -0,0 +1,153 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Type */
html {
font-size: 16pt;
@include breakpoint('<=xlarge') {
font-size: 12pt;
}
@include breakpoint('<=large') {
font-size: 11pt;
}
}
body {
background-color: _palette(bg);
color: _palette(fg);
}
body, input, select, textarea {
font-family: _font(family);
font-weight: _font(weight);
line-height: 1.65;
font-size: 1em;
color: _palette(fg);
}
a {
@include vendor('transition', ('color #{_duration(transition)} ease', 'border-bottom-color #{_duration(transition)} ease'));
border-bottom: dotted 1px;
color: inherit;
text-decoration: none;
&:hover {
border-bottom-color: transparent;
color: _palette(accent);
}
}
strong, b {
font-weight: _font(weight);
color: _palette(fg-bold);
}
em, i {
font-style: italic;
}
p {
margin: 0 0 _size(element-margin) 0;
}
h1, h2, h3, h4, h5, h6 {
font-weight: _font(weight);
line-height: 1.25;
margin: 0 0 (_size(element-margin) * 0.4) 0;
color: _palette(fg-bold);
a {
color: inherit;
text-decoration: none;
}
}
h2 {
font-size: 1.25em;
}
h3 {
font-size: 1em;
}
h4 {
font-size: 0.9em;
}
h5 {
font-size: 0.8em;
}
h6 {
font-size: 0.7em;
}
sub {
font-size: 0.8em;
position: relative;
top: 0.5em;
}
sup {
font-size: 0.8em;
position: relative;
top: -0.5em;
}
blockquote {
border-left: solid (_size(border-width) * 4) _palette(border);
font-style: italic;
margin: 0 0 _size(element-margin) 0;
padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);
}
code {
border-radius: _size(border-radius);
border: solid _size(border-width);
font-family: _font(family-fixed);
font-size: 0.9em;
margin: 0 0.25em;
padding: 0.25em 0.65em;
border-color: _palette(border);
}
pre {
-webkit-overflow-scrolling: touch;
font-family: _font(family-fixed);
font-size: 0.9em;
margin: 0 0 _size(element-margin) 0;
code {
display: block;
padding: 1em 1.5em;
overflow-x: auto;
}
}
hr {
border: 0;
border-bottom: solid _size(border-width) _palette(border);
margin: _size(element-margin) 0;
&.major {
margin: (_size(element-margin) * 1.5) 0;
}
}
.align-left {
text-align: left;
}
.align-center {
text-align: center;
}
.align-right {
text-align: right;
}

2
_sass/components/_actions.scss → _sass/photos/components/_actions.scss
View file

@ -1,5 +1,5 @@
/// ///
/// Story by HTML5 UP /// Lens by HTML5 UP
/// html5up.net | @ajlkn /// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
/// ///

66
_sass/photos/components/_button.scss Normal file
View file

@ -0,0 +1,66 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Button */
input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
@include vendor('appearance', 'none');
@include vendor('transition', (
'background-color #{_duration(transition)} ease-in-out',
'border-color #{_duration(transition)} ease-in-out',
'color #{_duration(transition)} ease-in-out'
));
background-color: transparent;
border-radius: _size(border-radius);
border: solid 1px _palette(border);
color: _palette(fg-bold);
cursor: pointer;
display: inline-block;
line-height: 1;
padding: 0.75em 1.5em;
text-align: center;
text-decoration: none;
white-space: nowrap;
&:hover {
border-color: _palette(accent);
color: _palette(accent);
&:active {
background-color: transparentize(_palette(accent), 0.85);
}
}
&.icon {
padding-left: 1.35em;
&:before {
margin-right: 0.5em;
}
}
&.fit {
width: 100%;
}
&.small {
font-size: 0.8em;
}
&.large {
font-size: 1.35em;
}
&.disabled,
&:disabled {
@include vendor('pointer-events', 'none');
opacity: 0.25;
}
}

199
_sass/photos/components/_form.scss Normal file
View file

@ -0,0 +1,199 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Form */
form {
margin: 0 0 _size(element-margin) 0;
}
label {
color: _palette(fg-bold);
display: block;
font-size: 0.9em;
font-weight: _font(weight);
margin: 0 0 (_size(element-margin) * 0.5) 0;
}
input[type="text"],
input[type="password"],
input[type="email"],
select,
textarea {
@include vendor('appearance', 'none');
background-color: transparent;
border-radius: _size(border-radius);
border: solid _size(border-width) _palette(border);
color: inherit;
display: block;
outline: 0;
padding: 0 0.75em;
text-decoration: none;
width: 100%;
&:invalid {
box-shadow: none;
}
&:focus {
border-color: _palette(accent);
}
}
select {
background-image: svg-url("<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'><path d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='#{_palette(border)}' /></svg>");
background-size: 1.25rem;
background-repeat: no-repeat;
background-position: calc(100% - 1rem) center;
height: _size(element-height);
padding-right: _size(element-height);
text-overflow: ellipsis;
option {
color: _palette(fg-bold);
background: _palette(bg);
}
&:focus {
&::-ms-value {
background-color: transparent;
}
}
&::-ms-expand {
display: none;
}
}
.select-wrapper {
@include icon;
display: block;
position: relative;
&:before {
color: _palette(border);
content: '\f107';
display: block;
height: _size(element-height);
line-height: _size(element-height);
pointer-events: none;
position: absolute;
right: 0;
text-align: center;
top: 0;
width: _size(element-height);
}
select::-ms-expand {
display: none;
}
}
input[type="text"],
input[type="password"],
input[type="email"],
select {
height: _size(element-height);
}
textarea {
padding: 0.75em 1em;
}
input[type="checkbox"],
input[type="radio"], {
@include vendor('appearance', 'none');
display: block;
float: left;
margin-right: -2em;
opacity: 0;
width: 1em;
z-index: -1;
& + label {
@include icon;
color: _palette(fg);
cursor: pointer;
display: inline-block;
font-size: 1em;
font-weight: _font(weight);
margin: 0;
padding-left: (_size(element-height) * 0.6) + 0.75em;
padding-right: 0.75em;
position: relative;
&:before {
background: transparent;
border-radius: _size(border-radius);
border: solid _size(border-width) _palette(border);
content: '';
display: inline-block;
height: (_size(element-height) * 0.6);
left: 0;
line-height: (_size(element-height) * 0.575);
position: absolute;
text-align: center;
top: 0;
width: (_size(element-height) * 0.6);
}
}
&:checked + label {
&:before {
background-color: _palette(fg-bold);
border-color: _palette(fg-bold);
color: _palette(bg);
content: '\f00c';
}
}
&:focus + label {
&:before {
border-color: _palette(accent);
}
}
}
input[type="checkbox"] {
& + label {
&:before {
border-radius: _size(border-radius);
}
}
}
input[type="radio"] {
& + label {
&:before {
border-radius: 100%;
}
}
}
::-webkit-input-placeholder {
opacity: 1.0;
color: _palette(fg-light) !important;
}
:-moz-placeholder {
opacity: 1.0;
color: _palette(fg-light) !important;
}
::-moz-placeholder {
opacity: 1.0;
color: _palette(fg-light) !important;
}
:-ms-input-placeholder {
opacity: 1.0;
color: _palette(fg-light) !important;
}
.field {
margin: 0 0 _size(element-margin) 0;
}

17
_sass/photos/components/_icon.scss Normal file
View file

@ -0,0 +1,17 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Icon */
.icon {
@include icon;
border-bottom: none;
position: relative;
> .label {
display: none;
}
}

48
_sass/components/_icons.scss → _sass/photos/components/_icons.scss
View file

@ -1,22 +1,28 @@
/// ///
/// Story by HTML5 UP /// Lens by HTML5 UP
/// html5up.net | @ajlkn /// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
/// ///
/* Icons */ /* Icons */
ul.icons { ul.icons {
cursor: default; cursor: default;
list-style: none; list-style: none;
padding-left: 0; padding-left: 0;
li { li {
display: inline-block; display: inline-block;
padding: 0 0.75rem 0 0; padding: 0 1em 0 0;
&:last-child { &:last-child {
padding-right: 0; padding-right: 0;
} }
}
.icon {
&:before {
font-size: 1.5rem;
}
}
}
} }

56
_sass/photos/components/_list.scss Normal file
View file

@ -0,0 +1,56 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* List */
ol {
list-style: decimal;
margin: 0 0 _size(element-margin) 0;
padding-left: 1.25em;
li {
padding-left: 0.25em;
}
}
ul {
list-style: disc;
margin: 0 0 _size(element-margin) 0;
padding-left: 1em;
li {
padding-left: 0.5em;
}
&.alt {
list-style: none;
padding-left: 0;
li {
border-top: solid _size(border-width) _palette(border);
padding: 0.5em 0;
&:first-child {
border-top: 0;
padding-top: 0;
}
}
}
}
dl {
margin: 0 0 _size(element-margin) 0;
dt {
display: block;
font-weight: _font(weight);
margin: 0 0 (_size(element-margin) * 0.5) 0;
}
dd {
margin-left: _size(element-margin);
}
}

27
_sass/photos/layout/_footer.scss Normal file
View file

@ -0,0 +1,27 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Footer */
#footer {
@include padding(2.25em, 2.25em);
.copyright {
list-style: none;
padding: 0;
li {
display: inline-block;
font-size: 0.8em;
margin-left: 0.35em;
padding: 0;
&:first-child {
margin-left: 0;
}
}
}
}

16
_sass/photos/layout/_header.scss Normal file
View file

@ -0,0 +1,16 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Header */
#header {
@include padding(3em, 2.25em);
h1 {
font-size: 2.25em;
font-weight: _font(weight-bold);
}
}

118
_sass/photos/layout/_main.scss Normal file
View file

@ -0,0 +1,118 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Main */
#main {
@include vendor('transition', ('opacity #{_duration(layout)} ease', 'right #{_duration(layout)} ease', 'left #{_duration(layout)} ease', 'visibility #{_duration(layout)}'));
-webkit-overflow-scrolling: touch;
position: fixed;
top: 0;
width: _size(main);
height: 100%;
background: _palette(bg);
outline: 0;
overflow-x: hidden;
overflow-y: auto;
text-align: _misc(main-align);
visibility: visible;
z-index: _misc(z-index-base);
@if _misc(main-side) == 'left' {
left: 0;
}
@else {
right: 0;
}
.toggle {
-webkit-tap-highlight-color: rgba(0,0,0,0);
position: absolute;
top: 0;
width: 4em;
height: 4em;
background-image: url('images/close-small-alt.svg');
background-repeat: no-repeat;
background-size: 32px 32px;
cursor: pointer;
display: none;
z-index: 1;
@if _misc(main-side) == 'left' {
background-position: calc(100% - 0.5em) 0.5em;
right: 0;
}
@else {
background-position: 0.5em 0.5em;
left: 0;
}
}
body.fullscreen & {
visibility: hidden;
@if _misc(main-side) == 'left' {
left: (_size(main) * -1);
}
@else {
right: (_size(main) * -1);
}
}
body.is-preload-1 & {
opacity: 0;
@if _misc(main-side) == 'left' {
left: -2em;
}
@else {
right: -2em;
}
}
@include breakpoint('<=large') {
width: _size(main-alt);
body.fullscreen & {
@if _misc(main-side) == 'left' {
left: (_size(main-alt) * -1);
}
@else {
right: (_size(main-alt) * -1);
}
}
}
@include breakpoint('<=medium') {
background: transparentize(_palette(bg), 0.075);
.toggle {
display: block;
}
}
@include breakpoint('<=xsmall') {
@include vendor('transition', ('opacity #{_duration(layout-alt)} ease', 'visibility #{_duration(layout-alt)}'));
width: 100%;
background: _palette(bg);
text-align: center;
body.is-preload-1 & {
left: auto !important;
right: auto !important;
}
body.fullscreen & {
left: auto !important;
right: auto !important;
opacity: 0;
}
.toggle {
display: none;
}
}
}

75
_sass/photos/layout/_thumbnails.scss Normal file
View file

@ -0,0 +1,75 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Thumbnails */
#thumbnails {
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
padding: 0 0.75em;
article {
position: relative;
width: #{100% / _misc(thumbnails-per-row)};
background: #101010;
outline: 0;
.thumbnail {
-webkit-tap-highlight-color: rgba(0,0,0,0);
display: block;
position: relative;
border: 0;
outline: 0;
img {
display: block;
width: 100%;
}
&:before {
@include vendor('pointer-events', 'none');
@include vendor('transition', 'opacity 0.25s ease');
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
box-shadow: inset 0 0 0 2px _palette(accent), inset 0 0 0px 3px rgba(0,0,0,0.15);
opacity: 0;
z-index: 1;
}
&:focus {
&:before {
opacity: 0.5;
}
}
}
h2, p {
display: none;
}
&.active {
.thumbnail {
&:before {
opacity: 1;
}
}
}
}
@include breakpoint('<=xsmall') {
article {
.thumbnail {
&:before {
display: none;
}
}
}
}
}

267
_sass/photos/layout/_viewer.scss Normal file
View file

@ -0,0 +1,267 @@
///
/// Lens by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Viewer */
@include keyframes(spinner) {
0% {
@include vendor('transform', 'rotate(0deg)');
}
100% {
@include vendor('transform', 'rotate(360deg)');
}
}
#viewer {
@include vendor('transition', ('opacity #{_duration(layout)} ease', 'width #{_duration(layout)} ease'));
position: absolute;
top: 0;
width: calc(100% - #{_size(main)});
height: 100%;
@if _misc(main-side) == 'left' {
right: 0;
}
@else {
left: 0;
}
.inner {
@include vendor('pointer-events', 'none');
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
> * {
@include vendor('pointer-events', 'auto');
}
&:before {
@include vendor('background-image', (
'linear-gradient(left, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0))',
'linear-gradient(right, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0))'
));
content: '';
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.toggle {
-webkit-tap-highlight-color: rgba(0,0,0,0);
position: absolute;
top: 0;
width: 4em;
height: 4em;
background-image: url('images/close.svg');
background-repeat: no-repeat;
background-size: 64px 64px;
cursor: pointer;
z-index: 1;
@if _misc(main-side) == 'left' {
left: 0;
background-position: 0.75em 0.75em;
}
@else {
right: 0;
background-position: calc(100% - 0.75em) 0.75em;
}
}
.nav-next,
.nav-previous {
-webkit-tap-highlight-color: rgba(0,0,0,0);
position: absolute;
top: 50%;
width: 6em;
height: 6em;
margin-top: -3em;
background-image: url('images/arrow.svg');
background-position: center;
background-repeat: no-repeat;
background-size: contain;
cursor: pointer;
}
.nav-previous {
@include vendor('transform', 'scaleX(-1)');
left: 0;
}
.nav-next {
right: 0;
}
}
.slide {
@include vendor('transition', 'opacity #{_duration(slide)} ease-in-out');
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 1;
z-index: 1;
.caption {
@include vendor('background-image', (
'linear-gradient(bottom, rgba(16,16,16,0.75), rgba(16,16,16,0.25) 80%, rgba(16,16,16,0))',
));
@include padding(2em, 2em);
position: absolute;
bottom: 0;
left: 0;
width: 100%;
color: rgba(255,255,255,0.5);
z-index: 1;
h2, h3, h4, h5, h6 {
color: #fff;
}
}
.image {
@include vendor('transition', 'opacity #{_duration(slide)} ease-in-out');
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: contain;
opacity: 0;
}
&:before {
@include vendor('animation', 'spinner #{_duration(spinner)} linear infinite');
@include vendor('transition', 'opacity #{_duration(slide)} ease-in-out');
content: '';
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 3em;
height: 3em;
background-image: url('images/spinner.svg');
background-position: center;
background-repeat: no-repeat;
background-size: contain;
margin: -1.5em 0 0 -1.5em;
opacity: 0;
}
&.loading {
&:before {
opacity: 1;
}
}
&.active {
.image {
opacity: 1;
}
}
}
body.fullscreen & {
width: 100%;
.inner {
.toggle {
background-image: url('images/open.svg');
}
}
}
body.is-preload-1 & {
opacity: 0;
}
body.is-preload-2 & {
.slide {
opacity: 0;
}
}
@include breakpoint('<=large') {
width: calc(100% - #{_size(main-alt)});
}
@include breakpoint('<=medium') {
width: 100%;
.inner {
.toggle {
@include vendor('transition', 'opacity #{_duration(layout)} ease');
background-image: url('images/open.svg');
opacity: 0;
@if _misc(main-side) == 'left' {
left: 0;
}
@else {
right: 0;
}
}
}
body.fullscreen & {
.inner {
.toggle {
opacity: 1;
}
}
}
}
@include breakpoint('<=small') {
.inner {
.toggle {
background-size: 32px 32px;
}
.nav-next,
.nav-previous {
background-image: url('images/arrow-small.svg');
background-size: 32px 32px;
}
}
body.fullscreen & {
.inner {
.toggle {
background-image: url('images/open-small.svg');
}
}
}
}
@include breakpoint('<=xsmall') {
@include vendor('transition', ('opacity #{_duration(layout-alt)} ease'));
@include vendor('transition-delay', '0s');
opacity: 0;
.inner {
.toggle {
background-image: url('images/close-small.svg') !important;
background-size: 32px 32px;
}
}
body.fullscreen & {
@include vendor('transition-delay', '#{_duration(layout-alt)}');
opacity: 1;
}
}
}

0
_sass/libs/_breakpoints.scss → _sass/photos/libs/_breakpoints.scss
View file

0
_sass/libs/_functions.scss → _sass/photos/libs/_functions.scss
View file

21
_sass/libs/_mixins.scss → _sass/photos/libs/_mixins.scss
View file

@ -1,8 +1,7 @@
/// Makes an element's :before pseudoelement a FontAwesome icon. /// Makes an element's :before pseudoelement a FontAwesome icon.
/// @param {string} $content Optional content value to use. /// @param {string} $content Optional content value to use.
/// @param {string} $category Optional category to use.
/// @param {string} $where Optional pseudoelement to target (before or after). /// @param {string} $where Optional pseudoelement to target (before or after).
@mixin icon($content: false, $category: regular, $where: before) { @mixin icon($content: false, $where: before) {
text-decoration: none; text-decoration: none;
@ -14,25 +13,11 @@
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
display: inline-block; font-family: FontAwesome;
font-style: normal; font-style: normal;
font-variant: normal; font-weight: normal;
text-rendering: auto;
line-height: 1;
text-transform: none !important; text-transform: none !important;
@if ($category == brands) {
font-family: 'Font Awesome 5 Brands';
}
@elseif ($category == solid) {
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
@else {
font-family: 'Font Awesome 5 Free';
font-weight: 400;
}
} }
} }

45
_sass/photos/libs/_vars.scss Normal file
View file

@ -0,0 +1,45 @@
// Misc.
$misc: (
z-index-base: 10000,
main-side: right,
main-align: right,
thumbnails-per-row: 2
);
// Duration.
$duration: (
transition: 0.25s,
layout: 0.75s,
layout-alt: 0.5s,
slide: 0.5s,
spinner: 1s
);
// Size.
$size: (
border-radius: 4px,
border-width: 1px,
element-height: 2.75em,
element-margin: 1.25em,
main: 22.5em,
main-alt: 19em
);
// Font.
$font: (
family: ('avant', 'Roboto', Helvetica, sans-serif),
family-fixed: ('Courier New', monospace),
weight: 400,
weight-bold: 700
);
// Palette.
$palette: (
page-bg: #101010,
bg: rgb(51, 51, 51),
fg: rgb(224, 224, 224),
fg-bold: rgb(224, 224, 224),
fg-light: #ccc,
border: #ccc,
accent: #00D3B7
);

0
_sass/libs/_vendor.scss → _sass/photos/libs/_vendor.scss
View file

54
_sass/photos/main.scss Normal file
View file

@ -0,0 +1,54 @@
@import 'libs/vars';
@import 'libs/functions';
@import 'libs/mixins';
@import 'libs/vendor';
@import 'libs/breakpoints';
@import 'font-awesome.min.css';
@font-face {
font-family: avant;
src: url('../fonts/free_avantgarde.woff');
}
@font-face {
font-family: avantB;
src: url('../fonts/free_avantgardeBOLD.woff');
}
/*
Lens by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
// Breakpoints.
@include breakpoints((
xlarge: ( 1281px, 1680px ),
large: ( 981px, 1280px ),
medium: ( 737px, 980px ),
small: ( 481px, 736px ),
xsmall: ( null, 480px )
));
// Base.
@import 'base/reset';
@import 'base/page';
@import 'base/typography';
// Component.
@import 'components/button';
@import 'components/form';
@import 'components/icon';
@import 'components/list';
@import 'components/actions';
@import 'components/icons';
// Layout.
@import 'layout/main';
@import 'layout/header';
@import 'layout/footer';
@import 'layout/thumbnails';
@import 'layout/viewer';

47
_sass/photos/noscript.scss Normal file
View file

@ -0,0 +1,47 @@
@import 'libs/vars';
@import 'libs/functions';
@import 'libs/mixins';
@import 'libs/vendor';
@import 'libs/breakpoints';
/*
Lens by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
/* Main */
#main {
opacity: 1 !important;
@if _misc(main-side) == 'left' {
left: 0 !important;
}
@else {
right: 0 !important;
}
}
body:before {
content: 'Javascript is disabled :(';
display: block;
position: absolute;
top: 50%;
width: calc(100% - #{_size(main)} * 0.333333333);
height: 4em;
margin-top: -2em;
color: mix(_palette(page-bg), #fff, 90%);
cursor: default;
font-size: 3em;
line-height: 4em;
text-align: center;
white-space: nowrap;
@if _misc(main-side) == 'left' {
right: 0;
}
@else {
left: 0;
}
}

136
_sass/player.scss
View file

@ -1,136 +0,0 @@
/* Audio Player Styles
================================================== */
/* Default / Desktop / Firefox */
audio {
margin: 0;
width: 100%;
}
#mainwrap {
border-radius: 5px;
width: 100%;
ul {
list-style: none;
padding: 0;
li:last-child {
border-radius: 0 0 5px 5px;
}
}
}
#audiowrap {
background-color: _palette(accent-dark);
margin: 0 auto 0 auto;
}
#plwrap {
margin: 0 auto;
}
#tracks {
min-height: 65px;
position: relative;
text-align: center;
text-decoration: none;
}
#nowPlay {
display: flex;
width: 100%;
height: 60px;
flex-wrap: unset;
justify-content: center;
align-items: center;
background-color: _palette(accent-dark);
border-radius: 5px 5px 0 0;
}
#npTitle {
margin: 0;
padding: 21px;
}
#npAction {
display: none;
margin: 0;
padding: 21px;
font-size: 12px;
}
#plList {
margin: 0;
}
#plList li {
background-color: _palette(border-darken);
cursor: pointer;
margin: 0;
padding: 21px 0;
border: 1px solid _palette(accent-dark);
border-top: 0;
transition: all 400ms ease-in-out;
}
#plList li:hover {
background-color: _palette(border-alt);
transition: all 400ms ease-in-out;
}
.plItem {
position: relative;
}
.plTitle {
left: 75px;
overflow: hidden;
position: absolute;
right: 65px;
text-overflow: ellipsis;
top: 0;
white-space: nowrap;
font-weight: bold;
padding-right: 10px;
}
.plNum {
padding-left: 21px;
width: 65px;
}
.plLength {
padding-left: 21px;
position: absolute;
right: 21px;
top: 0;
}
.plSel, .plSel:hover {
background-color: _palette(border-alt)!important;
cursor: default!important;
border-radius: 5px;
}
a[id^="btn"] {
background-color: _palette(border-darken);
color: _palette(fg);
cursor: pointer;
margin: 0;
padding: 0 27px 0 21px;
text-decoration: none;
}
a[id^="btn"]::-moz-focus-inner {
border: 0;
padding: 0;
}
#noJSalbum {
display: none;
}

48
_sass/staff.scss Normal file
View file

@ -0,0 +1,48 @@
.staff {
max-width: var(--max-width);
padding: 0;
margin: auto;
list-style: none;
display: flex;
flex-wrap: wrap;
li {
flex: 1 1 300px;
display: flex;
flex-direction: column;
padding: 30px 20px;
box-sizing: border-box;
width: 100%;
text-align: center;
.square-image {
background-size: cover;
background-position: center;
width: 100px;
height: 100px;
border-radius: 200px;
margin: 0 auto;
}
}
.name {
margin-top: 20px;
font-weight: 700;
}
.position {
color: var(--fg);
font-size: 1em;
}
@media only screen and (max-width: 769px) {
li {
.square-image {
width: 70px;
height: 70px;
}
}
}
}

9
_sass/svg.scss Normal file
View file

@ -0,0 +1,9 @@
#linearGradient2060 {
stop {
stop-color: var(--accent2);
}
stop:nth-child(even){
stop-color: var(--fg);
}
}

116
_sass/trackplayer.scss Normal file
View file

@ -0,0 +1,116 @@
#trackArt {
z-index: 5;
overflow-x: hidden;
flex: 1 1 50%;
min-width: 512px;
height: 100vh;
padding: 0;
margin: 0;
background-size: 100%;
background: var(--bg-alt);
background: linear-gradient(180deg, var(--bg-alt) 0%, var(--accent1-alt) 180%);
> section {
position: absolute;
height: 100vh;
width: 50%;
background: transparent;
padding: 0;
margin: 0;
text-align: center;
> * {
margin: 40px;
}
}
.coverartwrapper {
margin-top: 120px;
margin-left: 50%;
transform: translateX(-50%);
width: 50%;
padding-top: 50%; /* 1:1 Aspect Ratio */
position: relative; /* If you want text inside of it */
}
.coverartwrapped {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
border-radius: 100%;
padding-bottom: 0;
background-size: cover;
}
.playbutton {
cursor: pointer;
justify-self: center;
}
}
#trackInfo {
flex: 1 1 50%;
z-index: 5;
height:100vh;
overflow-y: scroll;
overflow-x: hidden;
margin: 0;
padding: 0;
section {
padding: 20px;
background-color: var(--bg-alt);
> * {
margin: 20px;
}
.info {
margin: 20px;
padding: 0;
}
p:first-child {
margin-top:80px;
}
}
.post-nav-next {
text-align: right;
}
.post-nav {
text-align: left;
}
}
.playerlogo {
}
@media only screen and (max-width: 1023px) {
#trackArt {
z-index: 5;
min-width: 100%;
section {
position: absolute;
top: 0;
margin: 0;
width: 100%;
height: 80vh;
}
}
#trackInfo {
z-index: 5;
height: unset;
overflow-y: unset;
section {
p:first-child {
margin-top:20px;
}
}
}
}
.bouncer {
-webkit-animation: backgroundSize 10s ease infinite;
-moz-animation: backgroundSize 10s ease infinite;
animation: backgroundSize 10s ease infinite;
}

52
artists.html
View file

@ -18,45 +18,33 @@ video_path: /assets/vid/artists.mp4
image: /assets/vid/artists.jpg image: /assets/vid/artists.jpg
--- ---
{% include relBase.html %} {% include relBase.html %}
<!-- Banner --> {% include header.html %}
<section class="banner onload-image-fade-in onload-content-fade-right style2 fullscreen content-align-center image-position-center">
<div class="image">
<img src="{{ relBase }}{{ page.image }}" alt="{{ page.title | smartify }}" class="editable" />
</div>
</section>
<!-- NEWS -->
<section id="news" class="wrapper style1 align-center">
<div class="inner" style="padding-top: 40px;">
<h1>{{ page.title }}</h1>
<p>{{ page.description }}</p>
<p>Our Artists are free and independent: We have no exclusivity deals. If you feel you can offer these Geniuses a better deal then <a href="https://github.com/Basspistol/Music-Syndicate" target="_blank" rel="noopener">ours,</a> you should contact them ASAP</p>
</div>
</section>
{% assign sorted = site.data.artists | sort: 'id' %} {% assign sorted = site.data.artists | sort: 'id' %}
{% for artist in sorted %} {% for post in sorted %}
<section id="second" class="spotlight style2 orient-{% cycle 'left', 'right' %} content-align-{% cycle 'right', 'left' %} image-position-center onscroll-image-fade-in" {% if forloop.index == 1 %}style="box-shadow: none;" {% endif %}> <section class="front-section">
<div class="content">
<h2>{{ artist.display_name }}</h2>
<!-- <p>{{ artist.bio }}</p> -->
<ul class="actions stacked"> <div style="background-image:url({{ post.image }})">
<li><a href="{{ artist.web }}?ref=TheOuternationalMusicSyndicate" target="_blank" rel="noopener" style="text-decoration:none;" class="button small icon solid fa-external-link-alt">Visit</a></li> <p class="editor-link"><a href="cloudcannon:collections/_artists/{{ post.path }}" rel="nofollow"
</ul> class="btn"><strong>&#9998;</strong> Edit Posy</a></p>
</div> </div>
<div class="image"> <div class="description">
<img src="{{ relBase }}{{ artist.image }}" alt="{{ artist.display_name | smartify }}" /> <div class="container">
<div class="">
<h3></h3>
{{ post.description }}
</div>
<div>
<p><a class="button" href="{{ relBase }}{{ post.link }}">🌍 {{ post.display_name }}</a></p>
</div>
</div>
</div> </div>
</section> </section>
{% endfor %} {% endfor %}
{% include footer.html %}
</body>
</html>

BIN
assets/css/Astloch-Bold.ttf
View file

Binary file not shown.

BIN
assets/css/Astloch-Refular.ttf
View file

Binary file not shown.

5
assets/css/all.min.css vendored Normal file
View file

File diff suppressed because one or more lines are too long

16
assets/css/colors.css Normal file
View file

@ -0,0 +1,16 @@
---
layout: nil
---
:root {
--bg: {{ site.data.colors.bg_color }};
--bg-alt: {{ site.data.colors.bg-alt_color }};
--fg: {{ site.data.colors.fg_color }};
--fg-alt: {{ site.data.colors.fg-alt_color }};
--border: {{ site.data.colors.border_color }};
--border-alt: {{ site.data.colors.border-alt_color }};
--accent1: {{ site.data.colors.accent1_color }};
--accent1-alt: {{ site.data.colors.accent1-alt_color }};
--accent2: {{ site.data.colors.accent2_color }};
--accent2-alt: {{ site.data.colors.accent2-alt_color }};
}

4
assets/css/font-awesome.min.css vendored Normal file
View file

File diff suppressed because one or more lines are too long

21
assets/css/main-20200812.scss Normal file
View file

@ -0,0 +1,21 @@
---
---
@import 'libs/vars';
@import 'libs/reset';
// sethy stuff
@import 'libs/animations';
@import 'layout';
@import 'elements';
@import 'forms';
@import 'navigation';
@import 'videos';
@import 'player';
@import 'trackplayer';
@import 'cookies';
@import 'set';
@import 'svg';
@import 'ethos';
@import 'staff';

192
assets/css/main20200710.scss
View file

@ -1,192 +0,0 @@
---
---
@import 'libs/vars';
@import 'libs/functions';
@import 'libs/mixins';
@import 'libs/vendor';
@import 'libs/breakpoints';
@import 'libs/html-grid';
@import 'fontawesome-all.min.css';
@import 'libs/fonts';
/*
Story by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
// Breakpoints.
@include breakpoints((
xlarge: ( 1281px, 1680px ),
large: ( 981px, 1280px ),
medium: ( 737px, 980px ),
small: ( 481px, 736px ),
xsmall: ( 361px, 480px ),
xxsmall: ( null, 360px )
));
// Mixins.
@mixin color($p) {
@include color-typography($p);
@include color-box($p);
@include color-button($p);
@include color-form($p);
@include color-icon($p);
@include color-list($p);
@include color-section($p);
@include color-table($p);
@include color-banner($p);
@include color-spotlight($p);
@include color-gallery($p);
@include color-items($p);
@include color-index($p);
}
// Phone.
@mixin phone($image-width) {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
border-radius: 0;
border: solid _size(border-width);
img {
@include vendor('object-fit', 'cover');
@include vendor('object-position', 'center');
display: block;
width: 100%;
height: 100%;
border-radius: 0;
}
&:before {
content: '';
display: block;
background-position: center;
background-repeat: no-repeat;
border: solid _size(border-width);
border-bottom: 0;
}
&:after {
content: '';
display: block;
background-position: center;
background-repeat: no-repeat;
border: solid _size(border-width);
border-top: 0;
}
@include resize-phone($image-width, 1);
}
@mixin resize-phone($image-width, $image-factor) {
$image-pad-top: 2.5rem;
$image-pad-bottom: 3rem;
$image-height: ($image-width * (1920 / 1080));
width: ($image-width * $image-factor);
height: (($image-width * $image-factor) * (1920 / 1080));
margin-top: ($image-pad-top * $image-factor);
margin-bottom: (_size(element-margin) + ($image-pad-bottom * $image-factor));
&:before {
height: ($image-pad-top * $image-factor);
background-size: (64px * $image-factor) (32px * $image-factor);
margin-top: (($image-pad-top * $image-factor) * -1);
border-radius: (1rem * $image-factor) (1rem * $image-factor) 0 0;
}
&:after {
height: ($image-pad-bottom * $image-factor);
background-size: (64px * $image-factor) (32px * $image-factor);
margin-bottom: (($image-pad-bottom * $image-factor) * -1);
border-radius: 0 0 (1rem * $image-factor) (1rem * $image-factor);
}
}
@mixin color-phone($p) {
border-color: _palette($p, border);
background-color: _palette($p, border);
@if ($p != 'invert') {
border-width: 0;
}
@else {
border-width: _size(border-width);
}
&:before {
background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="32px" viewBox="0 0 64 32" zoomAndPan="disable"><style>rect {fill: transparent; stroke: #{_palette($p, border)}; stroke-width: #{_size(border-width)}; }</style><rect rx="4" ry="4" x="11" y="12" width="42" height="8" vector-effect="non-scaling-stroke" /></svg>');
border-color: _palette($p, border);
@if ($p == 'invert') {
width: calc(100% + #{_size(border-width) * 2});
margin-left: (_size(border-width) * -1);
}
@else {
width: 100%;
}
}
&:after {
background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="32px" viewBox="0 0 64 32" zoomAndPan="disable"><style>circle {fill: transparent; stroke: #{_palette($p, border)}; stroke-width: #{_size(border-width)}; }</style><circle cx="32" cy="16" r="14" vector-effect="non-scaling-stroke" /></svg>');
border-color: _palette($p, border);
@if ($p == 'invert') {
width: calc(100% + #{_size(border-width) * 2});
margin-left: (_size(border-width) * -1);
}
@else {
width: 100%;
}
}
}
@mixin color-phone-variant($v, $p) {
@if ($v == 'android') {
&:after {
background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="32px" viewBox="0 0 64 32" zoomAndPan="disable"><style>rect {fill: transparent; stroke: #{_palette($p, border)}; stroke-width: #{_size(border-width)}; }</style><rect rx="4" ry="4" x="6" y="4" width="52" height="24" vector-effect="non-scaling-stroke" /></svg>');
}
}
@else if ($p == 'iphone') {
// ...
}
}
// Base.
@import 'base/reset';
@import 'base/page';
@import 'base/typography';
// Component.
@import 'components/row';
@import 'components/box';
@import 'components/button';
@import 'components/form';
@import 'components/icon';
@import 'components/image';
@import 'components/list';
@import 'components/actions';
@import 'components/icons';
@import 'components/section';
@import 'components/table';
@import 'components/banner';
@import 'components/spotlight';
@import 'components/gallery';
@import 'components/wrapper';
@import 'components/items';
@import 'components/index';
// Layout.
@import 'layout/wrapper';
// Set's customizations
@import 'set.scss';
@import 'player.scss';

258
assets/css/noscript20200710.scss
View file

@ -1,258 +0,0 @@
---
---
@import 'libs/vars';
@import 'libs/functions';
@import 'libs/mixins';
@import 'libs/vendor';
@import 'libs/breakpoints';
@import 'libs/html-grid';
@import 'libs/fonts';
/*
Story by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
/* Banner (transitions) */
.banner {
// Mixin.
@mixin transition-banner($event) {
$x: null;
$y: null;
@if ($event == 'load') {
$x: 'body.is-preload &';
$y: _duration(on-load);
}
@else if ($event == 'scroll') {
$x: '&.is-inactive';
$y: _duration(on-scroll);
}
// Content.
&.on#{$event}-content-fade-up {
.content {
@include vendor('transition', 'none');
}
#{$x} {
.content {
@include vendor('transform', 'none');
opacity: 1;
}
}
}
&.on#{$event}-content-fade-down {
.content {
@include vendor('transition', 'none');
}
#{$x} {
.content {
@include vendor('transform', 'none');
opacity: 1;
}
}
}
&.on#{$event}-content-fade-left {
.content {
@include vendor('transition', 'none');
}
#{$x} {
.content {
@include vendor('transform', 'none');
opacity: 1;
}
}
}
&.on#{$event}-content-fade-right {
.content {
@include vendor('transition', 'none');
}
#{$x} {
.content {
@include vendor('transform', 'none');
opacity: 1;
}
}
}
&.on#{$event}-content-fade-in {
.content {
@include vendor('transition', 'none');
}
#{$x} {
.content {
@include vendor('transform', 'none');
opacity: 1;
}
}
}
// Image.
&.on#{$event}-image-fade-up {
.image {
@include vendor('transition', 'none');
img {
@include vendor('transition', 'none');
}
}
#{$x} {
.image {
@include vendor('transform', 'none');
opacity: 1;
img {
opacity: 1;
}
}
}
}
&.on#{$event}-image-fade-down {
.image {
@include vendor('transition', 'none');
img {
@include vendor('transition', 'none');
}
}
#{$x} {
.image {
@include vendor('transform', 'none');
opacity: 1;
img {
opacity: 1;
}
}
}
}
&.on#{$event}-image-fade-left {
.image {
@include vendor('transition', 'none');
img {
@include vendor('transition', 'none');
}
}
#{$x} {
.image {
@include vendor('transform', 'none');
opacity: 1;
img {
opacity: 1;
}
}
}
}
&.on#{$event}-image-fade-right {
.image {
@include vendor('transition', 'none');
img {
@include vendor('transition', 'none');
}
}
#{$x} {
.image {
@include vendor('transform', 'none');
opacity: 1;
img {
opacity: 1;
}
}
}
}
&.on#{$event}-image-fade-in {
.image {
img {
@include vendor('transition', 'none');
}
}
#{$x} {
.image {
img {
opacity: 1;
}
}
}
}
}
// On Load.
@include transition-banner('load');
// On Scroll.
@include transition-banner('scroll');
}
// Set's customizations
@import 'set';
@import 'player';
.logo {
position: fixed;
top: 20px;
right: 20px;
width: 50%;
height: 10%;
background-color: transparent;
background-repeat: no-repeat;
background-position: center center;
background-size: 95% 95%;
-webkit-transition: all 400ms ease-in;
-moz-transition: all 400ms ease-in;
transition: all 400ms ease-in;
box-shadow: 0 0 10px 1px _palette(border-alt);
}
@media only screen and (min-width: 769px) {
.logo {
position: fixed;
top: 20px;
right: 20px;
width: 20%;
height: 10%;
background-color: transparent;
background-repeat: no-repeat;
background-position: center center;
background-size: 95% 95%;
-webkit-transition: all 400ms ease-in;
-moz-transition: all 400ms ease-in;
transition: all 400ms ease-in;
box-shadow: 0 0 10px 1px _palette(border-alt);
}
}
// Player link
#mainwrap {
display: none;
}
#noJSalbum {
display: unset;
}

23
assets/css/noscripts-20200812.scss Normal file
View file

@ -0,0 +1,23 @@
---
---
@import 'libs/vars';
@import 'libs/reset';
// sethy stuff
@import 'libs/animations';
@import 'layout';
@import 'elements';
@import 'forms';
@import 'navigation';
@import 'videos';
@import 'player';
@import 'trackplayer';
@import 'cookies';
@import 'set';
@import 'svg';
@import 'ethos';
@import 'staff';
@import 'noscripts';

BIN
assets/fonts/FontAwesome.otf Normal file
View file

Binary file not shown.

Some files were not shown because too many files have changed in this diff Show more