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

refactor: redesign of the feature

Browse source
This commit is contained in:
Timothy Z. 2024-12-03 23:06:19 +02:00
parent d3dec89ff4
commit 9a5934cbb9
2 changed files with 16 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/routes/Settings/URLsManager/AddItem/AddItem.less
View file

@ -4,25 +4,24 @@
.add-item {
display: flex;
padding: 0.5rem 1.5rem;
padding: 0.4rem 1.5rem;
gap: 1rem;
border-radius: var(--border-radius);
border-radius: 1.5rem;
transition: 0.3s all ease-in-out;
background-color: transparent;
background-color: var(--overlay-color);
border: 2px solid transparent;
justify-content: space-between;
position: relative;
.input {
background-color: var(--overlay-color);
border-radius: var(--border-radius);
border-radius: 1.5rem;
color: var(--primary-foreground-color);
padding: 0.5rem 0.75rem;
border: 1px solid transparent;
border: 2px solid var(--overlay-color);
width: 70%;
&:focus {
border: 1px solid var(--primary-foreground-color);
border: 2px solid var(--primary-foreground-color);
}
}
@ -39,7 +38,7 @@
justify-content: center;
background-color: transparent;
transition: 0.3s all ease-in-out;
border-radius: var(--border-radius);
border-radius: 1.5rem;
width: 3rem;
opacity: 0.6;
@ -77,13 +76,12 @@
}
&:hover {
border: 2px solid transparent;
background-color: var(--overlay-color);
border: 2px solid var(--overlay-color);
}
}
@media only screen and (max-width: @minimum) {
.add-item {
padding: 0.5rem;
padding: 0.4rem;
}
}

14
src/routes/Settings/URLsManager/Item/Item.less
View file

@ -4,10 +4,10 @@
.item {
display: flex;
padding: 1rem 1.5rem;
border-radius: var(--border-radius);
padding: 0.7rem 1.5rem;
border-radius: 2rem;
transition: 0.3s all ease-in-out;
background-color: transparent;
background-color: var(--overlay-color);
border: 2px solid transparent;
justify-content: space-between;
position: relative;
@ -76,7 +76,7 @@
justify-content: center;
background-color: transparent;
transition: 0.3s all ease-in-out;
border-radius: var(--border-radius);
border-radius: 1.5rem;
transform: translateY(-50%);
width: 3rem;
@ -85,7 +85,7 @@
height: 1.5rem;
opacity: 0;
transition: 0.3s all ease-in-out;
color: var(--primary-foreground-color);
color: var(--color-trakt);
}
&:hover, &:focus {
@ -100,7 +100,7 @@
}
&:hover {
background-color: var(--overlay-color);
border: 2px solid var(--overlay-color);
.actions {
.delete {
@ -114,7 +114,7 @@
@media only screen and (max-width: @minimum) {
.item {
padding: 1rem 0.5rem;
padding: 0.7rem 0.5rem;
.actions {
margin-right: 4rem;