From 4c8196e3eebe0965983702667c6428476bd66c37 Mon Sep 17 00:00:00 2001
From: "marcus@weifer.de" <marcus>
Date: Sat, 3 Dec 2022 00:10:58 +0100
Subject: [PATCH] cardheader

---
 src/app/about-me/about-me.component.html      |   6 -----
 src/app/app.module.ts                         |   2 +-
 .../about-me/about-me.component.css           |   6 +++++
 .../cards/about-me/about-me.component.html    |  16 ++++++++++++
 .../about-me/about-me.component.spec.ts       |   0
 .../about-me/about-me.component.ts            |   0
 src/app/{ => cards}/about-me/me.jpg           | Bin
 .../android-apps/android-apps.component.html  |  23 +++++++++++++-----
 src/app/cards/csharp/csharp.component.html    |  21 ++++++++++------
 src/app/cards/python/python.component.html    |  21 ++++++++++------
 10 files changed, 68 insertions(+), 27 deletions(-)
 delete mode 100644 src/app/about-me/about-me.component.html
 rename src/app/{ => cards}/about-me/about-me.component.css (85%)
 create mode 100644 src/app/cards/about-me/about-me.component.html
 rename src/app/{ => cards}/about-me/about-me.component.spec.ts (100%)
 rename src/app/{ => cards}/about-me/about-me.component.ts (100%)
 rename src/app/{ => cards}/about-me/me.jpg (100%)

diff --git a/src/app/about-me/about-me.component.html b/src/app/about-me/about-me.component.html
deleted file mode 100644
index dfab576..0000000
--- a/src/app/about-me/about-me.component.html
+++ /dev/null
@@ -1,6 +0,0 @@
-<a href="https://marcusferl.de" class="custom-card">
-    <div class="card p-2 my-1" style="width: auto;">
-        <h3>About me</h3>
-        <img src="https://marcusferl.de/wp-content/uploads/2021/01/edititsme.png" alt="" class="card-img-bottom">
-    </div>
-</a>
\ No newline at end of file
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index c347f3a..10e312b 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -4,7 +4,7 @@ import { BrowserModule } from '@angular/platform-browser';
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
 import { NavBarComponent } from './nav-bar/nav-bar.component';
-import { AboutMeComponent } from './about-me/about-me.component';
+import { AboutMeComponent } from './cards/about-me/about-me.component';
 import { CardsComponent } from './cards/cards.component';
 import { AndroidAppsComponent } from './cards/android-apps/android-apps.component';
 import { CsharpComponent } from './cards/csharp/csharp.component';
diff --git a/src/app/about-me/about-me.component.css b/src/app/cards/about-me/about-me.component.css
similarity index 85%
rename from src/app/about-me/about-me.component.css
rename to src/app/cards/about-me/about-me.component.css
index dbcd96c..014088b 100644
--- a/src/app/about-me/about-me.component.css
+++ b/src/app/cards/about-me/about-me.component.css
@@ -14,4 +14,10 @@
 
 img {
     height: fit-content;
+}
+
+button {
+    border-radius: 50%;
+    height: 50px;
+    width: 50px;
 }
\ No newline at end of file
diff --git a/src/app/cards/about-me/about-me.component.html b/src/app/cards/about-me/about-me.component.html
new file mode 100644
index 0000000..29530b9
--- /dev/null
+++ b/src/app/cards/about-me/about-me.component.html
@@ -0,0 +1,16 @@
+<div class="card p-2 my-1" style="width: auto;">
+    <div class="row">
+        <div class="col-sm-10">
+            <h2 class="card-title">About me</h2>
+        </div>
+        <div class="col-sm-1">
+            <svg xmlns="http://www.w3.org/2000/svg" width="45" height="45" fill="currentColor"
+                class="bi bi-arrow-right-circle-fill" viewBox="0 0 16 16">
+                <path
+                    d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z" />
+            </svg>
+        </div>
+        <hr>
+    </div>
+    <img src="https://marcusferl.de/wp-content/uploads/2021/01/edititsme.png" alt="" class="card-img-bottom">
+</div>
\ No newline at end of file
diff --git a/src/app/about-me/about-me.component.spec.ts b/src/app/cards/about-me/about-me.component.spec.ts
similarity index 100%
rename from src/app/about-me/about-me.component.spec.ts
rename to src/app/cards/about-me/about-me.component.spec.ts
diff --git a/src/app/about-me/about-me.component.ts b/src/app/cards/about-me/about-me.component.ts
similarity index 100%
rename from src/app/about-me/about-me.component.ts
rename to src/app/cards/about-me/about-me.component.ts
diff --git a/src/app/about-me/me.jpg b/src/app/cards/about-me/me.jpg
similarity index 100%
rename from src/app/about-me/me.jpg
rename to src/app/cards/about-me/me.jpg
diff --git a/src/app/cards/android-apps/android-apps.component.html b/src/app/cards/android-apps/android-apps.component.html
index c337dcf..ea0e7a1 100644
--- a/src/app/cards/android-apps/android-apps.component.html
+++ b/src/app/cards/android-apps/android-apps.component.html
@@ -1,7 +1,18 @@
-<a href="https://marcusferl.de" class="custom-card">
-    <div class="card p-2 my-1" style="width: auto;">
-        <h3>Android Apps</h3>
-        <img src="https://marcusferl.de/wp-content/uploads/2022/12/android.png" alt="" class="card-img-bottom"
-            style="max-height: 720px;">
+<div class="card p-2 my-1" style="width: auto;">
+    <div class="row">
+        <div class="col-sm-10">
+            <h2 class="card-title">Android Apps</h2>
+        </div>
+        <div class="col-sm-1">
+            <svg xmlns="http://www.w3.org/2000/svg" width="45" height="45" fill="currentColor"
+                class="bi bi-arrow-right-circle-fill" viewBox="0 0 16 16">
+                <path
+                    d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z" />
+            </svg>
+        </div>
+        <hr>
     </div>
-</a>
\ No newline at end of file
+
+    <img src="https://marcusferl.de/wp-content/uploads/2022/12/android.png" alt="" class="card-img-bottom"
+        style="max-height: 720px;">
+</div>
\ No newline at end of file
diff --git a/src/app/cards/csharp/csharp.component.html b/src/app/cards/csharp/csharp.component.html
index 1a8a600..96daea9 100644
--- a/src/app/cards/csharp/csharp.component.html
+++ b/src/app/cards/csharp/csharp.component.html
@@ -1,9 +1,16 @@
-<a href="#" class="custom-card">
-    <div class="card p-2 my-1 bg-danger" style="width: auto;">
-
-        <h5>C#</h5>
+<div class="card p-2 my-1 bg-danger" style="width: auto;">
+    <div class="row">
+        <div class="col-sm-10">
+            <h2 class="card-title">C#</h2>
+        </div>
+        <div class="col-sm-1">
+            <svg xmlns="http://www.w3.org/2000/svg" width="45" height="45" fill="currentColor"
+                class="bi bi-arrow-right-circle-fill" viewBox="0 0 16 16">
+                <path
+                    d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z" />
+            </svg>
+        </div>
         <hr>
-        <img src="https://marcusferl.de/wp-content/uploads/2022/12/pngegg.png" alt="" class="card-img-bottom">
     </div>
-
-</a>
\ No newline at end of file
+    <img src="https://marcusferl.de/wp-content/uploads/2022/12/pngegg.png" alt="" class="card-img-bottom">
+</div>
\ No newline at end of file
diff --git a/src/app/cards/python/python.component.html b/src/app/cards/python/python.component.html
index 876e6c5..708dd4b 100644
--- a/src/app/cards/python/python.component.html
+++ b/src/app/cards/python/python.component.html
@@ -1,9 +1,16 @@
-<a href="#" class="custom-card">
-    <div class="card p-2 my-1 bg-danger" style="width: auto;">
-
-        <h5>Python</h5>
+<div class="card p-2 my-1 bg-danger" style="width: auto;">
+    <div class="row">
+        <div class="col-sm-10">
+            <h2 class="card-title">Python</h2>
+        </div>
+        <div class="col-sm-1">
+            <svg xmlns="http://www.w3.org/2000/svg" width="45" height="45" fill="currentColor"
+                class="bi bi-arrow-right-circle-fill" viewBox="0 0 16 16">
+                <path
+                    d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z" />
+            </svg>
+        </div>
         <hr>
-        <img src="https://marcusferl.de/wp-content/uploads/2022/12/python.png" alt="" class="card-img-bottom">
     </div>
-
-</a>
\ No newline at end of file
+    <img src="https://marcusferl.de/wp-content/uploads/2022/12/python.png" alt="" class="card-img-bottom">
+</div>
\ No newline at end of file