diff --git a/css/custom.css b/css/custom.css index 56accdc..535e33e 100644 --- a/css/custom.css +++ b/css/custom.css @@ -1,4 +1,4 @@ -body, wrapper +body, #wrapper { min-height: 100vh; } diff --git a/css/sidebar.css b/css/sidebar.css new file mode 100644 index 0000000..d642b2a --- /dev/null +++ b/css/sidebar.css @@ -0,0 +1,208 @@ +/*! + * Start Bootstrap - Simple Sidebar (https://startbootstrap.com/template-overviews/simple-sidebar) + * Copyright 2013-2017 Start Bootstrap + * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-simple-sidebar/blob/master/LICENSE) + */ + +#wrapper, #sidebar-wrapper, #menu-toggle-icon { + -webkit-transition: all 0.5s ease; + -moz-transition: all 0.5s ease; + -o-transition: all 0.5s ease; + transition: all 0.5s ease; +} + +#wrapper.toggled { + padding-left: 0; +} + +#sidebar-wrapper { + z-index: 1000; + position: fixed; + top 0; + left: 0; + width: 100%; + height: 3em; + overflow-y: auto; + background: #000; + padding: 10px; + padding-left: 0; + + border-width: thin; + border-color: white; +} + +#wrapper.toggled #sidebar-wrapper { + height: 100%; +} + +#wrapper.toggled #menu-toggle-icon { + -moz-transform: scale(1, -1); + -webkit-transform: scale(1, -1); + -o-transform: scale(1, -1); + -ms-transform: scale(1, -1); + transform: scale(1, -1); +} + +#menu-toggle, #menu-toggle-icon { + display: block-inline; +} + +#menu-toggle +{ + z-index: 1500; + position: absolute; + width: 100%; + top: 0; + height: 2em; + padding: 0.5em; + text-align: center; + color: #fff; + -webkit-transition: all 0.5s ease; + -moz-transition: all 0.5s ease; + -o-transition: all 0.5s ease; + transition: all 0.5s ease; +} + +.content-wrapper { + margin-top: 3em; + position: relative; +} + +/* Sidebar Styles */ + +.sidebar-nav { + white-space: nowrap; + opacity: 0; + visibility: hidden; + overflow-x: hidden; + position: absolute; + width: 100%; + top: 0; + margin: 0; + padding: 0; + padding-bottom: 3em; + list-style: none; + -webkit-transition: all 0.5s ease; + -moz-transition: all 0.5s ease; + -o-transition: all 0.5s ease; + transition: all 0.5s ease; +} + +#wrapper.toggled #sidebar-wrapper .sidebar-nav { + opacity: 1; + visibility: visible; + overflow-x: visible; + width: 100%; +} + +.sidebar-nav li { + text-indent: 20px; + line-height: 40px; +} + +.sidebar-nav li.sidebar-brand { + text-align: center; + text-indent: 0; + padding: 0 20px 0 20px; + margin: 0.5em 0 0.5em 0; +} + +.sidebar-nav li.sidebar-brand a img { + filter: invert(100%); +} + +.sidebar-nav li.sidebar-brand a img, +.sidebar-nav li.sidebar-brand { + height: 5em; +} + +.sidebar-nav li a { + display: block; + text-decoration: none; + color: #bbb; +} + +.sidebar-nav li a:hover { + text-decoration: none; + color: #fff; + background: rgba(255, 255, 255, 0.2); +} + +.sidebar-nav li a:active, .sidebar-nav li a:focus { + text-decoration: none; +} + +.sidebar-nav>.sidebar-brand { + height: 65px; + font-size: 18px; + line-height: 60px; +} + +.sidebar-nav>.sidebar-brand a { + color: #999999; +} + +.sidebar-nav>.sidebar-brand a:hover { + color: #fff; + background: none; +} + +.sidebar-nav>.sidebar-toggle { + width: 100%; + text-indent: 0; + z-index: -1000; +} + +.sidebar-nav>.sidebar-spacer { + height: 3em; +} + +@media (min-width: 576px) { + .sidebar-nav { + width: 0; + } + + #sidebar-wrapper { + left: 250px; + width: 3em; + height: 100%; + margin-left: -250px; + + border-right-style: solid; + } + + #wrapper { + padding-top: 0em; + padding-left: 3em; + } + + .content-wrapper { + margin-top: 0; + position: relative; + } + + #wrapper.toggled #menu-toggle-icon { + -moz-transform: scale(-1, 1); + -webkit-transform: scale(-1, 1); + -o-transform: scale(-1, 1); + -ms-transform: scale(-1, 1); + transform: scale(-1, 1); + } + + #wrapper.toggled #sidebar-wrapper { + width: 250px; + } + + #wrapper.toggled { + padding-left: 250px; + } + + #wrapper.toggled #sidebar-wrapper .sidebar-nav { + width: 100%; + } + + #menu-toggle { + width: auto; + text-align: right; + } +} diff --git a/templates/info.html.twig b/templates/info.html.twig new file mode 100644 index 0000000..5f78054 --- /dev/null +++ b/templates/info.html.twig @@ -0,0 +1,16 @@ +{% extends 'partials/base.html.twig' %} + +{% block content %} +
+ {% set text_class = 'col-12' %} + {% if page.media.images %} + {% set text_class = 'col-12 col-md-6' %} +
+ +
+ {% endif %} +
+ {{ page.content }} +
+
+{% endblock %} diff --git a/templates/item.html.twig b/templates/item.html.twig index f825d45..f80fcda 100644 --- a/templates/item.html.twig +++ b/templates/item.html.twig @@ -1,4 +1,5 @@ {% extends 'partials/base.html.twig' %} + {% set blog = page.find(header_var('blog_url')|defined(theme_var('blog-page'))) %} {% set show_breadcrumbs = header_var('show_breadcrumbs', [page, blog])|defined(true) %} {% set show_sidebar = header_var('show_sidebar', [page, blog])|defined(true) %} diff --git a/templates/modular.html.twig b/templates/modular.html.twig new file mode 100644 index 0000000..9c218e7 --- /dev/null +++ b/templates/modular.html.twig @@ -0,0 +1,27 @@ +{% extends 'partials/base.html.twig' %} + +{% set collection = page.collection() %} + +{% block content %} + {{ page.content }} + {% for child in collection %} + {% if child.template == 'info' %} +
+ {% set text_class = 'col-12' %} + {% if child.media.images|first %} + {% set text_class = 'col-12 col-md-6' %} +
+ +
+ {% endif %} +
+ {{ child.content }} +
+
+ {% else %} + {{ child.title }} +

{{ child.summary }}

+ {% endif %} +
+ {% endfor %} +{% endblock %} diff --git a/templates/partials/base.html.twig b/templates/partials/base.html.twig index 7e8fb05..b4256a5 100644 --- a/templates/partials/base.html.twig +++ b/templates/partials/base.html.twig @@ -32,36 +32,33 @@ {% endblock %} +
+ {% block body %} +
+ {% block header %} + {% include 'partials/navbar.html.twig' %} + {% endblock %} + {% block content %}{% endblock %} +
+ {% endblock %} - - -{% block header %} - {% include 'partials/navbar.html.twig' %} -{% endblock %} - -{% block body %} -
- {% block content %}{% endblock %} -
-{% endblock %} - -{% block footer %} - -{% endblock %} - -{% block bottom %} - {{ assets.js('bottom')|raw }} -{% endblock %} + {% block footer %} + + {% endblock %} +
+ {% block bottom %} + {{ assets.js('bottom')|raw }} + {% endblock %} diff --git a/templates/pictures.html.twig b/templates/pictures.html.twig index 54c7e30..125557f 100644 --- a/templates/pictures.html.twig +++ b/templates/pictures.html.twig @@ -1,4 +1,5 @@ {% extends 'partials/base.html.twig' %} + {% set blog = page.find(header_var('blog_url')|defined(theme_var('blog-page'))) %} {% set show_breadcrumbs = header_var('show_breadcrumbs', [page, blog])|defined(true) %}