trotFunky/Zulma-Theme
1
0
Fork 0
Code Releases Activity

made .box look better on newer themes; updated readme.md to add new themes; modularized blog sass some

Browse source
This commit is contained in:
Robert Clarke 2019-05-14 13:29:45 +01:00
parent c59659ca1d
commit 800363c6ab
15 changed files with 143 additions and 123 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
README.md
View file

@ -1,6 +1,6 @@
# Zulma
A Bulma theme for Zola.
A Bulma theme for Zola. See a live preview [here](https://festive-morse-47d46c.netlify.com/)
![Zulma Screenshot](/screenshot.png)
@ -187,6 +187,10 @@ In extra, setting `zulma_theme` to a valid value will change the current colour
- flatly
- pulse
- simplex
- lux
- slate
- solar
- superhero
All valid themes can also be found under the `extra.zulma_themes` variable in the `theme.toml`. Choosing no theme will set default as the theme. Setting an invalid theme value will cause the site to render improperly.

3
content/_index.md Normal file
View file

@ -0,0 +1,3 @@
+++
paginate_by=1
+++

114
sass/_blog.scss
View file

@ -1,3 +1,6 @@
@import "./_blog/article";
@import "./_blog/search-results";
html,
body {
font-family: "Open Sans", sans-serif;
@ -11,9 +14,13 @@ main {
flex: 1;
}
.navbar-brand .brand-text {
font-size: 1.11rem;
font-weight: bold;
.footer {
margin-top: 4rem;
padding: 2rem;
.theme-select-container {
margin-left: auto;
}
}
.hero .title {
@ -28,110 +35,13 @@ main {
}
}
.media-center {
display: block;
margin-bottom: 1rem;
}
.media-content {
margin-top: 1rem;
}
.article {
margin-top: 1rem;
}
.article-title {
font-size: 2rem;
font-weight: lighter;
line-height: 2;
margin-bottom: 0.5rem;
}
.article-subtitle {
margin-bottom: 3rem;
}
.article-footer,
.article-body {
margin: 2rem 0;
@include desktop {
margin: 2rem 6rem;
}
}
.article-body {
line-height: 1.4;
}
.article-footer {
font-style: italic;
padding: 1.5rem;
width: 100%;
.button,
.tag {
font-style: normal;
}
}
.list.box {
margin-top: 1rem;
display: flex;
flex-direction: row;
flex-wrap: wrap;
> a {
>a {
margin: 0.2rem;
}
}
.paginator-container {
padding: 2rem 0;
}
.search-results {
display: none;
max-height: 35rem;
overflow: auto;
@include desktop {
position: absolute;
top: 100%;
width: 50rem;
right: 0;
margin-right: 0.75rem;
}
}
.search-results__items > li {
list-style: none;
margin-top: 1rem;
&:first-child {
margin-top: 0;
}
}
.navbar-end {
height: 100%;
}
input#search::placeholder {
color: $grey-darker;
}
.footer {
margin-top: 4rem;
padding: 2rem;
}
.pagination-previous,
.pagination-next {
flex-grow: 0;
}
.theme-select-container {
margin-left: auto;
}
}

39
sass/_blog/_article.scss Normal file
View file

@ -0,0 +1,39 @@
.article {
margin-top: 1rem;
.article-title {
font-size: 2rem;
font-weight: lighter;
line-height: 2;
margin-bottom: 0.5rem;
}
.article-subtitle {
margin-bottom: 3rem;
}
.article-footer,
.article-body {
margin: 2rem 0;
@include desktop {
margin: 2rem 6rem;
}
}
.article-body {
line-height: 1.4;
}
.article-footer {
font-style: italic;
padding: 1.5rem;
width: 100%;
.button,
.tag {
font-style: normal;
}
}
}

10
sass/_blog/_nav.scss Normal file
View file

@ -0,0 +1,10 @@
nav {
.navbar-end {
height: 100%;
}
.navbar-brand .brand-text {
font-size: 1.11rem;
font-weight: bold;
}
}

8
sass/_blog/_pagination.scss Normal file
View file

@ -0,0 +1,8 @@
.paginator-container {
padding: 2rem 0;
.pagination-previous,
.pagination-next {
flex-grow: 0;
}
}

26
sass/_blog/_search-results.scss Normal file
View file

@ -0,0 +1,26 @@
.search-results {
display: none;
max-height: 35rem;
overflow: auto;
@include desktop {
position: absolute;
top: 100%;
width: 50rem;
right: 0;
margin-right: 0.75rem;
}
.search-results__items>li {
list-style: none;
margin-top: 1rem;
&:first-child {
margin-top: 0;
}
}
}
input#search::placeholder {
color: $grey-darker;
}

9
sass/lux.scss
View file

@ -3,3 +3,12 @@
@import "./_vendor/lux/overrides";
@import "./blog";
.box {
$card-border-color: $grey-darker;
$border-width: 2px default;
box-shadow: none;
border: $border-width solid $card-border-color;
background-color: $grey-darker;
border-radius: $radius;
}

10
sass/pulse.scss
View file

@ -2,12 +2,4 @@
@import './_vendor/bulma-0.7.4/_bulma.sass';
@import './_vendor/pulse/overrides';
@import './blog';
// .box {
// $card-border-color: lighten($grey-darker, 5);
// box-shadow: none;
// border: $border-width solid $card-border-color;
// background-color: $grey-darker;
// border-radius: $radius;
// }
@import './blog';

10
sass/simplex.scss
View file

@ -2,12 +2,4 @@
@import './_vendor/bulma-0.7.4/_bulma.sass';
@import './_vendor/simplex/overrides';
@import './blog';
// .box {
// $card-border-color: lighten($grey-darker, 5);
// box-shadow: none;
// border: $border-width solid $card-border-color;
// background-color: $grey-darker;
// border-radius: $radius;
// }
@import './blog';

9
sass/slate.scss
View file

@ -3,3 +3,12 @@
@import "./_vendor/slate/overrides";
@import "./blog";
.box {
$card-border-color: lighten($grey-darker, 5);
$border-width: 2px default;
box-shadow: none;
border: $border-width solid $card-border-color;
background-color: $grey-darker;
border-radius: $radius;
}

9
sass/solar.scss
View file

@ -3,3 +3,12 @@
@import "./_vendor/solar/overrides";
@import "./blog";
.box {
$card-border-color: lighten($grey-darker, 5);
$border-width: 2px default;
box-shadow: none;
border: $border-width solid $card-border-color;
background-color: $grey-darker;
border-radius: $radius;
}

9
sass/superhero.scss
View file

@ -3,3 +3,12 @@
@import "./_vendor/superhero/overrides";
@import "./blog";
.box {
$card-border-color: lighten($grey-darker, 5);
$border-width: 2px default;
box-shadow: none;
border: $border-width solid $card-border-color;
background-color: $grey-darker;
border-radius: $radius;
}

2
static/js/zulma_search.js.map
View file

File diff suppressed because one or more lines are too long

2
static/js/zulma_switchcss.js.map
View file

File diff suppressed because one or more lines are too long