Compare commits

...

13 commits

Author SHA1 Message Date
aaron 29fb2dd641 update frio-red
changed the missing color
2024-02-19 09:10:53 +01:00
Jakobus Schürz eb4dd7c27a fix merge 2024-02-19 09:10:53 +01:00
Jakobus Schürz (admin) 33cf47be50 reduce threadlines 2024-02-19 09:10:53 +01:00
Jakobus Schürz (admin) 362562ab93 Add Threadview to Frio 2024-02-19 09:10:53 +01:00
aaron 6c81d40542 update frio-red
changed the missing color
2024-02-19 09:10:53 +01:00
Jakobus Schürz fed9eeb4b8 change preview-video image 2024-02-19 09:10:53 +01:00
Jakobus Schürz d913971e56 change video preview image 2024-02-19 09:10:53 +01:00
Jakobus Schürz (admin) 68ee9550ea remove iframe 2024-02-19 09:10:53 +01:00
Jakobus Schürz (admin) a81a650500 add Video to README 2024-02-19 09:10:53 +01:00
Jakobus Schürz (admin) 006f9ba4de reduce threadlines 2024-02-19 09:10:53 +01:00
Jakobus Schürz 35a9be6f6c fix some view-drawbacks
update README
2024-02-19 09:10:53 +01:00
Jakobus Schürz d096fb4899 fix better visibility on likers list 2024-02-19 09:10:53 +01:00
Jakobus Schürz (admin) 4d32a22bb1 Add Threadview to Frio 2024-02-19 09:10:53 +01:00
4 changed files with 228 additions and 0 deletions

View file

@ -0,0 +1,14 @@
# Threadview in Frio
## Install it
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.
Activate "intelligent threadview", it really helps with new Link to parent comment!!!
## And how it looks like?
[![Preview of Video for Friendica with loooooooong thread](./preview-video.png)](https://kino.schuerz.at/w/1EEXMnx6Z2LM52r9E3snby)

Binary file not shown.

After

Width:  |  Height:  |  Size: 297 KiB

View file

@ -0,0 +1,193 @@
/*
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: 4px;
--second-border-radius: 7px;
--third-border-radius: 1px;
--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{
filter: brightness(1);
}
button:active {
filter: brightness(1);
color: var(--active_btn_color) !important;
}
}
#contact-edit-actions-button {
filter: none !important;
}
/*figure, audio, canvas, progress, video, img {
max-height: 75vh;
}*/
figure, audio, canvas, progress, video {
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,
.media {
/*
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;
}
.dropdown-toggle.active,
.button-likes.active,
.button-event.active,
.button-announces.active {
color: var(--active_btn_color) !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,
.button-likes,
.button-event,
.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;
}
}
.media.shiny {
}

View file

@ -0,0 +1,21 @@
<?php
/*
* Name: Threadview
* Licence: AGPL
* Author: Jakob Schürz <jakob@schuerz.at>
* 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 = '';