-
Notifications
You must be signed in to change notification settings - Fork 96
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Update for some CSS/Sass inconsistencies Created “css” dir, with example CSS and Sass files inside, and added it to :resources list. Removed :sass-dest key from config (should still work with old cryogen-core, since it’ll default to “css” if missing) - pucoming cryogen-core changes always compile Sass to same directory Updated docs to remove :sass-dest * Added Lotus theme * Made img links relative Fixed bug in title tag * Made weird hack to split blog title with <br>'s, since Selmer has no way to split strings, and I don't have a good way to add a custom filter in a theme... * Fixed missing menu opening behavior Updated image URLs to handle blog prefix Removed hacky way of tightening blog title text * Added config.edn for Lotus theme Added README with installation instructions on changing the logo and social media links * Fixed minor typo in Lotus theme README
- Loading branch information
Showing
27 changed files
with
1,661 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
| # About Lotus | ||
| An elegant and responsive theme for Cryogen by [Matthew Davidson](https://github.com/KingMob). To see it live, visit my site, [modulolotus.net](https://modulolotus.net). | ||
|
|
||
| # Install | ||
|
|
||
| 1. Change the `:theme` key in `resources/templates/config.edn` to "lotus". | ||
| 2. Replace the GitHub and LinkedIn links in `base.html` with links to your own profiles. (More social media icons can be found in `icons.svg`.) | ||
| 3. Replace the white lotus logo with the logo of your choice in `base.html`. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,2 @@ | ||
| {:sass-src ["themes/lotus/css"] | ||
| :resources ["themes/lotus/img"]} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| @import "variables"; | ||
|
|
||
| .button { | ||
| background: none; | ||
| border: $default-border; | ||
| position: relative; | ||
| display: inline-block; | ||
| padding: 7px 12px; | ||
| margin: 0; | ||
| width: auto; | ||
| font-family: $wide-font-family; | ||
| font-size: $button-font-size; | ||
| text-transform: uppercase; | ||
|
|
||
| cursor: pointer; | ||
| text-align: left; | ||
| text-decoration: none; | ||
| letter-spacing: 2px; | ||
|
|
||
| &:hover { | ||
| background: $default-border-color; | ||
| color: $white; | ||
| } | ||
|
|
||
| &:active { | ||
| top: 1px; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,93 @@ | ||
| @import "variables"; | ||
|
|
||
| body { | ||
| display: flex; | ||
| flex-flow: row nowrap; | ||
| align-items: stretch; | ||
| justify-content: space-between; | ||
|
|
||
| @media (max-width: $mobile-breakpoint) { | ||
| flex-flow: column nowrap; | ||
| } | ||
| } | ||
|
|
||
| #sidebar { | ||
| @media (min-width: $mobile-breakpoint) { | ||
| flex: 0 0 auto; | ||
| height: 100vh; | ||
| } | ||
| @media (max-width: $mobile-breakpoint) { | ||
| flex: 1 0 auto; | ||
| width: 100vw; | ||
| } | ||
| } | ||
|
|
||
| #sidebar-links { | ||
| display: flex; | ||
| flex-flow: column nowrap; | ||
| justify-content: space-between; | ||
| align-items: stretch; | ||
|
|
||
| @media (max-width: $mobile-breakpoint) { | ||
| flex-flow: row nowrap; | ||
| } | ||
| } | ||
|
|
||
| .post-header { | ||
| h1 { | ||
| margin-top: 0; | ||
| } | ||
|
|
||
| .byline { | ||
| display: flex; | ||
| justify-content: space-between; | ||
| margin-bottom: 1.375rem; | ||
|
|
||
| @media (max-width: $tablet-breakpoint) { | ||
| margin-bottom: 1.375rem; | ||
| } | ||
|
|
||
| @media (max-width: $mobile-breakpoint) { | ||
| margin-bottom: 1.25rem; | ||
| } | ||
| } | ||
| } | ||
|
|
||
| #main { | ||
| flex: 1 1 0; | ||
|
|
||
| @media (min-width: $mobile-breakpoint) { | ||
| height: 100vh; | ||
| overflow-y: scroll; | ||
| } | ||
| } | ||
|
|
||
| #prev-next { | ||
| display: flex; | ||
| align-items: center; | ||
| flex-flow: row nowrap; | ||
| justify-content: space-between; | ||
|
|
||
| .prev, .next { | ||
| display: flex; | ||
| align-items: center; | ||
| flex-flow: row nowrap; | ||
|
|
||
| flex: 1 1 50%; | ||
| fill: currentColor; | ||
| text-decoration: none; | ||
|
|
||
| .icon { | ||
| flex: 0 0 1em; | ||
| height: 1em; | ||
| width: 1em; | ||
| } | ||
|
|
||
| .nav-text { | ||
| flex: 1 1 0; | ||
| margin-left: 1em; | ||
| margin-right: 1em; | ||
| text-align: center; | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,134 @@ | ||
| @import "variables"; | ||
|
|
||
| #menucont { | ||
| #menu-checkbox { | ||
| display: none; | ||
| } | ||
|
|
||
| .menutitle { | ||
| display: none; | ||
| } | ||
|
|
||
| .menu { | ||
| margin: 0; | ||
| padding: 0; | ||
|
|
||
| li { | ||
| width: 100%; | ||
| list-style-type: none; | ||
| padding: 0; | ||
|
|
||
| a { | ||
| color: #FFF; | ||
| width: 100%; | ||
| margin: 0; | ||
| font-weight: 300; | ||
| text-transform: uppercase; | ||
| line-height: 22px; | ||
| text-decoration: none; | ||
| letter-spacing: 2px; | ||
| } | ||
|
|
||
| &:hover { | ||
| background: rgba(0, 0, 0, 0.2); | ||
| } | ||
|
|
||
| &.active { | ||
| background: rgba(0, 0, 0, 0.2); | ||
|
|
||
| a { | ||
| font-weight: 600; | ||
| } | ||
| } | ||
|
|
||
| .menu-item-text { | ||
| padding: $default-gutter/2 $default-gutter; | ||
| width: 100%; | ||
| } | ||
| } | ||
| } | ||
| } | ||
|
|
||
| // From the awesome animate.css | ||
| @keyframes fadeIn { | ||
| from { | ||
| opacity: 0; | ||
| } | ||
|
|
||
| to { | ||
| opacity: 1; | ||
| } | ||
| } | ||
|
|
||
| @media screen and (max-width: $mobile-breakpoint) { | ||
|
|
||
| #menucont { | ||
| #menu-checkbox { | ||
| &:checked ~ .menu { | ||
| display: block; | ||
| margin-bottom: .5em; | ||
| } | ||
| } | ||
|
|
||
| .menutitle { | ||
| display: flex; | ||
| align-items: center; | ||
|
|
||
| padding: $default-gutter/2 $default-gutter; | ||
| cursor: pointer; | ||
| text-transform: uppercase; | ||
| opacity: $default-opacity; | ||
|
|
||
| .icon-menu { | ||
| // color: currentColor; | ||
| fill: currentColor; | ||
|
|
||
| // margin: 0 0 0 2px; | ||
| // font-size: $default-font-size * 1.2; | ||
| height: $default-font-size; | ||
| width: $default-font-size; | ||
| } | ||
|
|
||
| .menu-text { | ||
| margin: 0 0 0 .8em; | ||
| font-size: $default-font-size; | ||
| font-weight: $font-weight-heavy; | ||
| letter-spacing: 2px; | ||
| line-height: 1; | ||
| } | ||
| } | ||
|
|
||
| .menu { | ||
| animation-name: fadeIn; | ||
| animation-duration: 1s; | ||
| animation-fill-mode: both; | ||
|
|
||
| display: none; | ||
|
|
||
| li { | ||
| &.active { | ||
| background: transparent; | ||
|
|
||
| a, a:hover { | ||
| font-weight: 600; | ||
| color: #FFF; | ||
| } | ||
| } | ||
|
|
||
| a { | ||
| width: 100%; | ||
| display: inline-block; | ||
| margin: 0; | ||
| line-height: 23px; | ||
| color: rgba(255, 255, 255, 0.6); | ||
| font-weight: 300; | ||
| text-transform: uppercase; | ||
| } | ||
|
|
||
| .menu-item-text { | ||
| padding: $default-gutter/4 $default-gutter; | ||
| } | ||
| } | ||
| } | ||
| } | ||
| } |
Oops, something went wrong.