Dwinzo-Beta/Dwinzo_dev
4
0
Fork 3
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Add dragging and rotating state management to simulation store

Browse Source 
- Introduced `useIsDragging` and `useIsRotating` stores to manage dragging and rotating states.
- Each store maintains its own state and provides setter functions.

refactor: Enhance storage unit and vehicle stores

- Added `clearStorageUnits` and `clearvehicles` methods to clear respective stores.
- Prevent duplicate entries in `addStorageUnit` and `addVehicle` methods by checking for existing model UUIDs.

style: Update SCSS variables and improve styling consistency

- Refactored background gradient variables for better readability.
- Introduced log indication colors for better visual feedback.
- Cleaned up and organized styles in various components for improved maintainability.

chore: Remove unused ROISummary styles

- Deleted `ROISummary.scss` as it was no longer needed.

feat: Implement new analysis component styles

- Created `analysis.scss` for the new analysis component layout and styles.
- Added styles for various sections including metrics, throughput values, and progress bars.

fix: Update main styles import

- Adjusted imports in `main.scss` to reflect the new structure and removed obsolete imports.
This commit is contained in:
Nalvazhuthi
2025-05-03 11:20:31 +05:30
parent 55d691074b b4e3d3ef73
commit 2c37472928
45 changed files with 1680 additions and 802 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
app/src/styles/components/form.scss
View File

@@ -0,0 +1,26 @@
@use "../abstracts/variables" as *;
@use "../abstracts/mixins" as *;
.rename-tool-tip {
position: absolute;
background: var(--background-color);
padding: 10px 16px;
width: 260px;
border-radius: #{$border-radius-large};
outline: 1px solid var(--border-color);
z-index: 100;
.header {
@include flex-center;
gap: 8px;
.icon {
@include flex-center;
}
.name {
color: var(--text-color);
}
input {
width: 100%;
margin-top: 6px;
}
}
}

12
app/src/styles/components/lists.scss
View File

@@ -2,8 +2,6 @@
@use "../abstracts/mixins" as *;
.dropdown-list-container {
border-bottom: 1px solid var(--border-color);
.lists-container {
margin-bottom: 6px;
}
@@ -44,7 +42,7 @@
text-align: center;
padding: 4px 8px;
border-radius: #{$border-radius-large};
.zone-header{
.zone-header {
@include flex-center;
.value {
width: 100%;
@@ -62,16 +60,10 @@
cursor: pointer;
}
}
&:first-child{
background: var(--highlight-accent-color);
.input-value{
color: var(--highlight-text-color);
}
}
}
.active {
background: var(--highlight-accent-color);
.input-value{
.input-value {
color: var(--highlight-text-color);
}
}

89
app/src/styles/components/simulation/simulation.scss
View File

@@ -3,7 +3,7 @@
.simulation-player-wrapper {
position: fixed;
bottom: 12px;
bottom: 32px;
left: 50%;
z-index: 2;
transform: translate(-50%, 0);
@@ -35,11 +35,11 @@
@include flex-space-between;
gap: 12px;
justify-content: space-between;
.header{
.header {
@include flex-center;
gap: 6px;
padding: 0 8px;
svg{
svg {
scale: 1.3;
}
}
@@ -299,6 +299,37 @@
}
}
}
.open {
.start-displayer,
.end-displayer {
display: none;
}
.timmer {
display: none;
}
.progresser-wrapper {
padding-top: 4px;
}
.time-displayer {
height: 0;
opacity: 0;
pointer-events: none;
display: none;
}
.processDisplayer {
padding: 0 8px;
background: transparent;
.process-player {
width: 0;
display: none !important;
}
}
}
}
.processDisplayer {
@@ -314,22 +345,6 @@
font-size: var(--font-size-tiny);
}
.timmer {
width: auto;
position: absolute;
bottom: 0;
font-size: var(--font-size-tiny);
}
.start-displayer {
left: 8px;
}
.end-displayer {
width: auto;
right: 8px;
}
.start-displayer {
bottom: 4px;
left: 16px;
@@ -351,12 +366,12 @@
border-width: 1px;
background: var(--background-color-accent, #6f42c1);
}
.process-wrapper{
.process-wrapper {
.process-container {
position: relative;
display: flex;
width: 100%;
.process {
height: 5px;
border-radius: 4px;
@@ -368,35 +383,3 @@
}
}
}
.simulation-player-container.open {
.start-displayer,
.end-displayer {
display: none;
}
.timmer {
display: none;
}
.progresser-wrapper {
padding-top: 4px;
}
.time-displayer {
height: 0;
opacity: 0;
pointer-events: none;
display: none;
}
.processDisplayer {
padding: 0 8px;
background: transparent;
.process-player {
width: 0;
display: none !important;
}
}
}

33
app/src/styles/components/tools.scss
View File

@@ -14,7 +14,7 @@
width: fit-content;
transition: width 0.2s;
background: var(--background-color);
backdrop-filter: blur(8px);
backdrop-filter: blur(20px);
z-index: 2;
outline: 1px solid var(--border-color);
outline-offset: -1px;
@@ -31,6 +31,7 @@
.activeDropicon {
@include flex-center;
gap: 2px;
// stylelint-disable-next-line
interpolate-size: allow-keywords;
width: 0;
opacity: 0;
@@ -44,9 +45,11 @@
border-radius: #{$border-radius-medium};
&:hover {
background: color-mix(in srgb,
var(--highlight-accent-color) 60%,
transparent);
background: color-mix(
in srgb,
var(--highlight-accent-color) 60%,
transparent
);
}
}
@@ -70,9 +73,11 @@
position: relative;
&:hover {
background: color-mix(in srgb,
var(--highlight-accent-color) 60%,
transparent);
background: color-mix(
in srgb,
var(--highlight-accent-color) 60%,
transparent
);
}
.drop-down-container {
@@ -179,11 +184,11 @@
font-weight: 500;
background: var(--accent-color);
color: var(--highlight-accent-color);
&::after{
&::after {
animation: pulse 1s ease-out infinite;
}
}
&::after{
&::after {
content: "";
position: absolute;
height: 100%;
@@ -195,14 +200,14 @@
}
@keyframes pulse {
0%{
0% {
opacity: 0;
scale: .5;
scale: 0.5;
}
50%{
50% {
opacity: 1;
}
100%{
100% {
opacity: 0;
scale: 2;
}
@@ -218,4 +223,4 @@
width: fit-content;
opacity: 1;
}
}
}