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

updated

Browse Source
This commit is contained in:
Vishnu
2025-06-23 09:37:53 +05:30
parent 2fbdf8ab61
commit 54b02541c1
278 changed files with 10134 additions and 7904 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -9,15 +9,16 @@
transform: translate(-50%, 0);
width: 70vw;
transition: all 0.3s;
&.hide {
width: fit-content;
.simulation-player-container
.controls-container
.simulation-button-container {
.simulation-player-container .controls-container .simulation-button-container {
width: 32px;
height: 24px;
}
}
.simulation-player-container {
background: var(--background-color);
padding: 7px;
@@ -327,6 +328,7 @@
}
.open {
.start-displayer,
.end-displayer {
display: none;
@@ -423,13 +425,16 @@
cursor: pointer;
transition: all 0.2s;
outline: 1px solid transparent;
&:hover {
outline: 1px solid var(--border-color);
color: var(--accent-color);
}
&.hide {
width: 32px;
}
.icon {
width: 16px;
height: 16px;
@@ -496,6 +501,7 @@
.asset-details-card-wrapper {
pointer-events: none;
.asset-details-card-container {
position: relative;
padding: 8px;
@@ -527,6 +533,7 @@
.asset-details-header {
@include flex-space-between;
gap: 12px;
.content {
.name {
text-wrap: nowrap;
@@ -536,20 +543,34 @@
margin-bottom: 4px;
text-transform: capitalize;
}
.status-container {
.status {
display: flex;
align-items: center;
gap: 6px;
padding-top: 4px;
.icon {
@include flex-center;
}
}
}
.active-time {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.value {
color: var(--highlight-text-color);
}
}
.storage-container {
font-size: var(--font-size-tiny);
color: var(--highlight-text-color);
}
}
}
@@ -561,6 +582,7 @@
border-radius: #{$border-radius-small};
overflow: hidden;
position: relative;
.process-running {
height: 100%;
width: 35%;
@@ -584,6 +606,7 @@
top: -2px;
padding: 4px;
padding-right: 8px;
.count-ui-container {
background: var(--background-color-solid);
padding: 8px;
@@ -593,19 +616,24 @@
max-width: 80px;
position: absolute;
left: 0;
.content {
@include flex-center;
gap: 2px;
.icon {
@include flex-center;
}
.display {
font-size: var(--font-size-small);
}
}
.value-container {
@include flex-center;
gap: 4px;
.progress-bar {
display: flex;
align-items: center;
@@ -621,13 +649,12 @@
background: var(--background-color);
overflow: hidden;
position: relative;
.fill {
height: 100%;
background: linear-gradient(
to top,
var(--background-color-accent) var(--process-fill-percentage),
transparent var(--process-fill-percentage)
);
background: linear-gradient(to top,
var(--background-color-accent) var(--process-fill-percentage),
transparent var(--process-fill-percentage));
}
}
@@ -645,6 +672,7 @@
from {
transform: translateX(-100%);
}
to {
transform: translateX(300%);
}
@@ -654,10 +682,12 @@
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
}

10
app/src/styles/layout/compareLayout.scss
View File

@@ -207,6 +207,10 @@
display: flex;
gap: 12px;
h4 {
font-weight: 600;
}
.comparisionCard {
position: relative;
flex: 1;
@@ -418,9 +422,7 @@
position: relative;
.energy-usage-wrapper {
h4 {
font-weight: 600;
}
.value {
padding-top: 25px;
@@ -551,7 +553,7 @@
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
// gap: 20px;
padding: 8px 10px;
margin: 44px 0;

3938
app/src/styles/layout/sidebar.scss
View File

File diff suppressed because it is too large Load Diff

2
app/src/styles/pages/dashboard.scss
View File

@@ -129,7 +129,7 @@
}
}
.container {
.dashboard-container {
margin: 22px 0;
width: 100%;
height: calc(100% - 357px);

190
app/src/styles/pages/realTimeViz.scss
View File

@@ -178,7 +178,6 @@
color: var(--accent-color);
}
}
}
}
@@ -199,8 +198,10 @@
height: 100%;
width: 100%;
padding: 10px;
display: flex;
flex-direction: column;
// display: flex;
// flex-direction: column;
display: block;
position: relative;
gap: 6px;
background: var(--background-color);
backdrop-filter: blur(10px);
@@ -217,9 +218,18 @@
box-shadow: var(--box-shadow-medium);
background: var(--background-color);
position: relative;
position: absolute;
padding: 0 10px;
animation: scaleFadeIn 0.4s forwards;
// position: absolute;
top: 0;
left: 0;
user-select: none;
z-index: 1;
// animation: scaleFadeIn 0.4s forwards;
.chart-container.dragging {
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
transition: box-shadow 0.2s ease;
}
.kebab {
width: 30px;
@@ -370,9 +380,6 @@
}
}
// Side Buttons
.side-button-container {
position: absolute;
@@ -430,7 +437,7 @@
path {
stroke: var(--text-button-color);
strokeWidth: 2;
stroke-width: 2;
}
}
@@ -442,7 +449,7 @@
path {
stroke: #f65648;
strokeWidth: 1.3;
stroke-width: 1.3;
}
}
}
@@ -980,4 +987,165 @@
display: flex;
justify-content: center;
align-items: center;
}
}
// Drad
.container {
position: absolute;
// top: 50%;
// left: 50%;
top: 0;
left: 0;
display: flex;
flex-direction: column;
gap: 12px;
min-width: 160px;
height: 100%;
opacity: 0;
visibility: hidden;
// transform: translate(-50%, -50%);
pointer-events: all;
}
// .list-item {
// position: absolute;
// top: 0;
// left: 0;
// height: 90px;
// width: 100%;
// }
.panel {
background: var(--background-color);
backdrop-filter: blur(10px);
pointer-events: all;
padding: 6px;
&.left-panel,
&.right-panel {
min-width: 150px;
.panel-content {
flex-direction: column;
width: 100%;
gap: 6px;
.chart-container {
position: relative;
width: 100%;
min-height: 150px;
max-height: 100%;
border-radius: #{$border-radius-medium};
box-shadow: var(--box-shadow-medium);
padding: 6px 0;
background: var(--background-color);
}
}
}
&.top-panel,
&.bottom-panel {
left: 0;
right: 0;
min-height: 150px;
.container {
display: flex;
flex-direction: row;
.chart-container {
height: 100%;
}
}
.panel-content {
display: flex;
flex-direction: row;
height: 100%;
width: 100%;
min-height: 150px;
}
}
}
.chart-container {
width: 100%;
min-height: 150px;
max-height: 100%;
border-radius: #{$border-radius-medium};
box-shadow: var(--box-shadow-medium);
background: var(--background-color);
position: relative;
// margin: 6px 0;
.item-content {
height: 100%;
padding: 6px;
border-radius: 6px;
padding: 6px 0;
.kebab {
width: 30px;
height: 30px;
position: absolute;
top: 0px;
right: 0px;
z-index: 10;
cursor: pointer;
@include flex-center;
}
.kebab-options {
position: absolute;
top: 18px;
right: 5px;
transform: translate(0px, 0);
background: var(--background-color);
z-index: 10;
display: flex;
flex-direction: column;
gap: 6px;
border-radius: #{$border-radius-small};
box-shadow: var(--box-shadow-medium);
.btn {
display: flex;
gap: 6px;
align-items: center;
padding: 5px 10px;
color: var(--text-color);
&:hover {
background: var(--highlight-accent-color);
width: 100%;
.label {
color: var(--accent-color);
}
svg {
&:first-child {
fill: var(--accent-color);
}
&:last-child {
fill: auto;
stroke: var(--accent-color);
}
}
}
}
.btn-blur {
color: var(--text-disabled);
cursor: not-allowed;
pointer-events: none;
}
}
canvas {
height: 80%;
}
.order {
display: none;
}
}
}

37
app/src/styles/scene/comments.scss
View File

@@ -56,16 +56,23 @@
.message {
margin-top: 10px;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
text-align: start;
}
.replies {
.replies,
.comments {
margin-top: 4px;
font-size: var(--font-size-small);
color: var(--input-text-color);
}
.header,
.message,
.replies {
.replies,
.comments {
display: none;
opacity: 0;
}
@@ -84,9 +91,15 @@
.users-commented {
padding: 12px;
}
.message {
display: -webkit-box !important;
opacity: 1 !important;
margin-bottom: 4px;
padding: 0;
}
.header,
.message,
.replies {
.replies,
.comments {
display: flex !important;
opacity: 1 !important;
}
@@ -158,11 +171,13 @@
.messages-wrapper {
padding: 12px;
padding-top: 0;
max-height: 50vh;
overflow-y: auto;
.edit-container {
.input-container {
textarea{
textarea {
background: var(--background-color);
&:focus{
&:focus {
outline-color: var(--border-color-accent);
}
}
@@ -195,7 +210,7 @@
align-items: flex-start;
gap: 12px;
margin-top: 8px;
&:first-child{
&:first-child {
margin: 0;
}
.profile {
@@ -231,7 +246,7 @@
height: 18px;
width: 18px;
border-radius: #{$border-radius-small};
&:hover{
&:hover {
background: var(--background-color-solid);
}
}
@@ -249,14 +264,14 @@
border-radius: #{$border-radius-medium};
padding: 2px 6px;
text-align: start;
&:hover{
&:hover {
background: var(--background-color-accent);
color: var(--text-button-color);
}
}
}
}
.message{
.message {
margin-top: 6px;
}
}
@@ -284,7 +299,9 @@
bottom: 2px;
@include flex-center;
padding: 2px;
cursor: pointer;
svg {
pointer-events: none;
rotate: 45deg;
}
}

7
app/src/styles/scene/scene.scss
View File

@@ -98,7 +98,7 @@
right: 1.5%;
z-index: 10;
border-radius: 8px;
transition: all 0.3s ease-in-out;
.input-toggle-container {
padding: 0;
display: flex;
@@ -117,4 +117,9 @@
}
}
}
}
.label-toogler.bottom{
bottom: 32%;
}