From 6e9f913ae21d08ac1ef2b172d43f97baa67f613b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Fri, 14 Jul 2023 14:42:08 +0200 Subject: [PATCH 1/2] Added support for PiP and video controls --- TangerineUI-purple.css | 35 ++++++++++++++++++++++++++++------- TangerineUI.css | 29 +++++++++++++++++++++++++---- 2 files changed, 53 insertions(+), 11 deletions(-) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index f61e5ee..502c1ed 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -602,9 +602,9 @@ body.layout-single-column { .layout-single-column .compose-form .compose-form__modifiers .compose-form__upload .icon-button { color: #ffffff; } -.compose-form .compose-form__modifiers .compose-form__upload .icon-button:active, -.compose-form .compose-form__modifiers .compose-form__upload .icon-button:focus, -.compose-form .compose-form__modifiers .compose-form__upload .icon-button:hover { +.layout-single-column .compose-form .compose-form__modifiers .compose-form__upload .icon-button:active, +.layout-single-column .compose-form .compose-form__modifiers .compose-form__upload .icon-button:focus, +.layout-single-column .compose-form .compose-form__modifiers .compose-form__upload .icon-button:hover { background-color: rgba(0, 0, 0, .4); } @media screen and (max-width:1174px) { @@ -1869,7 +1869,7 @@ body.layout-single-column { -/* Lists tab */ +/* πŸ“‹ Lists tab */ .layout-single-column .column-inline-form { background-color: var(--color-accent-bg); border-radius: 7px; @@ -1924,7 +1924,7 @@ body.layout-single-column { } -/* Follow requests */ +/* βž• Follow requests */ .layout-single-column #Follow-requests { margin-bottom: 0; z-index: 0; @@ -2039,7 +2039,7 @@ body.layout-single-column { background-color: var(--color-accent-focus); } -/* Toggles */ +/* ⏺️ Toggles */ .layout-single-column .setting-toggle__label { vertical-align: top; } @@ -2059,7 +2059,7 @@ body.layout-single-column { } -/* Radio buttons */ +/* ⏺️ Radio buttons */ .layout-single-column .radio-button { color: var(--color-content-fg); } @@ -2216,6 +2216,27 @@ body.layout-single-column { color: var(--color-accent-fg); } +/* πŸ–ΌοΈ Picture in Picture */ +.layout-single-column .picture-in-picture { + box-shadow: 0 0 5px rgba(0, 0, 0, .2); + border-radius: 7px; +} +.layout-single-column .picture-in-picture__footer, +.layout-single-column .picture-in-picture__header { + background-color: var(--color-content-bg); +} +.picture-in-picture__header .display-name span { + color: var(--color-content-fg-muted); +} + +/* ⏯️ Video controls */ +.layout-single-column .video-player__seek__buffer, +.layout-single-column .video-player__seek__progress, +.layout-single-column .video-player__volume__handle, +.layout-single-column .video-player__volume__current { + background-color: var(--color-accent); +} + /* πŸ“„ Meta ------- */ diff --git a/TangerineUI.css b/TangerineUI.css index 733faf6..85fcad9 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -1869,7 +1869,7 @@ body.layout-single-column { -/* Lists tab */ +/* πŸ“‹ Lists tab */ .layout-single-column .column-inline-form { background-color: var(--color-accent-bg); border-radius: 7px; @@ -1924,7 +1924,7 @@ body.layout-single-column { } -/* Follow requests */ +/* βž• Follow requests */ .layout-single-column #Follow-requests { margin-bottom: 0; z-index: 0; @@ -2039,7 +2039,7 @@ body.layout-single-column { background-color: var(--color-accent-focus); } -/* Toggles */ +/* ⏺️ Toggles */ .layout-single-column .setting-toggle__label { vertical-align: top; } @@ -2059,7 +2059,7 @@ body.layout-single-column { } -/* Radio buttons */ +/* ⏺️ Radio buttons */ .layout-single-column .radio-button { color: var(--color-content-fg); } @@ -2216,6 +2216,27 @@ body.layout-single-column { color: var(--color-accent-fg); } +/* πŸ–ΌοΈ Picture in Picture */ +.layout-single-column .picture-in-picture { + box-shadow: 0 0 5px rgba(0, 0, 0, .2); + border-radius: 7px; +} +.layout-single-column .picture-in-picture__footer, +.layout-single-column .picture-in-picture__header { + background-color: var(--color-content-bg); +} +.layout-single-column .picture-in-picture__header .display-name span { + color: var(--color-content-fg-muted); +} + +/* ⏯️ Video controls */ +.layout-single-column .video-player__seek__buffer, +.layout-single-column .video-player__seek__progress, +.layout-single-column .video-player__volume__handle, +.layout-single-column .video-player__volume__current { + background-color: var(--color-accent); +} + /* πŸ“„ Meta ------- */ From 605a9aa06f4fb6ffde8f59f556ac00acc9c963e7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nil=C3=A9ane?= Date: Fri, 14 Jul 2023 14:43:46 +0200 Subject: [PATCH 2/2] v1.4.2 --- TangerineUI-purple.css | 2 +- TangerineUI.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css index 502c1ed..0058c7b 100644 --- a/TangerineUI-purple.css +++ b/TangerineUI-purple.css @@ -1,5 +1,5 @@ /* TangerineUI 🍊 for Mastodon ・ Purple variant πŸͺ» - version: 1.4.1 + version: 1.4.2 A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/ diff --git a/TangerineUI.css b/TangerineUI.css index 85fcad9..8744103 100644 --- a/TangerineUI.css +++ b/TangerineUI.css @@ -1,5 +1,5 @@ /* TangerineUI 🍊 for Mastodon - version: 1.4.1 + version: 1.4.2 A Tangerine redesign for Mastodon's Web UI. https://github.com/nileane/TangerineUI-for-Mastodon/