Created
August 22, 2019 15:02
-
-
Save themeix/0e4bbac2353b5c307c9826ad6f350139 to your computer and use it in GitHub Desktop.
Ghost Fixing
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
| body { | |
| overflow-x: hidden; | |
| } | |
| .kg-gallery-container { | |
| margin: 1.5em auto; | |
| display: flex; | |
| flex-direction: column; | |
| max-width: 1040px; | |
| width: 60vw; | |
| max-width: 100%; | |
| } | |
| .kg-gallery-row { | |
| display: flex; | |
| flex-direction: row; | |
| justify-content: center; | |
| &:not(:first-of-type) { | |
| margin: 0.75em 0 0 0; | |
| } | |
| } | |
| .kg-gallery-image { | |
| img { | |
| display: block; | |
| margin: 0; | |
| width: 100%; | |
| height: 100%; | |
| } | |
| &:not(:first-of-type) { | |
| margin: 0 0 0 0.75em; | |
| } | |
| } | |
| .entry-content { | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| max-width: 920px; | |
| margin: 0 auto; | |
| figcaption { | |
| padding-left: 10px; | |
| font-size: 14px; | |
| margin: 0; | |
| padding: 3px; | |
| margin: 1.0em 0 0; | |
| font-size: 80%; | |
| line-height: 1.6em; | |
| text-align: center; | |
| } | |
| blockquote { | |
| min-width: 100%; | |
| } | |
| dl { | |
| min-width: 100%; | |
| } | |
| h1 { | |
| min-width: 100%; | |
| } | |
| h2 { | |
| min-width: 100%; | |
| } | |
| h3 { | |
| min-width: 100%; | |
| } | |
| h4 { | |
| min-width: 100%; | |
| } | |
| h5 { | |
| min-width: 100%; | |
| } | |
| h6 { | |
| min-width: 100%; | |
| } | |
| ol { | |
| min-width: 100%; | |
| } | |
| p { | |
| min-width: 100%; | |
| } | |
| pre { | |
| min-width: 100%; | |
| } | |
| ul { | |
| min-width: 100%; | |
| } | |
| .kg-image { | |
| max-width: 100%; | |
| } | |
| figure { | |
| margin: 1em 0; | |
| img { | |
| margin: 0; | |
| } | |
| } | |
| .kg-width-wide .kg-image { | |
| max-width: 1040px; | |
| } | |
| .kg-width-full .kg-image { | |
| max-width: 100vw; | |
| } | |
| } | |
| .footnotes { | |
| min-width: 100%; | |
| } | |
| .post-full-comments { | |
| min-width: 100%; | |
| } | |
| .kg-embed-card { | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| min-width: 100%; | |
| .fluid-width-video-wrapper { | |
| margin: 0; | |
| } | |
| } | |
| @media(max-width: 1040px) { | |
| .entry-content .kg-width-full .kg-image { | |
| width: 100vw; | |
| } | |
| } | |
| .post-full-image+.entry-content .kg-content *:first-child .kg-image { | |
| width: 100%; | |
| } | |
| .kg-width-full figcaption { | |
| padding: 0 1.5em; | |
| } | |
| .kg-gallery-card+.kg-image-card.kg-width-wide, | |
| .kg-gallery-card+.kg-gallery-card, | |
| .kg-image-card.kg-width-wide+.kg-gallery-card, | |
| .kg-image-card.kg-width-wide+.kg-image-card.kg-width-wide { | |
| margin: -2.25em 0 3em; | |
| } | |
| %extend_1 { | |
| display: block; | |
| margin: 1.5em auto; | |
| max-width: 1040px; | |
| height: auto; | |
| } | |
| .entry-content { | |
| h1 { | |
| min-width: 100%; | |
| margin: 0.5em 0 0.2em 0; | |
| font-weight: 700; | |
| } | |
| h2 { | |
| min-width: 100%; | |
| margin: 0.5em 0 0.2em 0; | |
| font-weight: 700; | |
| } | |
| h3 { | |
| min-width: 100%; | |
| margin: 0.5em 0 0.2em 0; | |
| font-weight: 700; | |
| } | |
| h4 { | |
| min-width: 100%; | |
| margin: 0.5em 0 0.2em 0; | |
| font-weight: 700; | |
| } | |
| h5 { | |
| min-width: 100%; | |
| display: block; | |
| font-weight: 700; | |
| } | |
| h6 { | |
| min-width: 100%; | |
| margin: 0.5em 0 0.2em 0; | |
| font-weight: 700; | |
| } | |
| p { | |
| min-width: 100%; | |
| code { | |
| //Instead of the line below you could use @include word-break($value) | |
| word-break: break-all; | |
| } | |
| } | |
| ul { | |
| min-width: 100%; | |
| } | |
| ol { | |
| min-width: 100%; | |
| } | |
| dl { | |
| min-width: 100%; | |
| } | |
| pre { | |
| min-width: 100%; | |
| overflow-x: auto; | |
| max-width: 100%; | |
| border-radius: 5px; | |
| code { | |
| font-size: inherit; | |
| line-height: inherit; | |
| :not(span) { | |
| color: inherit; | |
| } | |
| } | |
| } | |
| blockquote { | |
| min-width: 100%; | |
| padding: 0 1.5em; | |
| border-left: #3eb0ef 3px solid; | |
| p { | |
| margin: 0 0 1em 0; | |
| color: inherit; | |
| font-size: inherit; | |
| line-height: inherit; | |
| font-style: italic; | |
| &:last-child { | |
| margin-bottom: 0; | |
| } | |
| } | |
| } | |
| li { | |
| //Instead of the line below you could use @include word-break($value) | |
| word-break: break-word; | |
| p { | |
| margin: 0; | |
| } | |
| &:first-child { | |
| margin-top: 0; | |
| } | |
| } | |
| a { | |
| word-break: break-word; | |
| } | |
| strong { | |
| color: color(var(--darkgrey) l(-5%)); | |
| } | |
| em { | |
| color: color(var(--darkgrey) l(-5%)); | |
| } | |
| small { | |
| display: inline-block; | |
| line-height: 1.6em; | |
| } | |
| img { | |
| @extend %extend_1; | |
| +br+small { | |
| display: block; | |
| margin-top: -3em; | |
| margin-bottom: 1.5em; | |
| text-align: center; | |
| } | |
| } | |
| video { | |
| @extend %extend_1; | |
| } | |
| img[src$="#full"] { | |
| max-width: none; | |
| width: 100vw; | |
| } | |
| iframe { | |
| margin: 0 auto !important; | |
| } | |
| .fluid-width-video-wrapper { | |
| margin: 1.5em 0 3em; | |
| } | |
| hr { | |
| width: 100%; | |
| margin: 1.5rem 0; | |
| } | |
| table { | |
| display: inline-block; | |
| overflow-x: auto; | |
| margin: 0.5em 0 2.5em; | |
| max-width: 100%; | |
| width: auto; | |
| border-spacing: 0; | |
| border-collapse: collapse; | |
| font-size: 1.6rem; | |
| white-space: nowrap; | |
| vertical-align: top; | |
| background: radial-gradient(ellipse at left, rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0) 75%) 0 center, radial-gradient(ellipse at right, rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0) 75%) 100% center; | |
| background-attachment: scroll, scroll; | |
| background-size: 10px 100%, 10px 100%; | |
| background-repeat: no-repeat; | |
| td { | |
| padding: 6px 12px; | |
| border: color(var(--whitegrey) l(-1%) s(-5%)) 1px solid; | |
| &:first-child { | |
| background-image: linear-gradient(to right, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%); | |
| background-size: 20px 100%; | |
| background-repeat: no-repeat; | |
| } | |
| &:last-child { | |
| background-image: linear-gradient(to left, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%); | |
| background-position: 100% 0; | |
| background-size: 20px 100%; | |
| background-repeat: no-repeat; | |
| } | |
| } | |
| th { | |
| font-weight: 700; | |
| letter-spacing: 0.2px; | |
| text-align: left; | |
| text-transform: uppercase; | |
| padding: 6px 12px; | |
| } | |
| } | |
| } | |
| .post-full-comments { | |
| min-width: 100%; | |
| } | |
| .footnotes { | |
| min-width: 100%; | |
| font-size: 1.5rem; | |
| p { | |
| margin: 0; | |
| } | |
| } | |
| @media(max-width: 1040px) { | |
| .entry-content { | |
| img { | |
| width: 100%; | |
| } | |
| video { | |
| width: 100%; | |
| } | |
| } | |
| } | |
| @media(max-width: 500px) { | |
| .entry-content { | |
| padding: 0; | |
| h1 { | |
| font-size: 2.8rem; | |
| } | |
| h2 { | |
| font-size: 2.6rem; | |
| } | |
| h3 { | |
| font-size: 2.2rem; | |
| } | |
| h4 { | |
| font-size: 2.2rem; | |
| } | |
| h5 { | |
| font-size: 2.2rem; | |
| } | |
| h6 { | |
| font-size: 2rem; | |
| } | |
| &:before { | |
| display: none; | |
| } | |
| &:after { | |
| display: none; | |
| } | |
| } | |
| .post-full-meta { | |
| font-size: 1.2rem; | |
| line-height: 1.3em; | |
| } | |
| .post-full-title { | |
| font-size: 2.9rem; | |
| } | |
| .post-full-image { | |
| margin-bottom: 4vw; | |
| height: 350px; | |
| } | |
| } | |
| @media(min-width: 1180px) { | |
| .entry-content h5 { | |
| max-width: 1060px; | |
| width: 100vw; | |
| } | |
| } | |
| .footnotes-sep { | |
| margin-bottom: 30px; | |
| } | |
| .footnote-backref { | |
| font-weight: bold; | |
| text-decoration: none !important; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment