From 2e286d6a57ead80239ba74ab52b1439bbe3bfcf3 Mon Sep 17 00:00:00 2001 From: Hypolite Petovan Date: Sat, 15 Aug 2020 18:56:17 -0400 Subject: [PATCH 01/12] Move calendar/event stylesheets/scripts registration to modules - Add media parameter to Page->registerStylesheet - Fixes CSS precedence with custom theme stylesheet --- mod/cal.php | 5 +++++ mod/events.php | 5 +++++ src/App/Page.php | 9 ++++----- view/templates/event_head.tpl | 6 ------ view/templates/head.tpl | 4 ++-- view/theme/frio/templates/event_head.tpl | 4 ---- view/theme/frio/templates/head.tpl | 8 ++++---- 7 files changed, 20 insertions(+), 21 deletions(-) diff --git a/mod/cal.php b/mod/cal.php index 0e8e8a2af..1ac11dc98 100644 --- a/mod/cal.php +++ b/mod/cal.php @@ -105,6 +105,11 @@ function cal_content(App $a) // get the translation strings for the callendar $i18n = Event::getStrings(); + DI::page()->registerStylesheet('view/asset/fullcalendar/dist/fullcalendar.min.css'); + DI::page()->registerStylesheet('view/asset/fullcalendar/dist/fullcalendar.print.min.css', 'print'); + DI::page()->registerFooterScript('view/asset/moment/min/moment-with-locales.min.js'); + DI::page()->registerFooterScript('view/asset/fullcalendar/dist/fullcalendar.min.js'); + $htpl = Renderer::getMarkupTemplate('event_head.tpl'); DI::page()['htmlhead'] .= Renderer::replaceMacros($htpl, [ '$module_url' => '/cal/' . $a->data['user']['nickname'], diff --git a/mod/events.php b/mod/events.php index 69f6b6f32..d82fbd818 100644 --- a/mod/events.php +++ b/mod/events.php @@ -256,6 +256,11 @@ function events_content(App $a) // get the translation strings for the callendar $i18n = Event::getStrings(); + DI::page()->registerStylesheet('view/asset/fullcalendar/dist/fullcalendar.min.css'); + DI::page()->registerStylesheet('view/asset/fullcalendar/dist/fullcalendar.print.min.css', 'print'); + DI::page()->registerFooterScript('view/asset/moment/min/moment-with-locales.min.js'); + DI::page()->registerFooterScript('view/asset/fullcalendar/dist/fullcalendar.min.js'); + $htpl = Renderer::getMarkupTemplate('event_head.tpl'); DI::page()['htmlhead'] .= Renderer::replaceMacros($htpl, [ '$module_url' => '/events', diff --git a/src/App/Page.php b/src/App/Page.php index d3365a16c..c2bfb3887 100644 --- a/src/App/Page.php +++ b/src/App/Page.php @@ -165,11 +165,10 @@ class Page implements ArrayAccess * The path can be absolute or relative to the Friendica installation base folder. * * @param string $path - * + * @param string $media * @see Page::initHead() - * */ - public function registerStylesheet($path) + public function registerStylesheet($path, string $media = 'screen') { $path = Network::appendQueryParam($path, ['v' => FRIENDICA_VERSION]); @@ -177,7 +176,7 @@ class Page implements ArrayAccess $path = mb_substr($path, mb_strlen($this->basePath . DIRECTORY_SEPARATOR)); } - $this->stylesheets[] = trim($path, '/'); + $this->stylesheets[trim($path, '/')] = $media; } /** @@ -252,7 +251,7 @@ class Page implements ArrayAccess '$shortcut_icon' => $shortcut_icon, '$touch_icon' => $touch_icon, '$block_public' => intval($config->get('system', 'block_public')), - '$stylesheets' => array_unique($this->stylesheets), + '$stylesheets' => $this->stylesheets, ]) . $this->page['htmlhead']; } diff --git a/view/templates/event_head.tpl b/view/templates/event_head.tpl index 463ba720e..8990c6fb2 100644 --- a/view/templates/event_head.tpl +++ b/view/templates/event_head.tpl @@ -1,9 +1,3 @@ - - - - - - - -
+
From d5975ff0bcd73ab9d5775bf6189c5c76e8066b67 Mon Sep 17 00:00:00 2001 From: Hypolite Petovan Date: Sat, 15 Aug 2020 20:25:33 -0400 Subject: [PATCH 07/12] [frio] Add dynamic CSS property before introducing accented themes - Introduce variables for font colors - Set content background transparency on several background colors - Change radio/checkbox colors depending on the link color - Prevent post highlighting to end up on static white --- view/theme/frio/css/style.css | 113 +++++++++++++++++++++------------- view/theme/frio/js/theme.js | 2 +- view/theme/frio/style.php | 6 +- 3 files changed, 74 insertions(+), 47 deletions(-) diff --git a/view/theme/frio/css/style.css b/view/theme/frio/css/style.css index d2fa94e00..3f87f0170 100644 --- a/view/theme/frio/css/style.css +++ b/view/theme/frio/css/style.css @@ -10,7 +10,7 @@ body { background-size: $background_size_img; background-repeat: $background_repeat; background-attachment: fixed; - color: #777; + color: $font_color; font-family: 'Open Sans',sans-serif; } body.minimal { @@ -181,7 +181,7 @@ blockquote { .btn-default { background: #ededed; - color: #7a7a7a; + color: $font_color; } .btn-sm { padding: 4px 8px; @@ -416,6 +416,11 @@ nav.navbar .nav > li > button { color: $nav_icon_color; } +#topbar-first .nav > .open > a, +#topbar-first .nav > .open > button +{ + background-color: $nav_bg; +} #topbar-first .nav > li > a:hover, #topbar-first .nav > li > a:focus, #topbar-first .nav > li > button:not(#main-menu):hover, @@ -570,11 +575,11 @@ nav.navbar .nav > li > button:focus max-height: 400px; } #topbar-first #nav-notifications-menu a { - color: #555; + color: $font_color_darker; padding: 0; } #topbar-first #nav-notifications-menu li.notif-entry { - color: #555; + color: $font_color_darker; padding: 10px; border-bottom: 1px solid #eee; position: relative; @@ -800,7 +805,7 @@ nav.navbar .nav > li > button:focus background: $menu_background_hover_color; } #photo-edit-link-wrap { - color: #555; + color: $font_color_darker; margin-bottom: 15px; } @@ -817,7 +822,7 @@ nav.navbar .nav > li > button:focus aside .widget, .nav-container .widget { border: none; - color: #777; + color: $font_color; background-color: rgba(255, 255, 255, $contentbg_transp); box-shadow: 0 0 3px #dadada; -webkit-box-shadow: 0 0 3px #dadada; @@ -858,14 +863,14 @@ aside .widget li:hover, aside .widget li.selected, .nav-container .widget li:hover { z-index: 2; - color: #555; + color: $font_color_darker; background-color: rgba(247, 247, 247, $contentbg_transp); border-left: 3px solid $link_color !important; padding-left: 17px; } aside .widget li a, aside .widget li a:hover { - color: #555; + color: $font_color_darker; } /* forumlist widget */ @@ -1039,12 +1044,12 @@ aside .vcard #wallmessage-link { font-weight: bold; } #nav-short-info .contact-wrapper .media-heading a { - color: #555; + color: $font_color_darker; font-size: 14px !important; } #vcard-short-desc > .vcard-short-addr, #nav-short-info .contact-wrapper #contact-entry-url-network { - color: #777; + color: $font_color; font-size: 12px; } .network-content-wrapper > #viewcontact_wrapper-network, @@ -1080,16 +1085,16 @@ div#sidebar-group-list { } .group-edit-tool { - color: #555; + color: $font_color_darker; } .faded-icon { - color: #555; + color: $font_color_darker; opacity: 0.3; transition: all 0.1s ease-in-out; } .faded-icon:hover { - color: #555; + color: $font_color_darker; opacity: 1; } .icon-padding { @@ -1180,7 +1185,7 @@ section #jotOpen { } #jot-modal .modal-header a, #jot-modal .modal-header .btn-link, #profile-jot-submit-wrapper a, #profile-jot-submit-wrapper .btn-link { - color: #555; + color: $font_color_darker; text-transform: capitalize; } #jot-modal .modal-header { @@ -1214,7 +1219,7 @@ section #jotOpen { box-shadow: none; border-radius: 0 0 4px 4px; background: #fff; - color: #555; + color: $font_color_darker; } textarea#profile-jot-text:focus + #preview_profile-jot-text, textarea.comment-edit-text:focus + .comment-edit-form .preview { @@ -1296,7 +1301,7 @@ textarea.comment-edit-text:focus + .comment-edit-form .preview { padding: 0; } .fbrowser .breadcrumb > li:last-of-type a{ - color: #777; + color: $font_color; pointer-events: none; cursor: default; } @@ -1326,14 +1331,14 @@ textarea.comment-edit-text:focus + .comment-edit-form .preview { } .fbrowser .folders li:hover { z-index: 2; - color: #555; + color: $font_color_darker; background-color: rgba(247, 247, 247, $contentbg_transp); border-left: 3px solid $link_color; padding-left: 17px; } .fbrowser .folders li a, .fbrowser .folders li a:hover { - color: #555; + color: $font_color_darker; font-size: 13px; } .fbrowser .folders + .list { @@ -1400,7 +1405,7 @@ aside .panel-body { .desktop-view .wall-item-container .fakelink, .desktop-view .toplevel_item .fakelink, .desktop-view .toplevel_item .wall-item-container .wall-item-responses a { - color: #555; + color: $font_color; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; @@ -1514,7 +1519,7 @@ aside .panel-body { .media .media-body h4.media-heading { font-size: 14px; font-weight: 500; - color: #555; + color: $font_color_darker; } .media .media-body .addional-info a, .media .media-body h5.media-heading > a { display: block; @@ -1597,11 +1602,11 @@ aside .panel-body { border-radius: 3px; } .wall-item-body .body-attach > a { - color: #555; + color: $font_color_darker; display: inline-block; } .wall-item-body .body-attach > a div { - color: #555; + color: $font_color_darker; width: 20px; } @@ -1691,7 +1696,7 @@ code > .hl-main { } .wall-item-tags a { - color: #555; + color: $font_color_darker; } .wall-item-tags a:hover { @@ -1714,7 +1719,7 @@ code > .hl-main { } .wall-item-actions a, .wall-item-actions button { font-size: 13px; - color: #555; + color: $font_color_darker; } .wall-item-actions .active { font-weight: bold; @@ -1737,7 +1742,7 @@ code > .hl-main { text-transform: capitalize; } .wall-item-actions button:hover { - color: #555; + color: $font_color_darker; text-decoration: underline; } .wall-item-actions .separator { @@ -1867,7 +1872,7 @@ nav .acpopup { /** @todo: we schould consider the possebility to overwrite bootstrap dropdowns at the beginning of this file to get rid of the !important */ .textcomplete-item > a { - color: #555 !important; + color: $font_color_darker !important; padding: 5px 20px !important; } .textcomplete-item.active > a { @@ -1987,7 +1992,7 @@ ul.dropdown-menu li:hover { .media .location, .media .location a { font-size: 11px; - color: #bebebe; + color: $font_color_darker; } .media-list > li { padding: 10px; @@ -2012,11 +2017,26 @@ ul.dropdown-menu li:hover { box-shadow: none; } +.radio label::before, +.checkbox label::before { + background-color: $background_color; +} +.radio label::after { + background-color: $link_color; +} +.checkbox label::after { + color: $link_color; +} + .checkbox input[type="checkbox"]:focus + label::before, .radio input[type="radio"]:focus + label::before { outline-color: $link_hover_color; } +.help-block { + color: $font_color_darker; +} + input[type=range].form-control { padding-left: 0; padding-right: 0; @@ -2067,7 +2087,7 @@ input[type=range].form-control { background-color: rgba(255,255,255,$contentbg_transp); border-radius: 4px; position: relative; - color: #555; + color: $font_color_darker; box-shadow: 0 0 3px #dadada; -webkit-box-shadow: 0 0 3px #dadada; -moz-box-shadow: 0 0 3px #dadada; @@ -2095,7 +2115,7 @@ section > .generic-page-wrapper, .videos-content-wrapper, background-color: rgba(255,255,255,$contentbg_transp); border-radius: 4px; position: relative; - color: #555; + color: $font_color_darker; box-shadow: 0 0 3px #dadada; -webkit-box-shadow: 0 0 3px #dadada; -moz-box-shadow: 0 0 3px #dadada; @@ -2178,7 +2198,7 @@ ul.viewcontact_wrapper > li { } .contact-entry-desc { - color: #555; + color: $font_color_darker; } .contact-entry-checkbox { margin-top: -20px; @@ -2195,7 +2215,7 @@ ul.viewcontact_wrapper > li { .contact-wrapper .contact-action-link:hover, .textcomplete-item .contact-wrapper .contact-action-link { padding: 0 5px; - color: #555; + color: $font_color_darker; border: 0; } .contact-wrapper .contact-action-link { @@ -2228,7 +2248,7 @@ ul li:hover .contact-wrapper .contact-action-link:hover { } #contact-edit-status-wrapper { border: none; - background-color: #E1F5FE; + background-color: rgba(225, 245, 254, $contentbg_transp); margin: 15px -15px; } #contact-edit-settings { @@ -2425,7 +2445,7 @@ ul li:hover .contact-wrapper .contact-action-link:hover { padding-top: 15px; } #event-nav a { - color: #555; + color: $font_color_darker; } #event-edit-form-wrapper #event-edit-time { padding: 10px 0; @@ -2482,7 +2502,7 @@ ul li:hover .contact-wrapper .contact-action-link:hover { width: 100%; padding: 0 5px 0 15px; box-shadow: 1.5px 0 0 0 rgba(0, 0, 0, .1) inset; - color: #777; + color: $font_color; position: relative; } .event-card .event-card-content .event-map-btn { @@ -2493,7 +2513,7 @@ ul li:hover .contact-wrapper .contact-action-link:hover { } .event-card .event-card-title { font-size: 14px; - color: #555; + color: $font_color_darker; line-height: 15px; font-weight: bold; margin: 0; @@ -2573,7 +2593,7 @@ ul li:hover .contact-wrapper .contact-action-link:hover { position: relative; } .photo-comment-wrapper .wall-item-content { - color: #555; + color: $font_color_darker; font-size: 13px; } .photo-comment-wrapper .comment-wwedit-wrapper, @@ -2640,7 +2660,7 @@ details.profile-jot-net[open] summary:before { /* Emulates Bootstrap display */ .settings-block { margin: 0 0 5px; - background-color: rgba(255,255,255,0.95); + background-color: rgba(255, 255, 255, $contentbg_transp); border-radius: 4px; padding: 10px 15px; box-shadow: 0 0 3px #dadada; @@ -2725,7 +2745,7 @@ ul.notif-network-list > li { .intro-wrapper button.intro-action-link:hover { padding-right: 5px; padding-left: 5px; - color: #555; + color: $font_color_darker; } ul li:hover .intro-wrapper button.intro-action-link { opacity: 0.8; @@ -2772,7 +2792,7 @@ ul.notif-network-list li.unseen { .notif-item .notif-desc-wrapper a { height: 100%; display: block; - color: #555; + color: $font_color_darker; font-size: 13px; font-weight: 600; } @@ -2793,7 +2813,7 @@ little modifications to emulate a standard page template */ background-color: rgba(255,255,255,$contentbg_transp); border-radius: 4px; position: relative; - color: #555; + color: $font_color_darker; box-shadow: 0 0 3px #dadada; -webkit-box-shadow: 0 0 3px #dadada; -moz-box-shadow: 0 0 3px #dadada; @@ -2867,7 +2887,7 @@ section.help-content-wrapper li { margin-top: 2px; border: 1px solid #cccccc; border-radius: 3px; - background-color: #fff; + background-color: $background_color; -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; transition: border 0.15s ease-in-out, color 0.15s ease-in-out; @@ -2886,14 +2906,14 @@ section.help-content-wrapper li { padding-left: 3px; padding-top: 1px; font-size: 11px; - color: #555555; + color: $link_color; } #adminpage .addon .desc { padding-left: 10px; } .adminpage .admin-settings-action-link, .adminpage .admin-settings-action-link:hover { - color: #555; + color: $font_color_darker; } .adminpage .admin-settings-action-link:hover { opacity: 1; @@ -3066,6 +3086,11 @@ body .tread-wrapper .hovercard:hover .hover-card-content a { display: none; } +.pagination li > a, +.pager li > a { + background-color: rgba(255, 255, 255, $contentbg_transp); +} + /* * some temporary workarounds until this will solved * elsewhere (e.g. new templates) @@ -3256,7 +3281,7 @@ section .profile-match-wrapper { .fc .fc-event { background-color: #E3F2FD; border: 1px solid #BBDEFB; - color: #555; + color: $font_color_darker; } .fc .fc-month-view .fc-time, .fc .fc-listMonth-view .fc-list-item-time, diff --git a/view/theme/frio/js/theme.js b/view/theme/frio/js/theme.js index be814f083..b7f222c0a 100644 --- a/view/theme/frio/js/theme.js +++ b/view/theme/frio/js/theme.js @@ -702,7 +702,7 @@ function scrollToItem(elementId) { scrollTop: itemPos }, 400).promise().done( function() { // Highlight post/commenent with ID (GUID) - $el.animate(colWhite, 1000).animate(colShiny).animate(colWhite, 600); + $el.animate(colWhite, 1000).animate(colShiny).animate({backgroundColor: 'transparent'}, 600); }); } diff --git a/view/theme/frio/style.php b/view/theme/frio/style.php index 0309daf94..dadd04580 100644 --- a/view/theme/frio/style.php +++ b/view/theme/frio/style.php @@ -123,7 +123,7 @@ if (!isset($nav_icon_hover_color)) { if ($nihc->isLight()) { $nav_icon_hover_color = '#' . $nihc->darken(10); } else { - $nav_icon_hover_color = '#' . $nihc->lighten(10); + $nav_icon_hover_color = '#' . $nihc->lighten(20); } } if (!isset($link_hover_color)) { @@ -184,7 +184,9 @@ $options = [ '$background_size_img' => $background_size_img, '$background_repeat' => $background_repeat, '$login_bg_image' => $login_bg_image, - '$login_bg_color' => $login_bg_color + '$login_bg_color' => $login_bg_color, + '$font_color_darker' => $font_color_darker ?? '#555', + '$font_color' => $font_color ?? '#777', ]; $css_tpl = file_get_contents('view/theme/frio/css/style.css'); From 91a1e5df91b1f4852abf765aed7f9836dcf5fb58 Mon Sep 17 00:00:00 2001 From: Hypolite Petovan Date: Wed, 19 Aug 2020 22:54:12 -0400 Subject: [PATCH 08/12] Add more references to theme.php --- src/Module/Theme.php | 18 ++++++++---------- view/theme/frio/config.php | 1 + view/theme/frio/php/default.php | 1 + view/theme/frio/style.php | 1 + 4 files changed, 11 insertions(+), 10 deletions(-) diff --git a/src/Module/Theme.php b/src/Module/Theme.php index c904f1def..87aa8dedd 100644 --- a/src/Module/Theme.php +++ b/src/Module/Theme.php @@ -32,19 +32,17 @@ class Theme extends BaseModule { public static function rawContent(array $parameters = []) { - header("Content-Type: text/css"); + header('Content-Type: text/css'); - $a = DI::app(); + $theme = Strings::sanitizeFilePathItem($parameters['theme']); - if ($a->argc == 4) { - $theme = $a->argv[2]; - $theme = Strings::sanitizeFilePathItem($theme); + if (file_exists("view/theme/$theme/theme.php")) { + require_once "view/theme/$theme/theme.php"; + } - // set the path for later use in the theme styles - $THEMEPATH = "view/theme/$theme"; - if (file_exists("view/theme/$theme/style.php")) { - require_once("view/theme/$theme/style.php"); - } + // set the path for later use in the theme styles + if (file_exists("view/theme/$theme/style.php")) { + require_once "view/theme/$theme/style.php"; } exit(); diff --git a/view/theme/frio/config.php b/view/theme/frio/config.php index 57417af05..64809f399 100644 --- a/view/theme/frio/config.php +++ b/view/theme/frio/config.php @@ -129,6 +129,7 @@ function theme_admin(App $a) function frio_form($arr) { require_once 'view/theme/frio/php/scheme.php'; + require_once 'view/theme/frio/theme.php'; $scheme_info = get_scheme_info($arr['scheme']); $disable = $scheme_info['overwrites']; diff --git a/view/theme/frio/php/default.php b/view/theme/frio/php/default.php index bd5ef7f3f..7cbfdacfe 100644 --- a/view/theme/frio/php/default.php +++ b/view/theme/frio/php/default.php @@ -27,6 +27,7 @@ use Friendica\DI; use Friendica\Model\Profile; +require_once 'view/theme/frio/theme.php'; require_once 'view/theme/frio/php/frio_boot.php'; // $minimal = is_modal(); diff --git a/view/theme/frio/style.php b/view/theme/frio/style.php index dadd04580..99e705a96 100644 --- a/view/theme/frio/style.php +++ b/view/theme/frio/style.php @@ -22,6 +22,7 @@ use Friendica\DI; use Friendica\Util\Strings; +require_once 'view/theme/frio/theme.php'; require_once 'view/theme/frio/php/PHPColors/Color.php'; $scheme = ''; From cb588eb53512625f8f47f21c1d227da8f2288da5 Mon Sep 17 00:00:00 2001 From: Hypolite Petovan Date: Wed, 19 Aug 2020 22:58:00 -0400 Subject: [PATCH 09/12] [frio] Add scheme accent feature - Add new accented scheme light - Add first accent blue --- view/theme/frio/config.php | 30 +++++++++++++------- view/theme/frio/php/default.php | 14 ++++----- view/theme/frio/php/scheme.php | 5 +++- view/theme/frio/scheme/light.php | 20 +++++++++++++ view/theme/frio/style.php | 2 ++ view/theme/frio/templates/theme_settings.tpl | 28 +++++++++++++++++- view/theme/frio/theme.php | 1 + 7 files changed, 78 insertions(+), 22 deletions(-) create mode 100644 view/theme/frio/scheme/light.php diff --git a/view/theme/frio/config.php b/view/theme/frio/config.php index 64809f399..b93848cfe 100644 --- a/view/theme/frio/config.php +++ b/view/theme/frio/config.php @@ -34,6 +34,7 @@ function theme_post(App $a) if (isset($_POST['frio-settings-submit'])) { foreach ([ 'scheme', + 'scheme_accent', 'nav_bg', 'nav_icon_color', 'link_color', @@ -63,6 +64,7 @@ function theme_admin_post(App $a) if (isset($_POST['frio-settings-submit'])) { foreach ([ 'scheme', + 'scheme_accent', 'nav_bg', 'nav_icon_color', 'link_color', @@ -92,6 +94,7 @@ function theme_content(App $a) $node_scheme = DI::config()->get('frio', 'scheme', DI::config()->get('frio', 'scheme')); $arr['scheme'] = DI::pConfig()->get(local_user(), 'frio', 'scheme', DI::pConfig()->get(local_user(), 'frio', 'schema', $node_scheme)); + $arr['scheme_accent'] = DI::pConfig()->get(local_user(), 'frio', 'scheme_accent' , DI::config()->get('frio', 'scheme_accent')); $arr['share_string'] = ''; $arr['nav_bg'] = DI::pConfig()->get(local_user(), 'frio', 'nav_bg' , DI::config()->get('frio', 'nav_bg')); $arr['nav_icon_color'] = DI::pConfig()->get(local_user(), 'frio', 'nav_icon_color' , DI::config()->get('frio', 'nav_icon_color')); @@ -112,6 +115,7 @@ function theme_admin(App $a) $arr = []; $arr['scheme'] = DI::config()->get('frio', 'scheme', DI::config()->get('frio', 'schema')); + $arr['scheme_accent'] = DI::config()->get('frio', 'scheme_accent'); $arr['share_string'] = ''; $arr['nav_bg'] = DI::config()->get('frio', 'nav_bg'); $arr['nav_icon_color'] = DI::config()->get('frio', 'nav_icon_color'); @@ -134,16 +138,16 @@ function frio_form($arr) $scheme_info = get_scheme_info($arr['scheme']); $disable = $scheme_info['overwrites']; - $scheme_choices = []; - $scheme_choices['---'] = DI::l10n()->t('Custom'); - $files = glob('view/theme/frio/scheme/*.php'); - if ($files) { - foreach ($files as $file) { - $f = basename($file, '.php'); - if ($f != 'default') { - $scheme_name = ucfirst($f); - $scheme_choices[$f] = $scheme_name; - } + $schemes = [ + 'light' => DI::l10n()->t('Light (Accented)'), + ]; + + $legacy_schemes = []; + foreach (glob('view/theme/frio/scheme/*.php') ?: [] as $file) { + $scheme = basename($file, '.php'); + if (!in_array($scheme, ['default', 'light', 'dark', 'black'])) { + $scheme_name = ucfirst($scheme); + $legacy_schemes[$scheme] = $scheme_name; } } @@ -153,7 +157,11 @@ function frio_form($arr) $ctx = [ '$submit' => DI::l10n()->t('Submit'), '$title' => DI::l10n()->t('Theme settings'), - '$scheme' => ['frio_scheme', DI::l10n()->t('Select color scheme'), $arr['scheme'], '', $scheme_choices], + '$custom' => DI::l10n()->t('Custom'), + '$legacy' => DI::l10n()->t('Legacy'), + '$accented' => DI::l10n()->t('Accented'), + '$scheme' => ['frio_scheme', DI::l10n()->t('Select color scheme'), $arr['scheme'], $schemes, $legacy_schemes], + '$scheme_accent' => !$scheme_info['accented'] ? '' : ['frio_scheme_accent', DI::l10n()->t('Select scheme accent'), $arr['scheme_accent'], ['blue' => DI::l10n()->t('Blue'), 'red' => DI::l10n()->t('Red'), 'purple' => DI::l10n()->t('Purple'), 'green' => DI::l10n()->t('Green'), 'pink' => DI::l10n()->t('Pink')]], '$share_string' => $arr['scheme'] != '---' ? '' : ['frio_share_string', DI::l10n()->t('Copy or paste schemestring'), $arr['share_string'], DI::l10n()->t('You can copy this string to share your theme with others. Pasting here applies the schemestring'), false, false], '$nav_bg' => array_key_exists('nav_bg', $disable) ? '' : ['frio_nav_bg', DI::l10n()->t('Navigation bar background color'), $arr['nav_bg'], '', false], '$nav_icon_color' => array_key_exists('nav_icon_color', $disable) ? '' : ['frio_nav_icon_color', DI::l10n()->t('Navigation bar icon color '), $arr['nav_icon_color'], '', false], diff --git a/view/theme/frio/php/default.php b/view/theme/frio/php/default.php index 7cbfdacfe..ca661c283 100644 --- a/view/theme/frio/php/default.php +++ b/view/theme/frio/php/default.php @@ -63,19 +63,15 @@ $is_singleuser_class = $is_singleuser ? "is-singleuser" : "is-not-singleuser"; if ($scheme && is_string($scheme) && $scheme != '---') { if (file_exists('view/theme/frio/scheme/' . $scheme . '.php')) { $schemefile = 'view/theme/frio/scheme/' . $scheme . '.php'; + $scheme_accent = + DI::pConfig()->get($uid, 'frio', 'scheme_accent') ?: + DI::config()->get('frio', 'scheme_accent') ?: FRIO_SCHEME_ACCENT_BLUE; + require_once $schemefile; } - } else { - $nav_bg = DI::pConfig()->get($uid, 'frio', 'nav_bg'); } - if (empty($nav_bg)) { - $nav_bg = DI::config()->get('frio', 'nav_bg'); - } - - if (empty($nav_bg) || !is_string($nav_bg)) { - $nav_bg = "#708fa0"; - } + $nav_bg = $nav_bg ?: DI::pConfig()->get($uid, 'frio', 'nav_bg', DI::config()->get('frio', 'nav_bg', '#708fa0')); echo ''; ?> diff --git a/view/theme/frio/php/scheme.php b/view/theme/frio/php/scheme.php index 42fc21ab8..ced19327e 100644 --- a/view/theme/frio/php/scheme.php +++ b/view/theme/frio/php/scheme.php @@ -52,7 +52,8 @@ function get_scheme_info($scheme) 'description' => '', 'author' => [], 'version' => '', - 'overwrites' => [] + 'overwrites' => [], + 'accented' => false, ]; if (!is_file($themepath . 'scheme/' . $scheme . '.php')) return $info; @@ -84,6 +85,8 @@ function get_scheme_info($scheme) foreach ($theme_settings as $key => $value) { $info['overwrites'][$value] = true; } + } elseif ($k == 'accented') { + $info['accented'] = $v && $v != 'false' && $v != 'no'; } else { if (array_key_exists($k, $info)) { $info[$k] = $v; diff --git a/view/theme/frio/scheme/light.php b/view/theme/frio/scheme/light.php new file mode 100644 index 000000000..767abb244 --- /dev/null +++ b/view/theme/frio/scheme/light.php @@ -0,0 +1,20 @@ + + * Overwrites: nav_bg, nav_icon_color, link_color, background_color, login_bg_color, contentbg_transp + * Accented: yes + */ + +require_once 'view/theme/frio/php/PHPColors/Color.php'; + +$accentColor = new Color($scheme_accent); + +$nav_bg = '#' . $accentColor->darken(10); +$menu_background_hover_color = '#' . $accentColor->darken(5); +$nav_icon_color = "#fff"; +$link_color = '#' . $accentColor->getHex(); +$background_color = "#ededed"; +$login_bg_color = "#ededed"; +$contentbg_transp = 100; diff --git a/view/theme/frio/style.php b/view/theme/frio/style.php index 99e705a96..b70f5657a 100644 --- a/view/theme/frio/style.php +++ b/view/theme/frio/style.php @@ -34,6 +34,7 @@ DI::config()->load('frio'); // Default to hard-coded values for empty settings $scheme = DI::config()->get('frio', 'scheme', DI::config()->get('frio', 'schema')); +$scheme_accent = DI::config()->get('frio', 'scheme_accent') ?: FRIO_SCHEME_ACCENT_BLUE; $nav_bg = DI::config()->get('frio', 'nav_bg') ?: '#708fa0'; $nav_icon_color = DI::config()->get('frio', 'nav_icon_color') ?: '#ffffff'; $link_color = DI::config()->get('frio', 'link_color') ?: '#6fdbe8'; @@ -57,6 +58,7 @@ if ($uid) { // Only override display settings that have actually been set $scheme = DI::pConfig()->get($uid, 'frio', 'scheme', DI::pConfig()->get($uid, 'frio', 'schema')) ?: $scheme; + $scheme_accent = DI::pConfig()->get($uid, 'frio', 'scheme_accent') ?: $scheme_accent; $nav_bg = DI::pConfig()->get($uid, 'frio', 'nav_bg') ?: $nav_bg; $nav_icon_color = DI::pConfig()->get($uid, 'frio', 'nav_icon_color') ?: $nav_icon_color; $link_color = DI::pConfig()->get($uid, 'frio', 'link_color') ?: $link_color; diff --git a/view/theme/frio/templates/theme_settings.tpl b/view/theme/frio/templates/theme_settings.tpl index 5eee8346d..564f90fde 100644 --- a/view/theme/frio/templates/theme_settings.tpl +++ b/view/theme/frio/templates/theme_settings.tpl @@ -1,7 +1,33 @@ -{{include file="field_select.tpl" field=$scheme}} +
+ + +
+ +{{if $scheme_accent}} +
+

+ +
+{{/if}} {{if $share_string}}{{include file="field_input.tpl" field=$share_string}}{{/if}} {{if $nav_bg}}{{include file="field_colorinput.tpl" field=$nav_bg}}{{/if}} diff --git a/view/theme/frio/theme.php b/view/theme/frio/theme.php index e555f7f20..8c40dadd8 100644 --- a/view/theme/frio/theme.php +++ b/view/theme/frio/theme.php @@ -21,6 +21,7 @@ use Friendica\Model\Contact; use Friendica\Module; use Friendica\Util\Strings; +const FRIO_SCHEME_ACCENT_BLUE = '#1e87c2'; function frio_init(App $a) { global $frio; From e4a1ace3ad765493a5c31645c13a95ab9140dff5 Mon Sep 17 00:00:00 2001 From: Hypolite Petovan Date: Wed, 19 Aug 2020 22:58:21 -0400 Subject: [PATCH 10/12] [frio] Add more color accents --- view/theme/frio/templates/theme_settings.tpl | 20 ++++++++++++++++++++ view/theme/frio/theme.php | 5 +++++ 2 files changed, 25 insertions(+) diff --git a/view/theme/frio/templates/theme_settings.tpl b/view/theme/frio/templates/theme_settings.tpl index 564f90fde..505aa55c2 100644 --- a/view/theme/frio/templates/theme_settings.tpl +++ b/view/theme/frio/templates/theme_settings.tpl @@ -26,6 +26,26 @@   {{$scheme_accent.3.blue}} + + + +
{{/if}} diff --git a/view/theme/frio/theme.php b/view/theme/frio/theme.php index 8c40dadd8..4c37e42e7 100644 --- a/view/theme/frio/theme.php +++ b/view/theme/frio/theme.php @@ -22,6 +22,11 @@ use Friendica\Module; use Friendica\Util\Strings; const FRIO_SCHEME_ACCENT_BLUE = '#1e87c2'; +const FRIO_SCHEME_ACCENT_RED = '#b50404'; +const FRIO_SCHEME_ACCENT_PURPLE = '#a54bad'; +const FRIO_SCHEME_ACCENT_GREEN = '#218f39'; +const FRIO_SCHEME_ACCENT_PINK = '#d900a9'; + function frio_init(App $a) { global $frio; From 907222da53ae598a79b06a25ec6b414b0cf2a3a9 Mon Sep 17 00:00:00 2001 From: Hypolite Petovan Date: Wed, 19 Aug 2020 22:58:47 -0400 Subject: [PATCH 11/12] [frio] Add dark accented scheme --- view/theme/frio/config.php | 1 + view/theme/frio/scheme/dark.css | 320 ++++++++++++++++++++++++++++++++ view/theme/frio/scheme/dark.php | 34 ++++ 3 files changed, 355 insertions(+) create mode 100644 view/theme/frio/scheme/dark.css create mode 100644 view/theme/frio/scheme/dark.php diff --git a/view/theme/frio/config.php b/view/theme/frio/config.php index b93848cfe..5b3c77a50 100644 --- a/view/theme/frio/config.php +++ b/view/theme/frio/config.php @@ -140,6 +140,7 @@ function frio_form($arr) $schemes = [ 'light' => DI::l10n()->t('Light (Accented)'), + 'dark' => DI::l10n()->t('Dark (Accented)'), ]; $legacy_schemes = []; diff --git a/view/theme/frio/scheme/dark.css b/view/theme/frio/scheme/dark.css new file mode 100644 index 000000000..308e31887 --- /dev/null +++ b/view/theme/frio/scheme/dark.css @@ -0,0 +1,320 @@ +/* + Licence : AGPL + Created on : 11.08.2020 + Author : Hypolite Petovan +*/ +#topbar-first { + background-color: $background_color; +} +#topbar-first .dropdown.account > a, +#topbar-first .dropdown.account.open > a, +#topbar-first .dropdown.account > button, +#topbar-first .dropdown.account.open > button { + background: none; +} + +#topbar-first #nav-notifications-menu li.notif-entry:hover { + background-color: $nav_bg; +} + + +#topbar-second { + background-color: $nav_bg; + border-color: $link_color; +} +#topbar-second ul.tabs li { + border_color: $link_color; +} + +.dropdown-menu, .account .dropdown-menu { + background-color: $background_color; +} +.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover { + color: $link_color; +} +.account .dropdown-menu li { + border-color: $background_color; +} + +.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover { + background-image: none; + background-color: rgba(232, 232, 232, $contentbg_transp); +} + +.breadcrumb, +.panel-footer, +.list-group-item { + background-color: rgba(245, 245, 245, $contentbg_transp); +} +.panel-group .panel-footer { + border-top: 1px solid $nav_bg; +} + +.well { + background-image: none; + background-color: $nav_bg; + box-shadow: 0 0 3px #dadada; + -webkit-box-shadow: 0 0 3px #dadada; +} + +input[type=text], +input[type=submit], +button[type=submit]:not(.btn), +select, +textarea, +.form-control { + border: none; + background-color: $nav_bg; + color: $font_color; + box-shadow: 0 0 3px #dadada; + -webkit-box-shadow: 0 0 3px #dadada; +} +.form-control[disabled], +.form-control[readonly], +.ieldset[disabled] .form-control { + background-color: $background_color; + color: $font_color_darker; +} + +.nav-tabs>li.active>a, +.nav-tabs>li.active>a:focus, +.nav-tabs>li.active>a:hover, +main .nav-tabs>li.active>a, +main .nav-tabs>li.active>a:focus, +main .nav-tabs>li.active>a:hover { + background-color: $nav_bg; + color: $font_color_darker; +} + +.nav > li > a:focus, +.nav > li > a:hover { + background-color: rgba(238, 238, 238, $contentbg_transp); +} + +.modal-content { + background-color: $background_color; +} + +.pagination > .active > a, +.pagination > .active > a:focus, +.pagination > .active > a:hover, +.pagination > .active > span, +.pagination > .active > span:focus, +.pagination > .active > span:hover { + border-color: $link_color; + background-color: $nav_bg; + color: $font_color; +} + +.pagination>li>a:hover, +.pagination>li>span:hover { + background-color: $nav_bg; +} + +#jotOpen { + border: none; + background-color: $background_color; +} + +.close { + color: $font_color; + text-shadow: 0 1px 0 $nav_bg; +} +.close:focus, +.close:hover { + color: $link_color; +} + +.input-group-addon { + color: $font_color; + background-color: $nav_bg; + box-shadow: 0 0 3px #dadada; + -webkit-box-shadow: 0 0 3px #dadada; + border: none; +} + +#topbar-first #nav-notifications-menu li.notif-entry, +.panel-footer, +.panel-group .panel-heading + .panel-collapse > .list-group, +.panel-group .panel-heading + .panel-collapse > .panel-body, +.wall-item-container, +.comment-fake-form { + border-color: $nav_bg; +} + +.wall-item-comment-wrapper { + border: 0; +} + +.badge { + background-color: $nav_bg; +} + +.btn { + box-shadow: 0 0 2px #dadada; + -webkit-box-shadow: 0 0 2px #dadada; + background: none; + color: $font_color_darker; +} +.btn.focus, +.btn:focus, +.btn:hover { + color: $font_color; +} +.btn-default:focus, +.btn-default:hover { + background: $nav_bg; +} +.btn-default.active, +.btn-default:active { + background-color: $nav_bg; + color: $font_color; +} + +button[type=submit]:not(.btn), +input[type=submit], +.btn.btn-primary { + border: 1px solid $link_color; +} + +.label-primary { + background-color: $background_color; + color: $link_color; +} + +.panel-default>.panel-heading { + background: none; + background-color: $nav_bg; + color: $font_color; +} + +.btn-success, +.label-success, +.alert-success, +.panel-success > .panel-heading { + background: rgba(60, 118, 61, 0.4); + color: #dff0d8; +} + +.fc .fc-event, +.btn-info, +.label-info, +.alert-info, +.panel-info > .panel-heading, +.table > tbody > tr.info > td, +.table > tbody > tr.info > th, +.table > tbody > tr > td.info, +.table > tbody > tr > th.info, +.table > tfoot > tr.info > td, +.table > tfoot > tr.info > th, +.table > tfoot > tr > td.info, +.table > tfoot > tr > th.info, +.table > thead > tr.info > td, +.table > thead > tr.info > th, +.table > thead > tr > td.info, +.table > thead > tr > th.info { + background: rgba(49, 112, 143, 0.4); + color: #d9edf7; +} + +.btn-warning, +.label-warning, +.alert-warning, +.panel-warning > .panel-heading { + background: rgba(139, 109, 59, 0.4); + color: #fcf8e3; +} + +.btn-danger, +.label-danger, +.alert-danger, +.panel-danger > .panel-heading { + background: rgba(169, 68, 66, 0.4); + color: #f2dede; +} + +.wall-item-actions a, +.wall-item-actions button { + color: $link_color; +} + +@media (min-width: 768px) { + .wall-item-container .wall-item-links, + .wall-item-container .wall-item-actions button, + .wall-item-container .body-attach > a { + opacity: 0.3; + -webkit-transition: all 0.25s ease-in-out; + -moz-transition: all 0.25s ease-in-out; + -o-transition: all 0.25s ease-in-out; + -ms-transition: all 0.25s ease-in-out; + transition: all 0.25s ease-in-out; + color: $font_color; + } + .wall-item-container:hover .wall-item-links, + .wall-item-container:hover .wall-item-actions button, + .wall-item-container:hover .body-attach > a { + opacity: 1; + -webkit-transition: all 0.25s ease-in-out; + -moz-transition: all 0.25s ease-in-out; + -o-transition: all 0.25s ease-in-out; + -ms-transition: all 0.25s ease-in-out; + transition: all 0.25s ease-in-out; + color: $link_color; + } + .wall-item-container .wall-item-body .body-attach > a:hover { + opacity: 1; + } +} + +.fc-unthemed td.fc-today { + background-color: $nav_bg; +} + +.nav .open > .btn-link { + background-color: $nav_bg; +} + +.hovercard { + box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5); +} +.hovercard, +.hover-card-footer { + background-color: $nav_bg; +} +.hovercard.top > .arrow:after { + border-top-color: $nav_bg; +} +.hovercard.right > .arrow:after { + border-right-color: $nav_bg; +} +.hovercard.bottom > .arrow:after { + border-bottom-color: $nav_bg; +} +.hovercard.left > .arrow:after { + border-left-color: $nav_bg; +} + +.friendica-tagsinput .tag { + color: inherit; +} + + +code { + color: $font_color; + background-color: rgba(255, 255, 255, .2); +} +pre { + color: $font_color_darker; + background-color: rgba(255, 255, 255, .05); +} + +legend { + color: $font_color; +} + +.table-striped>tbody>tr:nth-of-type(odd), +.table-hover > tbody > tr:hover, +.adminpage .table-hover > tbody > tr:hover + tr.details { + background-color: $nav_bg; +} diff --git a/view/theme/frio/scheme/dark.php b/view/theme/frio/scheme/dark.php new file mode 100644 index 000000000..507d9552b --- /dev/null +++ b/view/theme/frio/scheme/dark.php @@ -0,0 +1,34 @@ + + * Overwrites: nav_bg, nav_icon_color, link_color, background_color, contentbg_transp + * Accented: yes + */ + +require_once 'view/theme/frio/php/PHPColors/Color.php'; + +$accentColor = new Color($scheme_accent); + +$menu_background_hover_color = '#' . $accentColor->darken(20); +switch ($scheme_accent) { + default: + $link_color = '#' . $accentColor->lighten(25); +} +$nav_icon_color = $scheme_accent; +$nav_icon_hover_color = '#' . $accentColor->darken(20); +switch ($scheme_accent) { + case FRIO_SCHEME_ACCENT_GREEN: + case FRIO_SCHEME_ACCENT_RED: + $nav_bg = '#' . $accentColor->darken(25); + $background_color = '#' . $accentColor->darken(27); + break; + default: + $nav_bg = '#' . $accentColor->darken(30); + $background_color = '#' . $accentColor->darken(33); +} + +$contentbg_transp = 4; +$font_color = '#e4e4e4'; +$font_color_darker = '#dcdcdc'; From 062063c5e579429d1154c3d40cdfef1d61de3305 Mon Sep 17 00:00:00 2001 From: Hypolite Petovan Date: Wed, 19 Aug 2020 22:58:59 -0400 Subject: [PATCH 12/12] [frio] Add black accented scheme --- view/theme/frio/config.php | 1 + view/theme/frio/scheme/black.css | 347 +++++++++++++++++++++++++++++++ view/theme/frio/scheme/black.php | 21 ++ 3 files changed, 369 insertions(+) create mode 100644 view/theme/frio/scheme/black.css create mode 100644 view/theme/frio/scheme/black.php diff --git a/view/theme/frio/config.php b/view/theme/frio/config.php index 5b3c77a50..3b9233e0a 100644 --- a/view/theme/frio/config.php +++ b/view/theme/frio/config.php @@ -141,6 +141,7 @@ function frio_form($arr) $schemes = [ 'light' => DI::l10n()->t('Light (Accented)'), 'dark' => DI::l10n()->t('Dark (Accented)'), + 'black' => DI::l10n()->t('Black (Accented)'), ]; $legacy_schemes = []; diff --git a/view/theme/frio/scheme/black.css b/view/theme/frio/scheme/black.css new file mode 100644 index 000000000..982de93e8 --- /dev/null +++ b/view/theme/frio/scheme/black.css @@ -0,0 +1,347 @@ +/* + Licence : AGPL + Created on : 11.08.2020 + Author : Hypolite Petovan +*/ +#topbar-first { + background-color: $background_color; +} +#topbar-first .dropdown.account > a, +#topbar-first .dropdown.account.open > a, +#topbar-first .dropdown.account > button, +#topbar-first .dropdown.account.open > button { + background: none; +} + +#topbar-first #nav-notifications-menu li.notif-entry:hover { + background-color: $nav_bg; +} + + +#topbar-second { + background-color: $nav_bg; + border-color: $link_color; +} +#topbar-second ul.tabs li { + border_color: $link_color; +} + +.dropdown-menu, .account .dropdown-menu { + background-color: $background_color; +} +.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover { + color: $link_color; +} +.account .dropdown-menu li { + border-color: $background_color; +} + +.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover { + background-image: none; + background-color: rgba(232, 232, 232, $contentbg_transp); +} + +.breadcrumb, +.panel-footer, +.list-group-item { + background-color: rgba(245, 245, 245, $contentbg_transp); +} +.panel-group .panel-footer { + border-top: 1px solid $nav_bg; +} + +.well { + background-image: none; + background-color: $nav_bg; + box-shadow: 0 0 3px #dadada; + -webkit-box-shadow: 0 0 3px #dadada; + border-color: #a0a0a0; +} + +input[type=text], +input[type=submit], +button[type=submit]:not(.btn), +select, +textarea, +.form-control { + border: none; + background-color: $nav_bg; + color: $font_color; + box-shadow: 0 0 3px #dadada; + -webkit-box-shadow: 0 0 3px #dadada; +} +.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { + background-color: $background_color; + color: $font_color_darker; +} + +.nav-tabs>li.active>a, +.nav-tabs>li.active>a:focus, +.nav-tabs>li.active>a:hover, +main .nav-tabs>li.active>a, +main .nav-tabs>li.active>a:focus, +main .nav-tabs>li.active>a:hover { + background-color: $nav_bg; + color: $font_color_darker; +} + +.nav > li > a:focus, .nav > li > a:hover { + background-color: rgba(238, 238, 238, $contentbg_transp); +} + +.modal-content { + background-color: $background_color; +} + +.pager li > a, +.pager li > span { + border-color: #a0a0a0; +} + +.pager li > a:focus, +.pager li > a:hover { + background-color: #303030; +} + +.pagination > .active > a, +.pagination > .active > a:focus, +.pagination > .active > a:hover, +.pagination > .active > span, +.pagination > .active > span:focus, +.pagination > .active > span:hover { + border-color: $link_color; + background-color: $nav_bg; + color: $font_color; +} + +.pagination>li>a:hover, .pagination>li>span:hover { + background-color: $nav_bg; +} + +#jotOpen { + border: none; + background-color: $background_color; +} + +.close { + color: $font_color; + text-shadow: 0 1px 0 $nav_bg; +} +.close:focus, .close:hover { + color: $link_color; +} + +.input-group-addon { + color: $font_color; + background-color: $nav_bg; + box-shadow: 0 0 3px #dadada; + -webkit-box-shadow: 0 0 3px #dadada; + border: none; +} + +#topbar-first #nav-notifications-menu li.notif-entry, +.panel-footer, +.panel-group .panel-heading + .panel-collapse > .list-group, +.panel-group .panel-heading + .panel-collapse > .panel-body, +.wall-item-container, +.comment-fake-form { + border-color: $nav_bg; +} + +.wall-item-comment-wrapper { + border: 0; +} + +.badge { + background-color: $nav_bg; +} + +.btn { + box-shadow: 0 0 2px #dadada; + -webkit-box-shadow: 0 0 2px #dadada; + background: none; + color: $font_color_darker; +} +.btn.focus, .btn:focus, .btn:hover { + color: $font_color; +} +.btn-default:focus, .btn-default:hover { + background: $nav_bg; +} +.btn-default.active, .btn-default:active { + background-color: $nav_bg; + color: $font_color; +} + +button[type=submit]:not(.btn), +input[type=submit], +.btn.btn-primary { + border: 1px solid $link_color; +} + +.label-primary { + background-color: $background_color; + color: $link_color; +} + +.panel-default>.panel-heading { + background: none; + background-color: $nav_bg; + color: $font_color; +} + +.btn-success, +.label-success, +.alert-success, +.panel-success > .panel-heading { + background: rgba(60, 118, 61, 0.4); + color: #dff0d8; +} + +.fc .fc-event, +.btn-info, +.label-info, +.alert-info, +.panel-info > .panel-heading, +.table > tbody > tr.info > td, +.table > tbody > tr.info > th, +.table > tbody > tr > td.info, +.table > tbody > tr > th.info, +.table > tfoot > tr.info > td, +.table > tfoot > tr.info > th, +.table > tfoot > tr > td.info, +.table > tfoot > tr > th.info, +.table > thead > tr.info > td, +.table > thead > tr.info > th, +.table > thead > tr > td.info, +.table > thead > tr > th.info { + background: rgba(49, 112, 143, 0.4); + color: #d9edf7; +} + +.btn-warning, +.label-warning, +.alert-warning, +.panel-warning > .panel-heading { + background: rgba(139, 109, 59, 0.4); + color: #fcf8e3; +} + +.btn-danger, +.label-danger, +.alert-danger, +.panel-danger > .panel-heading { + background: rgba(169, 68, 66, 0.4); + color: #f2dede; +} + +.wall-item-actions a, .wall-item-actions button { + color: $link_color; +} + +@media (min-width: 768px) { + .wall-item-container .wall-item-links, + .wall-item-container .wall-item-actions button, + .wall-item-container .body-attach > a { + opacity: 0.3; + -webkit-transition: all 0.25s ease-in-out; + -moz-transition: all 0.25s ease-in-out; + -o-transition: all 0.25s ease-in-out; + -ms-transition: all 0.25s ease-in-out; + transition: all 0.25s ease-in-out; + color: $font_color; + } + .wall-item-container:hover .wall-item-links, + .wall-item-container:hover .wall-item-actions button, + .wall-item-container:hover .body-attach > a { + opacity: 1; + -webkit-transition: all 0.25s ease-in-out; + -moz-transition: all 0.25s ease-in-out; + -o-transition: all 0.25s ease-in-out; + -ms-transition: all 0.25s ease-in-out; + transition: all 0.25s ease-in-out; + color: $link_color; + } + .wall-item-container .wall-item-body .body-attach > a:hover { + opacity: 1; + } +} + +.fc-unthemed td.fc-today { + background-color: $nav_bg; +} + +.nav .open > .btn-link { + background-color: $nav_bg; +} + +.hovercard { + box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5); +} +.hovercard, .hover-card-footer { + background-color: $nav_bg; +} +.hovercard.top > .arrow:after { + border-top-color: $nav_bg; +} +.hovercard.right > .arrow:after { + border-right-color: $nav_bg; +} +.hovercard.bottom > .arrow:after { + border-bottom-color: $nav_bg; +} +.hovercard.left > .arrow:after { + border-left-color: $nav_bg; +} + +.friendica-tagsinput .tag { + color: inherit; +} + + +code { + color: $font_color; + background-color: rgba(255, 255, 255, .2); +} +pre { + color: $font_color_darker; + background-color: rgba(255, 255, 255, .05); +} + +legend { + color: $font_color; +} + +.table-striped>tbody>tr:nth-of-type(odd), +.table-hover > tbody > tr:hover, +.adminpage .table-hover > tbody > tr:hover + tr.details { + background-color: $nav_bg; +} + +section > .generic-page-wrapper, +.videos-content-wrapper, +.suggest-content-wrapper, +.help-content-wrapper, +.match-content-wrapper, +.dirfind-content-wrapper, +.delegation-content-wrapper, +.notes-content-wrapper, +.message-content-wrapper, +.apps-content-wrapper, #adminpage, +.delegate-content-wrapper, +.uexport-content-wrapper, +.dfrn_request-content-wrapper, +.friendica-content-wrapper, +.credits-content-wrapper, +.nogroup-content-wrapper, +.profperm-content-wrapper, +.invite-content-wrapper, +.tos-content-wrapper, +.fsuggest-content-wrapper, +.panel, +aside .widget, +.nav-container .widget{ + box-shadow: 0 0 3px $link_color; + -webkit-box-shadow: 0 0 3px $link_color; +} diff --git a/view/theme/frio/scheme/black.php b/view/theme/frio/scheme/black.php new file mode 100644 index 000000000..797ba78c9 --- /dev/null +++ b/view/theme/frio/scheme/black.php @@ -0,0 +1,21 @@ + + * Overwrites: nav_bg, nav_icon_color, link_color, background_color, contentbg_transp + * Accented: yes + */ + +require_once 'view/theme/frio/php/PHPColors/Color.php'; + +$accentColor = new Color($scheme_accent); + +$menu_background_hover_color = '#' . $accentColor->darken(45); +$nav_bg = '#202020'; +$link_color = '#' . $accentColor->lighten(10); +$nav_icon_color = '#d4d4d4'; +$background_color = '#000000'; +$contentbg_transp = '0'; +$font_color = '#cccccc'; +$font_color_darker = '#acacac';