From: Bastian Dehn <hhaalo@arcor.de>
Date: Sat, 13 Aug 2022 08:44:42 +0000 (+0200)
Subject: change: style for app
X-Git-Tag: v1.0.10^2~1^2
X-Git-Url: https://gitweb.hhaalo.de/?a=commitdiff_plain;h=39adc171046c29fbe532f858839ffa90869eb042;p=speisekarten-editor.git

change: style for app
---

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>