Remove hidden paddings

palinkiewicz · Aug 4, 2024 · b26eeb3 · b26eeb3
1 parent 8abbcfc
commit b26eeb3
Showing 1 changed file with 20 additions and 0 deletions.
diff --git a/styles/wizard.css b/styles/wizard.css
@@ -273,6 +273,11 @@
  max-width: 15rem;
  width: 80%;
  padding: 2rem 1rem;
+ transition: 200ms var(--cubic-ease-out);
+}
+
+.hidden .color-selection {
+ padding: 0 1rem;
 }
 
 .color-selection > div {
@@ -288,6 +293,10 @@
  scale: 1.1;
 }
 
+.hidden .color-selection > div {
+ width: 0;
+}
+
 #custom-color {
  display: flex;
  justify-content: center;
@@ -313,19 +322,30 @@
  max-width: 15rem;
  width: 80%;
  padding: 0rem 1rem 1rem;
+ transition: 200ms var(--cubic-ease-out);
 }
 
 .switch-container:hover {
  cursor: pointer;
 }
 
+.hidden .switch-container {
+ font-size: 0;
+ padding: 0;
+}
+
 .switch {
  position: relative;
  width: 4rem;
  height: 2rem;
  border-radius: 1rem;
  border: 1px solid var(--background-text-color);
  margin-right: 1rem;
+ transition: 200ms var(--cubic-ease-out);
+}
+
+.hidden .switch {
+ height: 0;
 }
 
 .switch::after {