change the visual design of the page, adding sections
This commit is contained in:
parent
d9408675cd
commit
56cb456d9d
2 changed files with 29 additions and 16 deletions
17
index.html
17
index.html
|
@ -14,10 +14,9 @@
|
|||
<script src="scripts/main.js"></script>
|
||||
</head>
|
||||
<body data-spy="scroll" data-target="#navbar">
|
||||
<a class="anchor" id="home"></a>
|
||||
|
||||
<a class="anchor home" id="home"></a>
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark" id="navbar">
|
||||
<nav class="navbar fixed-top navbar-expand-lg navbar-light bg-light" id="navbar">
|
||||
<!-- Navbar brand and logo -->
|
||||
<a class="navbar-brand mb-0 h1" href="#home">
|
||||
<img src="/res/logo.png" width="40" height="40" alt=""> Ellpeck.de
|
||||
|
@ -59,8 +58,8 @@
|
|||
</div>
|
||||
|
||||
<!-- Projects -->
|
||||
<div class="list-display">
|
||||
<a class="anchor" id="projects"></a>
|
||||
<a class="anchor" id="projects"></a>
|
||||
<div class="list-display rounded">
|
||||
<h2>Projects</h2>
|
||||
<p>
|
||||
Below is a list of all of the projects that I'm working on or that I've made in the past. Check them out if you want!
|
||||
|
@ -70,8 +69,8 @@
|
|||
</div>
|
||||
|
||||
<!-- Social -->
|
||||
<div class="list-display">
|
||||
<a class="anchor" id="social"></a>
|
||||
<a class="anchor" id="social"></a>
|
||||
<div class="list-display rounded">
|
||||
<h2>Social</h2>
|
||||
<p>
|
||||
Below is a list of the social networks and websites that I regularly use. The closer to the front of the list they are, the more frequently I use them, generally.
|
||||
|
@ -81,8 +80,8 @@
|
|||
</div>
|
||||
|
||||
<!-- About -->
|
||||
<div class="list-display">
|
||||
<a class="anchor" id="about"></a>
|
||||
<a class="anchor" id="about"></a>
|
||||
<div class="list-display rounded">
|
||||
<h2>About</h2>
|
||||
<p>
|
||||
Sometimes, some people ask me some questions about myself or my projects, so I decided to compile a list of some of the answers in a Q&A-like fashion so that I don't have to keep repeating them. If you're curious about me, this might be intersting to
|
||||
|
|
28
style.css
28
style.css
|
@ -1,16 +1,13 @@
|
|||
body {
|
||||
padding-top: 66px;
|
||||
margin-top: 106px;
|
||||
position: relative;
|
||||
font-family: Roboto;
|
||||
background-color: #404142;
|
||||
}
|
||||
|
||||
.main {
|
||||
margin-top: 20px;
|
||||
padding-bottom: 200px;
|
||||
}
|
||||
|
||||
.project {
|
||||
margin-top: 50px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.list-display {
|
||||
|
@ -19,6 +16,19 @@ body {
|
|||
margin-top: 40px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
padding-left: 60px;
|
||||
padding-right: 60px;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.project {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.jumbotron {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.project-image {
|
||||
|
@ -55,10 +65,14 @@ body {
|
|||
a.anchor {
|
||||
display: block;
|
||||
position: relative;
|
||||
top: -66px;
|
||||
top: -46px;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
a.anchor.home {
|
||||
top: -106px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
|
|
Loading…
Reference in a new issue