Change post title design

This commit is contained in:
Nico Jensen 2023-01-31 19:41:22 +01:00
parent e85fb01db3
commit 3f415e7967
4 changed files with 104 additions and 75 deletions

View file

@ -3,7 +3,13 @@
<article class="post">
<header class="post-header wrapper">
<div class="post-title">
<h2 class="post-title"><a href="{{post.url}}" rel="bookmark">{{post.title}}</a></h2>
<h2 class="post-title">
{% if post.external-url %}
<a href="{{post.external-url}}">{{post.title}}</a>
{% else %}
<a href="{{post.url}}" rel="bookmark">{{post.title}}</a>
{% endif %}
</h2>
<p class="public-date">vom <time class="post-date" datetime="{{post.date | date: "%Y-%m-%d"}}">
{% assign m = post.date | date: "%-m" %}
{{ post.date | date: "%d" }}
@ -23,7 +29,7 @@
{% endcase %}
{{ post.date | date: "%Y" }}</time>
{% if post.external-url %}
&nbsp;|&nbsp;<a href="{{post.external-url}}">Org. Post</a>
&nbsp;|&nbsp;<a href="{{post.url}}">Post Link</a>
{% endif %}
</p>
</div>

View file

@ -34,7 +34,7 @@ layout: default
{{ page.date | date: "%Y" }}
</time>
{% if page.external-url %}
&nbsp;|&nbsp;<a href="{{ page.external-url }}">Org. Post</a>
&nbsp;|&nbsp;<a href="{{ page.url }}">Post Link</a>
{% endif %}
</p>
</div>

View file

@ -1,69 +1,87 @@
@font-face {
font-family: entypo;
src: url('../fonts/entypo.ttf'),
url('../fonts/entypo.eot'); /* IE9 */
-webkit-font-smoothing: antialiased;
}
@font-face {
font-family: entypo-social;
src: url('../fonts/entypo-social.ttf'),
url('../fonts/entypo-social.eot'); /* IE9 */
-webkit-font-smoothing: antialiased;
}
/* open-sans-300 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: url('../fonts/open-sans-v15-latin-300.eot'); /* IE9 Compat Modes */
src: local('Open Sans Light'), local('OpenSans-Light'),
url('../fonts/open-sans-v15-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-300.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: url('../fonts/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
src: local('Open Sans Regular'), local('OpenSans-Regular'),
url('../fonts/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
src: url('../fonts/open-sans-v15-latin-600.eot'); /* IE9 Compat Modes */
src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
url('../fonts/open-sans-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-600.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
src: url('../fonts/open-sans-v15-latin-700.eot'); /* IE9 Compat Modes */
src: local('Open Sans Bold'), local('OpenSans-Bold'),
url('../fonts/open-sans-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-700.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}
.entypo { font-family: entypo; }
font-family: entypo;
src: url('../fonts/entypo.ttf'),
url('../fonts/entypo.eot'); /* IE9 */
-webkit-font-smoothing: antialiased;
}
@font-face {
font-family: entypo-social;
src: url('../fonts/entypo-social.ttf'),
url('../fonts/entypo-social.eot'); /* IE9 */
-webkit-font-smoothing: antialiased;
}
/* open-sans-300 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: url('../fonts/open-sans-v15-latin-300.eot'); /* IE9 Compat Modes */
src: local('Open Sans Light'), local('OpenSans-Light'),
url('../fonts/open-sans-v15-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-300.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: url('../fonts/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
src: local('Open Sans Regular'), local('OpenSans-Regular'),
url('../fonts/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
src: url('../fonts/open-sans-v15-latin-600.eot'); /* IE9 Compat Modes */
src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
url('../fonts/open-sans-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-600.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
src: url('../fonts/open-sans-v15-latin-700.eot'); /* IE9 Compat Modes */
src: local('Open Sans Bold'), local('OpenSans-Bold'),
url('../fonts/open-sans-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-700.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
src: url('../fonts/open-sans-v15-latin-800.eot'); /* IE9 Compat Modes */
src: local('Open Sans Bold'), local('OpenSans-Bold'),
url('../fonts/open-sans-v15-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/open-sans-v15-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/open-sans-v15-latin-800.woff') format('woff'), /* Modern Browsers */
url('../fonts/open-sans-v15-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/open-sans-v15-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}
.entypo { font-family: entypo; }
h1, h2, h3, h4, h5, h6 {
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 800;
line-height: 1.1;
}

View file

@ -12,14 +12,15 @@ a {
padding: 0 2px;
color: #4A4A4A;
text-decoration: none;
background: linear-gradient(to bottom,transparent 0,transparent 85%,#FFC0CB 60%,#FFC0CB 100%);
//background: linear-gradient(to bottom,transparent 0,transparent 85%,#FFC0CB 60%,#FFC0CB 100%);
transition: all 0.15s linear;
}
a:hover {
//color: #fff;
//background-color: #FFC0CB;
background: none;
//background: none;
color: #ff90a3;
}
.header {
@ -115,8 +116,10 @@ a:hover {
blockquote {
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 1.75rem 0 1.75rem 0.4rem;
margin: 1.75rem 0.4rem 1.75rem 0.4rem;
padding: 0 0 0 1.75rem;
border-left-width: 0.3125rem;
border-radius: 0.3125rem 0.1875rem 0.1875rem 0.3125rem;
border-left: #FFC0CB 0.4rem solid;
}
@ -138,8 +141,10 @@ article.post p {
padding-left: 4px;
}
article.post header.post-header div.post-title h2 {
div.post-title h2,
h2.post-title {
margin-bottom: 0;
font-size: 3.5rem;
}
article.post header.post-header div.post-featured-image {