From 39adc171046c29fbe532f858839ffa90869eb042 Mon Sep 17 00:00:00 2001
From: Bastian Dehn <hhaalo@arcor.de>
Date: Sat, 13 Aug 2022 10:44:42 +0200
Subject: [PATCH] change: style for app

---
 src/app/app.component.css  | 26 ++++++++++++++++++-
 src/app/app.component.html | 52 ++++++++++++++++++++------------------
 2 files changed, 52 insertions(+), 26 deletions(-)

diff --git a/src/app/app.component.css b/src/app/app.component.css
index c43b53e..c02b93b 100644
--- a/src/app/app.component.css
+++ b/src/app/app.component.css
@@ -3,10 +3,34 @@
 	margin: 0 auto;
 }
 
+.flex {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+}
+
+input {
+	margin: 0.2em
+}
+
+.button {
+	margin: 0.2em;
+}
+
 h1 {
-	text-align: left;
+	text-align: center;
 }
 
 .version {
 	text-align: center;
 }
+
+@media only screen and (min-width: 46.875em) {
+	.flex {
+		flex-direction: row;
+	}
+
+	.button {
+		
+	}
+}
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 6d118d7..36177f5 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,30 +1,32 @@
 <div class=foodcardeditor>
 	<h1>Speisekarten-Editor</h1>
-	<input type="file"
-		name="fileupload"
-		(change)="fileEvent($event)" />
-	<button class="button"
-		type="button"
-		id="exportJson"
-		(click)="exportJson()">Export Json</button>
-	<a #exportJsonLink
-		id="exportJsonLink"
-		[href]="downloadJsonHref"
-		hidden="hidden"
-		download="speisekarte.json">Json</a>
-	<button class="button"
-		type="button"
-		id="exportHtml"
-		(click)="exportHtml()">Export Html</button>
-	<a #exportHtmlLink
-		id="exportHtmlLink"
-		[href]="downloadHtmlHref"
-		hidden="hidden"
-		download="speisekarte.html">Html</a>
-	<button class="button"
-		type="button"
-		id="addTitle"
-		(click)="addTitle()">Titel Hinzufügen</button>
+	<div class="flex">
+		<input type="file"
+			name="fileupload"
+			(change)="fileEvent($event)" />
+		<button class="button"
+			type="button"
+			id="exportJson"
+			(click)="exportJson()">Export Json</button>
+		<a #exportJsonLink
+			id="exportJsonLink"
+			[href]="downloadJsonHref"
+			hidden="hidden"
+			download="speisekarte.json">Json</a>
+		<button class="button"
+			type="button"
+			id="exportHtml"
+			(click)="exportHtml()">Export Html</button>
+		<a #exportHtmlLink
+			id="exportHtmlLink"
+			[href]="downloadHtmlHref"
+			hidden="hidden"
+			download="speisekarte.html">Html</a>
+		<button class="button"
+			type="button"
+			id="addTitle"
+			(click)="addTitle()">Titel Hinzufügen</button>
+	</div>
 	<app-foodcard [foodcard]="foodcard"></app-foodcard>
 	<div class="version">{{version}}</div>
 </div>
-- 
2.39.5