From 0035f8ab32214dc97e35bdd005dab2f023b3b40f Mon Sep 17 00:00:00 2001 From: Thamara Andrade Date: Sun, 5 Jul 2020 22:47:47 -0300 Subject: [PATCH 1/5] Introducing Pastel Rainbow Theme --- css/styles.css | 44 +++++++++++++++++++++++++++++++++++++++++++- js/themes.js | 2 +- src/preferences.html | 1 + 3 files changed, 45 insertions(+), 2 deletions(-) diff --git a/css/styles.css b/css/styles.css index ac0f61a56..5539e0596 100644 --- a/css/styles.css +++ b/css/styles.css @@ -9,6 +9,7 @@ html[data-theme="light"] { --page-bground: white; --page-color: black; --table-bground: white; + --input-bground: transparent; --table-border: rgb(203, 203, 203); --table-total-border: rgb(164, 158, 207); --table-cell-offtime-bground: rgb(245, 245, 245); @@ -40,6 +41,7 @@ html[data-theme="dark"] { --page-color: white; --table-bground: rgb(39, 39, 39); --table-border: rgb(90, 90, 90); + --input-bground: transparent; --table-total-border: rgb(95, 92, 121); --table-cell-offtime-bground: rgb(71, 71, 71); --table-cell-offtime-color: rgb(151, 151, 151); @@ -65,12 +67,51 @@ html[data-theme="dark"] { --day-calendar-select-icon: -webkit-image-set(url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAiIGhlaWdodD0iMTAiPg0KICAgIDxwb2x5Z29uIHBvaW50cz0iNTAgODUsIDEwMCAwLCAwIDAiIGZpbGw9IndoaXRlIj48L3BvbHlnb24+DQo8L3N2Zz4=) 1x); } +html[data-theme="pastel-rainbow"] { + --page-bground: transparent; + --page-color: black; + --table-bground: rgba(255, 238, 227, 0.3); + --input-bground: transparent; + --table-border: #28292F; + --table-total-border: rgb(121, 121, 121); + --table-cell-offtime-bground: rgba(0, 0, 0, 0.1); + --table-cell-offtime-color: rgba(0, 0, 0, 0.5); + --table-cell-total-bground: transparent; + --table-cell-total-color: var(--table-cell-offtime-color); + --table-header-label-bground: rgba(255, 238, 227, 0.5);; + --table-header-label-shadow: var(--table-border); + --error: red; + --punch-bground: var(--table-total-border); + --punch-color: rgb(228, 228, 228); + --punch-disable-bground: rgb(134, 134, 134); + --slider-background-color: rgb(220, 220, 220); + --slider-checked-color: var(--table-total-border); + --slider-unchecked-color: white; + --weekday-background: var(--slider-background-color); + --weekday-selected: var(--punch-bground); + --svg-invert: 0; + --disabled-input-bground: transparent; + --title-color: rgb(51, 51, 51); + --input-border: transparent; + --datepicker-icon: -webkit-image-set(url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSJXaW5kb3dUZXh0IiBkPSJNMTEuOTkgMkM2LjQ3IDIgMiA2LjQ4IDIgMTJzNC40NyAxMCA5Ljk5IDEwQzE3LjUyIDIyIDIyIDE3LjUyIDIyIDEyUzE3LjUyIDIgMTEuOTkgMnpNMTIgMjBjLTQuNDIgMC04LTMuNTgtOC04czMuNTgtOCA4LTggOCAzLjU4IDggOC0zLjU4IDgtOCA4eiIvPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz48cGF0aCBkPSJNMTIuNSA3SDExdjZsNS4yNSAzLjE1Ljc1LTEuMjMtNC41LTIuNjd6Ii8+PC9zdmc+) 1x); + --calendar-icon: -webkit-image-set(url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNSIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSJXaW5kb3dUZXh0IiBkPSJNMjAgM2gtMVYxaC0ydjJIN1YxSDV2Mkg0Yy0xLjEgMC0yIC45LTIgMnYxNmMwIDEuMS45IDIgMiAyaDE2YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6bTAgMThINFY4aDE2djEzeiIvPjxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiLz48L3N2Zz4=) 1x); + --day-calendar-select-icon: -webkit-image-set(url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAiIGhlaWdodD0iMTAiPg0KICAgIDxwb2x5Z29uIHBvaW50cz0iNTAgODUsIDEwMCAwLCAwIDAiIGZpbGw9ImJsYWNrIj48L3BvbHlnb24+DQo8L3N2Zz4=) 1x); +} + /* There are some libraries that impose their own colors. These may need to be overriden for specific themes */ html[data-theme="dark"] .text-danger { color: rgb(226, 93, 90); } +html[data-theme="pastel-rainbow"] .text-danger { + color: rgb(226, 93, 90); +} + +html[data-theme="pastel-rainbow"] body { + background-image: linear-gradient(to right, #FF9AA2, #FFB7B2, #FFDAC1, #E2F0CB, #B5EAD7, #C7CEEA); +} + body { background-color: var(--page-bground); color: var(--page-color); @@ -156,6 +197,7 @@ body { #calendar .table-body { overflow-y: auto; + background-color: var(--table-bground); } #calendar tr { @@ -214,7 +256,7 @@ body { #calendar input { color: var(--page-color); border: none; - background-color: transparent; + background-color: var(--input-bground); } #calendar input[type="image"] { diff --git a/js/themes.js b/js/themes.js index fd0c1295b..583add611 100644 --- a/js/themes.js +++ b/js/themes.js @@ -1,4 +1,4 @@ -const themeOptions = [ 'light', 'dark' ]; +const themeOptions = [ 'light', 'dark', 'pastel-rainbow' ]; /** * Checks whether the provided theme is valid. This list should be reflected in the `styles.css` file. diff --git a/src/preferences.html b/src/preferences.html index dfa45754e..0ee0a13a0 100644 --- a/src/preferences.html +++ b/src/preferences.html @@ -80,6 +80,7 @@
From 769a701b8f841ef8dfe8bf750a388e5a879e378f Mon Sep 17 00:00:00 2001 From: Thamara Andrade Date: Sun, 5 Jul 2020 22:48:30 -0300 Subject: [PATCH 2/5] Fix lint --- css/styles.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/css/styles.css b/css/styles.css index 5539e0596..ccc25cc85 100644 --- a/css/styles.css +++ b/css/styles.css @@ -72,13 +72,13 @@ html[data-theme="pastel-rainbow"] { --page-color: black; --table-bground: rgba(255, 238, 227, 0.3); --input-bground: transparent; - --table-border: #28292F; + --table-border: #28292f; --table-total-border: rgb(121, 121, 121); --table-cell-offtime-bground: rgba(0, 0, 0, 0.1); --table-cell-offtime-color: rgba(0, 0, 0, 0.5); --table-cell-total-bground: transparent; --table-cell-total-color: var(--table-cell-offtime-color); - --table-header-label-bground: rgba(255, 238, 227, 0.5);; + --table-header-label-bground: rgba(255, 238, 227, 0.5); --table-header-label-shadow: var(--table-border); --error: red; --punch-bground: var(--table-total-border); @@ -109,7 +109,7 @@ html[data-theme="pastel-rainbow"] .text-danger { } html[data-theme="pastel-rainbow"] body { - background-image: linear-gradient(to right, #FF9AA2, #FFB7B2, #FFDAC1, #E2F0CB, #B5EAD7, #C7CEEA); + background-image: linear-gradient(to right, #ff9aa2, #ffb7b2, #ffdac1, #e2f0cb, #b5ead7, #c7ceea); } body { From 1668ef3f308aa11cd72e03086e5c58b426288ab2 Mon Sep 17 00:00:00 2001 From: Thamara Andrade Date: Sun, 5 Jul 2020 22:53:56 -0300 Subject: [PATCH 3/5] Adding new theme to tests --- __tests__/__renderer__/themes.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/__tests__/__renderer__/themes.js b/__tests__/__renderer__/themes.js index 0291502bd..c473aa29d 100755 --- a/__tests__/__renderer__/themes.js +++ b/__tests__/__renderer__/themes.js @@ -11,6 +11,7 @@ describe('Theme Functions', function() { test('should validate', () => { expect(isValidTheme('light')).toBeTruthy(); expect(isValidTheme('dark')).toBeTruthy(); + expect(isValidTheme('pastel-rainbow')).toBeTruthy(); }); }); @@ -25,6 +26,7 @@ describe('Theme Functions', function() { test('should apply', () => { expect(applyTheme('light')).toBeTruthy(); expect(applyTheme('dark')).toBeTruthy(); + expect(applyTheme('pastel-rainbow')).toBeTruthy(); }); test('should not apply', function() { From cd3bb09357deb250f22d9b0752e11667b983232f Mon Sep 17 00:00:00 2001 From: Thamara Andrade Date: Sun, 5 Jul 2020 23:27:00 -0300 Subject: [PATCH 4/5] Force CI From b16a0f17b103d15d42181a68342d40beffb364ed Mon Sep 17 00:00:00 2001 From: Thamara Andrade Date: Mon, 6 Jul 2020 10:44:08 -0300 Subject: [PATCH 5/5] Adding changelog entry --- changelog.txt | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/changelog.txt b/changelog.txt index 91c8ac5ef..6854fcaaf 100644 --- a/changelog.txt +++ b/changelog.txt @@ -1,8 +1,9 @@ 1.5.5 (in development) ------------------------------------------------------------------------ +- Enhancement: [#299] Introducing new theme: Pastel Rainbow Who built 1.5.5: - +- thamara 1.5.4