css theme sombre (

inspiré par @clement.papin.etu)

css/main.css

@@ -22,7 +22,7 @@ body {
 	margin: 0;
 	/* height: 100%; */
 	padding: 0;
-	background: #eee;
+	background: #222;
 }
 body {
 	min-height: 100vh;
@@ -40,7 +40,7 @@ body > footer {
 	padding: 0 40px;
 }
 .pageContainer {
-	color: #121618;
+	color: #fff;
 	background-image: url('../images/bg.png');
 	background-size: 110%;
 	background-position: center -20px;

css/news.css

@@ -18,7 +18,7 @@
 	bottom: 0;
 	height: 0;
 	width: 100%;
-	background-image: linear-gradient(#eee, #eee), linear-gradient(45deg, transparent 75%, #eee 75%), linear-gradient(-45deg, transparent 75%, #eee 75%);
+	background-image: linear-gradient(#222, #222), linear-gradient(45deg, transparent 75%, #222 75%), linear-gradient(-45deg, transparent 75%, #222 75%);
 	background-position: 0 0, 0 0, 0 0, 0 100%, 0 100%;
 	background-size: auto auto, 15px 15px, 15px 15px, 15px 15px, 15px 15px;
 	background-clip: padding-box, border-box, border-box, border-box, border-box;

css/pizzaForm.css

 .pizzaForm {
 	background: white;
+	color: #121618;
     padding: 50px;
     border: 1px #13181919 solid;
     outline: 20px hsl(240deg 0% 100%) solid;
@@ -41,6 +42,25 @@
 	font-weight: lighter;
 	text-transform: uppercase;
 }
+.pizzaForm label:not(:first-of-type) {
+	margin-top: 30px;
+}
+.pizzaForm label small{
+	margin-top: 5px;
+	text-transform: none;
+	font-family: 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	font-weight: normal;
+	font-style: italic;
+	font-size: 12px;
+	opacity: .6;
+	letter-spacing: 1;
+}
+.pizzaForm label code{
+	font-family: 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	background-color: #13181919;
+	padding: 2px 4px;
+	border-radius: 3px;
+}
 .pizzaForm input {
 	border: 1px #eee solid;
 	border-radius: 3px;
@@ -62,3 +82,7 @@
 		/* width: 60%; */
 	}
 }
+input::placeholder {
+	font-weight: lighter !important;
+	color: #ddd;
+}
\ No newline at end of file

css/pizzaList.css

@@ -31,7 +31,7 @@
 	transform: scaleX(-1) translateY(-50%);
 }
 .pizzaThumbnail {
-	background-color: #fff;
+	background-color: #131618;
 }
 .pizzaThumbnail a {
 	/* background-color: #12161899; */
@@ -73,7 +73,7 @@
 	align-items: center;
 	padding: 20px 20px;
 	font-size: 16px;
-	background-color: #f9f9f9;
+	background-color: #131618;
 }
 .pizzaThumbnail a section:before {
 	content: '';
@@ -85,7 +85,7 @@
 	height: 0;
 	border-top: 20px solid transparent;
 	border-bottom: 20px solid transparent;
-	border-right:20px solid #f9f9f9;
+	border-right:20px solid #131618;
 }
 .pizzaThumbnail a section h4 {
 	text-align: center;
@@ -94,7 +94,7 @@
 	font-size: 30px;
 	letter-spacing: 2px;
 	text-transform: uppercase;
-	color: #000;
+	color: #fff;
 	/* color: #e2952d; */
 	margin: 0 0 15px;
 	white-space: nowrap;
@@ -102,6 +102,7 @@
 .pizzaThumbnail a section h4:before,
 .pizzaThumbnail a section h4:after {
 	content: '〜';
+	color: #bbb;
 	font-weight: lighter;
 	display: inline-flex;
 	font-size: 0.5em;
@@ -115,18 +116,18 @@
 	list-style-type: none;
 	padding: 0;
 	margin: 0;
-	color: #555;
+	color: #bbb;
 }
 .pizzaThumbnail a:hover img {
 	/* filter: contrast(1) grayscale(0) brightness(1); */
 	width: 48%;
 }
 .pizzaThumbnail a:hover section {
-	background-color: #fff;
+	background-color: #0d0e10;
 	/* width: 52%; */
 }
 .pizzaThumbnail a:hover section:before {
-	border-right-color: #fff;
+	border-right-color: #0d0e10;
 }
 @media (max-width: 1200px) {
 	.pizzaThumbnail a img {