mirror of
https://github.com/Brandon-Rozek/website-theme.git
synced 2024-11-24 17:16:31 -05: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 {
|
body {
|
||||||
-ms-text-size-adjust: 100%;
|
-ms-text-size-adjust: 100%;
|
||||||
-webkit-text-size-adjust: 100%;
|
-webkit-text-size-adjust: 100%;
|
||||||
min-height:100vh;
|
min-height: 100vh;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
box-sizing:border-box;
|
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 */
|
/* END HEADER */
|
||||||
|
|
||||||
main {
|
main {
|
||||||
|
|
@ -123,22 +104,11 @@ mark {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
** NAVIGATION
|
||||||
|
*/
|
||||||
|
|
||||||
/* Top page */
|
.nav-home ul {
|
||||||
#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 {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
/* max-width: 300px; */
|
/* max-width: 300px; */
|
||||||
|
|
@ -148,10 +118,12 @@ nav ul {
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav li {
|
.nav-home li {
|
||||||
margin: 0 10px;
|
margin: 0 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* END NAVIGATION */
|
||||||
|
|
||||||
/* Contents List */
|
/* Contents List */
|
||||||
#searchBox {
|
#searchBox {
|
||||||
position: relative;
|
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; }
|
#webmentions img { max-height: 1.2em; margin-right: -1ex; }
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,51 +1,47 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
{{- partial "head.html" . -}}
|
{{- partial "head.html" . -}}
|
||||||
<body>
|
<body>
|
||||||
<main>
|
<main class="main-home">
|
||||||
<div id="profileContainer">
|
<div class="h-card">
|
||||||
<div id="profile" class="h-card">
|
<!-- avator -->
|
||||||
<header class="header-home">
|
<div class="avatar">
|
||||||
<!-- avator -->
|
<img class="avatarMask u-photo" src="{{ .Site.BaseURL }}/img/{{ .Site.Params.avatar }}" alt="Photo of {{ .Site.Params.Author }}" />
|
||||||
<div class="avatar">
|
<img src="{{ .Site.BaseURL }}/img/avatar-border.svg" />
|
||||||
<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>
|
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
{{- partial "footer.html" . -}}
|
{{ partial "footer.html" . -}}
|
||||||
<script type="application/ld+json">
|
<script type="application/ld+json">
|
||||||
{
|
{
|
||||||
"@context": "http://schema.org",
|
"@context": "http://schema.org",
|
||||||
"@type": "WebSite",
|
"@type": "WebSite",
|
||||||
"url": "{{ .Permalink }}"
|
"url": "{{ .Permalink }}"
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue