Refactor styles to use 'background' shorthand property instead of 'background-color' for consistency across components. Updated various components including confirmation pop-up, input fields, lists, marketplace, menu, module toggle, simulation, and more. Enhanced visual effects with backdrop filters and adjusted padding/margins for improved layout. Removed unnecessary styles and optimized hover effects for better user experience.
This commit is contained in:
@@ -13,14 +13,15 @@
|
||||
border-radius: #{$border-radius-large};
|
||||
width: fit-content;
|
||||
transition: width 0.2s;
|
||||
background-color: var(--background-color);
|
||||
background: var(--background-color);
|
||||
backdrop-filter: blur(8px);
|
||||
z-index: #{$z-index-default};
|
||||
|
||||
.split {
|
||||
height: 20px;
|
||||
width: 2px;
|
||||
border-radius: 2px;
|
||||
background: var(--highlight-accent-color);
|
||||
background: var(--text-disabled);
|
||||
}
|
||||
|
||||
.draw-tools,
|
||||
@@ -48,10 +49,10 @@
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: var(--accent-color);
|
||||
background: var(--accent-color);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--accent-color);
|
||||
background: var(--accent-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -91,7 +92,7 @@
|
||||
padding: 4px;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--highlight-accent-color);
|
||||
background: var(--highlight-accent-color);
|
||||
color: var(--accent-color);
|
||||
|
||||
path {
|
||||
@@ -117,7 +118,7 @@
|
||||
@include flex-center;
|
||||
padding: 3px;
|
||||
border-radius: #{$border-radius-small};
|
||||
background-color: var(--highlight-accent-color);
|
||||
background: var(--highlight-accent-color);
|
||||
gap: 2px;
|
||||
position: relative;
|
||||
|
||||
@@ -131,7 +132,7 @@
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
background-color: var(--accent-color);
|
||||
background: var(--accent-color);
|
||||
left: 3px;
|
||||
top: 3px;
|
||||
height: 18px;
|
||||
@@ -161,7 +162,7 @@
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--highlight-accent-color);
|
||||
background: var(--highlight-accent-color);
|
||||
cursor: pointer;
|
||||
@include flex-center;
|
||||
position: fixed;
|
||||
@@ -174,7 +175,7 @@
|
||||
font-weight: 700;
|
||||
&:hover {
|
||||
font-weight: 500;
|
||||
background-color: var(--accent-color);
|
||||
background: var(--accent-color);
|
||||
color: var(--highlight-accent-color);
|
||||
&::after{
|
||||
animation: pulse 1s ease-out infinite;
|
||||
|
||||
Reference in New Issue
Block a user