From d575bf52bb134cd66e57a6e52215e1d4173f8ac5 Mon Sep 17 00:00:00 2001 From: "Jan C. Borchardt" Date: Fri, 9 Oct 2020 17:37:14 +0200 Subject: Fix design of Explore page Signed-off-by: Jan C. Borchardt --- css/explore.css | 109 ------------------------------------------------------- css/explore.scss | 64 ++++++++++++++++++++++++++++++++ 2 files changed, 64 insertions(+), 109 deletions(-) delete mode 100644 css/explore.css create mode 100644 css/explore.scss (limited to 'css') diff --git a/css/explore.css b/css/explore.css deleted file mode 100644 index 8bf60a754..000000000 --- a/css/explore.css +++ /dev/null @@ -1,109 +0,0 @@ -/** - * Nextcloud - News - * - * This file is licensed under the Affero General Public License version 3 or - * later. See the COPYING file. - * - * @author Bernhard Posselt - * @copyright Bernhard Posselt 2014 - */ - -/** - * Explore styles - */ -.explore #app-content-wrapper { - height: 100%; -} - -#explore { - height: 100%; - width: 100%; - padding: 45px 0 45px 45px; -} - - -#explore .grid-item { - float: left; - width: 300px; - border-collapse: collapse; - border: 1px solid #ccc; - margin: 0 25px 25px 0; -} - -#explore h1 { - font-size: 13pt; - background-repeat: no-repeat; - background-position: 0 center; - background-size: 24px 24px; - padding: 5px 0 0 35px; -} - -#explore h1 a { - word-wrap: break-word; -} - -#explore h1 a:hover { - text-decoration: underline; -} - -#explore .category-wrapper { - text-align: center; -} - -#explore .category { - font-weight: normal; - font-size: 10pt; - color: var(--color-primary-text); - background-color: var(--color-primary); - padding: 10px; - font-weight: bold; -} - -#explore .grid-item-content { - padding: 30px; -} - -#explore .explore-logo { - text-align: center; - margin-top: 25px; -} - -#explore .explore-logo img { - width: 100%; -} - -#explore .explore-subscribe { - padding-top: 15px; - text-align: right; -} - -#explore .explore-content { - padding-top: 25px; -} - -#explore .explore-filter { - text-align: right; - padding: 0 30px 30px; -} - -#explore .explore-filter input, -#explore .explore-filter select { - margin-left: 10px; - display: inline-block; -} - -#explore .explore-filter input { - width: 200px; -} - -#explore .explore-footer { - clear: both; - margin: 75px 0; - text-align: center; -} - -#explore .explore-footer a { - font-size: 11pt; - color: #0000AA; - text-decoration: underline; -} diff --git a/css/explore.scss b/css/explore.scss new file mode 100644 index 000000000..d459ae825 --- /dev/null +++ b/css/explore.scss @@ -0,0 +1,64 @@ +/** + * Nextcloud - News + * + * This file is licensed under the Affero General Public License version 3 or + * later. See the COPYING file. + * + * @author Bernhard Posselt + * @copyright 2020, Jan C. Borchardt, https://jancborchardt.net + * @copyright Bernhard Posselt 2014 + */ + +/** + * Explore styles + */ +.explore #app-content-wrapper { + height: 100%; +} + +#explore { + height: 100%; + width: 100%; + padding: 45px 0 45px 45px; + + .grid-item { + width: 300px; + border: 2px solid var(--color-border); + border-radius: var(--border-radius-large); + margin: 0 24px 24px 0; + padding: 24px; + + .explore-title { + background-repeat: no-repeat; + background-position: 0 center; + background-size: 24px; + padding-left: 32px; + + a { + word-wrap: break-word; + + &:hover, + &:focus { + text-decoration: underline; + } + } + } + + .explore-logo { + text-align: center; + margin-top: 25px; + + img { + width: 100%; + } + } + + .explore-subscribe { + margin-top: 16px; + max-width: 100%; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } +} -- cgit v1.2.3