refactor: Update icon imports and improve UI components; enhance styles for better layout and responsiveness; modify event properties and simulation player functionality

This commit is contained in:
2025-05-02 16:43:43 +05:30
parent 4535be68b3
commit db162c9ffa
10 changed files with 252 additions and 252 deletions

View File

@@ -32,10 +32,17 @@
}
.controls-container {
@include flex-center;
@include flex-space-between;
gap: 12px;
justify-content: space-between;
.header{
@include flex-center;
gap: 6px;
padding: 0 8px;
svg{
scale: 1.3;
}
}
.production-details,
.controls-wrapper {
@include flex-center;
@@ -72,7 +79,7 @@
.expand-icon-container {
@include flex-center;
padding: 6px 8px;
padding: 0 8px;
cursor: pointer;
}

View File

@@ -124,6 +124,8 @@
padding: 4px;
border-radius: #{$border-radius-medium};
background: var(--background-color);
outline: 1px solid var(--border-color);
outline-offset: -1px;
gap: 5px;
position: relative;

View File

@@ -58,12 +58,8 @@
fill: var(--icon-default-color-active);
}
&:hover {
rect {
stroke: var(--icon-default-color);
}
circle {
fill: var(--icon-default-color);
}
filter: saturate(0.8);
background: var(--background-color-accent);
}
}
}
@@ -714,10 +710,10 @@
.add-button {
@include flex-center;
padding: 2px 4px;
padding: 4px 8px;
background: var(--background-color-button);
color: var(--text-button-color);
border-radius: #{$border-radius-small};
border-radius: #{$border-radius-large};
cursor: pointer;
outline: none;
border: none;
@@ -832,10 +828,10 @@
transform: translateX(4px);
&:hover {
background: var(--accent-color);
background: var(--background-color-accent);
path {
stroke: var(--primary-color);
stroke: var(--text-button-color);
}
}
}
@@ -1003,10 +999,10 @@
border-radius: 8px 0 0 8px;
&:hover {
background: var(--accent-color);
background: var(--background-color-accent);
path {
stroke: var(--primary-color);
stroke: var(--text-button-color);
}
}
}
@@ -1067,7 +1063,13 @@
.dropdown-content-container {
padding: 6px 12px;
}
.value-field-container {
padding: 6px;
.dropdown {
min-width: 44px;
text-align: center;
}
}
.input-range-container {
.input-container {
width: 75%;