Ellpeck/Web
1
0
Fork 0
Code Issues Pull requests Releases Activity Actions

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

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

7
index.html
View file

@ -45,7 +45,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-auto"> <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>
<div class="col"> <div class="col">
<h1 class="display-4" id="intro-text"></h1> <h1 class="display-4" id="intro-text"></h1>
@ -94,9 +94,8 @@
<!-- Footer --> <!-- Footer -->
<div class="footer"> <div class="footer">
<div class="container footer-content"> <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>
<span class="text-muted">&copy; 2018 Ellpeck - <a href="" data-toggle="modal" data-target="#impressum-modal">Impressum</a></span> <img src="res/blobheart.png" id="blobheart">
</div>
</div> </div>
<!-- Impressum --> <!-- Impressum -->

BIN
res/blobheart.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 29 KiB

BIN
res/heart.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 540 KiB

4
scripts/main.js
View file

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

4
scripts/projects.js
View file

@ -60,7 +60,7 @@ const projects = [{
let p = ''; let p = '';
for (project of projects) { 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 += '<div class="card-body">';
p += '<img class="project-image" src="res/projects/' + project['icon'] + '.png" alt="">'; p += '<img class="project-image" src="res/projects/' + project['icon'] + '.png" alt="">';
@ -70,7 +70,7 @@ for (project of projects) {
let links = project['links']; let links = project['links'];
for (let name in 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>'; p += '</div>';

2
scripts/social.js
View file

@ -50,7 +50,7 @@ const socials = [{
let s = ''; let s = '';
for (social of socials) { 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 += '<img class="social-image" src="res/social/' + social['name'].toLowerCase() + '.png" alt="">';
s += ' ' + social['name']; s += ' ' + social['name'];
s += '</a>' s += '</a>'

10
style.css
View file

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