From 54ee240878ed95ebe08ff7a226fc07f8a69b1073 Mon Sep 17 00:00:00 2001 From: ArthurHoaro Date: Sat, 9 Feb 2019 16:56:24 +0100 Subject: Fix button overlapping on mobile in linklist --- assets/default/scss/shaarli.scss | 3 +++ 1 file changed, 3 insertions(+) (limited to 'assets/default/scss/shaarli.scss') diff --git a/assets/default/scss/shaarli.scss b/assets/default/scss/shaarli.scss index 760d8d6a..691b2b37 100644 --- a/assets/default/scss/shaarli.scss +++ b/assets/default/scss/shaarli.scss @@ -544,7 +544,10 @@ body, color: $dark-grey; font-size: .9em; + a { + display: inline-block; + margin: 3px 0; padding: 5px 8px; text-decoration: none; } -- cgit v1.2.3 From 8fc0a984f036cae692b5dc9095b5d7631f92bcbc Mon Sep 17 00:00:00 2001 From: ArthurHoaro Date: Mon, 22 Apr 2019 10:19:10 +0200 Subject: Slightly lighten visited link color To make it more visible in the middle of raw text. --- assets/default/scss/shaarli.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'assets/default/scss/shaarli.scss') diff --git a/assets/default/scss/shaarli.scss b/assets/default/scss/shaarli.scss index 691b2b37..b14052ed 100644 --- a/assets/default/scss/shaarli.scss +++ b/assets/default/scss/shaarli.scss @@ -13,7 +13,7 @@ $dark-grey: #252525; $light-grey: #797979; $main-green: #1b926c; $light-green: #b0ddce; -$dark-green: #2a4c41; +$dark-green: #186446; $red: #ac2925; $orange: #f89406; $blue: #0b5ea6; -- cgit v1.2.3 From d3defcac1c6785ea074070ba6290e68efe16b1a8 Mon Sep 17 00:00:00 2001 From: ArthurHoaro Date: Mon, 22 Apr 2019 11:23:47 +0200 Subject: Display sticky label in linklist Add sticky label, like private label, in linklist to make it more visible. --- assets/default/scss/shaarli.scss | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) (limited to 'assets/default/scss/shaarli.scss') diff --git a/assets/default/scss/shaarli.scss b/assets/default/scss/shaarli.scss index 691b2b37..518fecdf 100644 --- a/assets/default/scss/shaarli.scss +++ b/assets/default/scss/shaarli.scss @@ -716,11 +716,19 @@ body, } } + .label { + font-family: Arial, sans-serif; + font-size: .65em; + } + .label-private { border: solid 1px $orange; color: $orange; - font-family: Arial, sans-serif; - font-size: .65em; + } + + .label-sticky { + border: solid 1px $blue; + color: $blue; } } -- cgit v1.2.3 From 374f89e721047bb983d3c3270e73b2ffe8d9d079 Mon Sep 17 00:00:00 2001 From: ArthurHoaro Date: Wed, 8 May 2019 12:09:06 +0200 Subject: Add print CSS rules to the default template Fixes #1291 * Display the header bar only on the first page * Hide search bars, pagination buttons, filters, and edit/delete buttons --- assets/default/scss/shaarli.scss | 14 ++++++++++++++ 1 file changed, 14 insertions(+) (limited to 'assets/default/scss/shaarli.scss') diff --git a/assets/default/scss/shaarli.scss b/assets/default/scss/shaarli.scss index a529f01c..90000750 100644 --- a/assets/default/scss/shaarli.scss +++ b/assets/default/scss/shaarli.scss @@ -1611,3 +1611,17 @@ form { white-space: nowrap; } } + +// Print rules +@media print { + .shaarli-menu { + position: absolute; + } + + .search-linklist, + .link-count-block, + .linklist-item-infos-controls-group, + .mobile-buttons { + display: none; + } +} -- cgit v1.2.3 From b2143ff480dab4c57320166bd1569ebcdde4731c Mon Sep 17 00:00:00 2001 From: ArthurHoaro Date: Sun, 19 May 2019 11:57:23 +0200 Subject: Switch from FontAwesome v4.x to ForkAwesome And use the Shaarli icon made by @xuv in the header and footer (default template). --- assets/default/scss/shaarli.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'assets/default/scss/shaarli.scss') diff --git a/assets/default/scss/shaarli.scss b/assets/default/scss/shaarli.scss index a529f01c..95e2ba93 100644 --- a/assets/default/scss/shaarli.scss +++ b/assets/default/scss/shaarli.scss @@ -1,6 +1,6 @@ -$fa-font-path: '~font-awesome/fonts'; +$fa-font-path: '~fork-awesome/fonts'; -@import '~font-awesome/scss/font-awesome'; +@import '~fork-awesome/scss/fork-awesome'; @import '~purecss/build/pure.css'; @import '~purecss/build/grids-responsive.css'; @import '~pure-extras/css/pure-extras.css'; -- cgit v1.2.3 From a5a0c0399bcfea518330c4bad186da77f89ace6e Mon Sep 17 00:00:00 2001 From: ArthurHoaro Date: Mon, 8 Jul 2019 23:10:00 +0200 Subject: WIP - Plugin to override default template colors * Adds a new core plugin to override default template colors * Adds a new hook when plugin settings are saved (`save_plugin_parameters`) * Use CSS native variables for main colors instead of SASS variables * Disable SASS sort order rules due to a bug in the plugin Fixes #1312 --- assets/default/scss/shaarli.scss | 58 ++++++++++++++++++++++------------------ 1 file changed, 32 insertions(+), 26 deletions(-) (limited to 'assets/default/scss/shaarli.scss') diff --git a/assets/default/scss/shaarli.scss b/assets/default/scss/shaarli.scss index 9e5464a0..1d89f998 100644 --- a/assets/default/scss/shaarli.scss +++ b/assets/default/scss/shaarli.scss @@ -25,9 +25,15 @@ $warning-text: #97600d; $form-input-border: #d8d8d8; $form-input-background: #eee; +:root { + --main-color: #{$main-green}; + --background-color: #{$background-color}; + --dark-main-color: #{$dark-green}; +} + // General body { - background: $background-color; + background: var(--background-color); } .strong { @@ -143,7 +149,7 @@ body, } .pure-alert-success { - background-color: $main-green; + background-color: var(--main-color); } .pure-alert-warning { @@ -169,7 +175,7 @@ body, top: 0; transition: max-height .5s; z-index: 999; - background: $main-green; + background: var(--main-color); width: 100%; // Hack to transition with auto height: http://stackoverflow.com/a/8331169/1484919 max-height: 45px; @@ -322,7 +328,7 @@ body, button { border: 0; border-radius: 2px; - background-color: $main-green; + background-color: var(--main-color); padding: 4px 8px 6px; color: $almost-white; } @@ -358,7 +364,7 @@ body, .search-tagcloud { button { &:hover { - color: $background-color; + color: var(--background-color); } } } @@ -389,7 +395,7 @@ body, position: fixed; visibility: hidden; z-index: 999; - background: $main-green; + background: var(--main-color); padding: 5px 0; width: 100%; height: 30px; @@ -411,7 +417,7 @@ body, margin: 0 0 5px; border: 1px solid $almost-white; border-radius: 2px; - background: $main-green; + background: var(--main-color); padding: 4px 0; width: 100px; height: 28px; @@ -419,7 +425,7 @@ body, &:hover { background: $almost-white; - color: $main-green; + color: var(--main-color); } } @@ -558,7 +564,7 @@ body, } .filter-on { - background: $main-green; + background: var(--main-color); color: $light-green; } @@ -697,7 +703,7 @@ body, &:visited { .linklist-link { - color: $dark-green; + color: var(--dark-main-color); } } @@ -708,7 +714,7 @@ body, } .linklist-link { - color: $main-green; + color: var(--main-color); font-size: 1.1em; &:hover { @@ -783,14 +789,14 @@ body, a { text-decoration: none; - color: $main-green; + color: var(--main-color); &:hover { color: $dark-grey; } &:visited { - color: $dark-green; + color: var(--dark-main-color); } } } @@ -888,7 +894,7 @@ body, &::before { display: block; margin: 10px auto; - background: linear-gradient(to right, $background-color, $dark-grey, $background-color); + background: linear-gradient(to right, var(--background-color), $dark-grey, var(--background-color)); width: 80%; height: 1px; content: ''; @@ -917,7 +923,7 @@ body, margin: 15px 5px; border: 0; box-shadow: 1px 1px 1px $form-input-border, -1px -1px 6px $form-input-border, -1px 1px 2px $form-input-border, 1px -1px 2px $form-input-border; - background: $main-green; + background: var(--main-color); min-width: 150px; height: 35px; vertical-align: center; @@ -941,7 +947,7 @@ body, padding: 10px 0; width: 100%; text-align: center; - color: $main-green; + color: var(--main-color); } .window-subtitle { @@ -950,7 +956,7 @@ body, a { text-decoration: none; - color: $main-green; + color: var(--main-color); font-weight: bold; &.button { @@ -1278,7 +1284,7 @@ form { .pure-button { &:hover { - background-color: $main-green; + background-color: var(--main-color); background-image: none; color: $almost-white; } @@ -1362,7 +1368,7 @@ form { } .validate-rename-tag { - color: $main-green; + color: var(--main-color); } } @@ -1458,7 +1464,7 @@ form { &::after { display: block; margin: 10px auto; - background: linear-gradient(to right, $background-color, $dark-grey, $background-color); + background: linear-gradient(to right, var(--background-color), $dark-grey, var(--background-color)); width: 90%; height: 1px; content: ''; @@ -1508,14 +1514,14 @@ form { .daily-entry-description { a { text-decoration: none; - color: $main-green; + color: var(--main-color); &:hover { text-shadow: 1px 1px $background-linklist-info; } &:visited { - color: $dark-green; + color: var(--dark-main-color); } } } @@ -1572,12 +1578,12 @@ form { } .pure-button-shaarli { - background-color: $main-green; + background-color: var(--main-color); } .progressbar { border-radius: 6px; - background-color: $main-green; + background-color: var(--main-color); padding: 1px; > div { @@ -1586,8 +1592,8 @@ form { -45deg, $almost-white, $almost-white 6px, - $background-color 6px, - $background-color 12px + var(--background-color) 6px, + var(--background-color) 12px ); width: 0%; height: 10px; -- cgit v1.2.3 From 4c029779c87f049acf58676881335da103741148 Mon Sep 17 00:00:00 2001 From: Rajat Hans Date: Wed, 24 Jul 2019 21:59:56 +0530 Subject: Responsive issue with delete button fix --- assets/default/scss/shaarli.scss | 1 - 1 file changed, 1 deletion(-) (limited to 'assets/default/scss/shaarli.scss') diff --git a/assets/default/scss/shaarli.scss b/assets/default/scss/shaarli.scss index 1d89f998..61e382b6 100644 --- a/assets/default/scss/shaarli.scss +++ b/assets/default/scss/shaarli.scss @@ -1078,7 +1078,6 @@ body, .page-form { .submit-buttons { .button { - display: block; margin: auto; } } -- cgit v1.2.3