danvics/ProzillaOS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added round corners and shadows to windows

Browse source
This commit is contained in:
Prozilla 2023-07-29 18:32:27 +02:00
parent 0a2fd25fa2
commit d0ada23bf1
No known key found for this signature in database
GPG key ID: 5858DFE71CAF31EE
1 changed files with 8 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/components/windows/Window.module.css
View file

@ -4,12 +4,18 @@
} }
.Window-container { .Window-container {
--shadow-size: 0.3rem;
--shadow-opacity: 35%;
--shadow-spread: 3;
position: absolute; position: absolute;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-width: 300px; min-width: 300px;
min-height: 150px; min-height: 150px;
background-color: var(--background-color-c); background-color: var(--background-color-c);
border-radius: 0.5rem;
box-shadow: calc(var(--shadow-size) * -1) var(--shadow-size) calc(var(--shadow-size) * var(--shadow-spread)) 0px rgba(0, 0, 0, var(--shadow-opacity));
resize: both; resize: both;
overflow: hidden; overflow: hidden;
/* animation: pop-in 200ms ease-in-out; */ /* animation: pop-in 200ms ease-in-out; */
@ -33,6 +39,7 @@
align-items: center; align-items: center;
height: var(--header-height); height: var(--header-height);
padding: 0.25rem; padding: 0.25rem;
padding-left: 0.5rem;
padding-right: 0; padding-right: 0;
background-color: var(--background-color-b); background-color: var(--background-color-b);
cursor: grab; cursor: grab;
@ -47,7 +54,7 @@
.Window-icon { .Window-icon {
height: 1rem; height: 1rem;
margin-right: 0.25rem; margin-right: 0.4rem;
} }
.Window-icon > div { .Window-icon > div {