Created landing page.
This commit is contained in:
@@ -19,7 +19,7 @@ $primary: #0b2a37;
|
||||
}
|
||||
}
|
||||
|
||||
#home-navbar {
|
||||
/*#home-navbar {
|
||||
&:not(.is-fixed-top) {
|
||||
patek-logo {
|
||||
font-size: 0;
|
||||
@@ -49,7 +49,85 @@ $primary: #0b2a37;
|
||||
background-color: $primary;
|
||||
color: $primary-invert !important;
|
||||
font-family: 'Fira Code';
|
||||
}*/
|
||||
#landing {
|
||||
background-color: $primary;
|
||||
color: $primary-invert;
|
||||
.patek-logo-top {
|
||||
text-align: center;
|
||||
font-size: 70px;
|
||||
padding-top: 40px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
.intro {
|
||||
text-align: center;
|
||||
font-family: 'Fira Code';
|
||||
padding-bottom: 30px;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
a {
|
||||
color: white !important;
|
||||
}
|
||||
.column {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.big-buttons {
|
||||
max-width: 62em;
|
||||
}
|
||||
.big-button {
|
||||
width: 100%;
|
||||
height: 12em;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
padding: 1em;
|
||||
font-family: 'Fira Code';
|
||||
transition: transform 0.4s;
|
||||
border-radius: 5px;
|
||||
font-weight: 500;
|
||||
max-width: 30em;
|
||||
&:hover {
|
||||
transform: scale(1.02);
|
||||
cursor: pointer;
|
||||
color: white;
|
||||
}
|
||||
h1 {
|
||||
font-size: 4em;
|
||||
font-weight: 500;
|
||||
patek-logo {
|
||||
position: relative;
|
||||
top: -10px;
|
||||
}
|
||||
}
|
||||
.front, .back {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
transition: opacity 0.4s, height 0.4s;
|
||||
}
|
||||
.front {
|
||||
height: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
.back {
|
||||
height: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover, &:focus {
|
||||
.front {
|
||||
height: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
.back {
|
||||
height: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
background-color: $primary;
|
||||
color: $primary-invert;
|
||||
@@ -59,6 +137,12 @@ $primary: #0b2a37;
|
||||
h2 {
|
||||
color: $primary-invert;
|
||||
}
|
||||
a {
|
||||
color: #73A0E7;
|
||||
&:hover {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
.author-media {
|
||||
margin-bottom: 15px;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{{ define "title" }} Pátek {{ end }}
|
||||
|
||||
{{ define "body" }}
|
||||
|
||||
<!--
|
||||
<div class="hero is-primary">
|
||||
<div class="hero-body">
|
||||
<div class="container">
|
||||
@@ -25,5 +25,69 @@
|
||||
</div>
|
||||
{{ partial "footer.html" . }}
|
||||
{{ partial "js.html" "js/home.js"}}
|
||||
-->
|
||||
<div id="landing">
|
||||
<div class="patek-logo-top">
|
||||
<patek-logo></patek-logo>
|
||||
</div>
|
||||
<div class="intro container">
|
||||
<section class="section">
|
||||
{{ .Content }}
|
||||
</section>
|
||||
</div>
|
||||
<div class="big-buttons container">
|
||||
<section class="section columns is-multiline">
|
||||
{{ range .Site.Menus.landing }}
|
||||
<div class="column is-6">
|
||||
<a href="{{ .URL }}">
|
||||
<div class="big-button" style="background-color: {{ .Page.Params.buttonColor }}; color: {{ .Page.Params.buttonTextColor | default "white" }}">
|
||||
<div class="front">
|
||||
<h1>{{ safeHTML .Title }}</h1>
|
||||
</div>
|
||||
<div class="back">
|
||||
{{ .Page.Summary | truncate 200 }}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
{{ end }}
|
||||
<!--
|
||||
<div class="column is-6">
|
||||
<div class="big-button">
|
||||
<div class="front">
|
||||
<h1><patek-logo title="Talks" subtitle="Pátek"></patek-logo></h1>
|
||||
</div>
|
||||
<div class="back">
|
||||
{{ (.Site.GetPage "about").Summary | truncate 250 }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="column is-6">
|
||||
<div class="big-button">
|
||||
<div class="front">
|
||||
<h1>O nás</h1>
|
||||
</div>
|
||||
<div class="back">
|
||||
{{ (.Site.GetPage "about").Summary | truncate 250 }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="column is-6">
|
||||
<div class="big-button">
|
||||
<div class="front">
|
||||
<h1>O nás</h1>
|
||||
</div>
|
||||
<div class="back">
|
||||
{{ (.Site.GetPage "about").Summary | truncate 250 }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
</section>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{{ partial "footer.html" . }}
|
||||
{{ end }}
|
||||
Reference in New Issue
Block a user