Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Intro screen uses flat file structure and single stylesheet

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-07-29 10:56:26 +03:00
parent 330defc0af
commit 4765f1c855
4 changed files with 41 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

0
src/routes/Intro/ConsentCheckbox/ConsentCheckbox.js → src/routes/Intro/ConsentCheckbox.js
View file

3
src/routes/Intro/ConsentCheckbox/index.js
View file

@ -1,3 +0,0 @@
const ConsentCheckbox = require('./ConsentCheckbox');
module.exports = ConsentCheckbox;

44
src/routes/Intro/ConsentCheckbox/styles.less
View file

@ -1,44 +0,0 @@
.consent-checkbox-container {
--icon-size: 1.2em;
--icon-color: var(--color-surface);
--icon-background-color: transparent;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
cursor: pointer;
.label {
flex: 1;
margin-left: 0.5em;
line-height: 1.2em;
color: var(--color-surface);
.link {
color: var(--color-surfacelight);
&:hover {
text-decoration: underline;
}
}
}
&:global(.checked) {
--icon-color: var(--color-surfacelight);
--icon-background-color: var(--color-primary);
}
&:focus-within, &:hover {
--icon-color: var(--color-surfacelighter);
background-color: var(--color-surfacedarker60);
.label {
color: var(--color-surfacelighter);
.link {
color: var(--color-surfacelighter);
}
}
}
}

41
src/routes/Intro/styles.less
View file

@ -125,8 +125,49 @@
}
.consent-checkbox {
--icon-size: 1.2em;
--icon-color: var(--color-surface);
--icon-background-color: transparent;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
margin: 1em 0;
padding: 0.5em 0.3em;
cursor: pointer;
.label {
flex: 1;
margin-left: 0.5em;
line-height: 1.2em;
color: var(--color-surface);
.link {
color: var(--color-surfacelight);
&:hover {
text-decoration: underline;
}
}
}
&:global(.checked) {
--icon-color: var(--color-surfacelight);
--icon-background-color: var(--color-primary);
}
&:focus-within, &:hover {
--icon-color: var(--color-surfacelighter);
background-color: var(--color-surfacedarker60);
.label {
color: var(--color-surfacelighter);
.link {
color: var(--color-surfacelighter);
}
}
}
}
.error-message {