mirror of https://github.com/Nofated095/blog
194 lines
3.8 KiB
Stylus
194 lines
3.8 KiB
Stylus
|
/* ---------------------------------
|
||
|
* Article Summary and Content
|
||
|
* --------------------------------- */
|
||
|
$article-font-size ?= 1.1rem
|
||
|
|
||
|
article
|
||
|
&.media
|
||
|
color: $text-light
|
||
|
|
||
|
a
|
||
|
color: inherit
|
||
|
|
||
|
&:hover
|
||
|
color: $primary
|
||
|
|
||
|
.image
|
||
|
width: 64px
|
||
|
height: 64px
|
||
|
|
||
|
img
|
||
|
object-fit: cover
|
||
|
width: 100%
|
||
|
height: 100%
|
||
|
|
||
|
.title
|
||
|
@extend .is-size-6
|
||
|
margin-bottom: .25em
|
||
|
|
||
|
.date, .categories
|
||
|
@extend .is-size-7
|
||
|
|
||
|
.categories
|
||
|
@extend .is-uppercase
|
||
|
|
||
|
.media-content
|
||
|
color: $text-light
|
||
|
|
||
|
.title
|
||
|
margin: 0
|
||
|
line-height: inherit
|
||
|
|
||
|
&.article
|
||
|
.article-meta, .article-tags
|
||
|
color: $text-light
|
||
|
|
||
|
.article-meta
|
||
|
overflow-x: auto
|
||
|
margin-bottom: .5rem
|
||
|
|
||
|
.article-more
|
||
|
@extend .button.is-light
|
||
|
|
||
|
.content
|
||
|
word-wrap: break-word
|
||
|
font-size: $article-font-size
|
||
|
|
||
|
h1
|
||
|
font-size: 1.75em
|
||
|
|
||
|
h2
|
||
|
font-size: 1.5em
|
||
|
|
||
|
h3
|
||
|
font-size: 1.25em
|
||
|
|
||
|
h4
|
||
|
font-size: 1.125em
|
||
|
|
||
|
h5
|
||
|
font-size: 1em
|
||
|
|
||
|
pre
|
||
|
font-size: .85em
|
||
|
|
||
|
code
|
||
|
padding: 0
|
||
|
background: transparent
|
||
|
overflow-wrap: break-word
|
||
|
|
||
|
blockquote
|
||
|
&.pullquote
|
||
|
float: right
|
||
|
max-width: 50%
|
||
|
font-size: 1.15rem
|
||
|
position: relative
|
||
|
|
||
|
footer
|
||
|
strong + cite
|
||
|
margin-left: .5em
|
||
|
|
||
|
.message.message-immersive
|
||
|
border-radius: 0
|
||
|
margin: 0 0 - $card-content-padding $card-content-padding 0 - $card-content-padding
|
||
|
|
||
|
.message-body
|
||
|
border: none
|
||
|
|
||
|
.rtl
|
||
|
direction: rtl
|
||
|
|
||
|
.level
|
||
|
&, &.is-mobile
|
||
|
.level-item:not(:last-child)
|
||
|
margin-left: .75rem
|
||
|
margin-right: 0
|
||
|
|
||
|
// Overflow table
|
||
|
.table-overflow
|
||
|
overflow-x: auto
|
||
|
|
||
|
table
|
||
|
width: auto !important
|
||
|
|
||
|
th
|
||
|
word-break: keep-all
|
||
|
|
||
|
// Video container
|
||
|
.video-container
|
||
|
position: relative
|
||
|
padding-bottom: 56.25%
|
||
|
padding-top: 25px
|
||
|
height: 0
|
||
|
|
||
|
iframe
|
||
|
position: absolute
|
||
|
top: 0
|
||
|
left: 0
|
||
|
width: 100%
|
||
|
height: 100%
|
||
|
|
||
|
.article-licensing
|
||
|
position: relative
|
||
|
z-index: 1
|
||
|
box-shadow: none
|
||
|
background: $white-ter
|
||
|
border-radius: $radius
|
||
|
overflow: hidden
|
||
|
|
||
|
&:after
|
||
|
position: absolute
|
||
|
z-index: -1
|
||
|
right: -50px
|
||
|
top: -87.87px
|
||
|
content: '\f25e'
|
||
|
font-size: 200px
|
||
|
font-family: 'Font Awesome 5 Brands'
|
||
|
opacity: .1
|
||
|
|
||
|
.level-left
|
||
|
flex-wrap: wrap
|
||
|
max-width: 100%
|
||
|
|
||
|
.licensing-title
|
||
|
@extend .mb-3
|
||
|
line-height: 1.2
|
||
|
|
||
|
p:not(:last-child)
|
||
|
@extend .mb-1
|
||
|
|
||
|
a
|
||
|
@extend .is-size-7, .has-text-grey
|
||
|
|
||
|
.licensing-meta
|
||
|
.level-item
|
||
|
@extend .mr-4
|
||
|
|
||
|
.icons
|
||
|
.icon
|
||
|
@extend .ml-1
|
||
|
width: 1.2em
|
||
|
height: 1.2em
|
||
|
font-size: 1.2em
|
||
|
vertical-align: bottom
|
||
|
|
||
|
h6
|
||
|
@extend .is-size-7
|
||
|
|
||
|
a
|
||
|
color: inherit
|
||
|
|
||
|
a
|
||
|
&.article-nav-prev
|
||
|
span
|
||
|
text-align: left
|
||
|
flex-shrink: 1
|
||
|
word-wrap: break-word
|
||
|
white-space: normal
|
||
|
|
||
|
&.article-nav-next
|
||
|
span
|
||
|
text-align: right
|
||
|
flex-shrink: 1
|
||
|
word-wrap: break-word
|
||
|
white-space: normal
|