Skip to content

Commit

Permalink
Update compatability for Ghost 3.0
Browse files Browse the repository at this point in the history
  • Loading branch information
ScottSmith95 committed Oct 23, 2019
1 parent aef1840 commit 1dd7c80
Show file tree
Hide file tree
Showing 7 changed files with 375 additions and 257 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Decode for Ghost

#### [Download the latest release for Ghost here.](https://github.com/ScottSmith95/Decode-for-Ghost/releases/download/0.9.3/decode.zip)
#### [Download the latest release for Ghost here.](https://github.com/ScottSmith95/Decode-for-Ghost/releases/download/0.9.4/decode.zip)

#### [Demo](https://decode-ghost-demo.scotthsmith.com)

Expand Down
188 changes: 188 additions & 0 deletions assets/styles/partials/6 Content.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,188 @@
/* Post Styles */
.post-content {
display: flex;
flex-direction: column;
}

.post-content p {
hyphens: auto;
}

.post-content h1 {
font-size: 2em;
}

.post-content h2 {
font-size: 1.75em;
}

.post-content h3 {
font-size: 1.5em;
}

.post-content h4 {
font-size: 1.375em;
}

.post-content h5 {
font-size: 1.25em;
}

.post-content h6 {
font-size: 1.125em;
}

.post-content img {
max-width: 100%;
margin: 2.5% auto;
}

.post-content blockquote {
padding: 0.5em 0.25em 0.5em 0.75em;
background: #DBDEE1;
}

.post-content blockquote > p::before {
content: open-quote;
font-size: 3.5em;
font-style: italic;
line-height: 0;
vertical-align: -0.4em;
margin-right: 0.25em;
}

figure.kg-embed-card {
margin: 0.5rem auto;

iframe {
margin-left: auto;
margin-right: auto;
}
}

figure.kg-image-card,
figure.kg-gallery-card {
margin: 0.25rem 0;
text-align: left;

img {
display: block;
}

&.kg-width-wide {
max-width: none;

img.kg-image {
/*
* max-width: 107.5%;
* margin-left: -3.75%;
* Rounding up from these values ensures that
* the image fully spans content div on narrow viewports.
*/
margin-left: -4.1%;
max-width: 108.2%;
}
}

&.kg-width-full,
&.kg-gallery-card {
align-self: center;
max-width: none;

img.kg-image {
width: 100vw;
max-width: 100vw;
}
}

figcaption {
color: var(--secondary-text-color);
text-align: center;
font-size: 0.85em;
font-style: italic;
padding: 0 0 0.5rem;
margin: 0 auto;
}
}

.kg-gallery-container {
display: flex;
flex-direction: column;
margin: 1rem auto;
max-width: 65rem;
width: 100vw;
}

.kg-gallery-row {
display: flex;
flex-direction: row;
justify-content: center;
}

.kg-gallery-image img {
display: block;
margin: 0;
width: 100%;
height: 100%;
}

.kg-gallery-row:not(:first-of-type) {
margin: 0.75rem 0 0 0;
}

.kg-gallery-image:not(:first-of-type) {
margin: 0 0 0 0.75rem;
}

.kg-bookmark-card .kg-bookmark-container {
display: flex;
flex-wrap: wrap;
color: black;
text-decoration: none;
border: 2px solid var(--secondary-text-color);
}

.kg-bookmark-content {
flex-basis: 0;
flex-grow: 999;
min-width: 50%;
padding: 20px;
}

.kg-bookmark-title {
font-weight: 600;
}

.kg-bookmark-description,
.kg-bookmark-metadata {
margin-top: 0.75rem;
}

.kg-bookmark-author,
.kg-bookmark-publisher {
color: var(--secondary-text-color);
}

.kg-bookmark-thumbnail {
flex-basis: 15rem;
flex-grow: 1;
}


.kg-bookmark-thumbnail img {
vertical-align: bottom;
object-fit: cover;
width: 100%;
}

.kg-bookmark-icon {
width: 22px;
height: 22px;
margin-right: 0.5rem;
vertical-align: bottom;
}

.kg-bookmark-author:after {
content: "•";
margin: 0 0.5rem;
}
153 changes: 12 additions & 141 deletions assets/styles/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,12 @@
3. Utilities
4. Header
5. Footer
6. General
7. Single Post
8. Navigation
9. Pagination
10. Media Queries
6. Post Content
7. General
8. Single Post
9. Navigation
10. Pagination
11. Media Queries
*/

/* ==========================================================================
Expand Down Expand Up @@ -54,6 +55,12 @@

@import 'partials/5 Footer.css';

/* ==========================================================================
6. Post Content - Styling for content of pages/posts
========================================================================== */

@import 'partials/6 Content.css';

/* ==========================================================================
6. General
========================================================================== */
Expand Down Expand Up @@ -160,142 +167,6 @@
}
}

/* Post Styles */
.post-content {
display: flex;
flex-direction: column;
}

.post-content p {
hyphens: auto;
}

.post-content h1 {
font-size: 2em;
}

.post-content h2 {
font-size: 1.75em;
}

.post-content h3 {
font-size: 1.5em;
}

.post-content h4 {
font-size: 1.375em;
}

.post-content h5 {
font-size: 1.25em;
}

.post-content h6 {
font-size: 1.125em;
}

.post-content img {
max-width: 100%;
margin: 2.5% auto;
}

.post-content blockquote {
padding: 0.5em 0.25em 0.5em 0.75em;
background: #DBDEE1;
}

.post-content blockquote > p::before {
content: open-quote;
font-size: 3.5em;
font-style: italic;
line-height: 0;
vertical-align: -0.4em;
margin-right: 0.25em;
}

figure.kg-embed-card {
margin: 0.5rem auto;

iframe {
margin-left: auto;
margin-right: auto;
}
}

figure.kg-image-card,
figure.kg-gallery-card {
margin: 0.25rem 0;
text-align: left;

img {
display: block;
}

&.kg-width-wide {
max-width: none;

img.kg-image {
/*
* max-width: 107.5%;
* margin-left: -3.75%;
* Rounding up from these values ensures that
* the image fully spans content div on narrow viewports.
*/
margin-left: -4.1%;
max-width: 108.2%;
}
}

&.kg-width-full,
&.kg-gallery-card {
align-self: center;
max-width: none;

img.kg-image {
width: 100vw;
max-width: 100vw;
}
}

figcaption {
color: var(--secondary-text-color);
text-align: center;
font-size: 0.85em;
font-style: italic;
padding: 0 0 0.5rem;
margin: 0 auto;
}
}

.kg-gallery-container {
display: flex;
flex-direction: column;
margin: 1rem auto;
max-width: 65rem;
width: 100vw;
}

.kg-gallery-row {
display: flex;
flex-direction: row;
justify-content: center;
}

.kg-gallery-image img {
display: block;
margin: 0;
width: 100%;
height: 100%;
}

.kg-gallery-row:not(:first-of-type) {
margin: 0.75rem 0 0 0;
}

.kg-gallery-image:not(:first-of-type) {
margin: 0 0 0 0.75rem;
}

.post-meta {
display: inline-block;
font-size: 0.8em;
Expand Down
Loading

0 comments on commit 1dd7c80

Please sign in to comment.