mirror of
https://github.com/Brandon-Rozek/website-theme.git
synced 2024-12-22 17:42:18 +00:00
Cleaned up homepage HTML
This commit is contained in:
parent
06d74a6a39
commit
b28e531f9f
2 changed files with 79 additions and 74 deletions
|
|
@ -4,7 +4,7 @@
|
|||
body {
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
min-height:100vh;
|
||||
min-height: 100vh;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing:border-box;
|
||||
|
|
@ -93,25 +93,6 @@ a:active {
|
|||
}
|
||||
}
|
||||
|
||||
/* Homepage Header */
|
||||
|
||||
.header-home .avatar {
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
.header-home .avatar img {
|
||||
width: 250px;
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.header-home .avatarMask {
|
||||
clip-path: circle(120px at center);
|
||||
-webkit-clip-path: circle(120px at center);
|
||||
}
|
||||
|
||||
/* END HEADER */
|
||||
|
||||
main {
|
||||
|
|
@ -123,22 +104,11 @@ mark {
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
/*
|
||||
** NAVIGATION
|
||||
*/
|
||||
|
||||
/* Top page */
|
||||
#profileContainer {
|
||||
min-height: calc(100vh - 100px);
|
||||
/* max-width: 600px; */
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#profile {
|
||||
max-width: 600px;
|
||||
/* min-width: 300px; */
|
||||
}
|
||||
|
||||
nav ul {
|
||||
.nav-home ul {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
/* max-width: 300px; */
|
||||
|
|
@ -148,10 +118,12 @@ nav ul {
|
|||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
nav li {
|
||||
.nav-home li {
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
/* END NAVIGATION */
|
||||
|
||||
/* Contents List */
|
||||
#searchBox {
|
||||
position: relative;
|
||||
|
|
@ -281,6 +253,43 @@ nav li {
|
|||
}
|
||||
|
||||
|
||||
/*
|
||||
** Home Page
|
||||
*/
|
||||
|
||||
.main-home {
|
||||
min-height: calc(100vh - 100px);
|
||||
/* max-width: 600px; */
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.main-home .h-card {
|
||||
max-width: 600px;
|
||||
/* min-width: 300px; */
|
||||
}
|
||||
|
||||
.main-home .h-card .avatar {
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
.main-home .h-card .avatar img {
|
||||
width: 250px;
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.main-home .h-card .avatarMask {
|
||||
clip-path: circle(120px at center);
|
||||
-webkit-clip-path: circle(120px at center);
|
||||
}
|
||||
|
||||
/* END HOME PAGE */
|
||||
|
||||
|
||||
|
||||
#webmentions img { max-height: 1.2em; margin-right: -1ex; }
|
||||
|
||||
|
|
|
|||
|
|
@ -1,51 +1,47 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
{{- partial "head.html" . -}}
|
||||
<body>
|
||||
<main>
|
||||
<div id="profileContainer">
|
||||
<div id="profile" class="h-card">
|
||||
<header class="header-home">
|
||||
<!-- avator -->
|
||||
<div class="avatar">
|
||||
<img class="avatarMask u-photo" src="{{ .Site.BaseURL }}/img/{{ .Site.Params.avatar }}" alt="avatar">
|
||||
<img src="{{ .Site.BaseURL }}/img/avatar-border.svg" alt="avatar-border">
|
||||
</div>
|
||||
<!-- author -->
|
||||
<h1 class="author title p-name">{{ .Site.Params.Author }}</h1>
|
||||
<a style="display: none" rel="me" class="u-url" href="https://brandonrozek.com"></a>
|
||||
</header>
|
||||
<!-- description -->
|
||||
<p class="p-note">
|
||||
{{ .Site.Params.description | safeHTML }}
|
||||
</p>
|
||||
<!-- navigation -->
|
||||
<nav>
|
||||
<ul>
|
||||
{{ range .Site.Menus.main }}
|
||||
<li><a href="{{ .URL }}" aria-label="{{ .Identifier }}">{{ .Pre }}<br>{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
|
||||
</ul>
|
||||
</nav>
|
||||
<p>You can also find me on:</p>
|
||||
<nav>
|
||||
<ul>
|
||||
{{ range .Site.Menus.profile }}
|
||||
<li><a href="{{ .URL }}" rel="me" aria-label="{{ .Identifier }}">{{ .Pre }}<br>{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
<body>
|
||||
<main class="main-home">
|
||||
<div class="h-card">
|
||||
<!-- avator -->
|
||||
<div class="avatar">
|
||||
<img class="avatarMask u-photo" src="{{ .Site.BaseURL }}/img/{{ .Site.Params.avatar }}" alt="Photo of {{ .Site.Params.Author }}" />
|
||||
<img src="{{ .Site.BaseURL }}/img/avatar-border.svg" />
|
||||
</div>
|
||||
<!-- author -->
|
||||
<h1 class="author title p-name">{{ .Site.Params.Author }}</h1>
|
||||
<a style="display: none" rel="me" class="u-url" href="https://brandonrozek.com"></a>
|
||||
<!-- description -->
|
||||
<p class="p-note">
|
||||
{{ .Site.Params.description | safeHTML }}
|
||||
</p>
|
||||
<!-- Site Navigation -->
|
||||
<nav class="nav-home">
|
||||
<ul>
|
||||
{{ range .Site.Menus.main }}
|
||||
<li><a href="{{ .URL }}" aria-label="{{ .Identifier }}">{{ .Pre }}<br>{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
<!-- Social Navigation -->
|
||||
<p>You can also find me on:</p>
|
||||
<nav class="nav-home">
|
||||
<ul>
|
||||
{{ range .Site.Menus.profile }}
|
||||
<li><a href="{{ .URL }}" rel="me" aria-label="{{ .Identifier }}">{{ .Pre }}<br>{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</main>
|
||||
{{- partial "footer.html" . -}}
|
||||
{{ partial "footer.html" . -}}
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "http://schema.org",
|
||||
"@type": "WebSite",
|
||||
"url": "{{ .Permalink }}"
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in a new issue