make the site look a bit less bootstrappy (and a bit more materialy, rip)

This commit is contained in:
Ellpeck 2018-07-25 18:28:43 +02:00
parent 56cb456d9d
commit 2877f6ca11
7 changed files with 16 additions and 11 deletions

View file

@ -45,7 +45,7 @@
<div class="container">
<div class="row">
<div class="col-md-auto">
<img src="res/me.png" class="rounded-circle" width="200" height="200">
<img src="res/me.png" class="rounded-circle" width="200" height="200" id="navbar-image">
</div>
<div class="col">
<h1 class="display-4" id="intro-text"></h1>
@ -94,9 +94,8 @@
<!-- Footer -->
<div class="footer">
<div class="container footer-content">
<span class="text-muted">&copy; 2018 Ellpeck - <a href="" data-toggle="modal" data-target="#impressum-modal">Impressum</a></span>
</div>
<span class="text-muted"><a href="https://github.com/Ellpeck/Web">&copy; 2018 Ellpeck</a> - <a href="" data-toggle="modal" data-target="#impressum-modal">Impressum</a></span>
<img src="res/blobheart.png" id="blobheart">
</div>
<!-- Impressum -->

BIN
res/blobheart.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

BIN
res/heart.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 540 KiB

View file

@ -2,4 +2,8 @@ $(function() {
$('.navbar-collapse a').on('click', function() {
$('.navbar-collapse').collapse('hide');
});
$('#blobheart').on('click', function() {
$('#navbar-image').attr('src', 'res/heart.png');
});
});

View file

@ -60,7 +60,7 @@ const projects = [{
let p = '';
for (project of projects) {
p += '<div class="card bg-light project">';
p += '<div class="card bg-light project rounded-0">';
p += '<div class="card-body">';
p += '<img class="project-image" src="res/projects/' + project['icon'] + '.png" alt="">';
@ -70,7 +70,7 @@ for (project of projects) {
let links = project['links'];
for (let name in links) {
p += '<a href="' + links[name] + '" class="card-link btn btn-outline-info">' + name + '</a>';
p += '<a href="' + links[name] + '" class="card-link btn btn-outline-info rounded-0">' + name + '</a>';
}
p += '</div>';

View file

@ -50,7 +50,7 @@ const socials = [{
let s = '';
for (social of socials) {
s += '<a class="btn btn-light social-button" href="' + social['link'] + '"">';
s += '<a class="btn btn-light social-button rounded-0" href="' + social['link'] + '"">';
s += '<img class="social-image" src="res/social/' + social['name'].toLowerCase() + '.png" alt="">';
s += ' ' + social['name'];
s += '</a>'

View file

@ -75,12 +75,8 @@ a.anchor.home {
.footer {
bottom: 0;
width: 100%;
line-height: 30px;
background-color: #f5f5f5;
}
.footer-content {
text-align: center;
padding: 15px;
}
@ -89,4 +85,10 @@ a.anchor.home {
padding: 15px;
font-weight: bold;
font-size: 125%;
}
#blobheart {
float: right;
width: 30px;
height: 30px;
}