Selaa lähdekoodia

fix: css 'box-sizing' property was causing positioning issues for the close icon

Signed-off-by: Jonathan <theflametrooper@gmail.com>
Jonathan 4 vuotta sitten
vanhempi
sitoutus
9b7e7824eb
2 muutettua tiedostoa jossa 12 lisäystä ja 112 poistoa
  1. 0 105
      dist/toasters.js
  2. 12 7
      src/index.css

Tiedoston diff-näkymää rajattu, sillä se on liian suuri
+ 0 - 105
dist/toasters.js


+ 12 - 7
src/index.css

@@ -2,9 +2,10 @@
 	--max-width: 250px;
 }
 
-body {
+body, * {
 	padding: 0;
 	margin: 0;
+	box-sizing: border-box;
 }
 
 #toasts-container {
@@ -70,15 +71,18 @@ body {
 	font-family: sans-serif;
 }
 
+.toast * {
+	box-sizing: border-box;
+}
+
 .toast:not(:first-of-type) {
 	margin-top: 5px;
 }
 
-
 .close-icon {
-	min-width: 8px;
-	height: 8px;
-	padding: 8px;
+	min-width: 10px;
+	height: 10px;
+	padding: 10px;
 	position: relative;
 	margin-left: 5px;
 	opacity: 0.6;
@@ -92,9 +96,10 @@ body {
 
 .close-icon:before, .close-icon:after {
 	position: absolute;
-	left: 11px;
+	left: 9.25px;
+    top: 5px;
 	content: ' ';
-	height: 8px;
+	height: 10px;
 	width: 2px;
 	background-color: rgb(245, 245, 245);
 }

Kaikkia tiedostoja ei voida näyttää, sillä liian monta tiedostoa muuttui tässä diffissä