feat: typography changes
This commit is contained in:
Ayo Ayco
parent
cf00073e04
commit
53f3c712f3
3 changed files with 126 additions and 56 deletions
|
|
@ -1,60 +1,102 @@
|
|||
<head>
|
||||
<title>{{page.title}} - Web Technologies and Productivity Hacks - {{site.title}}</title>
|
||||
<meta name="description" content="Learn how to use the best and latest web technologies to boost your productivity." />
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>
|
||||
{{page.title}} - Web Technologies and Productivity Hacks - {{site.title}}
|
||||
</title>
|
||||
<meta
|
||||
name="description"
|
||||
content="Learn how to use the best and latest web technologies to boost your productivity."
|
||||
/>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
|
||||
<!-- Schema.org markup for Google+ -->
|
||||
<meta itemprop="name" content="{{ page.title }}" />
|
||||
<meta itemprop="description" content="{{ page.description }}" />
|
||||
<meta itemprop="image" content="{{ '/assets/images/' | absolute_url }}{{ page.image }}.jpg" />
|
||||
<!-- Schema.org markup for Google+ -->
|
||||
<meta itemprop="name" content="{{ page.title }}" />
|
||||
<meta itemprop="description" content="{{ page.description }}" />
|
||||
<meta
|
||||
itemprop="image"
|
||||
content="{{ '/assets/images/' | absolute_url }}{{ page.image }}.jpg"
|
||||
/>
|
||||
|
||||
<!-- Twitter Card data -->
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:site" content="@ayoayco" />
|
||||
<meta name="twitter:title" content="{{ page.title}}" />
|
||||
<meta name="twitter:description" content="{{ page.description }}" />
|
||||
<meta name="twitter:creator" content="@ayoayco_public" />
|
||||
<!-- Twitter summary card with large image must be at least 280x150px -->
|
||||
{% if page.image != '' %}
|
||||
<meta name="twitter:image:src" content="{{ '/assets/images/' | absolute_url }}{{ page.image }}.jpg" />
|
||||
{% else %}
|
||||
<meta name="twitter:image:src" content="{{ '/assets/images/' | absolute_url }}jumbotron.jpg" />
|
||||
{% endif %}
|
||||
<!-- Twitter Card data -->
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:site" content="@ayoayco" />
|
||||
<meta name="twitter:title" content="{{ page.title}}" />
|
||||
<meta name="twitter:description" content="{{ page.description }}" />
|
||||
<meta name="twitter:creator" content="@ayoayco_public" />
|
||||
<!-- Twitter summary card with large image must be at least 280x150px -->
|
||||
{% if page.image != '' %}
|
||||
<meta
|
||||
name="twitter:image:src"
|
||||
content="{{ '/assets/images/' | absolute_url }}{{ page.image }}.jpg"
|
||||
/>
|
||||
{% else %}
|
||||
<meta
|
||||
name="twitter:image:src"
|
||||
content="{{ '/assets/images/' | absolute_url }}jumbotron.jpg"
|
||||
/>
|
||||
{% endif %}
|
||||
|
||||
<!-- Open Graph data -->
|
||||
<meta property="og:title" content="{{ page.title }}" />
|
||||
{% if page.type == "post" %}
|
||||
<meta property="og:type" content="article" />{% else %}<meta property="og:type" content="website" />{% endif %}
|
||||
<meta property="og:url" content="{{ page.url | absolute_url }}" />
|
||||
{% if page.image != '' %}
|
||||
<meta property="og:image" content="{{ '/assets/images/' | absolute_url }}{{ page.image }}.jpg" />
|
||||
{% else %}
|
||||
<meta property="og:image" content="{{ '/assets/images/' | absolute_url }}jumbotron.jpg" />
|
||||
{% endif %}
|
||||
<meta property="og:image:alt" content="{{ page.description }}" />
|
||||
<meta property="og:description" content="{{ page.description }}" />
|
||||
<meta property="og:site_name" content="Ayos Blog" />
|
||||
<meta property="fb:admins" content="748355687" />
|
||||
<!--meta property="article:published_time" content="2013-09-17T05:59:00+01:00" />
|
||||
<!-- Open Graph data -->
|
||||
<meta property="og:title" content="{{ page.title }}" />
|
||||
{% if page.type == "post" %}
|
||||
<meta property="og:type" content="article" />
|
||||
{% else %}
|
||||
<meta property="og:type" content="website" />
|
||||
{% endif %}
|
||||
<meta property="og:url" content="{{ page.url | absolute_url }}" />
|
||||
{% if page.image != '' %}
|
||||
<meta
|
||||
property="og:image"
|
||||
content="{{ '/assets/images/' | absolute_url }}{{ page.image }}.jpg"
|
||||
/>
|
||||
{% else %}
|
||||
<meta
|
||||
property="og:image"
|
||||
content="{{ '/assets/images/' | absolute_url }}jumbotron.jpg"
|
||||
/>
|
||||
{% endif %}
|
||||
<meta property="og:image:alt" content="{{ page.description }}" />
|
||||
<meta property="og:description" content="{{ page.description }}" />
|
||||
<meta property="og:site_name" content="Ayos Blog" />
|
||||
<meta property="fb:admins" content="748355687" />
|
||||
<!--meta property="article:published_time" content="2013-09-17T05:59:00+01:00" />
|
||||
<meta property="article:modified_time" content="2013-09-16T19:08:47+01:00" />
|
||||
<meta property="article:section" content="Article Section" />
|
||||
<meta property="article:tag" content="Article Tag" /-->
|
||||
|
||||
{% if jekyll.environment == 'production' and site.google_analytics %}
|
||||
{% include google-analytics.html %}
|
||||
{% endif %}
|
||||
{% if jekyll.environment == 'production' and site.google_analytics %} {%
|
||||
include google-analytics.html %} {% endif %}
|
||||
|
||||
<link rel="stylesheet" href="{{ '/assets/main.css' | relative_url }}">
|
||||
<link rel="alternate" type="application/rss+xml" title="{{ site.title | escape }}" href="{{ '/feed.xml' | relative_url }}">
|
||||
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Lato" />
|
||||
<link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css">
|
||||
<link rel="shortcut icon" type="image/png" href="/favicon.ico">
|
||||
<link rel="stylesheet" href="{{ '/assets/main.css' | relative_url }}" />
|
||||
<link
|
||||
rel="alternate"
|
||||
type="application/rss+xml"
|
||||
title="{{ site.title | escape }}"
|
||||
href="{{ '/feed.xml' | relative_url }}"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
href="//fonts.googleapis.com/css?family=Lato"
|
||||
/>
|
||||
<link
|
||||
href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css"
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
/>
|
||||
<link rel="shortcut icon" type="image/png" href="/favicon.ico" />
|
||||
|
||||
<script
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Source+Serif+Pro:wght@900&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.2.1.min.js"
|
||||
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -40,7 +40,9 @@ Because of this, I had to stop doing some things I "loved".
|
|||
|
||||
For instance, I deactivated my Facebook for a time, and playing computer games had to be at a minimum.
|
||||
|
||||
> “The only people who achieve much are those who want knowledge so badly that they seek it while the conditions are still unfavorable. Favorable conditions never come.” C.S. Lewis
|
||||
> The only people who achieve much are those who want knowledge so badly that they seek it while the conditions are still unfavorable. Favorable conditions never come.
|
||||
>
|
||||
> C.S. Lewis
|
||||
|
||||
## Next Goal: Find Others
|
||||
|
||||
|
|
@ -56,4 +58,6 @@ The only qualification of sorts is that you are currently reading a book.
|
|||
|
||||
If you think this is something that interests you too, or if you simply want more details about it, please reach out to me on Twitter: [@ayoayco](https://twitter.com/ayoayco) or send me an email: [ramon.aycojr+reading@gmail.com](mailto:ramon.aycojr+reading@gmail.com)
|
||||
|
||||
> "the most famous example is The Inklings, a group started in the 1930s by a handful of friends living in Oxford, England (the two most famous being C. S. Lewis and J. R. R. Tolkien). They gathered to read selections from their own works and then to discuss them. The Inklings model is pretty simple: bring what occupies your mind and read it aloud. Stimulating the minds of others and generating conversation makes it possible to learn from one another." Tony Reinke, Lit!
|
||||
> ...the most famous example is The Inklings, a group started in the 1930s by a handful of friends living in Oxford, England (the two most famous being C. S. Lewis and J. R. R. Tolkien). They gathered to read selections from their own works and then to discuss them. The Inklings model is pretty simple: bring what occupies your mind and read it aloud. Stimulating the minds of others and generating conversation makes it possible to learn from one another.
|
||||
>
|
||||
> Tony Reinke, Lit!
|
||||
|
|
|
|||
|
|
@ -534,13 +534,12 @@ table.image caption {
|
|||
&__title {
|
||||
--x-height-multiplier: 0.342;
|
||||
--baseline-multiplier: 0.22;
|
||||
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva,
|
||||
Arial, sans-serif;
|
||||
font-family: "Source Serif Pro", serif;
|
||||
letter-spacing: -0.02em;
|
||||
font-weight: 700;
|
||||
font-weight: 900;
|
||||
font-style: normal;
|
||||
letter-spacing: 0;
|
||||
font-size: 36px;
|
||||
font-size: 56px;
|
||||
margin: 10px 0 10px -2.63px;
|
||||
line-height: 1.04;
|
||||
letter-spacing: -0.015em;
|
||||
|
|
@ -576,6 +575,7 @@ table.image caption {
|
|||
font-weight: bold;
|
||||
}
|
||||
p:first-of-type::first-letter {
|
||||
font-weight: 900;
|
||||
font-size: 75px;
|
||||
line-height: 60px;
|
||||
float: left;
|
||||
|
|
@ -586,14 +586,37 @@ table.image caption {
|
|||
margin-top: 21px;
|
||||
}
|
||||
|
||||
blockquote:before {
|
||||
content: "\201C";
|
||||
font-size: 75px;
|
||||
line-height: 30px;
|
||||
float: left;
|
||||
padding: 0px 10px 0 3px;
|
||||
margin-left: -15px;
|
||||
color: #ccc;
|
||||
font-family: medium-content-serif-font, Georgia, Cambria,
|
||||
"Times New Roman", Times, serif;
|
||||
}
|
||||
|
||||
blockquote p:first-of-type::first-letter {
|
||||
color: #555 !important;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
blockquote p {
|
||||
color: #555;
|
||||
}
|
||||
|
||||
p,
|
||||
ul li,
|
||||
ol li {
|
||||
ol li,
|
||||
blockquote p:first-of-type::first-letter {
|
||||
--x-height-multiplier: 0.375;
|
||||
--baseline-multiplier: 0.17;
|
||||
font-family: medium-content-serif-font, Georgia, Cambria,
|
||||
"Times New Roman", Times, serif;
|
||||
letter-spacing: 0.01rem;
|
||||
color: #333;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 21px;
|
||||
|
|
@ -620,10 +643,11 @@ table.image caption {
|
|||
margin-bottom: 15px;
|
||||
&__title {
|
||||
margin: 10px 0;
|
||||
font-family: "Source Serif Pro", serif;
|
||||
font-weight: 900;
|
||||
font-size: 36px;
|
||||
a {
|
||||
color: #222 !important;
|
||||
font-weight: bold;
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
|
|
|
|||
Loading…
Reference in a new issue