New version about-me with card

src/app/about-me/about-me.component.html

@@ -1,29 +1,40 @@
-<div class="container">
+<style>
-	<div class="row justify-content-center">
+	.frame {
-        <div class="col-1"><img src="ARTI_1.jpg" alt="Ja">
+		border: 2px solid gray; /* Kolor ramki */
-            </div>
+		border-radius: 8px; /* Zaokrąglenie krawędzi */
-		<div class="col-auto h2">Wrocław</div>
+		padding: 20px; /* Odstęp wewnętrzny */
+		background-color: #f8f9fa; /* Tło formularza */
+	}
+	.frame2 {
+		border: 2px solid rgb(225, 228, 86); /* Kolor ramki */
+		border-radius: 8px; /* Zaokrąglenie krawędzi */
+		padding: 20px; /* Odstęp wewnętrzny */
+		background-color: #f8f9fa; /* Tło formularza */
+	}
+</style>\
+<div class="container frame">
+
+	<div class="card" style="width: 18rem;">
+		<img src="ARTI-1.jpg" class="card-img-top" alt="Ja">
+		<div class="card-body">
+			<h5 class="card-title">Wrocław</h5>
+			<div class="col-auto">
+				<a href="mailto:kusartur@gmail.com"> 
+				<img width="30" height="20"	src="icons/envelope.svg" /> 
+				kusartur&#64;gmail.com
+				</a>
+			</div>	
+			<div class="col-auto">
+				<a href="tel:+48512558222"> <img width="30" height="20"
+					src="icons/telephone.svg" /> +48 511 116 016</a>
+			</div>
+			<div class="col-auto">
+				<a href="https://www.linkedin.com/in/artur-ku%C5%9B-99a7b02/"> <img
+					width="30" height="20" src="icons/linkedin.svg" />Linkedin
+				</a>
+			</div>
 				
-	</div>
-	<div class="row justify-content-center">
-		<div class="col-auto">
-			<a href="mailto:kusartur@gmail.com"> 
-			<img width="30" height="20"	src="icons/envelope.svg" /> 
-            kusartur&#64;gmail.com
-			</a>
-		</div>	
-	</div>
-	<div class="row justify-content-center">
-		<div class="col-auto">
-			<a href="tel:+48512558222"> <img width="30" height="20"
-				src="icons/telephone.svg" /> +48 511 116 016</a>
-		</div>
-	</div>
-	<div class="row justify-content-center">
-		<div class="col-auto">
-			<a href="https://www.linkedin.com/in/artur-ku%C5%9B-99a7b02/"> <img
-				width="30" height="20" src="icons/linkedin.svg" />Linkedin
-			</a>
 		</div>
 	</div>
+
 </div>

src/app/chat-gpt/chat-gpt.component.html

@@ -1,4 +1,4 @@
 <div class="container align-center mt-5">
-<h1><p>Witam!</p><p> Prace z chat GPT w toku.</p> 
+<h1><p>Witam!</p><p> Prace z toku.</p> </h1>
-    Już wkrótce będzie można pogadać ze AI!</h1>
+
 </div>