@import “morph/variables”; @import “morph/colors”; @import “morph/functions”; @import “morph/components/highlight”; @import “morph/components/catalogue”;
.page-post {
.content { .position-sticky-top { position: sticky; top: 0; } .status-bar { @include media-sm() { top: 0; } height: 3rem; .structure-menu { height: 100%; button { display: none; padding: .4rem .6rem; border-radius: 100%; border: 1px solid $color-primary; @include media-sm() { display: inline; } } } } // left area .left { padding: 2rem 0; color: $color-secondary; width: 70%; @include media-sm() { width: 100%; } header { padding: 0 0 2.5rem 0; .title { font-size: 2.5rem; padding: .5rem 0; @include media-sm() { font-size: 2rem; } } } } // right area .right { margin-left: 2rem; padding: 2rem 0; width: 30%; #scroll-top-lg { display: none; position: fixed; bottom: 7rem; width: 3rem; height: 2.5rem; border-radius: 8px; line-height: 2.5rem; border: 1px solid $color-primary-dark; font-size: 2rem; margin-left: 3em; &:hover { background-color: $color-secondary-dark; color: $color-primary-dark; } } h2 { padding: 0 0 1rem 1rem; border-left: 2px solid $color-primary-dark; border-bottom: 2px solid $color-primary-dark; } } // article area article.text { color: map-get($colors, 'secondary-light'); font-size: 16px; line-height: 1.5; h1, h2, h3, h4, h5, h6, p, blockquote, pre, ul, ol, dl, figure, %vertical-rhythm { margin-bottom: .8rem; } ul, ol { margin-left: 1.5rem; } li { &::marker { color: $color-secondary-dark; } > ul, > ol { margin-bottom: 0; } } hr { margin-top: 1rem; margin-bottom: 1rem; } figure > img { display: block; } a { &:hover { text-decoration: underline; } } blockquote { p { color: $color-secondary; } border-left: 4px solid $color-rang1; padding-left: .5em; font-style: italic; i, em { font-style: normal; } } // header style and anchor animations h1, h2, h3, h4, h5, h6 { font-weight: normal; color: $color-secondary-dark; margin-top: 2.5rem; //padding: 1rem 0 .5rem 0; .header-anchor { display: none; margin-left: 5px; font-size: .7em; } &:hover .header-anchor { display: inline-block; animation: fade-in .5s; -webkit-animation: fade-in .5s; } } // table table:not(.rouge-table) { margin-bottom: 1rem; width: 100%; text-align: left; color: $color-secondary; border-collapse: collapse; border: 1px solid $color-primary-dark; tr { &:nth-child(even) { background-color: $color-primary; } } th, td { padding: (2rem / 3) (2rem / 2); } th { background-color: $color-primary-dark; border: 1px solid $color-primary-dark; } td { border: 1px solid $color-primary-dark; } @include media-sm() { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } } } }
}