Added translation links
southerntofu
parent
644b5f05e7
commit
64f62a22e6
|
|
@ -1,4 +1,7 @@
|
||||||
@media screen and (max-width: 62em) {
|
@media screen and (max-width: 62em) {
|
||||||
// Do not overflow the ASCII art on smaller screens
|
// Do not overflow the ASCII art on smaller screens
|
||||||
header > pre { font-size: 0.4em; }
|
header {
|
||||||
|
> pre { font-size: 0.4em; }
|
||||||
|
> .widget-bubble { max-width: 60%; }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,72 @@
|
||||||
|
.widget-bubble {
|
||||||
|
background: #efefef;
|
||||||
|
border: 1px solid #a7a7a7;
|
||||||
|
-webkit-border-radius: 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
-webkit-box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.2);
|
||||||
|
box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.2);
|
||||||
|
margin: 0 auto;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.widget-bubble-arrow::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.widget-bubble-arrow::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.widget-bubble-arrow {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.widget-bubble-left {
|
||||||
|
> .widget-bubble-arrow { left: 15px; }
|
||||||
|
> .widget-bubble-arrow::before {
|
||||||
|
left: 5px;
|
||||||
|
border-right: 23px solid transparent;
|
||||||
|
}
|
||||||
|
> .widget-bubble-arrow::after {
|
||||||
|
left: 6px;
|
||||||
|
border-right: 21px solid transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.widget-bubble-right {
|
||||||
|
> .widget-bubble-arrow { right: 15px; }
|
||||||
|
> .widget-bubble-arrow::before {
|
||||||
|
right: 5px;
|
||||||
|
border-left: 23px solid transparent;
|
||||||
|
}
|
||||||
|
> .widget-bubble-arrow::after {
|
||||||
|
right: 6px;
|
||||||
|
border-left: 21px solid transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.widget-bubble-bottom {
|
||||||
|
> .widget-bubble-arrow::after {
|
||||||
|
border-top: 21px solid #efefef;
|
||||||
|
bottom: 4px;
|
||||||
|
}
|
||||||
|
> .widget-bubble-arrow::before {
|
||||||
|
border-top: 23px solid #a7a7a7;
|
||||||
|
bottom: 2px;
|
||||||
|
}
|
||||||
|
> .widget-bubble-arrow { bottom: -25px }
|
||||||
|
}
|
||||||
|
|
||||||
|
.widget-bubble-top {
|
||||||
|
> .widget-bubble-arrow::after {
|
||||||
|
border-bottom: 21px solid #efefef;
|
||||||
|
top: 4px;
|
||||||
|
}
|
||||||
|
> .widget-bubble-arrow::before {
|
||||||
|
border-bottom: 23px solid #a7a7a7;
|
||||||
|
top: 2px;
|
||||||
|
}
|
||||||
|
> .widget-bubble-arrow { top: -25px }
|
||||||
|
}
|
||||||
|
|
@ -1,14 +1,18 @@
|
||||||
@import 'mobile';
|
@import 'mobile';
|
||||||
|
@import 'widgets';
|
||||||
|
|
||||||
.nav-menu {
|
.nav-menu {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
> a { margin: 0 1rem; } // Spacing entries
|
> a { margin: 0 1rem; } // Spacing entries
|
||||||
background-color: rgb(239, 239, 239);
|
|
||||||
color: black;
|
color: black;
|
||||||
padding: 0.5rem; // Leaving background space around entries
|
padding: 0.5rem; // Leaving background space around entries
|
||||||
}
|
}
|
||||||
|
|
||||||
header { text-align: center; font-weight: bold; }
|
header {
|
||||||
|
text-align: center;
|
||||||
|
font-weight: bold;
|
||||||
|
background-color: rgb(239, 239, 239);
|
||||||
|
}
|
||||||
|
|
||||||
article > div:first-child > h1, section > h1:first-child {
|
article > div:first-child > h1, section > h1:first-child {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
@ -45,3 +49,7 @@ main {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.widget-bubble {
|
||||||
|
max-width: 30%;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
{% import "widgets.html" as widgets %}
|
{% import "widgets.html" as widgets %}
|
||||||
{% set lang = section.lang | default(value=page.lang) %}
|
{% set lang = section.lang | default(value=page.lang) %}
|
||||||
|
{% set translations = section.translations | default(value=page.translations) %}
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html class="no-js" lang="{{ lang | default(value=config.default_language)}}">
|
<html class="no-js" lang="{{ lang | default(value=config.default_language)}}">
|
||||||
<head>
|
<head>
|
||||||
|
|
@ -14,6 +15,9 @@
|
||||||
<header>
|
<header>
|
||||||
{% set header = get_page(path="_common/header.md") %}
|
{% set header = get_page(path="_common/header.md") %}
|
||||||
{{ header.content | markdown | safe }}
|
{{ header.content | markdown | safe }}
|
||||||
|
{% if translations %}
|
||||||
|
{{ widgets::bubble(content=widgets::translations(translations=translations), v="top", h="right") }}
|
||||||
|
{% endif %}
|
||||||
{{ widgets::menu(content="_common/menu.md") }}
|
{{ widgets::menu(content="_common/menu.md") }}
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
|
|
|
||||||
|
|
@ -54,3 +54,14 @@ a submenu. A submenu is an actual list
|
||||||
{%- else -%}
|
{%- else -%}
|
||||||
{%- set p = lang ~ "/" ~ path -%}{{ get_url(path=p) }}{%- endif -%}
|
{%- set p = lang ~ "/" ~ path -%}{{ get_url(path=p) }}{%- endif -%}
|
||||||
{%- endmacro i18n_url -%}
|
{%- endmacro i18n_url -%}
|
||||||
|
|
||||||
|
{% macro translations(translations) %}
|
||||||
|
{% for t in translations %}<a href="{{ t.permalink }}">{{ t.lang }}</a>{% endfor %}
|
||||||
|
{% endmacro translations %}
|
||||||
|
|
||||||
|
{% macro bubble(content, v="bottom", h="right") %}
|
||||||
|
<div class="widget-bubble widget-bubble-{{ v }} widget-bubble-{{ h }}">
|
||||||
|
<div class="widget-bubble-arrow"></div>
|
||||||
|
{{ content | safe }}
|
||||||
|
</div>
|
||||||
|
{% endmacro bubble %}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue