elixir-toolkit-theme 1.5.0

data/assets/css/main.scss

@@ -0,0 +1,678 @@
+---
+permalink: assets/css/main.css
+---
+
+@import "bootstrap_variables";
+@import "bootstrap/bootstrap";
+@import "custom_variables";
+
+/*-----General styling-----*/
+
+main {
+    h1 {
+        font-family: $font-family-theme;
+        font-weight: 400;
+        margin-bottom: $spacer * 1.5;
+    }
+    h2,
+    .h2-like {
+        font-family: $font-family-theme;
+        font-weight: 700;
+        color: $h2-color;
+        margin-top: $spacer * 2;
+    }
+
+    h3 {
+        font-weight: 700;
+        margin-top: $spacer * 1.5;
+    }
+
+    h4 {
+        font-weight: 700;
+        color: $secondary;
+        margin-top: $spacer * 1.5;
+    }
+
+    h2 + h3 {
+        margin-top: $spacer * 0.5;
+    }
+
+    h3 + h4 {
+        margin-top: $spacer * 0.25;
+    }
+
+    a:not(.btn):hover {
+        text-decoration: underline;
+    }
+
+    ol li,
+    ul li {
+        margin: 10px 0px;
+    }
+
+    img {
+        @extend .img-fluid;
+    }
+}
+
+.ff-body {
+    font-family: $font-family-sans-serif !important;
+}
+
+.ff-theme {
+    font-family: $font-family-theme !important;
+}
+
+/*-----Blockquote-----*/
+
+blockquote {
+    margin-left: 20px;
+    border-left: 5px solid $gray-600;
+    padding-left: 10px;
+    color: $gray-600;
+    border-radius: $border-radius;
+}
+
+/*-----Selection color-----*/
+
+::-moz-selection {
+    color: $white;
+    background: $primary;
+}
+
+::selection {
+    color: $white;
+    background: $primary;
+}
+
+/*-----Color list marker-----*/
+
+ul li::marker {
+    color: $primary;
+}
+
+/*-----Emoji styling-----*/
+
+main img.emoji {
+    margin: 0px 0px 0.2em 0px;
+    width: 1.3em;
+}
+
+/*-----Code highlighting-----*/
+
+code {
+    background-color: $light;
+    border-radius: $border-radius;
+    padding: 2px 4px;
+}
+
+pre {
+    padding: 9.5px;
+    line-height: 1.42857143;
+    color: #333;
+    word-break: break-all;
+    word-wrap: break-word;
+    border: 1px solid #ccc;
+    border-radius: $border-radius;
+}
+
+pre code {
+    padding: 0;
+    font-size: inherit;
+    color: inherit;
+    background-color: transparent;
+    border-radius: 0;
+}
+
+/*-----Top navigation-----*/
+
+header .navbar {
+    background-color: $topnav-bg;
+    border-bottom: $topnav-border;
+    .navbar-brand {
+        color: $topnav-title-color;
+        img {
+            height: $topnav-brand-height;
+        }
+    }
+}
+
+// Break line in top navigation
+
+.nav-break {
+    @media (min-width: 992px) {
+        width: 1px;
+    }
+    @media (max-width: 992px) {
+        height: 1px;
+    }
+    background-color: rgba($nav-link-color, 0.3);
+}
+
+/*-----Search box top navigation-----*/
+
+.search-results {
+    position: absolute;
+    right: 0;
+    top: 100%;
+    display: none;
+    width: 36em;
+    max-height: calc(90vh - 200%) !important;
+    overflow-y: auto;
+    background-color: $white;
+    box-shadow: $box-shadow;
+    border-radius: $border-radius;
+    z-index: $zindex-dropdown;
+
+    ul {
+        padding-left: 0;
+        list-style: none;
+    }
+
+    a {
+        display: block;
+        padding: 0.5rem 0.75rem;
+    }
+
+    a:hover,
+    a.active {
+        background-color: $light;
+    }
+}
+@media (max-width: 992px) {
+    .search-results {
+        width: 100%;
+    }
+}
+
+.search-result-title {
+    display: inline-block;
+    width: 40%;
+    padding: 0.5rem 0.5rem 0.5rem 0;
+    vertical-align: top;
+}
+
+.search-result-doc {
+    display: flex;
+    align-items: center;
+    word-wrap: break-word;
+
+    .search-result-doc-parent {
+        font-size: 12px !important;
+        font-weight: 600;
+    }
+    .search-result-doc-title {
+        overflow: auto;
+        color: $body-color;
+    }
+}
+
+.search-result-section {
+    word-wrap: break-word;
+    color: $search-result-color;
+}
+
+.search-result-rel-url {
+    display: block;
+    overflow: hidden;
+    color: $gray-600;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font-size: 10px !important;
+}
+
+.search-result-previews {
+    display: inline-block;
+    width: 60%;
+    padding: 0.5rem 0 0.5rem 0.5rem;
+    color: $gray-600;
+    word-wrap: break-word;
+    border-left: 1px solid $light;
+    font-size: 12px !important;
+    vertical-align: top;
+}
+
+.search-result-preview + .search-result-preview {
+    margin-top: 0.25rem;
+}
+
+.search-result-highlight {
+    font-weight: bold;
+}
+
+.search-no-result {
+    padding: 0.5rem 0.75rem;
+}
+
+.search-active .search-results {
+    display: block;
+}
+
+/*-----Sidebar-----*/
+
+@media (min-width: 992px) {
+    #side-nav {
+        display: block !important;
+    }
+}
+
+.sidebar-collapse {
+    background-color: $sidebar-bg;
+    i {
+        font-size: 1.25rem;
+        float: right;
+        line-height: 1.25em;
+    }
+}
+
+.sidebar-collapse:not(.collapsed) {
+    color: $sidebar-color-active;
+    background-color: $sidebar-bg-active;
+}
+
+ul#menu {
+    > li:not(.sidebar-title) > a {
+        background-color: $sidebar-bg;
+        color: $sidebar-color;
+    }
+    li > a {
+        > span {
+            float: right;
+            width: 15px;
+            margin-left: $btn-padding-x;
+            text-align: center;
+        }
+
+        > span:after {
+            display: inline-block;
+            font-style: normal;
+            font-variant: normal;
+            text-rendering: auto;
+            -webkit-font-smoothing: antialiased;
+            font-family: "Font Awesome 5 Free";
+            font-weight: 900;
+            content: "\f078";
+            transition: transform 0.2s ease-in-out;
+        }
+    }
+    li.active {
+        &:not(.parent) > a {
+            background-color: $sidebar-bg-active;
+            color: $sidebar-color-active;
+        }
+        > a > span:after {
+            transform: rotate(-180deg);
+        }
+    }
+    ul {
+        display: none;
+        li {
+            a {
+                margin-left: 30px;
+                background-color: $sidebar-lvl2-bg;
+                color: $sidebar-lvl2-color;
+            }
+            ul li a {
+                margin-left: 60px;
+                background-color: $sidebar-lvl3-bg;
+                color: $sidebar-lvl3-color;
+            }
+        }
+    }
+}
+
+/*-----Summary under page title-----*/
+
+.summary {
+    font-size: 16px;
+    color: $gray-600;
+    margin: 20px 0px 20px 0px;
+    border-left: 5px solid $primary;
+    padding-left: 10px;
+}
+
+.summary:before {
+    font-weight: bold;
+}
+
+/*-----TOC-----*/
+
+#toc {
+    background-color: $toc-bg;
+    border: $toc-border;
+    // Indent the lists and reset any other padding
+
+    ul {
+        padding: 0 0 0 20px;
+    }
+
+    // Consistent vertical space between list items
+
+    li,
+    ul ul li {
+        margin: 8px 0 0 0;
+    }
+
+    // Sublists
+
+    ul ul {
+        list-style: circle outside;
+    }
+}
+
+/*-----Default badge-----*/
+
+.default-badge {
+    font-weight: inherit;
+    background-color: $badge-bg;
+    color: $badge-color;
+}
+
+.default-badge:hover {
+    color: $badge-color-hover;
+    background-color: $badge-bg-hover;
+}
+
+/*-----General table properties-----*/
+
+.table > :not(:first-child) {
+    border-color: inherit;
+}
+
+.dataTables_wrapper {
+    margin: $btn-focus-width $btn-focus-width 0 0;
+}
+
+table {
+    @extend .table;
+}
+
+// Tool table column width optimizations
+
+#tooltable {
+    tr th:nth-child(1) {
+        width: 25%;
+    }
+    tr th:nth-child(2) {
+        width: 40%;
+    }
+    td:nth-child(2) {
+        font-size: 0.9em;
+    }
+
+    p {
+        margin-bottom: 0;
+    }
+}
+
+#tooltable td:nth-child(1) a,
+#trainingtable td:nth-child(1) a {
+    font-weight: bold;
+}
+
+/*-----Footer-----*/
+
+footer {
+    font-size: 0.9em;
+    line-height: 24px;
+    background-color: $footer-bg;
+    border-top: $footer-border;
+    color: $footer-color;
+
+    a {
+        color: $footer-link-color !important;
+        font-weight: bold;
+    }
+
+    a:hover {
+        color: $footer-link-color-hover !important;
+    }
+
+    h2 {
+        font-size: 1em;
+    }
+
+    p {
+        margin-bottom: 0;
+    }
+
+    .copyright {
+        background-color: $footer-copyright-bg;
+    }
+}
+
+/*-----Contributors cards-----*/
+
+.contributor-cards {
+    .card {
+        background-color: $contr-card-bg;
+    }
+    .badge {
+        background-color: $primary;
+        margin: 10px 10px 0px 0px;
+    }
+    .card-affiliation {
+        color: $primary;
+        font-size: 0.8em;
+    }
+}
+/*-----Contributors carousel-----*/
+
+#contributors-carousel .carousel-control-next,
+#contributors-carousel .carousel-control-prev {
+    width: 3%;
+}
+
+@media (max-width: 768px) {
+    #contributors-carousel .card-title {
+        font-size: 0.5em;
+    }
+    #contributors-carousel .card-affiliation {
+        color: $primary;
+        font-size: 0.4em;
+    }
+    #contributors-carousel .card-body {
+        padding: 0rem 0.5rem 0.5rem 0.5rem;
+    }
+}
+
+/*-----------Social icons----------*/
+
+.social-icons {
+    line-height: 4ex;
+    width: 4ex;
+    height: 4ex;
+    text-align: center;
+}
+
+@media (max-width: 768px) {
+    #contributors-carousel .social-icons {
+        line-height: 1.2ex;
+        width: 1.2ex;
+        height: 1.2ex;
+    }
+}
+
+/*--------Page contributors---------*/
+.page-contributors {
+    background-color: $contr-bg;
+    .contributor-link {
+        background-color: $contr-link-bg;
+        .contributor-img-sm {
+            height: 1.7em;
+        }
+
+        .coordinator-crown {
+            font-size: 0.7em;
+            width: 1.9em;
+            height: 1.9em;
+            line-height: 1.9;
+            background-color: $contr-crown-bg;
+
+            .fa {
+                color: $contr-crown-color;
+            }
+        }
+    }
+}
+
+.contributor-img {
+    width: 130px;
+}
+
+/*-----Cookie consent banner-----*/
+
+.cookiealert {
+    position: fixed;
+    background-color: $footer-bg;
+    color: $footer-color;
+    border-top: $footer-border;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    margin: 0 !important;
+    z-index: 999;
+    opacity: 0;
+    visibility: hidden;
+    transform: translateY(100%);
+    transition: all 500ms ease-out;
+
+    a {
+        color: $footer-link-color !important;
+    }
+
+    a:hover {
+        color: $footer-link-color-hover !important;
+    }
+}
+
+.cookiealert.show {
+    opacity: 1;
+    visibility: visible;
+    transform: translateY(0%);
+    transition-delay: 1000ms;
+}
+
+/*-----Hoover classes-----*/
+
+.hover-primary:hover,
+.hover-primary:focus {
+    background-color: $btn-primary-bg-hover !important;
+    transition: $btn-transition;
+    color: $btn-primary-color-hover !important;
+}
+
+.text-hover-primary:hover,
+.text-hover-primary:focus {
+    transition: $btn-transition;
+    color: $primary !important;
+}
+
+/*-----Size components-----*/
+
+.h-40px {
+    height: 40px;
+}
+
+.h-24px {
+    height: 24px;
+}
+
+/*-----News and events-----*/
+
+li.upcoming_event,
+li.past_event,
+.events {
+    display: none;
+}
+
+.events,
+.news {
+    li {
+        border-left: $light 5px solid;
+        border-radius: $border-radius;
+        padding: 0px 11px;
+    }
+
+    i {
+        width: 20px;
+        text-align: center;
+    }
+
+    .title {
+        background-color: $news-title-bg;
+        font-weight: 600;
+        color: $white;
+        padding: 0px 11px;
+        border-radius: 0px 4px 4px 0px;
+        margin-left: -11px;
+        border: 1px solid $news-title-bg;
+        display: inline-block;
+    }
+}
+/*-----More information tiles-----*/
+
+.info-card {
+    background-color: $info-card-bg;
+    .card-header {
+        background-color: $info-card-header-bg;
+        color: $info-card-header-color;
+    }
+    a:hover {
+        .text-muted {
+            transition: $btn-transition;
+            color: $white !important;
+        }
+
+        i {
+            transition: $btn-transition;
+            color: $white !important;
+        }
+    }
+}
+
+/*-----Country flags-----*/
+
+.flag-icon {
+    border-radius: 3px;
+    background-size: cover;
+}
+
+
+/*-----Section navigation tiles-----*/
+
+.navigation-tiles {
+    .card {
+        background-color: $nav-card-bg;
+        .card-text {
+            min-height: 4.5em;
+        }
+        .card-header {
+            background-color: $nav-card-header-bg;
+
+            a {
+                color: $nav-card-header-color;
+            }
+        }
+        .badge {
+            font-weight: inherit;
+            background-color: $nav-card-badge-bg;
+            color: $nav-card-badge-color;
+        }
+
+        .badge:hover {
+            color: $nav-card-badge-color-hover;
+            background-color: $nav-card-badge-bg-hover;
+        }
+    }
+}
+
+/*-----Scaling presentations and videos-----*/
+
+iframe.scale {
+    height: 500px;
+    width: 100%;
+    margin: 40px 0;
+}
+
+@import "custom_classes";

data/assets/css/syntax.css

@@ -0,0 +1,60 @@
+.highlight  { background: #ffffff; }
+.highlight .c { color: #999988; font-style: italic } /* Comment */
+.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
+.highlight .k { font-weight: bold } /* Keyword */
+.highlight .o { font-weight: bold } /* Operator */
+.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
+.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
+.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
+.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
+.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
+.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gr { color: #aa0000 } /* Generic.Error */
+.highlight .gh { color: #999999 } /* Generic.Heading */
+.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
+.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
+.highlight .go { color: #888888 } /* Generic.Output */
+.highlight .gp { color: #555555 } /* Generic.Prompt */
+.highlight .gs { font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: #aaaaaa } /* Generic.Subheading */
+.highlight .gt { color: #aa0000 } /* Generic.Traceback */
+.highlight .kc { font-weight: bold } /* Keyword.Constant */
+.highlight .kd { font-weight: bold } /* Keyword.Declaration */
+.highlight .kp { font-weight: bold } /* Keyword.Pseudo */
+.highlight .kr { font-weight: bold } /* Keyword.Reserved */
+.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
+.highlight .m { color: #009999 } /* Literal.Number */
+.highlight .s { color: #d14 } /* Literal.String */
+.highlight .na { color: #008080 } /* Name.Attribute */
+.highlight .nb { color: #0086B3 } /* Name.Builtin */
+.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
+.highlight .no { color: #008080 } /* Name.Constant */
+.highlight .ni { color: #800080 } /* Name.Entity */
+.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
+.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
+.highlight .nn { color: #555555 } /* Name.Namespace */
+.highlight .nt { color: #000080 } /* Name.Tag */
+.highlight .nv { color: #008080 } /* Name.Variable */
+.highlight .ow { font-weight: bold } /* Operator.Word */
+.highlight .w { color: #bbbbbb } /* Text.Whitespace */
+.highlight .mf { color: #009999 } /* Literal.Number.Float */
+.highlight .mh { color: #009999 } /* Literal.Number.Hex */
+.highlight .mi { color: #009999 } /* Literal.Number.Integer */
+.highlight .mo { color: #009999 } /* Literal.Number.Oct */
+.highlight .sb { color: #d14 } /* Literal.String.Backtick */
+.highlight .sc { color: #d14 } /* Literal.String.Char */
+.highlight .sd { color: #d14 } /* Literal.String.Doc */
+.highlight .s2 { color: #d14 } /* Literal.String.Double */
+.highlight .se { color: #d14 } /* Literal.String.Escape */
+.highlight .sh { color: #d14 } /* Literal.String.Heredoc */
+.highlight .si { color: #d14 } /* Literal.String.Interpol */
+.highlight .sx { color: #d14 } /* Literal.String.Other */
+.highlight .sr { color: #009926 } /* Literal.String.Regex */
+.highlight .s1 { color: #d14 } /* Literal.String.Single */
+.highlight .ss { color: #990073 } /* Literal.String.Symbol */
+.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
+.highlight .vc { color: #008080 } /* Name.Variable.Class */
+.highlight .vg { color: #008080 } /* Name.Variable.Global */
+.highlight .vi { color: #008080 } /* Name.Variable.Instance */
+.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */