Refactor code structure for improved readability and maintainability

This commit is contained in:
2025-05-07 08:57:31 +05:30
parent f7d0151b00
commit cb483b4ded
9 changed files with 120 additions and 103 deletions

View File

@@ -516,7 +516,6 @@ input[type="number"] {
-webkit-appearance: none;
width: 100%;
height: 6px;
background: var(--background-color-secondary);
border-radius: #{$border-radius-medium};
outline: none;
margin: 12px 8px;

View File

@@ -1275,49 +1275,49 @@
}
&:nth-child(1),
&:nth-child(9) {
&:nth-child(8) {
&::after {
@include gradient-by-child(1); // First child uses the first color
}
}
&:nth-child(2),
&:nth-child(10) {
&:nth-child(9) {
&::after {
@include gradient-by-child(2); // Second child uses the second color
}
}
&:nth-child(3),
&:nth-child(11) {
&:nth-child(10) {
&::after {
@include gradient-by-child(3); // Third child uses the third color
}
}
&:nth-child(4),
&:nth-child(12) {
&:nth-child(11) {
&::after {
@include gradient-by-child(4); // Fourth child uses the fourth color
}
}
&:nth-child(5),
&:nth-child(13) {
&:nth-child(12) {
&::after {
@include gradient-by-child(5); // Fifth child uses the fifth color
}
}
&:nth-child(6),
&:nth-child(14) {
&:nth-child(13) {
&::after {
@include gradient-by-child(6); // Fifth child uses the fifth color
}
}
&:nth-child(7),
&:nth-child(15) {
&:nth-child(14) {
&::after {
@include gradient-by-child(7); // Fifth child uses the fifth color
}

View File

@@ -212,7 +212,7 @@
background: var(--background-color);
position: relative;
padding: 0 10px;
animation: scaleFadeIn 0.4s forwards;
.kebab {
width: 30px;
height: 30px;
@@ -237,7 +237,6 @@
gap: 6px;
border-radius: #{$border-radius-small};
box-shadow: var(--box-shadow-medium);
.btn {
@@ -390,7 +389,6 @@
width: 18px;
height: 18px;
border-radius: #{$border-radius-small};
}
.active {
@@ -414,7 +412,6 @@
color: var(--background-color);
border-radius: #{$border-radius-small};
.add-icon {
@include flex-center;
transition: rotate 0.2s;
@@ -434,7 +431,7 @@
path {
stroke: #f65648;
strokeWidth: 1.3;
strokewidth: 1.3;
}
}
}
@@ -530,7 +527,6 @@
height: 10px;
background: var(--primary-color);
border-radius: #{$border-radius-circle};
}
}
}
@@ -553,7 +549,6 @@
border: none;
outline: none;
border-radius: #{$border-radius-circle};
}
}
}
@@ -615,7 +610,6 @@
gap: 6px;
border-radius: #{$border-radius-small};
box-shadow: var(--box-shadow-medium);
.icon {
@@ -953,4 +947,14 @@
opacity: 0;
transform: scaleY(0);
}
}
}
@keyframes scaleFadeIn {
from {
scale: 0;
opacity: 0;
}
to {
scale: 1;
opacity: 1;
}
}