From a4ff3e1ba413d3bb2d47338fa62e81acc76272e8 Mon Sep 17 00:00:00 2001 From: codecalm Date: Tue, 1 Oct 2019 20:40:09 +0200 Subject: [PATCH] removed media, topmenu fixes --- pages/_data/menu.yml | 10 +- pages/_includes/layout/topmenu.html | 5 + pages/_layouts/base.html | 6 +- pages/_layouts/component.html | 7 +- pages/_layouts/default.html | 7 +- scss/tabler.scss | 1 - scss/ui/_media.scss | 158 ---------------------------- 7 files changed, 18 insertions(+), 176 deletions(-) create mode 100644 pages/_includes/layout/topmenu.html delete mode 100644 scss/ui/_media.scss diff --git a/pages/_data/menu.yml b/pages/_data/menu.yml index 83509188e..914728e6c 100644 --- a/pages/_data/menu.yml +++ b/pages/_data/menu.yml @@ -55,11 +55,11 @@ docs: icon: file-text url: docs.html -changelog: - url: changelog.html - title: Changelog - icon: file-plus - label: v1.0 +#changelog: +# url: changelog.html +# title: Changelog +# icon: file-plus +# label: v1.0 components: url: components.html diff --git a/pages/_includes/layout/topmenu.html b/pages/_includes/layout/topmenu.html new file mode 100644 index 000000000..65b2cc8a8 --- /dev/null +++ b/pages/_includes/layout/topmenu.html @@ -0,0 +1,5 @@ + diff --git a/pages/_layouts/base.html b/pages/_layouts/base.html index c20ca6226..2a0025197 100644 --- a/pages/_layouts/base.html +++ b/pages/_layouts/base.html @@ -1,9 +1,9 @@ - - - + + + diff --git a/pages/_layouts/component.html b/pages/_layouts/component.html index cb13fdbeb..a2dfdb2fa 100644 --- a/pages/_layouts/component.html +++ b/pages/_layouts/component.html @@ -1,20 +1,21 @@ --- layout: default menu: components +page-title: Tabler components --- {% assign columns = page.columns | default: 0 %}
-
+
{% for component in site.components %} {{ component.title }} {% endfor %}
-
-
+
+
0 %}class="flex-fill" style="max-width: {{ columns | times: 298 | minus: 24 }}px"{% endif %}> {{ content }}
diff --git a/pages/_layouts/default.html b/pages/_layouts/default.html index cfb0dd2b5..2b8ea136b 100644 --- a/pages/_layouts/default.html +++ b/pages/_layouts/default.html @@ -9,12 +9,7 @@ layout: base
{% include layout/topnav.html dark=page.header-dark sticky=page.header-sticky %} - - + {% include layout/topmenu.html %}
{% include layout/page-title.html %} diff --git a/scss/tabler.scss b/scss/tabler.scss index 346054698..75c5f3d9c 100644 --- a/scss/tabler.scss +++ b/scss/tabler.scss @@ -35,7 +35,6 @@ @import "ui/lists"; @import "ui/loaders"; @import "ui/login"; -@import "ui/media"; @import "ui/modals"; @import "ui/nav"; @import "ui/pagination"; diff --git a/scss/ui/_media.scss b/scss/ui/_media.scss deleted file mode 100644 index 7b8af4539..000000000 --- a/scss/ui/_media.scss +++ /dev/null @@ -1,158 +0,0 @@ -// stylelint-disable property-no-vendor-prefix - -.media { - position: relative; - display: flex; - flex-shrink: 0; - padding: 0; - overflow: hidden; - border-top-left-radius: inherit; - border-top-right-radius: inherit; - - &:not(:first-child):not(:last-child):not(:only-child) { - border-radius: 0; - } -} - -.media-list { - margin: 0; - padding: 0; - list-style: none; -} - -.media-overlay { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 2; - display: flex; - align-items: center; - padding: 1rem; - color: #fff; - - &.overlay-top { - bottom: auto; - } - - &.overlay-bottom { - top: auto; - } -} - -.media-action { - position: absolute; - top: 50%; - left: 50%; - z-index: 3; - - display: flex; - align-items: center; - pointer-events: none; - opacity: 0; - transition: opacity .3s; - transform: translate(-50%, -50%); - - &.active { - opacity: 1; - } - - &.media-action-overlay { - display: flex; - justify-content: space-around; - width: 100%; - height: 100%; - padding: 0 5%; - color: #fff; - background-color: rgba(0, 0, 0, .2); - - .btn { - flex-shrink: 0; - } - } -} - -.list-item:hover, -.list-item:active, -.media:hover, -.media:active, -.active > .media { - .media-action { - pointer-events: initial; - opacity: 1; - } -} - -.media iframe, -.media-content { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - display: flex; - align-items: center; - justify-content: center; - background-color: $body-bg; - background-repeat: no-repeat; - background-position: 50% 50%; - background-size: cover; - border: 0; - border-radius: inherit; -} - -.media-21x9::after { - padding-top: 42.857143%; -} - -.media-16x9::after { - padding-top: 56.25%; -} - -.media-4x3::after { - padding-top: 75%; -} - -.media-2x3::after { - padding-top: 150%; -} - -.media-3x4::after { - padding-top: 133.33333%; -} - -.media-1x2::after { - padding-top: 200%; -} - -.media-2x1::after { - padding-top: 50%; -} - -.media-1x1::after { - padding-top: 100%; -} - -.media-3x1::after { - padding-top: 33%; -} - -.media-4x1::after { - padding-top: 25%; -} - -.media-1-4::after { - min-height: 10rem; - padding-top: 25vh; -} - -.media-1-3::after { - min-height: 12.5rem; - padding-top: 33vh; -} - -.media-1-2::after { - min-height: 15rem; - padding-top: 50vh; -}