new colors

This commit is contained in:
WieErWill 2021-01-09 19:26:03 +01:00
parent 0c8f3e1765
commit 4971c41d62
8 changed files with 64 additions and 45 deletions

View File

@ -7,8 +7,4 @@
.project-head {
padding: 15px;
background-color: #548f8f;
}
.project a {
color: black;
}

View File

@ -1,10 +1,9 @@
<mat-card class="content-container bg-info text-white" style="border-radius:20px;">
<mat-card class="content-container bg-primary text-white" style="border-radius:20px;">
<mat-card-title>
<h1 class="my-3 text-center">
<span class="text-muted">My</span>&nbsp;
<span style="color:#ffffff">P</span><span style="color:#020077">rojects</span>&nbsp;
<span class="text-muted">and</span>&nbsp;
<span style="color:#ffffff">W</span><span style="color:#020077">orks</span>
<h1 class="my-3 display-1 text-center">
<span style="color:#ffffff">P</span><span style="color:#bebdff">rojects</span>
<span class="text-muted">&nbsp;&&nbsp;</span>
<span style="color:#ffffff">W</span><span style="color:#bebdff">orks</span>
</h1>
</mat-card-title>
@ -12,25 +11,19 @@
<p class="mb-5 lead text-center">"Do what you love and work is a hobby"</p>
</mat-card-subtitle>
<mat-card-content>
<div class="project row my-4" *ngFor="let project of projects">
<div class="col-12 col-md-3">
<h4 class="text-center">{{project.title}}</h4>
<mat-card-content class="list-group">
<div class="list-group-item list-group-item-action my-3" *ngFor="let project of projects">
<div class="d-flex w-100 justify-content-between">
<h3 class="mb-1">{{project.title}}</h3>
<small>
<a href={{project.link}} *ngIf="project.link">
<button mat-mini-fab color="primary">
<mat-icon>link</mat-icon>
</button>
</a>
</small>
</div>
<div class="col-12 col-md-8">
<p>{{project.description}}</p>
</div>
<div class="col-12 col-md-1">
<a href={{project.link}} *ngIf="project.link; else noLink">
<button mat-mini-fab color="primary">
<mat-icon>link</mat-icon>
</button>
</a>
<ng-template #noLink>
<p>no Website so far</p>
</ng-template>
</div>
<hr class="col-9 p-4 m-auto" />
<p class="mx-5">{{project.description}}</p>
</div>
</mat-card-content>

View File

@ -10,11 +10,6 @@ export const PROJECTS = [
description: "With a team up to four we build and programmed multiple robots to play football against each other or 2v2.With much fun and learning we worked together for several years and remain our friendships.",
link: "https://robocupgermanopen.de/de/junior/soccer"
},
{
title: "Student newspaper",
description: "A bit late i joined the schools newspaper and ranked up quickly with articles and proofleading.",
link: "https://passwort-sz.jimdofree.com/"
},
{
title: "UNIKAT",
description: "My first club at University of Ilmenau: UNIKAT, the makerspace for students and scholars.Here i worked for nearly three years on 3d - printers, CNC - milling - machines and much more.Each semester we also made a workshop week and gave our knowledge to further students.I retired at the end of 2019 but am still visiting and sometimes working there.",
@ -37,7 +32,7 @@ export const PROJECTS = [
},
{
title: "BI Student Club",
description: "Mainly because of the music i joined this club on my campus.With good old(and new) metal and rock we got some of the hardest partys and best members you can imageine.After some time i am one of our head technicans.Currently i am responsible for our cultural programm and association communication.",
description: "Mainly because of the music i joined this club on my campus.With good old(and new) metal and rock we got some of the hardest partys and best members you can imageine. After some time i am one of our head technicans. Currently i am responsible for our cultural programm and association communication.",
link: "http://www.bi-club.de"
},
{
@ -59,5 +54,15 @@ export const PROJECTS = [
title: "Discord Bot",
description: "With corona virus pandemia we shipped our weekly club meeting to discord.For management, fun and more interactivity we created a discord bot with several functions.",
link: null
}
},
{
title: "Wandern bringt Wasser",
description: "In collaboration with Engineers without Borders, this website is a fundraiser to encourage regional companies to support the 'Water for Nyamache' project.",
link: ""
},
{
title: "Ilmenauer Studentenclub e.V.",
description: "After being active in one of the sections for several years, I was elected to the board of the association. In this position, I manage, organise and plan four student clubs and a student café with three other board members in close cooperation with the individual sections. This work is more exciting than before in other associations, especially because of the Corona situation.",
link: "http://il-sc.de"
},
];

View File

@ -1,4 +1,9 @@
.card-image,
.mat-card-image {
height: auto;
width: 50px;
}
.mat-card-avatar {
border-radius: 0 !important;
}

View File

@ -1,9 +1,9 @@
<mat-card class="content-container bg-info text-white" style="border-radius:20px;">
<mat-card class="content-container bg-primary text-white" style="border-radius:20px;">
<mat-card-title>
<h1 class="my-3 display-1 text-center">
<span style="color:#ffffff">S</span><span style="color:#020077">kills</span>
<span style="color:#ffffff">S</span><span style="color:#bebdff">kills</span>
<span class="text-muted">&</span>
<span style="color:#ffffff">T</span><span style="color:#020077">ools</span>
<span style="color:#ffffff">T</span><span style="color:#bebdff">ools</span>
</h1>
</mat-card-title>
@ -13,19 +13,19 @@
<mat-card-content>
<div class="row justify-content-around">
<mat-card class="col-11 col-sm-5 m-3" *ngFor="let skill of skills">
<mat-card class="col-4 col-sm-2 m-2" *ngFor="let skill of skills">
<mat-card-header>
<div mat-card-avatar class="example-header-image">
<div mat-card-avatar>
<img mat-card-image class="m-auto" src="../../../assets/icons/{{skill.logo}}" alt="{{skill.name}}">
</div>
<mat-card-title>{{skill.name}}</mat-card-title>
<mat-card-subtitle>{{skill.kategory}}</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<!--<mat-card-content>
<p>{{skill.description}}</p>
</mat-card-content>
</mat-card-content>-->
<mat-card-actions>
<a href="{{skill.link}}"><button mat-raised-button>goto Website</button></a>
<a href="{{skill.link}}"><button mat-raised-button>visit Website</button></a>
</mat-card-actions>
</mat-card>
</div>

View File

@ -176,7 +176,7 @@ export const SKILLS = [
description: "PayPal is a listed operator of an online payment service that can be used for the payment of medium and small amounts, for example when buying and selling in online commerce."
},
{
name: "WooCommerce",
name: "Woo Commerce",
kategory: "shop systems",
logo: "woo.png",
link: "https://woocommerce.com/",

View File

@ -33,6 +33,6 @@ h1 {
}
a {
color: #2fff00;
color: #09ff00;
text-decoration: none;
}

View File

@ -24,4 +24,24 @@ body {
.list-inline-item {
size: 15px;
color: #00004d;
}
.bg-primary {
background-color: #439AFA;
}
.bg-secondary {
background-color: #38F8F9;
}
.bg-warning {
background-color: #FAAA1E;
}
.bg-danger {
background-color: #FA5D50;
}
.bg-other {
background-color: #2AFA84;
}