mirror of
https://github.com/yangbvv/yangbvv.github.io.git
synced 2025-12-16 23:11:02 +08:00
Add files via upload
This commit is contained in:
yangbvv
7
_posts/2016-05-19-super-short-article.md
Normal file
7
_posts/2016-05-19-super-short-article.md
Normal file
@@ -0,0 +1,7 @@
|
||||
---
|
||||
layout: post
|
||||
title: "Some articles are just so short that we have to make the footer stick"
|
||||
categories: misc
|
||||
---
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
12
_posts/2016-05-20-my-example-post.md
Normal file
12
_posts/2016-05-20-my-example-post.md
Normal file
@@ -0,0 +1,12 @@
|
||||
---
|
||||
layout: post
|
||||
---
|
||||
|
||||
Eos eu docendi tractatos sapientem, brute option menandri in vix, quando vivendo accommodare te ius. Nec melius fastidii constituam id, viderer theophrastus ad sit, hinc semper periculis cum id. Noluisse postulant assentior est in, no choro sadipscing repudiandae vix. Vis in euismod delenit dignissim. Ex quod nostrum sit, suas decore animal id ius, nobis solet detracto quo te.
|
||||
|
||||
{% comment %}
|
||||
Might you have an include in your theme? Why not try it here!
|
||||
{% include my-themes-great-include.html %}
|
||||
{% endcomment %}
|
||||
|
||||
No laudem altera adolescens has, volumus lucilius eum no. Eam ei nulla audiam efficiantur. Suas affert per no, ei tale nibh sea. Sea ne magna harum, in denique scriptorem sea, cetero alienum tibique ei eos. Labores persequeris referrentur eos ei.
|
||||
11
_posts/2016-05-20-super-long-article.md
Normal file
11
_posts/2016-05-20-super-long-article.md
Normal file
@@ -0,0 +1,11 @@
|
||||
---
|
||||
layout: post
|
||||
title: "Some articles are just so long they deserve a really long title to see if things will break well"
|
||||
categories: misc
|
||||
---
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce bibendum neque eget nunc mattis eu sollicitudin enim tincidunt. Vestibulum lacus tortor, ultricies id dignissim ac, bibendum in velit. Proin convallis mi ac felis pharetra aliquam. Curabitur dignissim accumsan rutrum. In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris. Proin eget nibh a massa vestibulum pretium. Suspendisse eu nisl a ante aliquet bibendum quis a nunc. Praesent varius interdum vehicula. Aenean risus libero, placerat at vestibulum eget, ultricies eu enim. Praesent nulla tortor, malesuada adipiscing adipiscing sollicitudin, adipiscing eget est.
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce bibendum neque eget nunc mattis eu sollicitudin enim tincidunt. Vestibulum lacus tortor, ultricies id dignissim ac, bibendum in velit. Proin convallis mi ac felis pharetra aliquam. Curabitur dignissim accumsan rutrum. In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris. Proin eget nibh a massa vestibulum pretium. Suspendisse eu nisl a ante aliquet bibendum quis a nunc. Praesent varius interdum vehicula. Aenean risus libero, placerat at vestibulum eget, ultricies eu enim. Praesent nulla tortor, malesuada adipiscing adipiscing sollicitudin, adipiscing eget est.
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce bibendum neque eget nunc mattis eu sollicitudin enim tincidunt. Vestibulum lacus tortor, ultricies id dignissim ac, bibendum in velit. Proin convallis mi ac felis pharetra aliquam. Curabitur dignissim accumsan rutrum. In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris. Proin eget nibh a massa vestibulum pretium. Suspendisse eu nisl a ante aliquet bibendum quis a nunc. Praesent varius interdum vehicula. Aenean risus libero, placerat at vestibulum eget, ultricies eu enim. Praesent nulla tortor, malesuada adipiscing adipiscing sollicitudin, adipiscing eget est.
|
||||
115
_posts/2016-05-20-this-post-demonstrates-post-content-styles.md
Normal file
115
_posts/2016-05-20-this-post-demonstrates-post-content-styles.md
Normal file
@@ -0,0 +1,115 @@
|
||||
---
|
||||
layout: post
|
||||
title: "This post demonstrates post content styles"
|
||||
categories: junk
|
||||
author:
|
||||
- Bart Simpson
|
||||
- Nelson Mandela Muntz
|
||||
meta: "Springfield"
|
||||
---
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce bibendum neque eget nunc mattis eu sollicitudin enim tincidunt. Vestibulum lacus tortor, ultricies id dignissim ac, bibendum in velit.
|
||||
|
||||
## Some great heading (h2)
|
||||
|
||||
Proin convallis mi ac felis pharetra aliquam. Curabitur dignissim accumsan rutrum. In arcu magna, aliquet vel pretium et, molestie et arcu.
|
||||
|
||||
Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris. Proin eget nibh a massa vestibulum pretium. Suspendisse eu nisl a ante aliquet bibendum quis a nunc. Praesent varius interdum vehicula. Aenean risus libero, placerat at vestibulum eget, ultricies eu enim. Praesent nulla tortor, malesuada adipiscing adipiscing sollicitudin, adipiscing eget est.
|
||||
|
||||
## Another great heading (h2)
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce bibendum neque eget nunc mattis eu sollicitudin enim tincidunt. Vestibulum lacus tortor, ultricies id dignissim ac, bibendum in velit.
|
||||
|
||||
### Some great subheading (h3)
|
||||
|
||||
Proin convallis mi ac felis pharetra aliquam. Curabitur dignissim accumsan rutrum. In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum.
|
||||
|
||||
Phasellus et hendrerit mauris. Proin eget nibh a massa vestibulum pretium. Suspendisse eu nisl a ante aliquet bibendum quis a nunc.
|
||||
|
||||
### Some great subheading (h3)
|
||||
|
||||
Praesent varius interdum vehicula. Aenean risus libero, placerat at vestibulum eget, ultricies eu enim. Praesent nulla tortor, malesuada adipiscing adipiscing sollicitudin, adipiscing eget est.
|
||||
|
||||
> This quote will *change* your life. It will reveal the <i>secrets</i> of the universe, and all the wonders of humanity. Don't <em>misuse</em> it.
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce bibendum neque eget nunc mattis eu sollicitudin enim tincidunt.
|
||||
|
||||
### Some great subheading (h3)
|
||||
|
||||
Vestibulum lacus tortor, ultricies id dignissim ac, bibendum in velit. Proin convallis mi ac felis pharetra aliquam. Curabitur dignissim accumsan rutrum.
|
||||
|
||||
```html
|
||||
<html>
|
||||
<head>
|
||||
</head>
|
||||
<body>
|
||||
<p>Hello, World!</p>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
|
||||
In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris.
|
||||
|
||||
#### You might want a sub-subheading (h4)
|
||||
|
||||
In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris.
|
||||
|
||||
In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris.
|
||||
|
||||
#### But it's probably overkill (h4)
|
||||
|
||||
In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris.
|
||||
|
||||
##### Could be a smaller sub-heading, `pacman` (h5)
|
||||
|
||||
In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris.
|
||||
|
||||
###### Small yet significant sub-heading (h6)
|
||||
|
||||
In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris.
|
||||
|
||||
### Oh hai, an unordered list!!
|
||||
|
||||
In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris.
|
||||
|
||||
- First item, yo
|
||||
- Second item, dawg
|
||||
- Third item, what what?!
|
||||
- Fourth item, fo sheezy my neezy
|
||||
|
||||
### Oh hai, an ordered list!!
|
||||
|
||||
In arcu magna, aliquet vel pretium et, molestie et arcu. Mauris lobortis nulla et felis ullamcorper bibendum. Phasellus et hendrerit mauris.
|
||||
|
||||
1. First item, yo
|
||||
2. Second item, dawg
|
||||
3. Third item, what what?!
|
||||
4. Fourth item, fo sheezy my neezy
|
||||
|
||||
|
||||
|
||||
## Headings are cool! (h2)
|
||||
|
||||
Proin eget nibh a massa vestibulum pretium. Suspendisse eu nisl a ante aliquet bibendum quis a nunc. Praesent varius interdum vehicula. Aenean risus libero, placerat at vestibulum eget, ultricies eu enim. Praesent nulla tortor, malesuada adipiscing adipiscing sollicitudin, adipiscing eget est.
|
||||
|
||||
Praesent nulla tortor, malesuada adipiscing adipiscing sollicitudin, adipiscing eget est.
|
||||
|
||||
Proin eget nibh a massa vestibulum pretium. Suspendisse eu nisl a ante aliquet bibendum quis a nunc.
|
||||
|
||||
### Tables
|
||||
|
||||
Title 1 | Title 2 | Title 3 | Title 4
|
||||
--------------------- | --------------------- | --------------------- | ---------------------
|
||||
lorem | lorem ipsum | lorem ipsum dolor | lorem ipsum dolor sit
|
||||
lorem ipsum dolor sit | lorem ipsum dolor sit | lorem ipsum dolor sit | lorem ipsum dolor sit
|
||||
lorem ipsum dolor sit | lorem ipsum dolor sit | lorem ipsum dolor sit | lorem ipsum dolor sit
|
||||
lorem ipsum dolor sit | lorem ipsum dolor sit | lorem ipsum dolor sit | lorem ipsum dolor sit
|
||||
|
||||
|
||||
Title 1 | Title 2 | Title 3 | Title 4
|
||||
--- | --- | --- | ---
|
||||
lorem | lorem ipsum | lorem ipsum dolor | lorem ipsum dolor sit
|
||||
lorem ipsum dolor sit amet | lorem ipsum dolor sit amet consectetur | lorem ipsum dolor sit amet | lorem ipsum dolor sit
|
||||
lorem ipsum dolor | lorem ipsum | lorem | lorem ipsum
|
||||
lorem ipsum dolor | lorem ipsum dolor sit | lorem ipsum dolor sit amet | lorem ipsum dolor sit amet consectetur
|
||||
22
_posts/2016-05-20-welcome-to-jekyll.md
Normal file
22
_posts/2016-05-20-welcome-to-jekyll.md
Normal file
@@ -0,0 +1,22 @@
|
||||
---
|
||||
layout: post
|
||||
---
|
||||
You’ll find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `jekyll serve`, which launches a web server and auto-regenerates your site when a file is updated.
|
||||
|
||||
To add new posts, simply add a file in the `_posts` directory that follows the convention `YYYY-MM-DD-name-of-post.ext` and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.
|
||||
|
||||
Jekyll also offers powerful support for code snippets:
|
||||
|
||||
{% highlight ruby %}
|
||||
def print_hi(name)
|
||||
puts "Hi, #{name}"
|
||||
end
|
||||
print_hi('Tom')
|
||||
#=> prints 'Hi, Tom' to STDOUT.
|
||||
{% endhighlight %}
|
||||
|
||||
Check out the [Jekyll docs][jekyll-docs] for more info on how to get the most out of Jekyll. File all bugs/feature requests at [Jekyll’s GitHub repo][jekyll-gh]. If you have questions, you can ask them on [Jekyll Talk][jekyll-talk].
|
||||
|
||||
[jekyll-docs]: http://jekyllrb.com/docs/home
|
||||
[jekyll-gh]: https://github.com/jekyll/jekyll
|
||||
[jekyll-talk]: https://talk.jekyllrb.com/
|
||||
281
_sass/minima/_base.scss
Normal file
281
_sass/minima/_base.scss
Normal file
@@ -0,0 +1,281 @@
|
||||
html {
|
||||
font-size: $base-font-size;
|
||||
}
|
||||
|
||||
/**
|
||||
* Reset some basic elements
|
||||
*/
|
||||
body, h1, h2, h3, h4, h5, h6,
|
||||
p, blockquote, pre, hr,
|
||||
dl, dd, ol, ul, figure {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Basic styling
|
||||
*/
|
||||
body {
|
||||
font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family;
|
||||
color: $text-color;
|
||||
background-color: $background-color;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-webkit-font-feature-settings: "kern" 1;
|
||||
-moz-font-feature-settings: "kern" 1;
|
||||
-o-font-feature-settings: "kern" 1;
|
||||
font-feature-settings: "kern" 1;
|
||||
font-kerning: normal;
|
||||
display: flex;
|
||||
min-height: 100vh;
|
||||
flex-direction: column;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Set `margin-bottom` to maintain vertical rhythm
|
||||
*/
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
p, blockquote, pre,
|
||||
ul, ol, dl, figure,
|
||||
%vertical-rhythm {
|
||||
margin-bottom: $spacing-unit / 2;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin-top: $spacing-unit;
|
||||
margin-bottom: $spacing-unit;
|
||||
}
|
||||
|
||||
/**
|
||||
* `main` element
|
||||
*/
|
||||
main {
|
||||
display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Images
|
||||
*/
|
||||
img {
|
||||
max-width: 100%;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Figures
|
||||
*/
|
||||
figure > img {
|
||||
display: block;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
font-size: $small-font-size;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Lists
|
||||
*/
|
||||
ul, ol {
|
||||
margin-left: $spacing-unit;
|
||||
}
|
||||
|
||||
li {
|
||||
> ul,
|
||||
> ol {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Headings
|
||||
*/
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: $base-font-weight;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Links
|
||||
*/
|
||||
a {
|
||||
color: $link-base-color;
|
||||
text-decoration: none;
|
||||
|
||||
&:visited {
|
||||
color: $link-visited-color;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $link-hover-color;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.social-media-list &:hover {
|
||||
text-decoration: none;
|
||||
|
||||
.username {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Blockquotes
|
||||
*/
|
||||
blockquote {
|
||||
color: $brand-color;
|
||||
border-left: 4px solid $border-color-01;
|
||||
padding-left: $spacing-unit / 2;
|
||||
@include relative-font-size(1.125);
|
||||
font-style: italic;
|
||||
|
||||
> :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
i, em {
|
||||
font-style: normal;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Code formatting
|
||||
*/
|
||||
pre,
|
||||
code {
|
||||
font-family: $code-font-family;
|
||||
font-size: 0.9375em;
|
||||
border: 1px solid $border-color-01;
|
||||
border-radius: 3px;
|
||||
background-color: $code-background-color;
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 1px 5px;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: 8px 12px;
|
||||
overflow-x: auto;
|
||||
|
||||
> code {
|
||||
border: 0;
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.highlight {
|
||||
border-radius: 3px;
|
||||
background: $code-background-color;
|
||||
@extend %vertical-rhythm;
|
||||
|
||||
.highlighter-rouge & {
|
||||
background: $code-background-color;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Wrapper
|
||||
*/
|
||||
.wrapper {
|
||||
max-width: calc(#{$content-width} - (#{$spacing-unit}));
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding-right: $spacing-unit / 2;
|
||||
padding-left: $spacing-unit / 2;
|
||||
@extend %clearfix;
|
||||
|
||||
@media screen and (min-width: $on-large) {
|
||||
max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
|
||||
padding-right: $spacing-unit;
|
||||
padding-left: $spacing-unit;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Clearfix
|
||||
*/
|
||||
%clearfix:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Icons
|
||||
*/
|
||||
|
||||
.orange {
|
||||
color: #f66a0a;
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: #828282;
|
||||
}
|
||||
|
||||
.svg-icon {
|
||||
width: 1.25em;
|
||||
height: 1.25em;
|
||||
display: inline-block;
|
||||
fill: currentColor;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Tables
|
||||
*/
|
||||
table {
|
||||
margin-bottom: $spacing-unit;
|
||||
width: 100%;
|
||||
text-align: $table-text-align;
|
||||
color: $table-text-color;
|
||||
border-collapse: collapse;
|
||||
border: 1px solid $table-border-color;
|
||||
tr {
|
||||
&:nth-child(even) {
|
||||
background-color: $table-zebra-color;
|
||||
}
|
||||
}
|
||||
th, td {
|
||||
padding: ($spacing-unit / 3) ($spacing-unit / 2);
|
||||
}
|
||||
th {
|
||||
background-color: $table-header-bg-color;
|
||||
border: 1px solid $table-header-border;
|
||||
}
|
||||
td {
|
||||
border: 1px solid $table-border-color;
|
||||
}
|
||||
|
||||
@include media-query($on-laptop) {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
-ms-overflow-style: -ms-autohiding-scrollbar;
|
||||
}
|
||||
}
|
||||
341
_sass/minima/_layout.scss
Normal file
341
_sass/minima/_layout.scss
Normal file
@@ -0,0 +1,341 @@
|
||||
/**
|
||||
* Site header
|
||||
*/
|
||||
.site-header {
|
||||
border-top: 5px solid $border-color-03;
|
||||
border-bottom: 1px solid $border-color-01;
|
||||
min-height: $spacing-unit * 1.865;
|
||||
line-height: $base-line-height * $base-font-size * 2.25;
|
||||
|
||||
// Positioning context for the mobile navigation icon
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.site-title {
|
||||
@include relative-font-size(1.625);
|
||||
font-weight: 300;
|
||||
letter-spacing: -1px;
|
||||
margin-bottom: 0;
|
||||
float: left;
|
||||
|
||||
@include media-query($on-palm) {
|
||||
padding-right: 45px;
|
||||
}
|
||||
|
||||
&,
|
||||
&:visited {
|
||||
color: $site-title-color;
|
||||
}
|
||||
}
|
||||
|
||||
.site-nav {
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
right: $spacing-unit / 2;
|
||||
background-color: $background-color;
|
||||
border: 1px solid $border-color-01;
|
||||
border-radius: 5px;
|
||||
text-align: right;
|
||||
|
||||
.nav-trigger {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
float: right;
|
||||
width: 36px;
|
||||
height: 26px;
|
||||
line-height: 0;
|
||||
padding-top: 10px;
|
||||
text-align: center;
|
||||
|
||||
> svg path {
|
||||
fill: $border-color-03;
|
||||
}
|
||||
}
|
||||
|
||||
label[for="nav-trigger"] {
|
||||
display: block;
|
||||
float: right;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
z-index: 2;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input ~ .trigger {
|
||||
clear: both;
|
||||
display: none;
|
||||
}
|
||||
|
||||
input:checked ~ .trigger {
|
||||
display: block;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.page-link {
|
||||
color: $text-color;
|
||||
line-height: $base-line-height;
|
||||
display: block;
|
||||
padding: 5px 10px;
|
||||
|
||||
// Gaps between nav items, but not on the last one
|
||||
&:not(:last-child) {
|
||||
margin-right: 0;
|
||||
}
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: $on-medium) {
|
||||
position: static;
|
||||
float: right;
|
||||
border: none;
|
||||
background-color: inherit;
|
||||
|
||||
label[for="nav-trigger"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
input ~ .trigger {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.page-link {
|
||||
display: inline;
|
||||
padding: 0;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: 20px;
|
||||
}
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Site footer
|
||||
*/
|
||||
.site-footer {
|
||||
border-top: 1px solid $border-color-01;
|
||||
padding: $spacing-unit 0;
|
||||
}
|
||||
|
||||
.footer-heading {
|
||||
@include relative-font-size(1.125);
|
||||
margin-bottom: $spacing-unit / 2;
|
||||
}
|
||||
|
||||
.feed-subscribe .svg-icon {
|
||||
padding: 5px 5px 2px 0
|
||||
}
|
||||
|
||||
.contact-list,
|
||||
.social-media-list {
|
||||
list-style: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.footer-col-wrapper,
|
||||
.social-links {
|
||||
@include relative-font-size(0.9375);
|
||||
color: $brand-color;
|
||||
}
|
||||
|
||||
.footer-col {
|
||||
margin-bottom: $spacing-unit / 2;
|
||||
}
|
||||
|
||||
.footer-col-1,
|
||||
.footer-col-2 {
|
||||
width: calc(50% - (#{$spacing-unit} / 2));
|
||||
}
|
||||
|
||||
.footer-col-3 {
|
||||
width: calc(100% - (#{$spacing-unit} / 2));
|
||||
}
|
||||
|
||||
@media screen and (min-width: $on-large) {
|
||||
.footer-col-1 {
|
||||
width: calc(35% - (#{$spacing-unit} / 2));
|
||||
}
|
||||
|
||||
.footer-col-2 {
|
||||
width: calc(20% - (#{$spacing-unit} / 2));
|
||||
}
|
||||
|
||||
.footer-col-3 {
|
||||
width: calc(45% - (#{$spacing-unit} / 2));
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: $on-medium) {
|
||||
.footer-col-wrapper {
|
||||
display: flex
|
||||
}
|
||||
|
||||
.footer-col {
|
||||
width: calc(100% - (#{$spacing-unit} / 2));
|
||||
padding: 0 ($spacing-unit / 2);
|
||||
|
||||
&:first-child {
|
||||
padding-right: $spacing-unit / 2;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-right: 0;
|
||||
padding-left: $spacing-unit / 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Page content
|
||||
*/
|
||||
.page-content {
|
||||
padding: $spacing-unit 0;
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
|
||||
.page-heading {
|
||||
@include relative-font-size(2);
|
||||
}
|
||||
|
||||
.post-list-heading {
|
||||
@include relative-font-size(1.75);
|
||||
}
|
||||
|
||||
.post-list {
|
||||
margin-left: 0;
|
||||
list-style: none;
|
||||
|
||||
> li {
|
||||
margin-bottom: $spacing-unit;
|
||||
}
|
||||
}
|
||||
|
||||
.post-meta {
|
||||
font-size: $small-font-size;
|
||||
color: $brand-color;
|
||||
}
|
||||
|
||||
.post-link {
|
||||
display: block;
|
||||
@include relative-font-size(1.5);
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Posts
|
||||
*/
|
||||
.post-header {
|
||||
margin-bottom: $spacing-unit;
|
||||
}
|
||||
|
||||
.post-title,
|
||||
.post-content h1 {
|
||||
@include relative-font-size(2.625);
|
||||
letter-spacing: -1px;
|
||||
line-height: 1.15;
|
||||
|
||||
@media screen and (min-width: $on-large) {
|
||||
@include relative-font-size(2.625);
|
||||
}
|
||||
}
|
||||
|
||||
.post-content {
|
||||
margin-bottom: $spacing-unit;
|
||||
|
||||
h1, h2, h3, h4, h5, h6 { margin-top: $spacing-unit }
|
||||
|
||||
h2 {
|
||||
@include relative-font-size(1.75);
|
||||
|
||||
@media screen and (min-width: $on-large) {
|
||||
@include relative-font-size(2);
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
@include relative-font-size(1.375);
|
||||
|
||||
@media screen and (min-width: $on-large) {
|
||||
@include relative-font-size(1.625);
|
||||
}
|
||||
}
|
||||
|
||||
h4 {
|
||||
@include relative-font-size(1.25);
|
||||
}
|
||||
|
||||
h5 {
|
||||
@include relative-font-size(1.125);
|
||||
}
|
||||
h6 {
|
||||
@include relative-font-size(1.0625);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.social-media-list {
|
||||
display: table;
|
||||
margin: 0 auto;
|
||||
li {
|
||||
float: left;
|
||||
margin: 5px 10px 5px 0;
|
||||
&:last-of-type { margin-right: 0 }
|
||||
a {
|
||||
display: block;
|
||||
padding: 10px 12px;
|
||||
border: 1px solid $border-color-01;
|
||||
&:hover { border-color: $border-color-02 }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Pagination navbar
|
||||
*/
|
||||
.pagination {
|
||||
margin-bottom: $spacing-unit;
|
||||
@extend .social-media-list;
|
||||
li {
|
||||
a, div {
|
||||
min-width: 41px;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
div {
|
||||
display: block;
|
||||
padding: $spacing-unit / 4;
|
||||
border: 1px solid transparent;
|
||||
|
||||
&.pager-edge {
|
||||
color: $border-color-01;
|
||||
border: 1px dashed;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Grid helpers
|
||||
*/
|
||||
@media screen and (min-width: $on-large) {
|
||||
.one-half {
|
||||
width: calc(50% - (#{$spacing-unit} / 2));
|
||||
}
|
||||
}
|
||||
2
_sass/minima/custom-styles.scss
Normal file
2
_sass/minima/custom-styles.scss
Normal file
@@ -0,0 +1,2 @@
|
||||
// Placeholder to allow defining custom styles that override everything else.
|
||||
// (Use `_sass/minima/custom-variables.scss` to override variable defaults)
|
||||
1
_sass/minima/custom-variables.scss
Normal file
1
_sass/minima/custom-variables.scss
Normal file
@@ -0,0 +1 @@
|
||||
// Placeholder to allow overriding predefined variables smoothly.
|
||||
50
_sass/minima/initialize.scss
Normal file
50
_sass/minima/initialize.scss
Normal file
@@ -0,0 +1,50 @@
|
||||
@charset "utf-8";
|
||||
|
||||
// Define defaults for each variable.
|
||||
|
||||
$base-font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", Roboto, Helvetica, Arial, sans-serif !default;
|
||||
$code-font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono", "Ubuntu Mono", "Liberation Mono", "Courier New", monospace;
|
||||
$base-font-size: 16px !default;
|
||||
$base-font-weight: 400 !default;
|
||||
$small-font-size: $base-font-size * 0.875 !default;
|
||||
$base-line-height: 1.5 !default;
|
||||
|
||||
$spacing-unit: 30px !default;
|
||||
|
||||
$table-text-align: left !default;
|
||||
|
||||
// Width of the content area
|
||||
$content-width: 800px !default;
|
||||
|
||||
$on-palm: 600px !default;
|
||||
$on-laptop: 800px !default;
|
||||
|
||||
$on-medium: $on-palm !default;
|
||||
$on-large: $on-laptop !default;
|
||||
|
||||
// Use media queries like this:
|
||||
// @include media-query($on-palm) {
|
||||
// .wrapper {
|
||||
// padding-right: $spacing-unit / 2;
|
||||
// padding-left: $spacing-unit / 2;
|
||||
// }
|
||||
// }
|
||||
// Notice the following mixin uses max-width, in a deprecated, desktop-first
|
||||
// approach, whereas media queries used elsewhere now use min-width.
|
||||
@mixin media-query($device) {
|
||||
@media screen and (max-width: $device) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin relative-font-size($ratio) {
|
||||
font-size: #{$ratio}rem;
|
||||
}
|
||||
|
||||
// Import pre-styling-overrides hook and style-partials.
|
||||
@import
|
||||
"minima/custom-variables", // Hook to override predefined variables.
|
||||
"minima/base", // Defines element resets.
|
||||
"minima/layout", // Defines structure and style based on CSS selectors.
|
||||
"minima/custom-styles" // Hook to override existing styles.
|
||||
;
|
||||
361
_sass/minima/skins/auto.scss
Normal file
361
_sass/minima/skins/auto.scss
Normal file
@@ -0,0 +1,361 @@
|
||||
@charset "utf-8";
|
||||
|
||||
// Default color scheme settings
|
||||
// These are overridden in classic.css and dark.scss
|
||||
|
||||
$color-scheme-auto: true !default;
|
||||
$color-scheme-dark: false !default;
|
||||
|
||||
|
||||
// Light mode
|
||||
// ----------
|
||||
|
||||
$lm-brand-color: #828282 !default;
|
||||
$lm-brand-color-light: lighten($lm-brand-color, 40%) !default;
|
||||
$lm-brand-color-dark: darken($lm-brand-color, 25%) !default;
|
||||
|
||||
$lm-site-title-color: $lm-brand-color-dark !default;
|
||||
|
||||
$lm-text-color: #111111 !default;
|
||||
$lm-background-color: #fdfdfd !default;
|
||||
$lm-code-background-color: #eeeeff !default;
|
||||
|
||||
$lm-link-base-color: #2a7ae2 !default;
|
||||
$lm-link-visited-color: darken($lm-link-base-color, 15%) !default;
|
||||
$lm-link-hover-color: $lm-text-color !default;
|
||||
|
||||
$lm-border-color-01: $lm-brand-color-light !default;
|
||||
$lm-border-color-02: lighten($lm-brand-color, 35%) !default;
|
||||
$lm-border-color-03: $lm-brand-color-dark !default;
|
||||
|
||||
$lm-table-text-color: lighten($lm-text-color, 18%) !default;
|
||||
$lm-table-zebra-color: lighten($lm-brand-color, 46%) !default;
|
||||
$lm-table-header-bg-color: lighten($lm-brand-color, 43%) !default;
|
||||
$lm-table-header-border: lighten($lm-brand-color, 37%) !default;
|
||||
$lm-table-border-color: $lm-border-color-01 !default;
|
||||
|
||||
|
||||
// Syntax highlighting styles should be adjusted appropriately for every "skin"
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
@mixin lm-highlight {
|
||||
.highlight {
|
||||
.c { color: #998; font-style: italic } // Comment
|
||||
.err { color: #a61717; background-color: #e3d2d2 } // Error
|
||||
.k { font-weight: bold } // Keyword
|
||||
.o { font-weight: bold } // Operator
|
||||
.cm { color: #998; font-style: italic } // Comment.Multiline
|
||||
.cp { color: #999; font-weight: bold } // Comment.Preproc
|
||||
.c1 { color: #998; font-style: italic } // Comment.Single
|
||||
.cs { color: #999; font-weight: bold; font-style: italic } // Comment.Special
|
||||
.gd { color: #000; background-color: #fdd } // Generic.Deleted
|
||||
.gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific
|
||||
.ge { font-style: italic } // Generic.Emph
|
||||
.gr { color: #a00 } // Generic.Error
|
||||
.gh { color: #999 } // Generic.Heading
|
||||
.gi { color: #000; background-color: #dfd } // Generic.Inserted
|
||||
.gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific
|
||||
.go { color: #888 } // Generic.Output
|
||||
.gp { color: #555 } // Generic.Prompt
|
||||
.gs { font-weight: bold } // Generic.Strong
|
||||
.gu { color: #aaa } // Generic.Subheading
|
||||
.gt { color: #a00 } // Generic.Traceback
|
||||
.kc { font-weight: bold } // Keyword.Constant
|
||||
.kd { font-weight: bold } // Keyword.Declaration
|
||||
.kp { font-weight: bold } // Keyword.Pseudo
|
||||
.kr { font-weight: bold } // Keyword.Reserved
|
||||
.kt { color: #458; font-weight: bold } // Keyword.Type
|
||||
.m { color: #099 } // Literal.Number
|
||||
.s { color: #d14 } // Literal.String
|
||||
.na { color: #008080 } // Name.Attribute
|
||||
.nb { color: #0086B3 } // Name.Builtin
|
||||
.nc { color: #458; font-weight: bold } // Name.Class
|
||||
.no { color: #008080 } // Name.Constant
|
||||
.ni { color: #800080 } // Name.Entity
|
||||
.ne { color: #900; font-weight: bold } // Name.Exception
|
||||
.nf { color: #900; font-weight: bold } // Name.Function
|
||||
.nn { color: #555 } // Name.Namespace
|
||||
.nt { color: #000080 } // Name.Tag
|
||||
.nv { color: #008080 } // Name.Variable
|
||||
.ow { font-weight: bold } // Operator.Word
|
||||
.w { color: #bbb } // Text.Whitespace
|
||||
.mf { color: #099 } // Literal.Number.Float
|
||||
.mh { color: #099 } // Literal.Number.Hex
|
||||
.mi { color: #099 } // Literal.Number.Integer
|
||||
.mo { color: #099 } // Literal.Number.Oct
|
||||
.sb { color: #d14 } // Literal.String.Backtick
|
||||
.sc { color: #d14 } // Literal.String.Char
|
||||
.sd { color: #d14 } // Literal.String.Doc
|
||||
.s2 { color: #d14 } // Literal.String.Double
|
||||
.se { color: #d14 } // Literal.String.Escape
|
||||
.sh { color: #d14 } // Literal.String.Heredoc
|
||||
.si { color: #d14 } // Literal.String.Interpol
|
||||
.sx { color: #d14 } // Literal.String.Other
|
||||
.sr { color: #009926 } // Literal.String.Regex
|
||||
.s1 { color: #d14 } // Literal.String.Single
|
||||
.ss { color: #990073 } // Literal.String.Symbol
|
||||
.bp { color: #999 } // Name.Builtin.Pseudo
|
||||
.vc { color: #008080 } // Name.Variable.Class
|
||||
.vg { color: #008080 } // Name.Variable.Global
|
||||
.vi { color: #008080 } // Name.Variable.Instance
|
||||
.il { color: #099 } // Literal.Number.Integer.Long
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Dark mode
|
||||
// ---------
|
||||
|
||||
$dm-brand-color: #999999 !default;
|
||||
$dm-brand-color-light: lighten($dm-brand-color, 5%) !default;
|
||||
$dm-brand-color-dark: darken($dm-brand-color, 35%) !default;
|
||||
|
||||
$dm-site-title-color: $dm-brand-color-light !default;
|
||||
|
||||
$dm-text-color: #bbbbbb !default;
|
||||
$dm-background-color: #181818 !default;
|
||||
$dm-code-background-color: #212121 !default;
|
||||
|
||||
$dm-link-base-color: #79b8ff !default;
|
||||
$dm-link-visited-color: $dm-link-base-color !default;
|
||||
$dm-link-hover-color: $dm-text-color !default;
|
||||
|
||||
$dm-border-color-01: $dm-brand-color-dark !default;
|
||||
$dm-border-color-02: $dm-brand-color-light !default;
|
||||
$dm-border-color-03: $dm-brand-color !default;
|
||||
|
||||
$dm-table-text-color: $dm-text-color !default;
|
||||
$dm-table-zebra-color: lighten($dm-background-color, 4%) !default;
|
||||
$dm-table-header-bg-color: lighten($dm-background-color, 10%) !default;
|
||||
$dm-table-header-border: lighten($dm-background-color, 21%) !default;
|
||||
$dm-table-border-color: $dm-border-color-01 !default;
|
||||
|
||||
|
||||
// Syntax highlighting styles should be adjusted appropriately for every "skin"
|
||||
// List of tokens: https://github.com/rouge-ruby/rouge/wiki/List-of-tokens
|
||||
// Some colors come from Material Theme Darker:
|
||||
// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/settings/specific/darker-hc.ts
|
||||
// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/color-set.ts
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
@mixin dm-highlight {
|
||||
.highlight {
|
||||
.c { color: #545454; font-style: italic } // Comment
|
||||
.err { color: #f07178; background-color: #e3d2d2 } // Error
|
||||
.k { color: #89DDFF; font-weight: bold } // Keyword
|
||||
.o { font-weight: bold } // Operator
|
||||
.cm { color: #545454; font-style: italic } // Comment.Multiline
|
||||
.cp { color: #545454; font-weight: bold } // Comment.Preproc
|
||||
.c1 { color: #545454; font-style: italic } // Comment.Single
|
||||
.cs { color: #545454; font-weight: bold; font-style: italic } // Comment.Special
|
||||
.gd { color: #000; background-color: #fdd } // Generic.Deleted
|
||||
.gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific
|
||||
.ge { font-style: italic } // Generic.Emph
|
||||
.gr { color: #f07178 } // Generic.Error
|
||||
.gh { color: #999 } // Generic.Heading
|
||||
.gi { color: #000; background-color: #dfd } // Generic.Inserted
|
||||
.gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific
|
||||
.go { color: #888 } // Generic.Output
|
||||
.gp { color: #555 } // Generic.Prompt
|
||||
.gs { font-weight: bold } // Generic.Strong
|
||||
.gu { color: #aaa } // Generic.Subheading
|
||||
.gt { color: #f07178 } // Generic.Traceback
|
||||
.kc { font-weight: bold } // Keyword.Constant
|
||||
.kd { font-weight: bold } // Keyword.Declaration
|
||||
.kp { font-weight: bold } // Keyword.Pseudo
|
||||
.kr { font-weight: bold } // Keyword.Reserved
|
||||
.kt { color: #FFCB6B; font-weight: bold } // Keyword.Type
|
||||
.m { color: #F78C6C } // Literal.Number
|
||||
.s { color: #C3E88D } // Literal.String
|
||||
.na { color: #008080 } // Name.Attribute
|
||||
.nb { color: #EEFFFF } // Name.Builtin
|
||||
.nc { color: #FFCB6B; font-weight: bold } // Name.Class
|
||||
.no { color: #008080 } // Name.Constant
|
||||
.ni { color: #800080 } // Name.Entity
|
||||
.ne { color: #900; font-weight: bold } // Name.Exception
|
||||
.nf { color: #82AAFF; font-weight: bold } // Name.Function
|
||||
.nn { color: #555 } // Name.Namespace
|
||||
.nt { color: #FFCB6B } // Name.Tag
|
||||
.nv { color: #EEFFFF } // Name.Variable
|
||||
.ow { font-weight: bold } // Operator.Word
|
||||
.w { color: #EEFFFF } // Text.Whitespace
|
||||
.mf { color: #F78C6C } // Literal.Number.Float
|
||||
.mh { color: #F78C6C } // Literal.Number.Hex
|
||||
.mi { color: #F78C6C } // Literal.Number.Integer
|
||||
.mo { color: #F78C6C } // Literal.Number.Oct
|
||||
.sb { color: #C3E88D } // Literal.String.Backtick
|
||||
.sc { color: #C3E88D } // Literal.String.Char
|
||||
.sd { color: #C3E88D } // Literal.String.Doc
|
||||
.s2 { color: #C3E88D } // Literal.String.Double
|
||||
.se { color: #EEFFFF } // Literal.String.Escape
|
||||
.sh { color: #C3E88D } // Literal.String.Heredoc
|
||||
.si { color: #C3E88D } // Literal.String.Interpol
|
||||
.sx { color: #C3E88D } // Literal.String.Other
|
||||
.sr { color: #C3E88D } // Literal.String.Regex
|
||||
.s1 { color: #C3E88D } // Literal.String.Single
|
||||
.ss { color: #C3E88D } // Literal.String.Symbol
|
||||
.bp { color: #999 } // Name.Builtin.Pseudo
|
||||
.vc { color: #FFCB6B } // Name.Variable.Class
|
||||
.vg { color: #EEFFFF } // Name.Variable.Global
|
||||
.vi { color: #EEFFFF } // Name.Variable.Instance
|
||||
.il { color: #F78C6C } // Literal.Number.Integer.Long
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Mode selection
|
||||
// --------------
|
||||
|
||||
|
||||
// Classic skin (always light mode)
|
||||
// Assign outside of the if construct to establish global variable scope
|
||||
|
||||
$brand-color: $lm-brand-color;
|
||||
$brand-color-light: $lm-brand-color-light;
|
||||
$brand-color-dark: $lm-brand-color-dark;
|
||||
|
||||
$site-title-color: $lm-site-title-color;
|
||||
|
||||
$text-color: $lm-text-color;
|
||||
$background-color: $lm-background-color;
|
||||
$code-background-color: $lm-code-background-color;
|
||||
|
||||
$link-base-color: $lm-link-base-color;
|
||||
$link-visited-color: $lm-link-visited-color;
|
||||
$link-hover-color: $lm-link-hover-color;
|
||||
|
||||
$border-color-01: $lm-border-color-01;
|
||||
$border-color-02: $lm-border-color-02;
|
||||
$border-color-03: $lm-border-color-03;
|
||||
|
||||
$table-text-color: $lm-table-text-color;
|
||||
$table-zebra-color: $lm-table-zebra-color;
|
||||
$table-header-bg-color: $lm-table-header-bg-color;
|
||||
$table-header-border: $lm-table-header-border;
|
||||
$table-border-color: $lm-table-border-color;
|
||||
|
||||
|
||||
@if $color-scheme-auto {
|
||||
|
||||
// Auto mode
|
||||
|
||||
:root {
|
||||
--minima-brand-color: #{$lm-brand-color};
|
||||
--minima-brand-color-light: #{$lm-brand-color-light};
|
||||
--minima-brand-color-dark: #{$lm-brand-color-dark};
|
||||
|
||||
--minima-site-title-color: #{$lm-site-title-color};
|
||||
|
||||
--minima-text-color: #{$lm-text-color};
|
||||
--minima-background-color: #{$lm-background-color};
|
||||
--minima-code-background-color: #{$lm-code-background-color};
|
||||
|
||||
--minima-link-base-color: #{$lm-link-base-color};
|
||||
--minima-link-visited-color: #{$lm-link-visited-color};
|
||||
--minima-link-hover-color: #{$lm-link-hover-color};
|
||||
|
||||
--minima-border-color-01: #{$lm-border-color-01};
|
||||
--minima-border-color-02: #{$lm-border-color-02};
|
||||
--minima-border-color-03: #{$lm-border-color-03};
|
||||
|
||||
--minima-table-text-color: #{$lm-table-text-color};
|
||||
--minima-table-zebra-color: #{$lm-table-zebra-color};
|
||||
--minima-table-header-bg-color: #{$lm-table-header-bg-color};
|
||||
--minima-table-header-border: #{$lm-table-header-border};
|
||||
--minima-table-border-color: #{$lm-table-border-color};
|
||||
}
|
||||
|
||||
@include lm-highlight;
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--minima-brand-color: #{$dm-brand-color};
|
||||
--minima-brand-color-light: #{$dm-brand-color-light};
|
||||
--minima-brand-color-dark: #{$dm-brand-color-dark};
|
||||
|
||||
--minima-site-title-color: #{$dm-site-title-color};
|
||||
|
||||
--minima-text-color: #{$dm-text-color};
|
||||
--minima-background-color: #{$dm-background-color};
|
||||
--minima-code-background-color: #{$dm-code-background-color};
|
||||
|
||||
--minima-link-base-color: #{$dm-link-base-color};
|
||||
--minima-link-visited-color: #{$dm-link-visited-color};
|
||||
--minima-link-hover-color: #{$dm-link-hover-color};
|
||||
|
||||
--minima-border-color-01: #{$dm-border-color-01};
|
||||
--minima-border-color-02: #{$dm-border-color-02};
|
||||
--minima-border-color-03: #{$dm-border-color-03};
|
||||
|
||||
--minima-table-text-color: #{$dm-table-text-color};
|
||||
--minima-table-zebra-color: #{$dm-table-zebra-color};
|
||||
--minima-table-header-bg-color: #{$dm-table-header-bg-color};
|
||||
--minima-table-header-border: #{$dm-table-header-border};
|
||||
--minima-table-border-color: #{$dm-table-border-color};
|
||||
}
|
||||
|
||||
@include dm-highlight;
|
||||
}
|
||||
|
||||
$brand-color: var(--minima-brand-color);
|
||||
$brand-color-light: var(--minima-brand-color-light);
|
||||
$brand-color-dark: var(--minima-brand-color-dark);
|
||||
|
||||
$site-title-color: var(--minima-site-title-color);
|
||||
|
||||
$text-color: var(--minima-text-color);
|
||||
$background-color: var(--minima-background-color);
|
||||
$code-background-color: var(--minima-code-background-color);
|
||||
|
||||
$link-base-color: var(--minima-link-base-color);
|
||||
$link-visited-color: var(--minima-link-visited-color);
|
||||
$link-hover-color: var(--minima-link-hover-color);
|
||||
|
||||
$border-color-01: var(--minima-border-color-01);
|
||||
$border-color-02: var(--minima-border-color-02);
|
||||
$border-color-03: var(--minima-border-color-03);
|
||||
|
||||
$table-text-color: var(--minima-table-text-color);
|
||||
$table-zebra-color: var(--minima-table-zebra-color);
|
||||
$table-header-bg-color: var(--minima-table-header-bg-color);
|
||||
$table-header-border: var(--minima-table-header-border);
|
||||
$table-border-color: var(--minima-table-border-color);
|
||||
|
||||
|
||||
} @else if $color-scheme-dark {
|
||||
|
||||
// Dark skin (always dark mode)
|
||||
|
||||
$brand-color: $dm-brand-color;
|
||||
$brand-color-light: $dm-brand-color-light;
|
||||
$brand-color-dark: $dm-brand-color-dark;
|
||||
|
||||
$site-title-color: $dm-site-title-color;
|
||||
|
||||
$text-color: $dm-text-color;
|
||||
$background-color: $dm-background-color;
|
||||
$code-background-color: $dm-code-background-color;
|
||||
|
||||
$link-base-color: $dm-link-base-color;
|
||||
$link-visited-color: $dm-link-visited-color;
|
||||
$link-hover-color: $dm-link-hover-color;
|
||||
|
||||
$border-color-01: $dm-border-color-01;
|
||||
$border-color-02: $dm-border-color-02;
|
||||
$border-color-03: $dm-border-color-03;
|
||||
|
||||
$table-text-color: $dm-table-text-color;
|
||||
$table-zebra-color: $dm-table-zebra-color;
|
||||
$table-header-bg-color: $dm-table-header-bg-color;
|
||||
$table-header-border: $dm-table-header-border;
|
||||
$table-border-color: $dm-table-border-color;
|
||||
|
||||
@include dm-highlight;
|
||||
|
||||
|
||||
} @else {
|
||||
|
||||
// Classic skin syntax highlighting
|
||||
@include lm-highlight;
|
||||
|
||||
}
|
||||
5
_sass/minima/skins/classic.scss
Normal file
5
_sass/minima/skins/classic.scss
Normal file
@@ -0,0 +1,5 @@
|
||||
@charset "utf-8";
|
||||
|
||||
$color-scheme-auto: false;
|
||||
$color-scheme-dark: false;
|
||||
@import "minima/skins/auto";
|
||||
5
_sass/minima/skins/dark.scss
Normal file
5
_sass/minima/skins/dark.scss
Normal file
@@ -0,0 +1,5 @@
|
||||
@charset "utf-8";
|
||||
|
||||
$color-scheme-auto: false;
|
||||
$color-scheme-dark: true;
|
||||
@import "minima/skins/auto";
|
||||
5
_sass/minima/skins/solarized-dark.scss
Normal file
5
_sass/minima/skins/solarized-dark.scss
Normal file
@@ -0,0 +1,5 @@
|
||||
@charset "utf-8";
|
||||
|
||||
$sol-is-auto: false;
|
||||
$sol-is-dark: true;
|
||||
@import "minima/skins/solarized";
|
||||
4
_sass/minima/skins/solarized-light.scss
Normal file
4
_sass/minima/skins/solarized-light.scss
Normal file
@@ -0,0 +1,4 @@
|
||||
@charset "utf-8";
|
||||
|
||||
$sol-is-auto: false;
|
||||
@import "minima/skins/solarized";
|
||||
201
_sass/minima/skins/solarized.scss
Normal file
201
_sass/minima/skins/solarized.scss
Normal file
@@ -0,0 +1,201 @@
|
||||
@charset "utf-8";
|
||||
|
||||
// Solarized skin
|
||||
// ==============
|
||||
// Created by Sander Voerman <mailto:sander@savoerman.nl> using the Solarized
|
||||
// color scheme by Ethan Schoonover <https://ethanschoonover.com/solarized>.
|
||||
|
||||
// This style sheet implements three options for the minima.skin setting:
|
||||
// "solarized-light" for light mode, "solarized-dark" for dark mode, and
|
||||
// "solarized" for light or dark mode depending on user preference.
|
||||
$sol-is-auto: true !default;
|
||||
$sol-is-dark: false !default;
|
||||
|
||||
|
||||
// Color scheme
|
||||
// ------------
|
||||
// The inline comments show the canonical L*a*b values for each color.
|
||||
|
||||
$sol-base03: #002b36; // 15 -12 -12
|
||||
$sol-base02: #073642; // 20 -12 -12
|
||||
$sol-base01: #586e75; // 45 -07 -07
|
||||
$sol-base00: #657b83; // 50 -07 -07
|
||||
$sol-base0: #839496; // 60 -06 -03
|
||||
$sol-base1: #93a1a1; // 65 -05 -02
|
||||
$sol-base2: #eee8d5; // 92 -00 10
|
||||
$sol-base3: #fdf6e3; // 97 00 10
|
||||
$sol-yellow: #b58900; // 60 10 65
|
||||
$sol-orange: #cb4b16; // 50 50 55
|
||||
$sol-red: #dc322f; // 50 65 45
|
||||
$sol-magenta: #d33682; // 50 65 -05
|
||||
$sol-violet: #6c71c4; // 50 15 -45
|
||||
$sol-blue: #268bd2; // 55 -10 -45
|
||||
$sol-cyan: #2aa198; // 60 -35 -05
|
||||
$sol-green: #859900; // 60 -20 65
|
||||
|
||||
|
||||
// Mixed colors
|
||||
// ------------
|
||||
// While not part of the original Solarized base tones, these derived tones
|
||||
// are meant to replicate the visual style of the classic skin. They should
|
||||
// not be used in cases where sufficiently contrasting colors are needed.
|
||||
|
||||
$sol-light-mix1: mix($sol-base1, $sol-base3);
|
||||
$sol-light-mix2: mix($sol-blue, $sol-base00);
|
||||
$sol-light-mix3: mix($sol-base2, $sol-base3);
|
||||
$sol-dark-mix1: mix($sol-base01, $sol-base03);
|
||||
$sol-dark-mix2: mix($sol-blue, $sol-base0);
|
||||
$sol-dark-mix3: mix($sol-base02, $sol-base03);
|
||||
|
||||
|
||||
// Mode selection
|
||||
// --------------
|
||||
|
||||
$sol-mono3: $sol-base3;
|
||||
$sol-mono2: $sol-base2;
|
||||
$sol-mono1: $sol-base1;
|
||||
$sol-mono00: $sol-base00;
|
||||
$sol-mono01: $sol-base01;
|
||||
$sol-mix1: $sol-light-mix1;
|
||||
$sol-mix2: $sol-light-mix2;
|
||||
$sol-mix3: $sol-light-mix3;
|
||||
|
||||
@if $sol-is-dark {
|
||||
$sol-mono3: $sol-base03;
|
||||
$sol-mono2: $sol-base02;
|
||||
$sol-mono1: $sol-base01;
|
||||
$sol-mono00: $sol-base0;
|
||||
$sol-mono01: $sol-base1;
|
||||
$sol-mix1: $sol-dark-mix1;
|
||||
$sol-mix2: $sol-dark-mix2;
|
||||
$sol-mix3: $sol-dark-mix3;
|
||||
}
|
||||
|
||||
@if $sol-is-auto {
|
||||
:root {
|
||||
--solarized-mono3: #{$sol-base3};
|
||||
--solarized-mono2: #{$sol-base2};
|
||||
--solarized-mono1: #{$sol-base1};
|
||||
--solarized-mono00: #{$sol-base00};
|
||||
--solarized-mono01: #{$sol-base01};
|
||||
--solarized-mix1: #{$sol-light-mix1};
|
||||
--solarized-mix2: #{$sol-light-mix2};
|
||||
--solarized-mix3: #{$sol-light-mix3};
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--solarized-mono3: #{$sol-base03};
|
||||
--solarized-mono2: #{$sol-base02};
|
||||
--solarized-mono1: #{$sol-base01};
|
||||
--solarized-mono00: #{$sol-base0};
|
||||
--solarized-mono01: #{$sol-base1};
|
||||
--solarized-mix1: #{$sol-dark-mix1};
|
||||
--solarized-mix2: #{$sol-dark-mix2};
|
||||
--solarized-mix3: #{$sol-dark-mix3};
|
||||
}
|
||||
}
|
||||
|
||||
$sol-mono3: var(--solarized-mono3);
|
||||
$sol-mono2: var(--solarized-mono2);
|
||||
$sol-mono1: var(--solarized-mono1);
|
||||
$sol-mono00: var(--solarized-mono00);
|
||||
$sol-mono01: var(--solarized-mono01);
|
||||
$sol-mix1: var(--solarized-mix1);
|
||||
$sol-mix2: var(--solarized-mix2);
|
||||
$sol-mix3: var(--solarized-mix3);
|
||||
}
|
||||
|
||||
|
||||
// Minima color variables
|
||||
// ----------------------
|
||||
|
||||
$brand-color: $sol-mono1 !default;
|
||||
$brand-color-light: $sol-mix1 !default;
|
||||
$brand-color-dark: $sol-mono00 !default;
|
||||
|
||||
$site-title-color: $sol-mono00 !default;
|
||||
|
||||
$text-color: $sol-mono01 !default;
|
||||
$background-color: $sol-mono3 !default;
|
||||
$code-background-color: $sol-mono2 !default;
|
||||
|
||||
$link-base-color: $sol-blue !default;
|
||||
$link-visited-color: $sol-mix2 !default;
|
||||
$link-hover-color: $sol-mono00 !default;
|
||||
|
||||
$border-color-01: $brand-color-light !default;
|
||||
$border-color-02: $sol-mono1 !default;
|
||||
$border-color-03: $sol-mono00 !default;
|
||||
|
||||
$table-text-color: $sol-mono00 !default;
|
||||
$table-zebra-color: $sol-mix3 !default;
|
||||
$table-header-bg-color: $sol-mono2 !default;
|
||||
$table-header-border: $sol-mono1 !default;
|
||||
$table-border-color: $sol-mono1 !default;
|
||||
|
||||
|
||||
// Syntax highlighting styles
|
||||
// --------------------------
|
||||
|
||||
.highlight {
|
||||
.c { color: $sol-mono1; font-style: italic } // Comment
|
||||
.err { color: $sol-red } // Error
|
||||
.k { color: $sol-mono01; font-weight: bold } // Keyword
|
||||
.o { color: $sol-mono01; font-weight: bold } // Operator
|
||||
.cm { color: $sol-mono1; font-style: italic } // Comment.Multiline
|
||||
.cp { color: $sol-mono1; font-weight: bold } // Comment.Preproc
|
||||
.c1 { color: $sol-mono1; font-style: italic } // Comment.Single
|
||||
.cs { color: $sol-mono1; font-weight: bold; font-style: italic } // Comment.Special
|
||||
.gd { color: $sol-red } // Generic.Deleted
|
||||
.gd .x { color: $sol-red } // Generic.Deleted.Specific
|
||||
.ge { color: $sol-mono00; font-style: italic } // Generic.Emph
|
||||
.gr { color: $sol-red } // Generic.Error
|
||||
.gh { color: $sol-mono1 } // Generic.Heading
|
||||
.gi { color: $sol-green } // Generic.Inserted
|
||||
.gi .x { color: $sol-green } // Generic.Inserted.Specific
|
||||
.go { color: $sol-mono00 } // Generic.Output
|
||||
.gp { color: $sol-mono00 } // Generic.Prompt
|
||||
.gs { color: $sol-mono01; font-weight: bold } // Generic.Strong
|
||||
.gu { color: $sol-mono1 } // Generic.Subheading
|
||||
.gt { color: $sol-red } // Generic.Traceback
|
||||
.kc { color: $sol-mono01; font-weight: bold } // Keyword.Constant
|
||||
.kd { color: $sol-mono01; font-weight: bold } // Keyword.Declaration
|
||||
.kp { color: $sol-mono01; font-weight: bold } // Keyword.Pseudo
|
||||
.kr { color: $sol-mono01; font-weight: bold } // Keyword.Reserved
|
||||
.kt { color: $sol-violet; font-weight: bold } // Keyword.Type
|
||||
.m { color: $sol-cyan } // Literal.Number
|
||||
.s { color: $sol-magenta } // Literal.String
|
||||
.na { color: $sol-cyan } // Name.Attribute
|
||||
.nb { color: $sol-blue } // Name.Builtin
|
||||
.nc { color: $sol-violet; font-weight: bold } // Name.Class
|
||||
.no { color: $sol-cyan } // Name.Constant
|
||||
.ni { color: $sol-violet } // Name.Entity
|
||||
.ne { color: $sol-violet; font-weight: bold } // Name.Exception
|
||||
.nf { color: $sol-blue; font-weight: bold } // Name.Function
|
||||
.nn { color: $sol-mono00 } // Name.Namespace
|
||||
.nt { color: $sol-blue } // Name.Tag
|
||||
.nv { color: $sol-cyan } // Name.Variable
|
||||
.ow { color: $sol-mono01; font-weight: bold } // Operator.Word
|
||||
.w { color: $sol-mono1 } // Text.Whitespace
|
||||
.mf { color: $sol-cyan } // Literal.Number.Float
|
||||
.mh { color: $sol-cyan } // Literal.Number.Hex
|
||||
.mi { color: $sol-cyan } // Literal.Number.Integer
|
||||
.mo { color: $sol-cyan } // Literal.Number.Oct
|
||||
.sb { color: $sol-magenta } // Literal.String.Backtick
|
||||
.sc { color: $sol-magenta } // Literal.String.Char
|
||||
.sd { color: $sol-magenta } // Literal.String.Doc
|
||||
.s2 { color: $sol-magenta } // Literal.String.Double
|
||||
.se { color: $sol-magenta } // Literal.String.Escape
|
||||
.sh { color: $sol-magenta } // Literal.String.Heredoc
|
||||
.si { color: $sol-magenta } // Literal.String.Interpol
|
||||
.sx { color: $sol-magenta } // Literal.String.Other
|
||||
.sr { color: $sol-green } // Literal.String.Regex
|
||||
.s1 { color: $sol-magenta } // Literal.String.Single
|
||||
.ss { color: $sol-magenta } // Literal.String.Symbol
|
||||
.bp { color: $sol-mono1 } // Name.Builtin.Pseudo
|
||||
.vc { color: $sol-cyan } // Name.Variable.Class
|
||||
.vg { color: $sol-cyan } // Name.Variable.Global
|
||||
.vi { color: $sol-cyan } // Name.Variable.Instance
|
||||
.il { color: $sol-cyan } // Literal.Number.Integer.Long
|
||||
}
|
||||
Reference in New Issue
Block a user