Added Light and Dark Grey Main and Secondary themes as per Request #2600 #4293

fdarcey · 2023-11-07T19:58:18Z

Title

Added Light and Dark Grey Main and Secondary themes as per Request #2600

Pull Request Type

Bugfix
Feature Implementation
Documentation
Other

Related issue

closes #2600

Description

FreeTube/src/renderer/themes.ccs now has:

.mainLightGrey with primary-color: #B1B1B1, primary-color-hover: #848482, and primary-color-active: #7E7E7E. Lines 266, 365-369.
.mainDarkGrey with primary-color: ##696969, primary-color-hover: #555555, and primary-color-active: #4E4E4E. Lines 267, 371-375.
.secLightGrey with primary-color-active: #4E4E4E, accent-color-hover: #848482, accent-color-active: #7E7E7E,
accent-color-light: #cfcfcf, accent-color-visited: #797979, accent-color-opacity1: rgba(177,177,177,0.04), with accent-color-opacity2, 3, and 4 having their fourth value at 0.12, 0.16, and 0.24, respectively. Lines 561, 756-766.
.secDarkGrey with accent-color: #696969, accent-color-hover: #555555, accent-color-active: #4E4E4E,
accent-color-light: #A5A5A5, accent-color-visited: #444444, accent-color-opacity1: rgba(105,105,105,0.04), with accent-color-opacity2, 3, and 4 having their fourth value at 0.12, 0.16, and 0.24, respectively. Lines 562, 768-778.

FreeTube/src/renderer/helpers/colors.js has:

{ name: 'LightGrey', value: '#B1B1B1'}, and { name: 'DarkGrey', value: '#696969'} on line 18 and 19 under export const colors.

FreeTube/static/locales/en-US.yaml has:

Light Grey: Light Grey and Dark Grey: Dark Grey on line 230 and 231.

Overall, the user could now select Light Grey and Dark Grey for main and secondary themes and have the corresponding UI elements switch to those colors.
Note: I have only updated en-US.yalm with Light and Dark Grey, deciding to allow the users more experienced with translations add in such for other languages. This means that until then, the main and secondary color menus will show them with "Setting.Theme Settings." preceding them.

Screenshots

Testing

This has been tested, and the result is shown in the screenshot.

Desktop

OS: Windows
OS Version: 11
FreeTube version: 0.19.1 Beta

Additional context

absidue · 2023-11-07T20:48:30Z

Issues are considered closed when the feature has been implemented or bug fixed. If we waited for all translators to log into weblate and translate stuff before closing issues, we would have them open for months or longer.

src/renderer/themes.css

static/locales/en-US.yaml

efb4f5ff-1298-471a-8973-3d47447115dc · 2023-11-09T20:49:47Z

I would suggest changing everything to gray instead of grey just to avoid confusion in the code

efb4f5ff-1298-471a-8973-3d47447115dc

LGTM

kommunarr

suggestion (blocking): --text-with-accent-color (as secondary) and --text-with-main-color (as primary) for dark grey needs to be white (#FFFFFF) or another light color to resolve the issue of inaccessible color contrast with complementing text.

github-actions · 2024-02-03T01:42:40Z

This PR is stale because it has been open 28 days with no activity. Remove stale label or comment or this will be closed in 14 days.

fdarcey · 2024-02-10T03:19:25Z

First of all, I'm sorry for forgetting about this. The schedule which once had a specific time I went to work on this project changed, and as a result other thinks took more of my mental space.

Secondly, I'm afraid that I don't understand my last task. I tried to fulfill it as best as I could interpret it, but I don't know if it was correct.

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-03-01T15:01:13Z

@jasonhenriquez

First of all, I'm sorry for forgetting about this. The schedule which once had a specific time I went to work on this project changed, and as a result other thinks took more of my mental space.

Secondly, I'm afraid that I don't understand my last task. I tried to fulfill it as best as I could interpret it, but I don't know if it was correct.

github-actions · 2024-03-30T01:42:42Z

This PR is stale because it has been open 28 days with no activity. Remove stale label or comment or this will be closed in 14 days.

kommunarr · 2024-04-17T19:58:32Z

Hi @fdarcey, I apologize for the communication troubles. I've created this PR here with a commit for implementing the suggested changes (& resolving merge conflicts).

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-04-17T20:16:15Z

src/renderer/themes.css

@@ -566,6 +582,26 @@ it can be safely elided. This looks quite pleasant on this theme. */
 .secDeepOrange {
  --text-with-accent-color: #000000;
 }
+.secLightGray {
+  --text-with-accent-color: #000000;
+  --logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");


Suggested change

--logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");

--logo-icon-bar-color: url("../../_icons/iconBlackSmall.svg");

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-04-17T20:16:26Z

src/renderer/themes.css

+.secLightGray {
+  --text-with-accent-color: #000000;
+  --logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");
+  --logo-text-bar-color: url("../../_icons/textBlackSmall.png");


Suggested change

--logo-text-bar-color: url("../../_icons/textBlackSmall.png");

--logo-text-bar-color: url("../../_icons/textBlackSmall.svg");

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-04-17T20:16:44Z

src/renderer/themes.css

+}
+.secDarkGray {
+  --text-with-accent-color: #FFFFFF;
+  --logo-icon-bar-color: url("../../_icons/iconWhiteSmall.png");


Suggested change

--logo-icon-bar-color: url("../../_icons/iconWhiteSmall.png");

--logo-icon-bar-color: url("../../_icons/iconWhiteSmall.svg");

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-04-17T20:16:53Z

src/renderer/themes.css

+.secDarkGray {
+  --text-with-accent-color: #FFFFFF;
+  --logo-icon-bar-color: url("../../_icons/iconWhiteSmall.png");
+  --logo-text-bar-color: url("../../_icons/textWhiteSmall.png");


Suggested change

--logo-text-bar-color: url("../../_icons/textWhiteSmall.png");

--logo-text-bar-color: url("../../_icons/textWhiteSmall.svg");

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-04-17T20:18:09Z

src/renderer/themes.css

+}
+.mainDarkGray {
+  --text-with-main-color: #FFFFFF;
+  --logo-icon-bar-color: url("../../_icons/iconWhiteSmall.png");


Suggested change

--logo-icon-bar-color: url("../../_icons/iconWhiteSmall.png");

--logo-icon-bar-color: url("../../_icons/iconWhiteSmall.svg");

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-04-17T20:18:20Z

src/renderer/themes.css

+.mainDarkGray {
+  --text-with-main-color: #FFFFFF;
+  --logo-icon-bar-color: url("../../_icons/iconWhiteSmall.png");
+  --logo-text-bar-color: url("../../_icons/textWhiteSmall.png");


Suggested change

--logo-text-bar-color: url("../../_icons/textWhiteSmall.png");

--logo-text-bar-color: url("../../_icons/textWhiteSmall.svg");

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-04-17T20:18:33Z

src/renderer/themes.css

+.mainLightGray {
+  --text-with-main-color: #000000;
+  --logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");
+  --logo-text-bar-color: url("../../_icons/textBlackSmall.png");


Suggested change

--logo-text-bar-color: url("../../_icons/textBlackSmall.png");

--logo-text-bar-color: url("../../_icons/textBlackSmall.svg");

efb4f5ff-1298-471a-8973-3d47447115dc · 2024-04-17T20:18:42Z

src/renderer/themes.css

@@ -286,6 +286,22 @@ it can be safely elided. This looks quite pleasant on this theme. */
  --logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");
  --logo-text-bar-color: url("../../_icons/textBlackSmall.png");
 }
+.mainLightGray {
+  --text-with-main-color: #000000;
+  --logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");


Suggested change

--logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");

--logo-icon-bar-color: url("../../_icons/iconBlackSmall.svg");

kommunarr · 2024-04-17T20:33:18Z

To clarify, the above issues detected are merge conflict issues not detected by the GH action, and these are all resolved in my commit above.

github-actions · 2024-05-16T01:45:20Z

This PR is stale because it has been open 28 days with no activity. Remove stale label or comment or this will be closed in 14 days.

github-actions · 2024-05-16T16:46:05Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2024-06-18T01:48:20Z

This PR is stale because it has been open 28 days with no activity. Remove stale label or comment or this will be closed in 14 days.

kasryan and others added 3 commits October 12, 2023 12:49

added light grey and dark grey to themes.css and colors.js

637c7b7

Added light and dark grey to en-US.yalm.

ac43085

Merge branch 'FreeTubeApp:development' into development

a6633b6

github-actions bot added the PR: waiting for review For PRs that are complete, tested, and ready for review label Nov 7, 2023

FreeTubeBot enabled auto-merge (squash) November 7, 2023 19:58

added necessary spaces in colors.js

3cd953d

auto-merge was automatically disabled November 7, 2023 20:09
Head branch was pushed to by a user without write access

FreeTubeBot enabled auto-merge (squash) November 7, 2023 20:09

ChunkyProgrammer reviewed Nov 7, 2023

View reviewed changes

src/renderer/themes.css Outdated Show resolved Hide resolved

static/locales/en-US.yaml Outdated Show resolved Hide resolved

removed excess code and changed 'grey' in en-US.yelm it 'gray'

da4d890

auto-merge was automatically disabled November 9, 2023 20:42
Head branch was pushed to by a user without write access

FreeTubeBot enabled auto-merge (squash) November 9, 2023 20:43

efb4f5ff-1298-471a-8973-3d47447115dc added PR: changes requested and removed PR: waiting for review For PRs that are complete, tested, and ready for review labels Nov 12, 2023

changed all grey to gray in themes.css, colors.js, and en-US.yalm

407ace0

auto-merge was automatically disabled November 14, 2023 19:18
Head branch was pushed to by a user without write access

FreeTubeBot enabled auto-merge (squash) November 14, 2023 19:18

Merge branch 'FreeTubeApp:development' into development

72b8d18

ChunkyProgrammer added PR: waiting for review For PRs that are complete, tested, and ready for review and removed PR: changes requested labels Nov 14, 2023

efb4f5ff-1298-471a-8973-3d47447115dc previously approved these changes Nov 22, 2023

View reviewed changes

ChunkyProgrammer requested review from PikachuEXE, absidue, ChunkyProgrammer and kommunarr November 22, 2023 17:39

kommunarr requested changes Nov 22, 2023

View reviewed changes

efb4f5ff-1298-471a-8973-3d47447115dc added PR: changes requested and removed PR: waiting for review For PRs that are complete, tested, and ready for review labels Nov 22, 2023

github-actions bot added the PR: stale label Feb 3, 2024

fdarcey and others added 2 commits February 9, 2024 20:02

Merge branch 'FreeTubeApp:development' into development

7fddb9e

Removed the bottom sections.

a16cb0e

auto-merge was automatically disabled February 10, 2024 03:17
Head branch was pushed to by a user without write access

FreeTubeBot enabled auto-merge (squash) February 10, 2024 03:17

github-actions bot removed the PR: stale label Feb 11, 2024

github-actions bot added the PR: stale label Mar 30, 2024

ChunkyProgrammer removed the PR: stale label Mar 30, 2024

efb4f5ff-1298-471a-8973-3d47447115dc reviewed Apr 17, 2024

View reviewed changes

github-actions bot added PR: stale PR: merge conflicts / rebase needed labels May 16, 2024

github-actions bot removed the PR: stale label May 17, 2024

kommunarr mentioned this pull request May 21, 2024

Make adding themes easier #5071

Open

1 task

github-actions bot added the PR: stale label Jun 18, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Added Light and Dark Grey Main and Secondary themes as per Request #2600 #4293

Added Light and Dark Grey Main and Secondary themes as per Request #2600 #4293

fdarcey commented Nov 7, 2023 •

edited

absidue commented Nov 7, 2023

efb4f5ff-1298-471a-8973-3d47447115dc commented Nov 9, 2023

efb4f5ff-1298-471a-8973-3d47447115dc left a comment

kommunarr left a comment •

edited

github-actions bot commented Feb 3, 2024

fdarcey commented Feb 10, 2024

efb4f5ff-1298-471a-8973-3d47447115dc commented Mar 1, 2024

github-actions bot commented Mar 30, 2024

kommunarr commented Apr 17, 2024 •

edited

efb4f5ff-1298-471a-8973-3d47447115dc Apr 17, 2024

efb4f5ff-1298-471a-8973-3d47447115dc Apr 17, 2024

efb4f5ff-1298-471a-8973-3d47447115dc Apr 17, 2024

efb4f5ff-1298-471a-8973-3d47447115dc Apr 17, 2024

efb4f5ff-1298-471a-8973-3d47447115dc Apr 17, 2024

efb4f5ff-1298-471a-8973-3d47447115dc Apr 17, 2024

efb4f5ff-1298-471a-8973-3d47447115dc Apr 17, 2024

efb4f5ff-1298-471a-8973-3d47447115dc Apr 17, 2024

kommunarr commented Apr 17, 2024 •

edited

github-actions bot commented May 16, 2024

github-actions bot commented May 16, 2024

github-actions bot commented Jun 18, 2024

	--logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");
	--logo-icon-bar-color: url("../../_icons/iconBlackSmall.svg");

	--logo-text-bar-color: url("../../_icons/textBlackSmall.png");
	--logo-text-bar-color: url("../../_icons/textBlackSmall.svg");

Added Light and Dark Grey Main and Secondary themes as per Request #2600 #4293

Are you sure you want to change the base?

Added Light and Dark Grey Main and Secondary themes as per Request #2600 #4293

Conversation

fdarcey commented Nov 7, 2023 • edited

Title

Pull Request Type

Related issue

Description

Screenshots

Testing

Desktop

Additional context

absidue commented Nov 7, 2023

efb4f5ff-1298-471a-8973-3d47447115dc commented Nov 9, 2023

efb4f5ff-1298-471a-8973-3d47447115dc left a comment

Choose a reason for hiding this comment

kommunarr left a comment • edited

Choose a reason for hiding this comment

github-actions bot commented Feb 3, 2024

fdarcey commented Feb 10, 2024

efb4f5ff-1298-471a-8973-3d47447115dc commented Mar 1, 2024

github-actions bot commented Mar 30, 2024

kommunarr commented Apr 17, 2024 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kommunarr commented Apr 17, 2024 • edited

github-actions bot commented May 16, 2024

github-actions bot commented May 16, 2024

github-actions bot commented Jun 18, 2024

fdarcey commented Nov 7, 2023 •

edited

kommunarr left a comment •

edited

kommunarr commented Apr 17, 2024 •

edited

kommunarr commented Apr 17, 2024 •

edited