franpcode/Pomodoro-Timer-with-Clockify-integration
1
0
Fork 0
mirror of https://github.com/FranP-code/Pomodoro-Timer-with-Clockify-integration.git synced 2025-10-12 23:52:30 +00:00
Code Issues 1 Packages Projects Releases Wiki Activity

Added hide to style selector and more modularizated the code

Browse Source
This commit is contained in:
Francisco Pessano
2021-09-19 00:41:18 -03:00
parent e8e826d7ff
commit 7d558fd54c
14 changed files with 321 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
public/css_styles/styles.css
View File

@@ -134,49 +134,51 @@
padding-bottom: 12vh;
position: absolute;
top: 29vh;
left: 77vw;
left: 75vw;
box-shadow: 1px 6px 15px #00000020;
z-index: 50;
transition: 0.2s ease-in-out;
}
.style-selector h2 {
font-family: "Rambla", sans-serif;
color: #1FAB89;
font-size: 30pt;
text-align: center;
margin-left: -3vw;
margin-top: 1vh;
margin-bottom: 3vh;
}
.style-selector .style-container {
.style-selector .style-selection-container .style-container {
display: flex;
height: 10vh;
align-items: center;
}
.style-selector .style-container label {
.style-selector .style-selection-container .style-container label {
display: flex;
flex-direction: column;
justify-content: center;
}
.style-selector .style-container label .title {
.style-selector .style-selection-container .style-container label .title {
font-family: "Rambla", sans-serif;
font-size: 13pt;
}
.style-selector .style-container label .times {
.style-selector .style-selection-container .style-container label .times {
font-family: "Rambla", sans-serif;
color: #1FAB89;
font-size: 13pt;
}
.style-selector input {
.style-selector .style-selection-container input {
width: 65px;
opacity: 0;
}
.style-selector .checkbox__input {
.style-selector .style-selection-container .checkbox__input {
display: grid;
grid-template-areas: "checkbox";
}
.style-selector .checkbox__input > * {
.style-selector .style-selection-container .checkbox__input > * {
grid-area: checkbox;
}
.style-selector .checkbox_control {
.style-selector .style-selection-container .checkbox_control {
display: inline-grid;
width: 45px;
height: 45px;
@@ -185,15 +187,24 @@
border-radius: 100%;
transition: ease-in-out 0.2s;
}
.style-selector .checkbox__input input:checked + .checkbox_control {
.style-selector .style-selection-container .checkbox__input input:checked + .checkbox_control {
background-color: #9DF3C4;
}
.style-selector-show {
opacity: 100%;
}
.style-selector-hidden {
opacity: 0%;
}
.go-down {
height: 7vh;
width: 100vw;
width: 100%;
display: flex;
justify-content: center;
cursor: pointer;
}
.go-down svg {
height: 6vh;
@@ -202,6 +213,50 @@
fill: #aaaaaa;
}
#about-this {
height: 95vh;
padding: 0px 3vw;
padding-top: 5vh;
}
#about-this .titles {
display: flex;
}
#about-this .titles h3 {
width: 50%;
font-family: "Raleway", sans-serif;
font-weight: 700;
margin: 0;
padding: 0;
user-select: none;
font-size: 22pt;
}
#about-this .titles h3 .line-through {
text-decoration: line-through;
text-decoration-thickness: 5px;
text-decoration-color: #73b7ff;
}
#about-this .information {
display: flex;
}
#about-this .information ul {
width: 50%;
}
#about-this .information ul li h4 {
margin: 0;
padding: 0;
user-select: none;
font-family: "Rambla", sans-serif;
font-size: 18pt;
}
#about-this .information ul li p {
margin: 0;
padding: 0;
font-family: "Rambla", sans-serif;
font-size: 13pt;
margin-left: 2vw;
margin-top: 1vh;
}
html, body {
margin: 0;
padding: 0;

2
public/css_styles/styles.css.map
View File

@@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../sass_styles/_header.scss","../sass_styles/styles.scss","../sass_styles/_banner-login.scss","../sass_styles/_mainPomodoro.scss","../sass_styles/_styleSelector.scss","../sass_styles/_goDownArrow.scss"],"names":[],"mappings":"AACA;EACI,kBC4BS;ED1BT;EACA;EACA;EACA;EAEA;;AAEA;EACI;EAEA;ECXJ;EACA;EAQA;EACA;EACA;;ADKA;EACI;EAEA;ECnBJ;EACA;EAQA;EACA;EACA;;ADYI;EACI;;AAGA;AAAA;AAAA;AAAA;AAAA;EAKI;EACA;EACA;;AAKA;EACI;EACA;;;AE5CpB;EACI;EACA;EDMA;ECFA;EACA;EACA;EAEA;EAEA;;AAGA;EDGA;EACA;;ACAA;EAEI;EAEA;EACA;;AAEA;EDHJ;EACA;EACA;ECIQ;EACA;EACA;EAEA;;AAIJ;EACI;EACA;;AAGJ;EACI;EACA;;;AC5CZ;EAEI;EACA;EACA;EACA;EAEA;;AAEA;EAEI;EACA;EFJJ;EEOI;EACA;EAEA,OFaO;;AEVX;EAEI;EACA;EACA;EFjBJ;;AEqBI;EACI;EFZR;EACA;EEeQ,OFHG;;AEMP;EACI;EFpBR;EACA;EEuBQ,OFXG;EEaH;EACA;;AAIR;EF1BA;EACA;EACA;EAtBA;EACA;EEiDI;EACA;EACA;EAEA,YF1BO;EE2BP;EAEA;EACA;;;AC7DR;EAEI;EACA;EACA;EAEA;EAEA;EACA;EAEA;EAEA;;AAGA;EHRA;EGUI,OHaO;EGZP;EACA;EAEA;EACA;;AAKJ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EH9BR;EGgCY;;AAGJ;EHnCR;EGqCY,OHdD;EGeC;;AAMZ;EACI;EACA;;AAGJ;EACI;EACA;;AAEA;EACI;;AAKR;EACI;EAEA;EACA;EAEA;EACA;EACA;EAEA;;AAGJ;EAEI,kBHlDM;;;AIhCd;EACI;EACA;EAEA;EACA;;AAEA;EACI;;AACA;EACI;;;AJ+BZ;EACI;EACA;;;AAGJ;EACI;EACA,kBApBe","file":"styles.css"}
{"version":3,"sourceRoot":"","sources":["../sass_styles/_header.scss","../sass_styles/styles.scss","../sass_styles/_banner-login.scss","../sass_styles/_mainPomodoro.scss","../sass_styles/_styleSelector.scss","../sass_styles/_goDownArrow.scss","../sass_styles/_aboutThis.scss"],"names":[],"mappings":"AACA;EACI,kBC4BS;ED1BT;EACA;EACA;EACA;EAEA;;AAEA;EACI;EAEA;ECXJ;EACA;EAQA;EACA;EACA;;ADKA;EACI;EAEA;ECnBJ;EACA;EAQA;EACA;EACA;;ADYI;EACI;;AAGA;AAAA;AAAA;AAAA;AAAA;EAKI;EACA;EACA;;AAKA;EACI;EACA;;;AE5CpB;EACI;EACA;EDMA;ECFA;EACA;EACA;EAEA;EAEA;;AAGA;EDGA;EACA;;ACAA;EAEI;EAEA;EACA;;AAEA;EDHJ;EACA;EACA;ECIQ;EACA;EACA;EAEA;;AAIJ;EACI;EACA;;AAGJ;EACI;EACA;;;AC5CZ;EAEI;EACA;EACA;EACA;EAEA;;AAEA;EAEI;EACA;EFJJ;EEOI;EACA;EAEA,OFaO;;AEVX;EAEI;EACA;EACA;EFjBJ;;AEqBI;EACI;EFZR;EACA;EEeQ,OFHG;;AEMP;EACI;EFpBR;EACA;EEuBQ,OFXG;EEaH;EACA;;AAIR;EF1BA;EACA;EACA;EAtBA;EACA;EEiDI;EACA;EACA;EAEA,YF1BO;EE2BP;EAEA;EACA;;;AC7DR;EAEI;EAEA;EACA;EAEA;EAEA;EACA;EAEA;EAEA;EAgFA;;AA9EA;EHRA;EGUI,OHaO;EGZP;EACA;EAEA;EAIA;EACA;;AAMA;EACI;EACA;EAEA;;AAEA;EACI;EACA;EACA;;AAEA;EHpCZ;EGsCgB;;AAGJ;EHzCZ;EG2CgB,OHpBL;EGqBK;;AAMZ;EACI;EACA;;AAGJ;EACI;EACA;;AAEA;EACI;;AAKR;EACI;EAEA;EACA;EAEA;EACA;EACA;EAEA;;AAGJ;EAEI,kBHxDE;;;AGiEN;EACI;;;AAGJ;EACI;;;ACtGZ;EACI;EACA;EAEA;EACA;EAEA;;AAEA;EACI;;AACA;EACI;;;ACZZ;EACI;EAEA;EACA;;AAEA;EAEI;;AAEA;EACI;ELRR;EACA;EAQA;EACA;EACA;EKEQ;;AAEA;EACI;EACA;EACA;;AAKZ;EAEI;;AAEA;EACI;;AAGI;ELtBZ;EACA;EACA;EANA;EK6BgB;;AAGJ;ELtBZ;EACA;EAXA;EKmCgB;EACA;EACA;;;ALHpB;EACI;EACA;;;AAGJ;EACI;EACA,kBArBe","file":"styles.css"}