Compare commits

...

22 Commits
2.2.1 ... 2.5.0

Author SHA1 Message Date
89ea6c5872 Upgrading Casper to 2.5.0 2018-08-16 13:59:03 +02:00
9d803067a4 🛠 Added .travis.yml and gscan tests (#470)
- Add gscan dependency & travis.yml file, so that we can run gscan as a test for this repo
- This check tells us whether or not the theme is valid & compatible with Ghost according to gscan
- We recommend that all themes do this!
2018-08-14 22:10:01 +01:00
0ea375643b Added required "ghost-theme" keyword
- We're going to start showing this as a warning in gscan
- The purpose is to give us a way to detect if a package is a valid Ghost theme
2018-08-13 14:29:56 +01:00
f31957bd0d Replaced {{author}} by {{primary_author}} in byline-single.hbs
refs https://github.com/TryGhost/gscan/issues/99

- single author usages will be deprecated in Ghost 2.0
- make Casper 100% compatible with Ghost 2.0
2018-08-12 15:02:03 +02:00
36841d4624 Set minimum Ghost version to 2.0 2018-08-11 20:22:43 +01:00
d41fcbbc8a Remove .kg-card-markdown styles
no issue
- `.kg-card-markdown` no longer exists in Ghost 2.x
2018-08-11 19:09:58 +01:00
5d318225f5 Upgrading Casper to 2.4.2 2018-08-08 17:08:21 +02:00
9b56779ca6 Use id attribute to query reading progress element (#467)
no issue
- using an `id` selector doesn't break if other `progress` elements are present on a page
2018-08-03 09:21:05 +01:00
1bf2cdb52a Upgrading Casper to 2.4.1 2018-07-31 11:31:35 +01:00
f67caaba5c 🐛 Fixed content overflow on mobile
closes https://github.com/TryGhost/Casper/issues/464
- setting max-width of `kg-markdown-card` wrapper that is still used by non-Koenig posts
2018-07-30 12:21:17 +01:00
25d1e368d6 Upgrading Casper to 2.4.0 2018-07-24 15:13:30 +02:00
5c6cce1519 Ghost 1.25 Koenig updates (#463)
refs https://github.com/TryGhost/Ghost/pull/9741
- Ghost 1.25 has updated the HTML output of Koenig beta posts
  - the `<div class="kg-post">` wrapper around post content has been removed
  - for image cards the `.kg-image-wide` and `.kg-image-full` classes have been changed to `.kg-width-wide` and `.kg-width-full` and applied to the `<figure>` element rather than the `<img>` element
- this will be the default for *all* posts after upgrading to Ghost 2.0

Example output of the `{{content}}` helper for Koenig beta...

Before 1.25.0 (Ghost 1.23.0-1.24.9):
```html
<div class="kg-post">
    <figure class="kg-image-card">
        <img class="kg-image kg-image-wide" src="...">
        <figcaption>example wide image</figcaption>
    </figure>
</div>
```

After 1.25.0:
```html
<figure class="kg-image-card kg-width-wide">
    <img class="kg-image" src="...">
    <figcaption>example wide image</figcaption>
</figure>
```

For reference, in Ghost 1.x a non Koenig post with nothing but an image in the markdown (`![](...)`) would generate output like this:

```html
<div class="kg-card-markdown">
    <img src="...">
</div>
```
2018-07-23 12:20:46 +01:00
019842155a Upgrading Casper to 2.3.3 2018-06-14 17:00:26 +01:00
1860a8305b Koenig embed card (#460) 2018-06-13 18:34:59 +01:00
6417b4cf2a Fix rendering bug for non-square user images 2018-06-06 19:29:22 -07:00
1c61bc5f16 Upgrading Casper to 2.3.2 2018-05-29 16:10:07 +01:00
7a7f04c716 Update built files 2018-05-29 16:09:40 +01:00
fd56128f9b Upgrading Casper to 2.3.1 2018-05-29 15:40:50 +01:00
cd3b470c18 Fix for missing default avatar and firefox footer misalignment (#458) 2018-05-29 10:38:27 +02:00
f3b44a7411 Upgrading Casper to 2.3.0 2018-05-22 20:17:56 +01:00
b83917060f Applying styles for Koenig content (#455)
refs https://github.com/TryGhost/Ghost/issues/9311
- move `.kg-card-markdown` styles and add deprecation notice
- add support for new `.kg-post` wrapper
- add support for `.kg-image` and `.kg-image-wide/full` image variants
- add support for image captions
2018-05-22 19:09:58 +01:00
4aaedf69d2 Running CSSComb 2018-05-21 17:36:08 +02:00
9 changed files with 908 additions and 89 deletions

6
.travis.yml Normal file
View File

@ -0,0 +1,6 @@
language: node_js
sudo: false
node_js:
- "8"

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -18,6 +18,7 @@ production stylesheet in assets/built/screen.css
7.3. Comments
7.4. Related Posts
7.5. Floating Header
7.6. Koenig Styles
8. Author Template
9. Error Template
10. Subscribe Overlay
@ -461,8 +462,11 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
padding: 0 25px 25px;
}
.author-profile-image {
.author-profile-image,
.avatar-wrapper {
display: block;
width: 100%;
height: 100%;
background: color(var(--lightgrey) l(+10%));
border-radius: 100%;
@ -483,41 +487,61 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
}
.author-list-item {
flex-shrink: 0;
position: relative;
flex-shrink: 0;
margin: 0;
padding: 0;
}
.author-list-item:nth-child(1) { z-index: 10; }
.author-list-item:nth-child(2) { z-index: 9; }
.author-list-item:nth-child(3) { z-index: 8; }
.author-list-item:nth-child(4) { z-index: 7; }
.author-list-item:nth-child(5) { z-index: 6; }
.author-list-item:nth-child(6) { z-index: 5; }
.author-list-item:nth-child(7) { z-index: 4; }
.author-list-item:nth-child(8) { z-index: 3; }
.author-list-item:nth-child(9) { z-index: 2; }
.author-list-item:nth-child(10) { z-index: 1; }
.author-list-item:nth-child(1) {
z-index: 10;
}
.author-list-item:nth-child(2) {
z-index: 9;
}
.author-list-item:nth-child(3) {
z-index: 8;
}
.author-list-item:nth-child(4) {
z-index: 7;
}
.author-list-item:nth-child(5) {
z-index: 6;
}
.author-list-item:nth-child(6) {
z-index: 5;
}
.author-list-item:nth-child(7) {
z-index: 4;
}
.author-list-item:nth-child(8) {
z-index: 3;
}
.author-list-item:nth-child(9) {
z-index: 2;
}
.author-list-item:nth-child(10) {
z-index: 1;
}
.static-avatar {
display: block;
height: 34px;
width: 34px;
border: #fff 2px solid;
margin: 0 -5px;
border-radius: 100%;
overflow: hidden;
margin: 0 -5px;
width: 34px;
height: 34px;
border: #fff 2px solid;
border-radius: 100%;
}
.moving-avatar {
display: block;
height: 56px;
width: 56px;
border: #fff 2px solid;
margin: 0 -6px;
border-radius: 100%;
overflow: hidden;
margin: 0 -6px;
width: 56px;
height: 56px;
border: #fff 2px solid;
border-radius: 100%;
transition: all 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99) 0.7s;
}
@ -764,13 +788,6 @@ The first (most recent) post in the list is styled to be bigger than the others
display: none;
}
.kg-card-markdown {
display: flex;
flex-direction: column;
align-items: center;
max-width: 920px;
}
.post-full-content h1,
.post-full-content h2,
.post-full-content h3,
@ -796,11 +813,6 @@ The first (most recent) post in the list is styled to be bigger than the others
margin: 0;
}
.post-template .kg-card-markdown > p:first-child {
font-size: 1.25em;
line-height: 1.5em;
}
.post-full-content a {
color: #000;
box-shadow: var(--blue) 0 -1px 0 inset;
@ -865,6 +877,7 @@ Usage (In Ghost editor):
display: block;
margin-top: -3em;
margin-bottom: 1.5em;
text-align: center;
}
@ -1262,7 +1275,8 @@ Usage (In Ghost editor):
display: flex;
}
.author-card .author-profile-image {
.author-card .author-profile-image,
.author-card .avatar-wrapper {
margin-right: 15px;
width: 60px;
height: 60px;
@ -1353,8 +1367,8 @@ Usage (In Ghost editor):
.author-card .author-profile-image,
.author-card .avatar-wrapper {
margin-right: 15px;
position: relative;
margin-right: 15px;
}
.author-list-item .author-card {
@ -1363,8 +1377,8 @@ Usage (In Ghost editor):
left: 50%;
z-index: 300;
display: block;
width: 320px;
margin-left: -160px;
width: 320px;
font-size: 1.4rem;
letter-spacing: 0.2px;
background: white;
@ -1382,9 +1396,9 @@ Usage (In Ghost editor):
top: 100%;
left: 50%;
display: block;
margin-left: -12px;
width: 0;
height: 0;
margin-left: -12px;
border-top: 12px solid #fff;
border-right: 12px solid transparent;
border-left: 12px solid transparent;
@ -1802,6 +1816,81 @@ Usage (In Ghost editor):
}
/* 7.6. Koenig Styles
/* ---------------------------------------------------------- */
.post-content {
display: flex;
flex-direction: column;
align-items: center;
max-width: 920px;
}
.post-template .post-content > p:first-child {
font-size: 1.25em;
line-height: 1.5em;
}
.post-full-content .kg-image {
max-width: 100%;
}
/* Preventing full-width image overlap with post image. */
.post-full-image + .post-full-content .kg-content *:first-child .kg-image {
width: 100%;
}
.post-full-content .kg-width-wide .kg-image {
max-width: 1040px;
}
.post-full-content .kg-width-full .kg-image {
max-width: 100vw;
}
.post-content figcaption {
font-size: 80%;
line-height: 1.6em;
text-align: center;
}
.kg-image-card {
margin: 0 0 1.5em;
}
.kg-image-card figcaption {
margin: -1.0em 0 1.5em;
}
.kg-embed-card {
display: flex;
flex-direction: column;
align-items: center;
margin: 1.5em 0 3em;
min-width: 100%;
}
.kg-embed-card figcaption {
margin: 0.5em 0 0;
}
.kg-embed-card .fluid-width-video-wrapper {
margin: 0;
}
.kg-image-full + figcaption {
padding: 0 1.5em;
}
@media (max-width: 1040px) {
.post-full-content .kg-width-full .kg-image {
width: 100vw;
}
}
/* 8. Author Template
/* ---------------------------------------------------------- */

View File

@ -2,9 +2,9 @@
"name": "casper",
"description": "The default personal blogging theme for Ghost. Beautiful, minimal and responsive.",
"demo": "https://demo.ghost.io",
"version": "2.2.1",
"version": "2.5.0",
"engines": {
"ghost": ">=1.2.0"
"ghost": ">=2.0.0"
},
"license": "MIT",
"screenshots": {
@ -12,8 +12,9 @@
"mobile": "assets/screenshot-mobile.jpg"
},
"scripts": {
"dev": "gulp",
"zip": "gulp zip"
"dev": "gulp",
"zip": "gulp zip",
"test": "gscan ."
},
"author": {
"name": "Ghost Foundation",
@ -29,7 +30,8 @@
},
"keywords": [
"ghost",
"theme"
"theme",
"ghost-theme"
],
"repository": {
"type": "git",
@ -40,6 +42,7 @@
"devDependencies": {
"autoprefixer": "6.3.6",
"cssnano": "3.7.1",
"gscan": "^2.0.0",
"gulp": "3.9.1",
"gulp-livereload": "3.8.1",
"gulp-postcss": "6.1.1",

View File

@ -1,5 +1,5 @@
{{!-- Everything inside the #author tags pulls data from the author --}}
{{#author}}
{{#primary_author}}
<section class="author-card">
{{#if profile_image}}
@ -20,4 +20,4 @@
<a class="author-card-button" href="{{url}}">Read More</a>
</div>
{{/author}}
{{/primary_author}}

View File

@ -20,7 +20,7 @@
{{> "icons/facebook"}}
</a>
</div>
<progress class="progress" value="0">
<progress id="reading-progress" class="progress" value="0">
<div class="progress-container">
<span class="progress-bar"></span>
</div>

View File

@ -33,7 +33,9 @@ into the {body} of the default.hbs template --}}
{{/if}}
<section class="post-full-content">
{{content}}
<div class="post-content">
{{content}}
</div>
</section>
{{!-- Email subscribe form at the bottom of the page --}}
@ -141,7 +143,7 @@ $(document).ready(function () {
$postContent.fitVids();
// End fitVids
var progressBar = document.querySelector('progress');
var progressBar = document.querySelector('#reading-progress');
var header = document.querySelector('.floating-header');
var title = document.querySelector('.post-full-title');

797
yarn.lock

File diff suppressed because it is too large Load Diff