cardheader
This commit is contained in:
parent
e4d5ddede7
commit
4c8196e3ee
|
@ -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>
|
|
@ -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';
|
||||
|
|
|
@ -15,3 +15,9 @@
|
|||
img {
|
||||
height: fit-content;
|
||||
}
|
||||
|
||||
button {
|
||||
border-radius: 50%;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
}
|
16
src/app/cards/about-me/about-me.component.html
Normal file
16
src/app/cards/about-me/about-me.component.html
Normal file
|
@ -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>
|
Before Width: | Height: | Size: 2.9 MiB After Width: | Height: | Size: 2.9 MiB |
|
@ -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>
|
||||
|
||||
<img src="https://marcusferl.de/wp-content/uploads/2022/12/android.png" alt="" class="card-img-bottom"
|
||||
style="max-height: 720px;">
|
||||
</div>
|
|
@ -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>
|
||||
<img src="https://marcusferl.de/wp-content/uploads/2022/12/pngegg.png" alt="" class="card-img-bottom">
|
||||
</div>
|
|
@ -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>
|
||||
<img src="https://marcusferl.de/wp-content/uploads/2022/12/python.png" alt="" class="card-img-bottom">
|
||||
</div>
|
Loading…
Reference in New Issue
Block a user