Add Threadview to Frio

This commit is contained in:
Jakobus Schürz (admin) 2023-03-11 02:20:51 +01:00 committed by Jakobus Schürz
parent 219563647d
commit 4d32a22bb1
3 changed files with 202 additions and 0 deletions

View file

@ -0,0 +1,7 @@
# Threadview in Frio
Just place this two files in
<friendica>/view/theme/frio/scheme/
reload your browser and you can choose in custom theme settings "Threadview" as Color-Scheme, which gives you pretty Thread-Lines on the left.
Also improves size of videos and images, so that they will fit always into screen. And the same for some veeeery long usernames too.

View file

@ -0,0 +1,174 @@
/*
Licence : AGPL
Created on : Sun 26 Feb 2023 08:20:14 PM CET
Author : jakob@soc.schuerz.at
Color picker : https://www.w3schools.com/colors/colors_names.asp
CSS UTF8 icons : https://www.utf8icons.com
*/
:root {
--main-border-radius: 10px;
--second-border-radius: 7px;
--third-border-radius: 4px;
--active_btn_color: #cc9f0d; // Gelb
--inactive_btn_color: #000055; // Gelb
}
/* Radius arount boxes */
.section,
.widget,
.media,
.wall-item-container,
.thread-wrapper,
div[class^="thread_level"],
div[class*=" thread_level"],
.toplevel_item,
.apub,
.panel-default,
.panel_body,
.panel {
border-bottom-left-radius: var(--main-border-radius) !important;
border-bottom-right-radius: var(--main-border-radius) !important;
border-top-right-radius: var(--main-border-radius) !important;
}
.btn,
.label {
border-radius: var(--second-border-radius) !important;
}
i .btn-link {
color: #fff !important;
}
button .btn-link {
color: #000 !important;
}
#contact-edit-actions-button,
#contact-edit-actions-button.active {
background-color: $nav_bg;
color: #fff !important;
}
@media (hover: hover) {
#main-menu,
#nav-notifications-menu-btn,
button:hover {
//color: #fff !important;
filter: brightness(1);
}
button:active {
filter: brightness(1);
color: var(--active_btn_color) !important;
}
}
@media (hover: none) {
#main-menu,
#nav-notifications-menu-btn,
button:hover{
//color: #fff !important;
filter: brightness(1);
}
button:active {
filter: brightness(1);
color: var(--active_btn_color) !important;
}
}
#contact-edit-actions-button {
//color: #fff;
filter: none !important;
}
audio, canvas, progress, video, img {
max-height: 75vh;
}
.wall-item-actions {
background-color: #b7b7b75c;
padding: 3px;
padding-left: 6px;
padding-right: 6px;
border-radius: var(--third-border-radius) !important;
}
/* Thread-Lines left on comments
.wall-item-container {
border-top: 1px solid;
border-top-color: $nav_bg;
border-image: linear-gradient(to right, $nav_bg, transparent) 30;
}
*/
/*.tread-wrapper,*/
div[class^="thread_level"],
div[class*=" thread_level"] {
border-left: 1px solid;
margin-left: 2px;
border-left-color: $nav_bg;
}
.media,
{
border-left: 1px solid;
}
.wall-item-container {
margin-left: 3px !important;
}
@media screen and (max-width: 767px) {
button[id^=like-] { margin-right: 5px !important;}
.button,
.btn {
padding: 1px;
padding-inline: 22px;
margin-top: 5px;
margin-bottom: 5px;
background-color: $nav_bg;
filter: brightness(1.25);
}
.wall-item-container {
margin-top: 10px;
}
.contact-info-comment {
display: contents !important;
}
.fakelink,
.media-heading,
.wall-item-name-link {
word-wrap: anywhere !important;
}
.dropdown-toggle.active,
.button-likes.active,
.button-announces.active {
color: var(--active_btn_color) !important;
}
.dropdown-toggle,
.button-likes,
.button-announces {
color: #000;
}
.dropdown-menu {
max-width: 40vh;
}
/* Thread-Lines left on comments */
div[class^="thread_level"],
div[class*=" thread_level"] {
border-left: 1px solid;
margin-left: 2px;
border-left-color: $nav_bg;
}
.media,
{
border-left: 1px solid;
}
.wall-item-container {
margin-left: 3px solid !important;
}
}

View file

@ -0,0 +1,21 @@
<?php
/*
* Name: Light
* Licence: AGPL
* Author: Hypolite Petovan <hypolite@friendica.mrpetovan.com>
* Overwrites: nav_bg, nav_icon_color, link_color, background_color, background_image, 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;
$background_image = '';