From 45323611ca044db8cf170ecf4c2d2a4665730b03 Mon Sep 17 00:00:00 2001 From: simongig Date: Tue, 5 Nov 2019 15:35:00 +0100 Subject: [PATCH 1/2] Solved Problems. --- index.html | 6 +++--- index_styles.css | 1 + 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 379aa85..d05a8b6 100644 --- a/index.html +++ b/index.html @@ -5,14 +5,14 @@ - + Document @@ -25,6 +25,6 @@
- + \ No newline at end of file diff --git a/index_styles.css b/index_styles.css index cd12f07..98749f5 100644 --- a/index_styles.css +++ b/index_styles.css @@ -3,6 +3,7 @@ display: inline; font-size: 400%; margin: 0.8rem; + text-decoration: none; } From f9a77cb1914cd35603fea54201eabf47107a656e Mon Sep 17 00:00:00 2001 From: simongig Date: Tue, 5 Nov 2019 17:05:45 +0100 Subject: [PATCH 2/2] Balance added + entry list structure --- components/icons/caret-down-solid.svg | 1 + components/icons/user-solid.svg | 1 + index.html | 25 ++++++++++-- index_styles.css | 55 +++++++++++++++++++++++++-- 4 files changed, 75 insertions(+), 7 deletions(-) create mode 100644 components/icons/caret-down-solid.svg create mode 100644 components/icons/user-solid.svg diff --git a/components/icons/caret-down-solid.svg b/components/icons/caret-down-solid.svg new file mode 100644 index 0000000..e1d0723 --- /dev/null +++ b/components/icons/caret-down-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/components/icons/user-solid.svg b/components/icons/user-solid.svg new file mode 100644 index 0000000..23737bf --- /dev/null +++ b/components/icons/user-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/index.html b/index.html index d05a8b6..0943823 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,7 @@ Document +
-

Umsätze

+
+
Balance:
+
500,00 Euro
+
-
-
-
+
+ + Beschreibung + Betrag +
+
+ +
Beschreibung
+
Betrag
+
+
+ +
Beschreibung
+
Betrag
+
+ \ No newline at end of file diff --git a/index_styles.css b/index_styles.css index 98749f5..2ad1af5 100644 --- a/index_styles.css +++ b/index_styles.css @@ -15,12 +15,61 @@ .grid-wrapper { display: grid; - padding: 4rem 4rem 0 4rem; + padding: 0 2em 0 2em; grid-template-columns: 1fr; - grid-template-rows: 100px 100px 100px; + grid-template-rows: 80px 80px 80px; grid-gap: 10px; } .box { - background-color: grey; + background-color: #C4C4C4; + display: grid; + grid-template-columns: repeat(12, 1fr); + grid-template-areas: "dropdown entry entry entry entry entry entry entry entry entry amount amount"; + font-size: 2em; + border-radius: 10px; +} + +.entry { + display: flex; + vertical-align: center; + align-items: center; + padding: 5px; + grid-area: entry; +} + +.amount { + display: flex; + vertical-align: center; + align-items: center; + padding: 10px; + text-align: right; + grid-area: amount; +} + +.balance-list { + display: grid; + grid-template-areas: ; +} + +.overview { + text-align: center; + padding: 20px; +} + +#title { + font-size: 2em; +} + +#total-amount { + font-size: 3em; + color: green; +} + +.dropdown { + grid-area: dropdown; + background-image: url("./components/icons/caret-down-solid.svg"); + background-repeat: no-repeat; + background-position: center; + fill: #F3f3F3 } \ No newline at end of file