From 7ccb2a261521cc826ff41d91cebbab504b7c4e11 Mon Sep 17 00:00:00 2001 From: Mario Date: Sat, 10 Feb 2024 22:04:24 +0000 Subject: custom sass bootstrap builds for channels and site --- view/theme/redbasic/css/blockmode.css | 15 ---- view/theme/redbasic/css/mod_page.css | 24 ------ view/theme/redbasic/css/sloppy_photos.css | 58 ------------- view/theme/redbasic/css/style.css | 22 +---- view/theme/redbasic/php/config.php | 73 ++++++++++++++--- view/theme/redbasic/php/style.php | 126 +++++++++++++---------------- view/theme/redbasic/php/theme_init.php | 2 - view/theme/redbasic/tpl/theme_settings.tpl | 20 ++--- 8 files changed, 131 insertions(+), 209 deletions(-) delete mode 100644 view/theme/redbasic/css/blockmode.css delete mode 100644 view/theme/redbasic/css/mod_page.css delete mode 100644 view/theme/redbasic/css/sloppy_photos.css (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/blockmode.css b/view/theme/redbasic/css/blockmode.css deleted file mode 100644 index cc1db209e..000000000 --- a/view/theme/redbasic/css/blockmode.css +++ /dev/null @@ -1,15 +0,0 @@ - -.wall-item-content.conv-list-mode { - max-width: 280px; - height:200px; - min-height: 200px; - overflow: hidden; -} - -.thread-wrapper.toplevel_item.conv-list-mode { - width: 300px; - height: 300px; - float: left; - margin-left: 5px; - margin-bottom: 35px; -} diff --git a/view/theme/redbasic/css/mod_page.css b/view/theme/redbasic/css/mod_page.css deleted file mode 100644 index 37f597fac..000000000 --- a/view/theme/redbasic/css/mod_page.css +++ /dev/null @@ -1,24 +0,0 @@ -/* -section { -left: 0px; -width: 800px; -margin-left: auto; -margin-right: auto; -} -body {background-color: #d00 !important;} - -.page-content-wrapper {background: #fff; - color: #000; - border-radius: 20px; - box-shadow: 5px 5px 5px #111; -} - -h3.page-title { -padding-top: 30px; - color: #033} -.page-body {padding: 40px;} - -.page-body strong {color: #033;} - -.nav-links {margin-top: 5px;} -*/ \ No newline at end of file diff --git a/view/theme/redbasic/css/sloppy_photos.css b/view/theme/redbasic/css/sloppy_photos.css deleted file mode 100644 index 78aedc9cc..000000000 --- a/view/theme/redbasic/css/sloppy_photos.css +++ /dev/null @@ -1,58 +0,0 @@ - -.rotleft1 { --webkit-transform: rotate(-1deg); --moz-transform: rotate(-1deg); --ms-transform: rotate(-1deg); --o-transform: rotate(-1deg); -} - -.rotleft2 { --webkit-transform: rotate(-2deg); --moz-transform: rotate(-2deg); --ms-transform: rotate(-2deg); --o-transform: rotate(-2deg); -} - -.rotleft3 { --webkit-transform: rotate(-3deg); --moz-transform: rotate(-3deg); --ms-transform: rotate(-3deg); --o-transform: rotate(-3deg); -} - -.rotleft4 { --webkit-transform: rotate(-4deg); --moz-transform: rotate(-4deg); --ms-transform: rotate(-4deg); --o-transform: rotate(-4deg); -} - - -.rotright1 { --webkit-transform: rotate(1deg); --moz-transform: rotate(1deg); --ms-transform: rotate(1deg); --o-transform: rotate(1deg); -} - -.rotright2 { --webkit-transform: rotate(2deg); --moz-transform: rotate(2deg); --ms-transform: rotate(2deg); --o-transform: rotate(2deg); -} - -.rotright3 { --webkit-transform: rotate(3deg); --moz-transform: rotate(3deg); --ms-transform: rotate(3deg); --o-transform: rotate(3deg); -} - -.rotright4 { --webkit-transform: rotate(4deg); --moz-transform: rotate(4deg); --ms-transform: rotate(4deg); --o-transform: rotate(4deg); -} - diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 451303338..8d91702a3 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -7,21 +7,13 @@ /* bootstrap variables */ -:root { - --bs-border-radius: $radius; - --bs-highlight-bg: var(--bs-warning); -} [data-bs-theme=light] { - --bs-link-color: $link_color; - --bs-link-hover-color: $link_hover_color; --hz-body-bg: $bgcolor; --hz-body-bg-image: url('$background_image'); } [data-bs-theme=dark] { - --bs-link-color: $link_color_dark; - --bs-link-hover-color: $link_hover_color_dark; --hz-body-bg: $bgcolor_dark; --hz-body-bg-image: url('$background_image_dark'); } @@ -34,10 +26,6 @@ background-color: $nav_bg_dark !important; } -.btn { - --bs-btn-border-radius: $radius; -} - /* generals */ @@ -459,7 +447,7 @@ footer { .photo, .contact-block-img { - border-radius: $radius; + border-radius: var(--bs-border-radius); } #side-bar-photos-albums { @@ -472,7 +460,7 @@ footer { .profile-match-photo img, .directory-photo-img { - border-radius: $radius; + border-radius: var(--bs-border-radius); } .profile-match-photo img { @@ -1354,10 +1342,6 @@ main.fullscreen .section-content-wrapper-np { /* bootstrap overrides */ -.form-control { - border-radius: $radius; -} - blockquote { font-size: 1rem; font-style: italic; @@ -1674,3 +1658,5 @@ dl.bb-dl > dd > li { transform: translateX(80vw); } } + + diff --git a/view/theme/redbasic/php/config.php b/view/theme/redbasic/php/config.php index 344f3ff68..213e441eb 100644 --- a/view/theme/redbasic/php/config.php +++ b/view/theme/redbasic/php/config.php @@ -2,6 +2,9 @@ namespace Zotlabs\Theme; +use ScssPhp\ScssPhp\Compiler; +use ScssPhp\ScssPhp\OutputStyle; + class RedbasicConfig { function get_schemas() { @@ -37,15 +40,12 @@ class RedbasicConfig { } $arr = array(); + $arr['primary_color'] = get_pconfig(local_channel(),'redbasic', 'primary_color'); $arr['dark_mode'] = get_pconfig(local_channel(),'redbasic', 'dark_mode'); $arr['navbar_dark_mode'] = get_pconfig(local_channel(),'redbasic', 'navbar_dark_mode'); $arr['narrow_navbar'] = get_pconfig(local_channel(),'redbasic', 'narrow_navbar' ); $arr['nav_bg'] = get_pconfig(local_channel(),'redbasic', 'nav_bg' ); $arr['nav_bg_dark'] = get_pconfig(local_channel(),'redbasic', 'nav_bg_dark' ); - $arr['link_color'] = get_pconfig(local_channel(),'redbasic', 'link_color' ); - $arr['link_color_dark'] = get_pconfig(local_channel(),'redbasic', 'link_color_dark' ); - $arr['link_hover_color'] = get_pconfig(local_channel(),'redbasic', 'link_hover_color' ); - $arr['link_hover_color_dark'] = get_pconfig(local_channel(),'redbasic', 'link_hover_color_dark' ); $arr['bgcolor'] = get_pconfig(local_channel(),'redbasic', 'background_color' ); $arr['bgcolor_dark'] = get_pconfig(local_channel(),'redbasic', 'background_color_dark' ); $arr['background_image'] = get_pconfig(local_channel(),'redbasic', 'background_image' ); @@ -65,15 +65,62 @@ class RedbasicConfig { } if (isset($_POST['redbasic-settings-submit'])) { + if (isset($_POST['redbasic_primary_color']) || isset($_POST['redbasic_radius'])) { + + $primary_color = ''; + $radius = floatval($_POST['redbasic_radius']); + + if (preg_match('/^#([A-Fa-f0-9]{3}){1,2}$/', $_POST['redbasic_primary_color'])) { + $primary_color = $_POST['redbasic_primary_color']; + } + + if ($primary_color || $radius) { + + try { + $cache_dir = 'store/[data]/[scss]'; + if(!is_dir($cache_dir)) { + os_mkdir($cache_dir, STORAGE_DEFAULT_PERMISSIONS, true); + } + + $options = [ + 'cacheDir' => $cache_dir, + 'forceRefresh' => false + ]; + + $compiler = new Compiler($options); + $compiler->setImportPaths('vendor/twbs/bootstrap/scss'); + $compiler->setOutputStyle(OutputStyle::COMPRESSED); + + // Set Variables + if ($primary_color) { + $variables['$primary'] = $primary_color; + } + + if ($radius) { + $variables['$border-radius'] = $radius . 'rem'; + } + + // Replace Bootstrap Variables with Customizer Variables + $compiler->replaceVariables($variables); + + $bs = $compiler->compileString('@import "bootstrap.scss";'); + + set_pconfig(local_channel(), 'redbasic', 'bootstrap', $bs->getCss()); + } catch (\Exception $e) { + logger('scssphp: Unable to compile content'); + } + } + else { + set_pconfig(local_channel(), 'redbasic', 'bootstrap', ''); + } + } + + set_pconfig(local_channel(), 'redbasic', 'primary_color', $_POST['redbasic_primary_color']); set_pconfig(local_channel(), 'redbasic', 'narrow_navbar', $_POST['redbasic_narrow_navbar']); set_pconfig(local_channel(), 'redbasic', 'navbar_dark_mode', $_POST['redbasic_navbar_dark_mode']); set_pconfig(local_channel(), 'redbasic', 'dark_mode', $_POST['redbasic_dark_mode']); set_pconfig(local_channel(), 'redbasic', 'nav_bg', $_POST['redbasic_nav_bg']); set_pconfig(local_channel(), 'redbasic', 'nav_bg_dark', $_POST['redbasic_nav_bg_dark']); - set_pconfig(local_channel(), 'redbasic', 'link_color', $_POST['redbasic_link_color']); - set_pconfig(local_channel(), 'redbasic', 'link_color_dark', $_POST['redbasic_link_color_dark']); - set_pconfig(local_channel(), 'redbasic', 'link_hover_color', $_POST['redbasic_link_hover_color']); - set_pconfig(local_channel(), 'redbasic', 'link_hover_color_dark', $_POST['redbasic_link_hover_color_dark']); set_pconfig(local_channel(), 'redbasic', 'background_color', $_POST['redbasic_background_color']); set_pconfig(local_channel(), 'redbasic', 'background_color_dark', $_POST['redbasic_background_color_dark']); set_pconfig(local_channel(), 'redbasic', 'background_image', $_POST['redbasic_background_image']); @@ -84,6 +131,9 @@ class RedbasicConfig { set_pconfig(local_channel(), 'redbasic', 'top_photo', $_POST['redbasic_top_photo']); set_pconfig(local_channel(), 'redbasic', 'reply_photo', $_POST['redbasic_reply_photo']); set_pconfig(local_channel(), 'redbasic', 'advanced_theming', $_POST['redbasic_advanced_theming']); + + // This is used to refresh the cache + set_pconfig(local_channel(), 'system', 'style_update', time()); } } @@ -103,21 +153,18 @@ class RedbasicConfig { '$dark' => t('Dark style'), '$light' => t('Light style'), '$common' => t('Common settings'), + '$primary_color' => array('redbasic_primary_color', t('Primary theme color'), $arr['primary_color']), '$dark_mode' => array('redbasic_dark_mode',t('Default to dark mode'),$arr['dark_mode'], '', array(t('No'),t('Yes'))), '$navbar_dark_mode' => array('redbasic_navbar_dark_mode',t('Always use light icons for navbar'),$arr['navbar_dark_mode'], t('Enable this option if you use a dark navbar color in light mode'), array(t('No'),t('Yes'))), '$narrow_navbar' => array('redbasic_narrow_navbar',t('Narrow navbar'),$arr['narrow_navbar'], '', array(t('No'),t('Yes'))), '$nav_bg' => array('redbasic_nav_bg', t('Navigation bar background color'), $arr['nav_bg']), '$nav_bg_dark' => array('redbasic_nav_bg_dark', t('Dark navigation bar background color'), $arr['nav_bg_dark']), - '$link_color' => array('redbasic_link_color', t('Link color'), $arr['link_color']), - '$link_color_dark' => array('redbasic_link_color_dark', t('Dark link color'), $arr['link_color_dark']), - '$link_hover_color' => array('redbasic_link_hover_color', t('Link hover color'), $arr['link_hover_color']), - '$link_hover_color_dark' => array('redbasic_link_hover_color_dark', t('Dark link hover color'), $arr['link_hover_color_dark']), '$bgcolor' => array('redbasic_background_color', t('Set the background color'), $arr['bgcolor']), '$bgcolor_dark' => array('redbasic_background_color_dark', t('Set the dark background color'), $arr['bgcolor_dark']), '$background_image' => array('redbasic_background_image', t('Set the background image'), $arr['background_image']), '$background_image_dark' => array('redbasic_background_image_dark', t('Set the dark background image'), $arr['background_image_dark']), '$font_size' => array('redbasic_font_size', t('Set font-size for the entire application'), $arr['font_size'], t('Examples: 1rem, 100%, 16px')), - '$radius' => array('redbasic_radius', t('Set radius of corners'), $arr['radius'], t('Example: 4px')), + '$radius' => array('redbasic_radius', t('Set radius of corners in rem'), $arr['radius']), '$converse_width' => array('redbasic_converse_width',t('Set maximum width of content region in rem'),$arr['converse_width'], t('Leave empty for default width')), '$top_photo' => array('redbasic_top_photo', t('Set size of conversation author photo'), $arr['top_photo']), '$reply_photo' => array('redbasic_reply_photo', t('Set size of followup author photos'), $arr['reply_photo']), diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php index 4d5bd42be..056cea1cd 100644 --- a/view/theme/redbasic/php/style.php +++ b/view/theme/redbasic/php/style.php @@ -1,32 +1,53 @@ $nav_bg, '$nav_bg_dark' => $nav_bg_dark, - '$link_color' => $link_color, - '$link_color_dark' => $link_color_dark, - '$link_hover_color' => $link_hover_color, - '$link_hover_color_dark' => $link_hover_color_dark, '$bgcolor' => $bgcolor, '$bgcolor_dark' => $bgcolor_dark, '$background_image' => $background_image, '$background_image_dark' => $background_image_dark, '$font_size' => $font_size, - '$radius' => $radius, '$converse_width' => $converse_width, '$top_photo' => $top_photo, '$reply_photo' => $reply_photo, @@ -158,8 +140,12 @@ if(file_exists('view/theme/redbasic/css/style.css')) { '$right_aside_width' => $right_aside_width ); - echo strtr($x, $options); + $o = strtr($x, $options); + + header('Cache-Control: max-age=2592000'); + + echo $bs . $o; } // Set the schema to the default schema in derived themes. See the documentation for creating derived themes how to override this. diff --git a/view/theme/redbasic/php/theme_init.php b/view/theme/redbasic/php/theme_init.php index cb81165b1..54e6e7be3 100644 --- a/view/theme/redbasic/php/theme_init.php +++ b/view/theme/redbasic/php/theme_init.php @@ -2,9 +2,7 @@ require_once('view/php/theme_init.php'); head_add_css('/library/fork-awesome/css/fork-awesome.min.css'); -head_add_css('/vendor/twbs/bootstrap/dist/css/bootstrap.min.css'); head_add_css('/library/bootstrap-tagsinput/bootstrap-tagsinput.css'); -head_add_css('/view/css/bootstrap-red.css'); head_add_css('/library/bootstrap-colorpicker/dist/css/bootstrap-colorpicker.min.css'); head_add_js('/vendor/twbs/bootstrap/dist/js/bootstrap.bundle.min.js'); diff --git a/view/theme/redbasic/tpl/theme_settings.tpl b/view/theme/redbasic/tpl/theme_settings.tpl index 6bf1666ed..4ba418afc 100644 --- a/view/theme/redbasic/tpl/theme_settings.tpl +++ b/view/theme/redbasic/tpl/theme_settings.tpl @@ -5,32 +5,34 @@ {{include file="field_checkbox.tpl" field=$advanced_theming}} {{if $expert}} +
+

{{$common}}

+ {{include file="field_colorinput.tpl" field=$primary_color}} + {{include file="field_input.tpl" field=$radius}} + {{include file="field_input.tpl" field=$top_photo}} + {{include file="field_input.tpl" field=$reply_photo}} +

{{$light}}

{{include file="field_checkbox.tpl" field=$navbar_dark_mode}} {{include file="field_colorinput.tpl" field=$nav_bg}} {{include file="field_colorinput.tpl" field=$bgcolor}} {{include file="field_colorinput.tpl" field=$background_image}} - {{include file="field_colorinput.tpl" field=$link_color}} - {{include file="field_colorinput.tpl" field=$link_hover_color}}

{{$dark}}

{{include file="field_colorinput.tpl" field=$nav_bg_dark}} {{include file="field_colorinput.tpl" field=$bgcolor_dark}} {{include file="field_colorinput.tpl" field=$background_image_dark}} - {{include file="field_colorinput.tpl" field=$link_color_dark}} - {{include file="field_colorinput.tpl" field=$link_hover_color_dark}} - -

{{$common}}

- {{include file="field_input.tpl" field=$radius}} - {{include file="field_input.tpl" field=$top_photo}} - {{include file="field_input.tpl" field=$reply_photo}} {{/if}} +
-- cgit v1.2.3 From d17934ed802073a2978e8c2472cf12a5a8ee42ba Mon Sep 17 00:00:00 2001 From: Mario Date: Mon, 12 Feb 2024 22:07:54 +0000 Subject: scss: more options and some fixes --- view/theme/redbasic/css/style.css | 16 ++++----- view/theme/redbasic/php/config.php | 52 +++++++++++++++++++++++++++--- view/theme/redbasic/tpl/theme_settings.tpl | 6 +++- 3 files changed, 61 insertions(+), 13 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 8d91702a3..576c4d8e9 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -1224,32 +1224,32 @@ img.mail-conv-sender-photo { .section-content-success-wrapper { padding: 21px 10px; - color: #155724; - background-color: #d4edda; + color: var(--bs-success-text-emphasis); + background-color: var(--bs-success-bg-subtle); border-bottom: 3px solid var(--bs-body-bg); text-align: center; } .section-content-info-wrapper { padding: 21px 10px; - color: #0c5460; - background-color: #d1ecf1; + color: var(--bs-info-text-emphasis); + background-color: var(--bs-info-bg-subtle); border-bottom: 3px solid var(--bs-body-bg); text-align: center; } .section-content-warning-wrapper { padding: 21px 10px; - color: #856404; - background-color: #fff3cd; + color: var(--bs-warning-text-emphasis); + background-color: var(--bs-warning-bg-subtle); border-bottom: 3px solid var(--bs-body-bg); text-align: center; } .section-content-danger-wrapper { padding: 21px 10px; - color: #721c24; - background-color: #f8d7da; + color: var(--bs-danger-text-emphasis); + background-color: var(--bs-danger-bg-subtle); border-bottom: 3px solid var(--bs-body-bg); text-align: center; } diff --git a/view/theme/redbasic/php/config.php b/view/theme/redbasic/php/config.php index 213e441eb..a9a766ad5 100644 --- a/view/theme/redbasic/php/config.php +++ b/view/theme/redbasic/php/config.php @@ -39,8 +39,11 @@ class RedbasicConfig { return; } - $arr = array(); $arr['primary_color'] = get_pconfig(local_channel(),'redbasic', 'primary_color'); + $arr['success_color'] = get_pconfig(local_channel(),'redbasic', 'success_color'); + $arr['info_color'] = get_pconfig(local_channel(),'redbasic', 'info_color'); + $arr['warning_color'] = get_pconfig(local_channel(),'redbasic', 'warning_color'); + $arr['danger_color'] = get_pconfig(local_channel(),'redbasic', 'danger_color'); $arr['dark_mode'] = get_pconfig(local_channel(),'redbasic', 'dark_mode'); $arr['navbar_dark_mode'] = get_pconfig(local_channel(),'redbasic', 'navbar_dark_mode'); $arr['narrow_navbar'] = get_pconfig(local_channel(),'redbasic', 'narrow_navbar' ); @@ -68,22 +71,39 @@ class RedbasicConfig { if (isset($_POST['redbasic_primary_color']) || isset($_POST['redbasic_radius'])) { $primary_color = ''; + $success_color = ''; + $info_color = ''; + $warning_color = ''; + $danger_color = ''; $radius = floatval($_POST['redbasic_radius']); if (preg_match('/^#([A-Fa-f0-9]{3}){1,2}$/', $_POST['redbasic_primary_color'])) { $primary_color = $_POST['redbasic_primary_color']; } + if (preg_match('/^#([A-Fa-f0-9]{3}){1,2}$/', $_POST['redbasic_success_color'])) { + $success_color = $_POST['redbasic_success_color']; + } + if (preg_match('/^#([A-Fa-f0-9]{3}){1,2}$/', $_POST['redbasic_info_color'])) { + $info_color = $_POST['redbasic_info_color']; + } + if (preg_match('/^#([A-Fa-f0-9]{3}){1,2}$/', $_POST['redbasic_warning_color'])) { + $warning_color = $_POST['redbasic_warning_color']; + } + if (preg_match('/^#([A-Fa-f0-9]{3}){1,2}$/', $_POST['redbasic_danger_color'])) { + $danger_color = $_POST['redbasic_danger_color']; + } - if ($primary_color || $radius) { + if ($primary_color || $success_color || $info_color || $warning_color || $danger_color || $radius) { try { - $cache_dir = 'store/[data]/[scss]'; + $cache_dir = 'store/[data]/[scss]/'; if(!is_dir($cache_dir)) { os_mkdir($cache_dir, STORAGE_DEFAULT_PERMISSIONS, true); } $options = [ 'cacheDir' => $cache_dir, + 'prefix' => 'redbasic_', 'forceRefresh' => false ]; @@ -95,9 +115,24 @@ class RedbasicConfig { if ($primary_color) { $variables['$primary'] = $primary_color; } - + if ($success_color) { + $variables['$success'] = $success_color; + } + if ($info_color) { + $variables['$info'] = $info_color; + } + if ($warning_color) { + $variables['$warning'] = $warning_color; + } + if ($danger_color) { + $variables['$danger'] = $danger_color; + } if ($radius) { $variables['$border-radius'] = $radius . 'rem'; + $variables['$border-radius-sm'] = $radius/1.5 . 'rem'; + $variables['$border-radius-lg'] = $radius*1.333 . 'rem'; + $variables['$border-radius-xl'] = $radius*2.666 . 'rem'; + $variables['$border-radius-xxl'] = $radius*5.333 . 'rem'; } // Replace Bootstrap Variables with Customizer Variables @@ -116,6 +151,11 @@ class RedbasicConfig { } set_pconfig(local_channel(), 'redbasic', 'primary_color', $_POST['redbasic_primary_color']); + set_pconfig(local_channel(), 'redbasic', 'success_color', $_POST['redbasic_success_color']); + set_pconfig(local_channel(), 'redbasic', 'info_color', $_POST['redbasic_info_color']); + set_pconfig(local_channel(), 'redbasic', 'warning_color', $_POST['redbasic_warning_color']); + set_pconfig(local_channel(), 'redbasic', 'danger_color', $_POST['redbasic_danger_color']); + set_pconfig(local_channel(), 'redbasic', 'narrow_navbar', $_POST['redbasic_narrow_navbar']); set_pconfig(local_channel(), 'redbasic', 'navbar_dark_mode', $_POST['redbasic_navbar_dark_mode']); set_pconfig(local_channel(), 'redbasic', 'dark_mode', $_POST['redbasic_dark_mode']); @@ -154,6 +194,10 @@ class RedbasicConfig { '$light' => t('Light style'), '$common' => t('Common settings'), '$primary_color' => array('redbasic_primary_color', t('Primary theme color'), $arr['primary_color']), + '$success_color' => array('redbasic_success_color', t('Success theme color'), $arr['success_color']), + '$info_color' => array('redbasic_info_color', t('Info theme color'), $arr['info_color']), + '$warning_color' => array('redbasic_warning_color', t('Warning theme color'), $arr['warning_color']), + '$danger_color' => array('redbasic_danger_color', t('Danger theme color'), $arr['danger_color']), '$dark_mode' => array('redbasic_dark_mode',t('Default to dark mode'),$arr['dark_mode'], '', array(t('No'),t('Yes'))), '$navbar_dark_mode' => array('redbasic_navbar_dark_mode',t('Always use light icons for navbar'),$arr['navbar_dark_mode'], t('Enable this option if you use a dark navbar color in light mode'), array(t('No'),t('Yes'))), '$narrow_navbar' => array('redbasic_narrow_navbar',t('Narrow navbar'),$arr['narrow_navbar'], '', array(t('No'),t('Yes'))), diff --git a/view/theme/redbasic/tpl/theme_settings.tpl b/view/theme/redbasic/tpl/theme_settings.tpl index 4ba418afc..61baeb58e 100644 --- a/view/theme/redbasic/tpl/theme_settings.tpl +++ b/view/theme/redbasic/tpl/theme_settings.tpl @@ -8,6 +8,10 @@

{{$common}}

{{include file="field_colorinput.tpl" field=$primary_color}} + {{include file="field_colorinput.tpl" field=$success_color}} + {{include file="field_colorinput.tpl" field=$info_color}} + {{include file="field_colorinput.tpl" field=$warning_color}} + {{include file="field_colorinput.tpl" field=$danger_color}} {{include file="field_input.tpl" field=$radius}} {{include file="field_input.tpl" field=$top_photo}} {{include file="field_input.tpl" field=$reply_photo}} @@ -28,7 +32,7 @@ $('#id_redbasic_link_color, #id_redbasic_link_color_dark, #id_redbasic_link_hover_color, #id_redbasic_link_hover_color_dark, #id_redbasic_background_color, #id_redbasic_background_color_dark, #id_redbasic_nav_bg, #id_redbasic_nav_bg_dark').colorpicker({format: 'rgba'}); }); $(function(){ - $('#id_redbasic_primary_color').colorpicker({format: 'hex'}); + $('#id_redbasic_primary_color, #id_redbasic_success_color, #id_redbasic_info_color, #id_redbasic_warning_color, #id_redbasic_danger_color').colorpicker({format: 'hex'}); }); {{/if}} -- cgit v1.2.3 From 08b2356ed182c079f2163f659bf31b98e2f6bffb Mon Sep 17 00:00:00 2001 From: Mario Date: Mon, 12 Feb 2024 22:09:07 +0000 Subject: add sample scss file --- view/theme/redbasic/css/sample.scss | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 view/theme/redbasic/css/sample.scss (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/sample.scss b/view/theme/redbasic/css/sample.scss new file mode 100644 index 000000000..87005be90 --- /dev/null +++ b/view/theme/redbasic/css/sample.scss @@ -0,0 +1,10 @@ +// See https://getbootstrap.com/docs/5.3/customize/sass/ for more infos + +// required import +@import "vendor/twbs/bootstrap/scss/_functions"; + +$primary: #ff0000; // set the $primary variable + + +// set changes +@import "vendor/twbs/bootstrap/scss/bootstrap"; -- cgit v1.2.3 From 2c93294eea4f6daa7e449c13f61b8398ac937aa0 Mon Sep 17 00:00:00 2001 From: Mario Date: Tue, 13 Feb 2024 12:28:11 +0000 Subject: scss: show current color and add some help text --- view/theme/redbasic/php/config.php | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/php/config.php b/view/theme/redbasic/php/config.php index a9a766ad5..7079cc386 100644 --- a/view/theme/redbasic/php/config.php +++ b/view/theme/redbasic/php/config.php @@ -193,11 +193,11 @@ class RedbasicConfig { '$dark' => t('Dark style'), '$light' => t('Light style'), '$common' => t('Common settings'), - '$primary_color' => array('redbasic_primary_color', t('Primary theme color'), $arr['primary_color']), - '$success_color' => array('redbasic_success_color', t('Success theme color'), $arr['success_color']), - '$info_color' => array('redbasic_info_color', t('Info theme color'), $arr['info_color']), - '$warning_color' => array('redbasic_warning_color', t('Warning theme color'), $arr['warning_color']), - '$danger_color' => array('redbasic_danger_color', t('Danger theme color'), $arr['danger_color']), + '$primary_color' => array('redbasic_primary_color', t('Primary theme color'), $arr['primary_color'], ' ' . t('Current color, leave empty for default')), + '$success_color' => array('redbasic_success_color', t('Success theme color'), $arr['success_color'], ' ' . t('Current color, leave empty for default')), + '$info_color' => array('redbasic_info_color', t('Info theme color'), $arr['info_color'], ' ' . t('Current color, leave empty for default')), + '$warning_color' => array('redbasic_warning_color', t('Warning theme color'), $arr['warning_color'], ' ' . t('Current color, leave empty for default')), + '$danger_color' => array('redbasic_danger_color', t('Danger theme color'), $arr['danger_color'], ' ' . t('Current color, leave empty for default')), '$dark_mode' => array('redbasic_dark_mode',t('Default to dark mode'),$arr['dark_mode'], '', array(t('No'),t('Yes'))), '$navbar_dark_mode' => array('redbasic_navbar_dark_mode',t('Always use light icons for navbar'),$arr['navbar_dark_mode'], t('Enable this option if you use a dark navbar color in light mode'), array(t('No'),t('Yes'))), '$narrow_navbar' => array('redbasic_narrow_navbar',t('Narrow navbar'),$arr['narrow_navbar'], '', array(t('No'),t('Yes'))), @@ -208,10 +208,10 @@ class RedbasicConfig { '$background_image' => array('redbasic_background_image', t('Set the background image'), $arr['background_image']), '$background_image_dark' => array('redbasic_background_image_dark', t('Set the dark background image'), $arr['background_image_dark']), '$font_size' => array('redbasic_font_size', t('Set font-size for the entire application'), $arr['font_size'], t('Examples: 1rem, 100%, 16px')), - '$radius' => array('redbasic_radius', t('Set radius of corners in rem'), $arr['radius']), + '$radius' => array('redbasic_radius', t('Set radius of corners in rem'), $arr['radius'], t('Leave empty for default radius')), '$converse_width' => array('redbasic_converse_width',t('Set maximum width of content region in rem'),$arr['converse_width'], t('Leave empty for default width')), - '$top_photo' => array('redbasic_top_photo', t('Set size of conversation author photo'), $arr['top_photo']), - '$reply_photo' => array('redbasic_reply_photo', t('Set size of followup author photos'), $arr['reply_photo']), + '$top_photo' => array('redbasic_top_photo', t('Set size of conversation author photo'), $arr['top_photo'], t('Leave empty for default size')), + '$reply_photo' => array('redbasic_reply_photo', t('Set size of followup author photos'), $arr['reply_photo'], t('Leave empty for default size')), '$advanced_theming' => ['redbasic_advanced_theming', t('Show advanced settings'), $arr['advanced_theming'], '', [t('No'), t('Yes')]] )); -- cgit v1.2.3 From 8b0dce56adcf6ef829af30e7857b82873793c4e8 Mon Sep 17 00:00:00 2001 From: Mario Date: Thu, 14 Mar 2024 19:11:25 +0000 Subject: remove some now redundant css --- view/theme/redbasic/css/style.css | 3 --- 1 file changed, 3 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 576c4d8e9..667708f02 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -34,13 +34,10 @@ html { } body { - font-size: 0.9rem; background-color: var(--hz-body-bg); background-image: var(--hz-body-bg-image); background-attachment: fixed; background-size: cover; - color: var(--bs-body-color); - margin: 0; } aside#region_1 { -- cgit v1.2.3 From 754d90a676e6cd8166965f12f2b3fa0bb203988e Mon Sep 17 00:00:00 2001 From: Mario Date: Thu, 14 Mar 2024 19:21:01 +0000 Subject: fix overlay z-index --- view/theme/redbasic/css/style.css | 1 + 1 file changed, 1 insertion(+) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 667708f02..9b93e28ee 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -72,6 +72,7 @@ main { height: 100vh; background: rgba(0, 0, 0, .3); cursor: pointer; + z-index: 1010; } h1, .h1 { -- cgit v1.2.3 From 41f909c4156ab5c6766a769a6aed52d093c36283 Mon Sep 17 00:00:00 2001 From: Mario Date: Fri, 15 Mar 2024 17:36:44 +0000 Subject: update redbasic screenshot --- view/theme/redbasic/img/screenshot.png | Bin 173915 -> 226493 bytes 1 file changed, 0 insertions(+), 0 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/img/screenshot.png b/view/theme/redbasic/img/screenshot.png index 80b217a21..8871c511c 100644 Binary files a/view/theme/redbasic/img/screenshot.png and b/view/theme/redbasic/img/screenshot.png differ -- cgit v1.2.3 From ac4aa6a9ea8a22bddfdc70bbac165a104b12471d Mon Sep 17 00:00:00 2001 From: Mario Date: Sat, 16 Mar 2024 16:22:39 +0000 Subject: css fixes --- view/theme/redbasic/css/style.css | 4 ++-- view/theme/redbasic/php/style.php | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 9b93e28ee..110137d70 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -1141,8 +1141,8 @@ img.mail-conv-sender-photo { } .menu-img-2 { - height: 2.3rem; - width: 2.3rem; + height: 2.5rem; + width: 2.5rem; margin-right: .5rem; border-radius: var(--bs-border-radius); float: left; diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php index 056cea1cd..350f0c867 100644 --- a/view/theme/redbasic/php/style.php +++ b/view/theme/redbasic/php/style.php @@ -100,8 +100,8 @@ $background_image = $background_image ?: ''; $background_image_dark = $background_image_dark ?: ''; $font_size = $font_size ?: '0.875rem'; $converse_width = $converse_width ?: '52'; //unit: rem -$top_photo = $top_photo ?: '2.3rem'; -$reply_photo = $reply_photo ?: '2.3rem'; +$top_photo = $top_photo ?: '2.5rem'; +$reply_photo = $reply_photo ?: '2.5rem'; // Apply the settings if(file_exists('view/theme/redbasic/css/style.css')) { -- cgit v1.2.3 From 68d989c79e98cd4b72d6f66df4aad0ee0fc95716 Mon Sep 17 00:00:00 2001 From: Mario Date: Sat, 16 Mar 2024 19:39:48 +0000 Subject: slightly adjust text sizing (cherry picked from commit 9600789d6be3fc3e8ed0803f1d80d5dbf0dd4779) --- view/theme/redbasic/css/style.css | 33 +++++++++++---------------------- view/theme/redbasic/php/style.php | 4 ++-- 2 files changed, 13 insertions(+), 24 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 110137d70..baadd7843 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -76,27 +76,27 @@ main { } h1, .h1 { - font-size: 2rem; + font-size: 2.1rem; } h2, .h2 { - font-size: 1.6rem; + font-size: 1.7rem; } h3, .h3 { - font-size: 1.2rem; + font-size: 1.3rem; } h4, .h4 { - font-size: 1.05rem; + font-size: 1.15rem; } h5, .h5 { - font-size: 0.9rem; + font-size: 1rem; } h6, .h6 { - font-size: 0.75rem; + font-size: 0.85rem; } .navbar-banner { @@ -141,7 +141,7 @@ a:focus, } input, optgroup, select, textarea { - font-size: 0.9rem !important; + font-size: 1rem !important; } input[type=text], textarea { @@ -730,7 +730,7 @@ div.jGrowl div.jGrowl-notification { .jslider .jslider-scale ins { color: #333; - font-size: 0.9rem; + font-size: 1rem; width: 100px; text-align: center; } @@ -948,17 +948,14 @@ img.mail-conv-sender-photo { background-color: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); - } - - #profile-jot-text::-webkit-input-placeholder { - font-size: 1.2rem; + font-size: 1.3rem; } #profile-jot-text::-moz-placeholder { - font-size: 1.2rem; + font-size: 1.3rem; } #profile-jot-text:focus::-webkit-input-placeholder { @@ -1047,14 +1044,6 @@ img.mail-conv-sender-photo { height: $reply_photo; } -.wall-item-content, -.mail-conv-body, -.page-body, -.chat-item-text, -.chat-item-text-self { - font-size: 1rem; -} - .comment-edit-text { border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); @@ -1185,6 +1174,7 @@ img.mail-conv-sender-photo { border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); margin-bottom: 1.5rem; + font-size: 1.1rem; } .section-title-wrapper { @@ -1341,7 +1331,6 @@ main.fullscreen .section-content-wrapper-np { /* bootstrap overrides */ blockquote { - font-size: 1rem; font-style: italic; border-left: 3px solid var(--bs-border-color); padding: 1em 0px 1em 1.5em; diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php index 350f0c867..63d3b4bf9 100644 --- a/view/theme/redbasic/php/style.php +++ b/view/theme/redbasic/php/style.php @@ -100,8 +100,8 @@ $background_image = $background_image ?: ''; $background_image_dark = $background_image_dark ?: ''; $font_size = $font_size ?: '0.875rem'; $converse_width = $converse_width ?: '52'; //unit: rem -$top_photo = $top_photo ?: '2.5rem'; -$reply_photo = $reply_photo ?: '2.5rem'; +$top_photo = $top_photo ?: '2.9rem'; +$reply_photo = $reply_photo ?: '2.9rem'; // Apply the settings if(file_exists('view/theme/redbasic/css/style.css')) { -- cgit v1.2.3 From 9cbb9a48742d41eba8d2d65e1a74cd0d6fe61554 Mon Sep 17 00:00:00 2001 From: Mario Date: Sun, 17 Mar 2024 21:30:50 +0000 Subject: theme min/max version and minor css fix --- view/theme/redbasic/php/theme.php | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/php/theme.php b/view/theme/redbasic/php/theme.php index c33c4f78e..1f50ed786 100644 --- a/view/theme/redbasic/php/theme.php +++ b/view/theme/redbasic/php/theme.php @@ -4,8 +4,8 @@ * * Name: Redbasic * * Description: Hubzilla standard theme * * Version: 2.2 - * * MinVersion: 8.0 - * * MaxVersion: 9.0 + * * MinVersion: 9.0 + * * MaxVersion: 10.0 * * Author: Fabrixxm * * Maintainer: Mike Macgirvin * * Maintainer: Mario Vavti -- cgit v1.2.3 From 7c5a0887cc050f98362c8badb41dda35bbdaf201 Mon Sep 17 00:00:00 2001 From: Mario Date: Mon, 18 Mar 2024 09:10:07 +0000 Subject: css fix --- view/theme/redbasic/css/style.css | 1 - 1 file changed, 1 deletion(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index baadd7843..6629861f6 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -1418,7 +1418,6 @@ dl.bb-dl > dd > li { .bootstrap-tagsinput input { height: 2.5rem; margin: 0; - max-width: 30%; } .bootstrap-tagsinput { -- cgit v1.2.3 From acc1834b0dc4804703610101fa95a3375649bc45 Mon Sep 17 00:00:00 2001 From: Mario Date: Mon, 18 Mar 2024 09:12:35 +0000 Subject: make theme compatible with rc version --- view/theme/redbasic/php/theme.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/php/theme.php b/view/theme/redbasic/php/theme.php index 1f50ed786..1f682634e 100644 --- a/view/theme/redbasic/php/theme.php +++ b/view/theme/redbasic/php/theme.php @@ -4,7 +4,7 @@ * * Name: Redbasic * * Description: Hubzilla standard theme * * Version: 2.2 - * * MinVersion: 9.0 + * * MinVersion: 8.9 * * MaxVersion: 10.0 * * Author: Fabrixxm * * Maintainer: Mike Macgirvin -- cgit v1.2.3 From ee0060619de03db1930da3472c48faac1ef9f95e Mon Sep 17 00:00:00 2001 From: Mario Date: Wed, 20 Mar 2024 15:25:38 +0000 Subject: css fix --- view/theme/redbasic/css/style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 6629861f6..30b9ba64c 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -1138,8 +1138,8 @@ img.mail-conv-sender-photo { } .menu-img-1 { - height: 1.1rem; - width: 1.1rem; + height: 1.3rem; + width: 1.3rem; border-radius: var(--bs-border-radius); } -- cgit v1.2.3 From 49509e73473de6f3528c7fdba8a4fa5437829817 Mon Sep 17 00:00:00 2001 From: Mario Date: Thu, 21 Mar 2024 09:47:34 +0000 Subject: more whitespace fixes and some docu --- view/theme/redbasic/css/sample.scss | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/sample.scss b/view/theme/redbasic/css/sample.scss index 87005be90..410026aa2 100644 --- a/view/theme/redbasic/css/sample.scss +++ b/view/theme/redbasic/css/sample.scss @@ -1,3 +1,7 @@ +// To compiled custom site bootstrap from sass, +// run this script from the document root for an example: +// php vendor/bin/pscss view/theme/redbasic/css/sample.scss view/theme/redbasic/css/bootstrap-custom.css + // See https://getbootstrap.com/docs/5.3/customize/sass/ for more infos // required import -- cgit v1.2.3 From 990017b5884bf4939dfbe6c03d3cfd4fc889dabd Mon Sep 17 00:00:00 2001 From: Mario Date: Fri, 22 Mar 2024 08:14:41 +0000 Subject: remove some unused variables --- view/theme/redbasic/php/style.php | 5 ----- view/theme/redbasic/schema/Focus-Boxy.php | 5 ----- 2 files changed, 10 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php index 63d3b4bf9..2636c71ef 100644 --- a/view/theme/redbasic/php/style.php +++ b/view/theme/redbasic/php/style.php @@ -13,17 +13,12 @@ if(!App::$install) { $nav_bg = get_pconfig($uid, 'redbasic', 'nav_bg'); $nav_bg_dark = get_pconfig($uid, 'redbasic', 'nav_bg_dark'); $narrow_navbar = get_pconfig($uid,'redbasic','narrow_navbar'); - $link_color = get_pconfig($uid, 'redbasic', 'link_color'); - $link_color_dark = get_pconfig($uid, 'redbasic', 'link_color_dark'); - $link_hover_color = get_pconfig($uid, 'redbasic', 'link_hover_color'); - $link_hover_color_dark = get_pconfig($uid, 'redbasic', 'link_hover_color_dark'); $bgcolor = get_pconfig($uid, 'redbasic', 'background_color'); $bgcolor_dark = get_pconfig($uid, 'redbasic', 'background_color_dark'); $schema = get_pconfig($uid,'redbasic','schema'); $background_image = get_pconfig($uid, 'redbasic', 'background_image'); $background_image_dark = get_pconfig($uid, 'redbasic', 'background_image_dark'); $font_size = get_pconfig($uid, 'redbasic', 'font_size'); - $radius = get_pconfig($uid, 'redbasic', 'radius'); $converse_width = get_pconfig($uid,'redbasic','converse_width'); $top_photo = get_pconfig($uid,'redbasic','top_photo'); $reply_photo = get_pconfig($uid,'redbasic','reply_photo'); diff --git a/view/theme/redbasic/schema/Focus-Boxy.php b/view/theme/redbasic/schema/Focus-Boxy.php index f298a0def..b3d9bbc7f 100644 --- a/view/theme/redbasic/schema/Focus-Boxy.php +++ b/view/theme/redbasic/schema/Focus-Boxy.php @@ -1,6 +1 @@