manuel/uhr
1
0
Fork 0
Code Issues 5 Pull requests Releases Wiki Activity

Migrate from CSS to SCSS. There's still a lot of potential, though.

Browse source
This commit is contained in:
Manuel Friedli 2019-05-09 19:04:17 +02:00
parent dd1e7a2d18
commit d00292fbb9
16 changed files with 161 additions and 147 deletions
Download patch file Download diff file Expand all files Collapse all files

26
css/uhr-black.scss
View file

@ -12,20 +12,22 @@ GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
.uhr.black {
background-color: #111;
.black {
&.uhr {
background-color: #111;
.dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
.dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
.letter:not(.active) {
color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
}
.letter:not(.active) {
color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
.onoffswitch-inner:before {
background-color: #111;
}
}
.black .onoffswitch-inner:before {
background-color: #111;
}

28
css/uhr-red.css → css/uhr-blue.scss
View file

@ -12,20 +12,22 @@ GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
.uhr.red {
background-color: #700;
}
.blue {
&.uhr {
background-color: #00a;
.red .onoffswitch-inner:before {
background-color: #700;
}
.dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
.uhr.red .dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
.letter:not(.active) {
color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
}
.uhr.red .letter:not(.active) {
color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
.onoffswitch-inner:before {
background-color: #00a;
}
}

28
css/uhr-blue.css → css/uhr-green.scss
View file

@ -12,20 +12,22 @@ GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
.uhr.blue {
background-color: #00a;
}
.green {
&.uhr {
background-color: #0c0;
.blue .onoffswitch-inner:before {
background-color: #00a;
}
.dot:not(.active) {
border-color: rgba(0, 0, 0, 0.1);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
}
.uhr.blue .dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
.letter:not(.active) {
color: rgba(0, 0, 0, 0.1);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
}
}
.uhr.blue .letter:not(.active) {
color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
.onoffswitch-inner:before {
background-color: #0c0;
}
}

41
css/uhr-pink.css
View file

@ -1,41 +0,0 @@
/*
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
.uhr.pink {
background-color: #f0a;
}
.uhr.pink .dot.active {
border-color: #fff;
box-shadow: 0 0 0.1em #fff;
}
.uhr.pink .letter.active {
color: #fff;
text-shadow: 0 0 0.1em #fff;
}
.pink .onoffswitch-inner:before {
background-color: #f0a;
}
.uhr.pink .dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
.uhr.pink .letter:not(.active) {
color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}

43
css/uhr-pink.scss Normal file
View file

@ -0,0 +1,43 @@
/*
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
.pink {
&.uhr {
background-color: #f0a;
.dot.active {
border-color: #fff;
box-shadow: 0 0 0.1em #fff;
}
.letter.active {
color: #fff;
text-shadow: 0 0 0.1em #fff;
}
.dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
.letter:not(.active) {
color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
}
.onoffswitch-inner:before {
background-color: #f0a;
}
}

28
css/uhr-green.css → css/uhr-red.scss
View file

@ -12,20 +12,22 @@ GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
.uhr.green {
background-color: #0c0;
}
.red {
&.uhr {
background-color: #700;
.green .onoffswitch-inner:before {
background-color: #0c0;
}
.dot:not(.active) {
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
.uhr.green .dot:not(.active) {
border-color: rgba(0, 0, 0, 0.1);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
}
.letter:not(.active) {
color: rgba(255, 255, 255, 0.1);
text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.1);
}
}
.uhr.green .letter:not(.active) {
color: rgba(0, 0, 0, 0.1);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
.onoffswitch-inner:before {
background-color: #700;
}
}

44
css/uhr-white.css → css/uhr-white.scss
View file

@ -12,30 +12,32 @@ GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
.uhr.white {
background-color: #ccc;
}
.white {
&.uhr {
background-color: #ccc;
.uhr.white .dot.active {
border-color: #fff;
box-shadow: 0 0 0.1em #fff;
}
.dot.active {
border-color: #fff;
box-shadow: 0 0 0.1em #fff;
}
.uhr.white .letter.active {
color: #fff;
text-shadow: 0 0 0.1em #fff;
}
.letter.active {
color: #fff;
text-shadow: 0 0 0.1em #fff;
}
.white .onoffswitch-inner:before {
background-color: #ccc;
}
.dot:not(.active) {
border-color: rgba(0, 0, 0, 0.1);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
}
.uhr.white .dot:not(.active) {
border-color: rgba(0, 0, 0, 0.1);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
}
.letter:not(.active) {
color: rgba(0, 0, 0, 0.1);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
}
}
.uhr.white .letter:not(.active) {
color: rgba(0, 0, 0, 0.1);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.1);
.onoffswitch-inner:before {
background-color: #ccc;
}
}

44
css/uhr-yellow.css → css/uhr-yellow.scss
View file

@ -12,30 +12,32 @@ GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
.uhr.yellow {
background-color: #fd0;
}
.yellow {
&.uhr {
background-color: #fd0;
.uhr.yellow .dot.active {
border-color: #fff;
box-shadow: 0 0 0.1em #fff;
}
.dot.active {
border-color: #fff;
box-shadow: 0 0 0.1em #fff;
}
.uhr.yellow .letter.active {
color: #fff;
text-shadow: 0 0 0.1em #fff;
}
.letter.active {
color: #fff;
text-shadow: 0 0 0.1em #fff;
}
.yellow .onoffswitch-inner:before {
background-color: #fd0;
}
.dot:not(.active) {
border-color: rgba(0, 0, 0, 0.05);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.05);
}
.uhr.yellow .dot:not(.active) {
border-color: rgba(0, 0, 0, 0.05);
box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.05);
}
.letter:not(.active) {
color: rgba(0, 0, 0, 0.05);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.05);
}
}
.uhr.yellow .letter:not(.active) {
color: rgba(0, 0, 0, 0.05);
text-shadow: 0 0 0.1em rgba(0, 0, 0, 0.05);
.onoffswitch-inner:before {
background-color: #fd0;
}
}