style: added image-header CSS component; style: removed stackedTabs and middle section SCSS files

src/styles/css/components.css

@@ -46,4 +46,11 @@
 		@apply text-primary border-primary bg-background-secondary;
 		@apply bg-opacity-25;
 	}
+
+	/* Image header */
+	.image-header header {
+		@apply bg-cover pt-56 px-6 pb-2 rounded-t-lg;
+
+		background-position: 0% 35%;
+	}
 }

src/styles/scss/_middle-section.scss

@@ -1,24 +0,0 @@
-#container {
-	--container-width: 95%;
-
-	@media only screen and (min-width: $small) {
-		--container-width: 85%;
-	}
-
-	@media only screen and (min-width: $medium) {
-		--container-width: 70%;
-	}
-}
-
-/* Modal Content */
-.smallmodal-content {
-	--modal-content-width: 95%;
-
-	@media only screen and (min-width: $small) {
-		--modal-content-width: 85%;
-	}
-
-	@media only screen and (min-width: $medium) {
-		--modal-content-width: 70%;
-	}
-}

src/styles/scss/_stackedTabs.scss

@@ -1,7 +0,0 @@
-// Make a component? But it would be only one HTML tag with a bunch of classes and a prop (the img src)...
-.image_header {
-	header {
-		@apply bg-cover pt-56 px-6 pb-2 rounded-t-lg;
-		background-position: 0% 35%;
-	}
-}

src/styles/scss/style.scss

@@ -28,6 +28,3 @@ body {
 @import './tabs/search-tab';
 @import './tabs/settings-tab';
 @import './tabs/tabs';
-
-@import './middle-section';
-@import './stackedTabs';