mirror of
https://github.com/ivabus/www
synced 2024-11-22 13:05:06 +03:00
Styling & content
This commit is contained in:
parent
fb1cae2401
commit
19f3806803
3 changed files with 107 additions and 70 deletions
|
@ -7,7 +7,7 @@
|
||||||
|
|
||||||
{{ partial "navbar.html" . }}
|
{{ partial "navbar.html" . }}
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<section class="teal-bg">
|
<section class="teal-bg">
|
||||||
<div class="container one-box">
|
<div class="container one-box">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
@ -35,7 +35,8 @@
|
||||||
<a href="{{ .RelPermalink }}"><h3>{{ .Title }}</h3></a>
|
<a href="{{ .RelPermalink }}"><h3>{{ .Title }}</h3></a>
|
||||||
<span class="grid-gray small">Published: {{ .Date.Format "02/01/2006" }}</span><br>
|
<span class="grid-gray small">Published: {{ .Date.Format "02/01/2006" }}</span><br>
|
||||||
<span class="grid-gray small">Categories: {{ range .Params.categories }}<a class="grid-gray" href="{{ "/categories/" | relLangURL }}{{ . | urlize }}">{{ . }}</a>, {{ end }}</span>
|
<span class="grid-gray small">Categories: {{ range .Params.categories }}<a class="grid-gray" href="{{ "/categories/" | relLangURL }}{{ . | urlize }}">{{ . }}</a>, {{ end }}</span>
|
||||||
<span class="preview-content small mt-2">{{ .Content }}</span>
|
<span class="preview-content small mt-2">{{ trim .Summary 5 | plainify }}</span>
|
||||||
|
<a class="read-more" href="{{ .RelPermalink }}">Read More</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
|
@ -48,49 +49,73 @@
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
<footer>
|
<footer>
|
||||||
{{- partial "footer-content.html" . -}}
|
{{- partial "footer-content.html" . -}}
|
||||||
{{- partial "footer.html" . -}}
|
{{- partial "footer.html" . -}}
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
.preview-content{
|
.preview-content {
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
-webkit-line-clamp: 3;
|
-webkit-line-clamp: 5;
|
||||||
-webkit-box-orient: vertical;
|
-webkit-box-orient: vertical;
|
||||||
}
|
text-overflow: ellipsis;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
.featured-image {
|
.featured-image {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100px;
|
height: 100px;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.blog-listing{
|
.blog-listing {
|
||||||
border: 1px solid #949494;
|
border: 1px solid #949494;
|
||||||
transition: 0.2s ease-in-out;
|
transition: 0.2s ease-in-out;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
min-height: 400px;
|
min-height: 400px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.blog-listing:hover{
|
.content-wrapper {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blog-col {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blog-listing:hover {
|
||||||
background-color: #252525 !important;
|
background-color: #252525 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
h3{
|
h3 {
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
line-height: 34px;
|
line-height: 34px;
|
||||||
}
|
}
|
||||||
|
|
||||||
p{
|
p {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.read-more {
|
||||||
|
display: block;
|
||||||
|
margin-top: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #00ffd0;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.read-more:hover{
|
||||||
|
color: #e1e1e1;
|
||||||
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
flex: 0 0 30%;
|
flex: 0 0 30%;
|
||||||
|
|
|
@ -50,4 +50,8 @@
|
||||||
img{
|
img{
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
code{
|
||||||
|
color:#ff7ba7;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -35,4 +35,12 @@
|
||||||
line-height:12px;
|
line-height:12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.sidebar-list a{
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar-list a:hover{
|
||||||
|
color: #00ffd0;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in a new issue