chore: update style
This commit is contained in:
parent
d8cac182fc
commit
9b826fde5f
@ -50,12 +50,12 @@ layout: default
|
|||||||
<!-- Syntax Highlight -->
|
<!-- Syntax Highlight -->
|
||||||
<link
|
<link
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css"
|
href="https://unpkg.com/highlight.js@9.18.1/styles/night-owl.css"
|
||||||
/>
|
/>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
|
<script src="https://unpkg.com/highlight.js@9.18.1/lib/highlight.js"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/languages/go.min.js"></script>
|
<script src="https://unpkg.com/highlight.js@9.18.1/lib/languages/go.js"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/languages/scss.min.js"></script>
|
<script src="https://unpkg.com/highlight.js@9.18.1/lib/languages/scss.js"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/languages/lua.min.js"></script>
|
<script src="https://unpkg.com/highlight.js@9.18.1/lib/languages/lua.js"></script>
|
||||||
<script>
|
<script>
|
||||||
hljs.initHighlightingOnLoad()
|
hljs.initHighlightingOnLoad()
|
||||||
</script>
|
</script>
|
@ -7,14 +7,14 @@ Sometimes you want to interact with a local webserver with https support because
|
|||||||
|
|
||||||
You can easily create a self-signed TLS cert for development purposes with [`mkcert`](https://github.com/FiloSottile/mkcert).
|
You can easily create a self-signed TLS cert for development purposes with [`mkcert`](https://github.com/FiloSottile/mkcert).
|
||||||
|
|
||||||
```shell
|
```bash
|
||||||
brew install mkcert
|
brew install mkcert
|
||||||
mkcert -install # Install the local CA in the OS keychain
|
mkcert -install # Install the local CA in the OS keychain
|
||||||
```
|
```
|
||||||
|
|
||||||
After installing `mkcert` and generating system-wide local CA cert, you can create a certificate for each project.
|
After installing `mkcert` and generating system-wide local CA cert, you can create a certificate for each project.
|
||||||
|
|
||||||
```
|
```bash
|
||||||
cd awesome-website
|
cd awesome-website
|
||||||
mkcert localhost # this will generate ./localhost.pem and ./localhost-key.pem
|
mkcert localhost # this will generate ./localhost.pem and ./localhost-key.pem
|
||||||
npm install -g serve
|
npm install -g serve
|
||||||
|
@ -23,7 +23,7 @@ a.article-list__item__button {
|
|||||||
border: 1px solid #989898;
|
border: 1px solid #989898;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
color: #989898;
|
color: #989898;
|
||||||
font-family: 'Open Sans', sans-serif;
|
font-family: "Open Sans", sans-serif;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
@ -73,7 +73,7 @@ a.article-list__item__button {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.article__title {
|
.article__title {
|
||||||
font-size: 80px;
|
font-size: 70px;
|
||||||
letter-spacing: -0.5px;
|
letter-spacing: -0.5px;
|
||||||
|
|
||||||
@media screen and (max-width: $break-small) {
|
@media screen and (max-width: $break-small) {
|
||||||
@ -87,7 +87,7 @@ a.article-list__item__button {
|
|||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-family: sans-serif;
|
font-family: sans-serif;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 10px;
|
||||||
border: 1px solid #989898;
|
border: 1px solid #989898;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 5px 20px;
|
padding: 5px 20px;
|
||||||
@ -103,7 +103,7 @@ a.article-list__item__button {
|
|||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
line-height: 1.666em;
|
line-height: 1.666em;
|
||||||
margin: 35px 0;
|
margin: 25px 0;
|
||||||
|
|
||||||
@media screen and (max-width: $break-small) {
|
@media screen and (max-width: $break-small) {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
---
|
---
|
||||||
---
|
---
|
||||||
|
|
||||||
@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700');
|
@import url("https://fonts.googleapis.com/css?family=PT+Sans:400,700");
|
||||||
|
|
||||||
$break-small: 500px;
|
$break-small: 500px;
|
||||||
$break-large: 840px;
|
$break-large: 840px;
|
||||||
@ -10,13 +10,13 @@ body {
|
|||||||
width: 900px;
|
width: 900px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 0 20px;
|
padding: 0 20px;
|
||||||
font-family: 'PT Sans', 'Hiragino Sans', 'Hiragino Mincho ProN', serif;
|
font-family: "PT Sans", "Hiragino Sans", "Hiragino Mincho ProN", serif;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
text-rendering: optimizeLegibility;
|
text-rendering: optimizeLegibility;
|
||||||
font-feature-settings: 'kern', 'palt', 'pwid';
|
font-feature-settings: "kern", "palt", "pwid";
|
||||||
-webkit-font-feature-settings: 'kern', 'palt', 'pwid';
|
-webkit-font-feature-settings: "kern", "palt", "pwid";
|
||||||
-moz-font-feature-settings: 'kern', 'palt', 'pwid';
|
-moz-font-feature-settings: "kern", "palt", "pwid";
|
||||||
-moz-font-feature-settings: 'kern=1', 'palt', 'pwid';
|
-moz-font-feature-settings: "kern=1", "palt", "pwid";
|
||||||
|
|
||||||
@media screen and (max-width: $break-large) {
|
@media screen and (max-width: $break-large) {
|
||||||
width: auto;
|
width: auto;
|
||||||
@ -31,13 +31,11 @@ body {
|
|||||||
|
|
||||||
// Highlight.js
|
// Highlight.js
|
||||||
.hljs {
|
.hljs {
|
||||||
border: 1px solid #d7d7d7;
|
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
background-color: #fff;
|
// font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
||||||
font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
|
// font-size: 14px;
|
||||||
font-size: 14px;
|
padding: 12px 18px !important;
|
||||||
padding: 12px 16px;
|
line-height: 1.6em !important;
|
||||||
line-height: 1.8em;
|
|
||||||
}
|
}
|
||||||
code {
|
code {
|
||||||
padding: 0 12px;
|
padding: 0 12px;
|
||||||
@ -76,13 +74,12 @@ hr {
|
|||||||
.header {
|
.header {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
// justify-content: space-between;
|
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
padding: 15px 0;
|
padding: 15px 0;
|
||||||
// border-bottom: 1px solid #efefef;
|
|
||||||
|
|
||||||
@media screen and (max-width: $break-small) {
|
@media screen and (max-width: $break-small) {
|
||||||
|
margin-top: 0px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
@ -141,4 +138,4 @@ hr {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@import './post';
|
@import "./post";
|
||||||
|
Loading…
x
Reference in New Issue
Block a user