doom-design-system 0.6.0 → 0.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/components/FileUpload/FileUpload.module.css +18 -14
  2. package/dist/styles/globals.css +2 -0
  3. package/package.json +1 -1
package/dist/components/FileUpload/FileUpload.module.css CHANGED
@@ -60,21 +60,23 @@
60
60
  .window.void .body::before, .window.void .body::after {
61
61
  content: "";
62
62
  position: absolute;
63
- inset: -50%;
64
- width: 200%;
65
- height: 200%;
66
- background-image: radial-gradient(1px 1px at 20% 30%, #fff 100%, transparent), radial-gradient(1px 1px at 40% 70%, #fff 100%, transparent), radial-gradient(1px 1px at 60% 40%, #fff 100%, transparent), radial-gradient(1px 1px at 80% 80%, #fff 100%, transparent), radial-gradient(1px 1px at 10% 10%, #fff 100%, transparent), radial-gradient(1px 1px at 30% 50%, #fff 100%, transparent), radial-gradient(1px 1px at 50% 20%, #fff 100%, transparent), radial-gradient(1px 1px at 70% 90%, #fff 100%, transparent), radial-gradient(1px 1px at 90% 30%, #fff 100%, transparent), radial-gradient(1.5px 1.5px at 15% 75%, #fff 100%, transparent), radial-gradient(1px 1px at 85% 15%, #fff 100%, transparent), radial-gradient(1px 1px at 55% 65%, #fff 100%, transparent);
67
- background-size: 50% 50%;
68
- opacity: 0.5;
63
+ top: 50%;
64
+ left: 50%;
65
+ width: 2px;
66
+ height: 2px;
67
+ background: transparent;
68
+ border-radius: 50%;
69
+ box-shadow: -80px -120px #fff, 40px -60px #fff, -150px 80px #fff, 120px 40px #fff, -30px -180px #fff, 90px 130px #fff, -170px -20px #fff, 60px -140px #fff, 180px -80px #fff, -100px 160px #fff, 140px 100px #fff, -50px -40px #fff, 30px 170px #fff, -140px -150px #fff, 170px 60px #fff, -60px 100px #fff, 100px -170px #fff, -180px 140px #fff, 50px 50px #fff, -120px -90px #fff, 160px -30px #fff, -20px 130px #fff, 80px -100px #fff, -160px 40px #fff;
70
+ opacity: 0.6;
69
71
  z-index: 0;
70
72
  animation: consume-stars 6s cubic-bezier(0.4, 0, 0.6, 1) infinite;
71
73
  pointer-events: none;
72
74
  }
73
75
  .window.void .body::after {
76
+ box-shadow: -70px -90px #fff, 50px -130px #fff, -130px 60px #fff, 110px 70px #fff, -20px -160px #fff, 80px 150px #fff, -160px -50px #fff, 70px -110px #fff, 160px -60px #fff, -90px 140px #fff, 130px 120px #fff, -40px -30px #fff, 20px 160px #fff, -150px -130px #fff, 150px 40px #fff, -50px 80px #fff, 90px -150px #fff, -170px 120px #fff;
74
77
  animation-name: consume-stars-alt;
75
78
  animation-delay: -3s;
76
- background-position: 33% 33%;
77
- opacity: 0.3;
79
+ opacity: 0.35;
78
80
  }
79
81
  .window.void .body .starField {
80
82
  position: absolute;
@@ -86,19 +88,21 @@
86
88
  .window.void .body .starField::before, .window.void .body .starField::after {
87
89
  content: "";
88
90
  position: absolute;
89
- inset: -50%;
90
- width: 200%;
91
- height: 200%;
92
- background-image: radial-gradient(1px 1px at 25% 35%, #fff 100%, transparent), radial-gradient(1px 1px at 45% 75%, #fff 100%, transparent), radial-gradient(1px 1px at 65% 45%, #fff 100%, transparent), radial-gradient(1px 1px at 85% 85%, #fff 100%, transparent), radial-gradient(1px 1px at 15% 15%, #fff 100%, transparent), radial-gradient(1px 1px at 35% 55%, #fff 100%, transparent), radial-gradient(1px 1px at 55% 25%, #fff 100%, transparent), radial-gradient(1px 1px at 75% 95%, #fff 100%, transparent), radial-gradient(1px 1px at 95% 35%, #fff 100%, transparent), radial-gradient(1.5px 1.5px at 20% 80%, #fff 100%, transparent), radial-gradient(1px 1px at 90% 20%, #fff 100%, transparent), radial-gradient(1px 1px at 60% 70%, #fff 100%, transparent);
93
- background-size: 50% 50%;
91
+ top: 50%;
92
+ left: 50%;
93
+ width: 2px;
94
+ height: 2px;
95
+ background: transparent;
96
+ border-radius: 50%;
97
+ box-shadow: -95px -105px #fff, 55px -75px #fff, -140px 95px #fff, 105px 55px #fff, -45px -170px #fff, 75px 145px #fff, -155px -35px #fff, 45px -125px #fff, 165px -70px #fff, -85px 155px #fff, 125px 85px #fff, -35px -55px #fff, 15px 175px #fff, -125px -140px #fff, 155px 50px #fff, -75px 90px #fff, 85px -160px #fff, -165px 130px #fff, 35px 65px #fff, -110px -80px #fff, 145px -15px #fff, -15px 115px #fff, 65px -85px #fff, -145px 55px #fff;
94
98
  opacity: 0.5;
95
99
  animation: consume-stars 6s cubic-bezier(0.4, 0, 0.6, 1) infinite;
96
100
  animation-delay: -1.5s;
97
101
  }
98
102
  .window.void .body .starField::after {
103
+ box-shadow: -65px -80px #fff, 45px -140px #fff, -120px 70px #fff, 100px 80px #fff, -35px -150px #fff, 70px 160px #fff, -150px -40px #fff, 55px -100px #fff, 150px -50px #fff, -80px 130px #fff, 120px 110px #fff, -55px -45px #fff;
99
104
  animation-name: consume-stars-alt;
100
105
  animation-delay: -4.5s;
101
- background-position: 40% 40%;
102
106
  opacity: 0.3;
103
107
  }
104
108
  .window.void .headerContent,
package/dist/styles/globals.css CHANGED
@@ -67,6 +67,8 @@
67
67
  }
68
68
 
69
69
  :root {
70
+ --common-black: #000;
71
+ --common-white: #fff;
70
72
  --control-height: var(--size-8);
71
73
  --control-padding-x: var(--space-3);
72
74
  --control-padding-y: var(--space-1\.5);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "doom-design-system",
3
- "version": "0.6.0",
3
+ "version": "0.6.1",
4
4
  "description": "Neubrutalist and comic book inspired design system",
5
5
  "sideEffects": [
6
6
  "**/*.css",