326 lines
8.8 KiB
Stylus
326 lines
8.8 KiB
Stylus
|
#post-index
|
||
|
width 100%
|
||
|
max-width 900px
|
||
|
margin 0 auto
|
||
|
|
||
|
#post-index-wrapper
|
||
|
padding 0.75rem
|
||
|
overflow hidden
|
||
|
|
||
|
#post-index-menu
|
||
|
color $white
|
||
|
|
||
|
a
|
||
|
text-decoration-color $highlight
|
||
|
|
||
|
a.add-new-post
|
||
|
display inline-block
|
||
|
background $highlight
|
||
|
border-radius 3px
|
||
|
padding 3px
|
||
|
color $white
|
||
|
text-align center
|
||
|
margin-bottom 10px
|
||
|
float right
|
||
|
|
||
|
.current-filter
|
||
|
color $highlight
|
||
|
text-decoration-color $secondary
|
||
|
|
||
|
#posts-list
|
||
|
margin 20px 0 0 0
|
||
|
|
||
|
a.post-link
|
||
|
background $white
|
||
|
display inline-block
|
||
|
vertical-align top
|
||
|
width 100%
|
||
|
text-decoration none
|
||
|
margin 0 0 20px 0
|
||
|
border-radius 3px
|
||
|
overflow hidden
|
||
|
color $primary - 60%
|
||
|
|
||
|
label
|
||
|
font-size 2em
|
||
|
font-weight 500
|
||
|
padding 10px
|
||
|
display inline-block
|
||
|
vertical-align top
|
||
|
width 100%
|
||
|
|
||
|
span
|
||
|
display inline-block
|
||
|
vertical-align top
|
||
|
font-size 0.8em
|
||
|
font-family 'Apercu-Mono'
|
||
|
width 50%
|
||
|
padding 0 0 0 10px
|
||
|
|
||
|
div.post-bg
|
||
|
width 100%
|
||
|
height 350px
|
||
|
background-color $highlight
|
||
|
|
||
|
p
|
||
|
padding 5px 10px 5px 10px
|
||
|
font-size 1.2em
|
||
|
font-weight 400
|
||
|
|
||
|
#post-edit-index
|
||
|
width 100%
|
||
|
overflow hidden
|
||
|
|
||
|
#post-edit-index-wrapper
|
||
|
width 100%
|
||
|
|
||
|
#post-header
|
||
|
// width 100%
|
||
|
max-width 900px
|
||
|
margin 0 auto
|
||
|
padding 0.75rem
|
||
|
|
||
|
#post-title
|
||
|
#post_title
|
||
|
background $primary - 4%
|
||
|
font-family 'Apercu'
|
||
|
width 97.6%
|
||
|
height 140px
|
||
|
font-size 1.5em
|
||
|
color $white
|
||
|
padding 5px
|
||
|
margin 0 0 5px 0
|
||
|
|
||
|
#post-date
|
||
|
background $primary - 10%
|
||
|
border-radius 0 3px 3px 0
|
||
|
width 39.5%
|
||
|
font-family 'Apercu'
|
||
|
color $highlight
|
||
|
height 30px
|
||
|
vertical-align top
|
||
|
text-align center
|
||
|
|
||
|
#calendar-icon
|
||
|
background $primary - 15%
|
||
|
border-radius 3px 0 0 3px
|
||
|
display inline-block
|
||
|
padding 2.9px
|
||
|
color $secondary
|
||
|
|
||
|
#post-options
|
||
|
display inline-block
|
||
|
vertical-align top
|
||
|
width 49%
|
||
|
padding 0 0 0 3px
|
||
|
|
||
|
button:nth-child(1)
|
||
|
border-radius 3px 0 0 3px
|
||
|
|
||
|
button:nth-child(4)
|
||
|
border-radius 0 3px 3px 0
|
||
|
|
||
|
button
|
||
|
width 25%
|
||
|
height 39px
|
||
|
object-transitions(0.3s)
|
||
|
margin 0
|
||
|
border-radius 0
|
||
|
display inline-block
|
||
|
vertical-align top
|
||
|
text-align center
|
||
|
|
||
|
button[data-active='false']
|
||
|
background $secondary
|
||
|
|
||
|
svg
|
||
|
fill $primary
|
||
|
|
||
|
button[data-active='true']
|
||
|
background $tertiary
|
||
|
|
||
|
svg
|
||
|
fill $tertiary - 70%
|
||
|
|
||
|
#post-meta
|
||
|
#post_tags
|
||
|
background $primary - 4%
|
||
|
font-family 'Apercu'
|
||
|
width 97.6%
|
||
|
height 140px
|
||
|
color $secondary
|
||
|
padding 5px
|
||
|
margin 0 0 5px 0
|
||
|
|
||
|
#featured-image-upload, #post-image-upload
|
||
|
display none
|
||
|
|
||
|
#post-feature
|
||
|
width 100%
|
||
|
|
||
|
#featured-image-drop
|
||
|
display flex
|
||
|
align-items center
|
||
|
justify-content center
|
||
|
width 100%
|
||
|
min-height 200px
|
||
|
background $primary - 50%
|
||
|
color $primary
|
||
|
vertical-align middle
|
||
|
font-family 'Apercu-Mono'
|
||
|
|
||
|
label
|
||
|
cursor pointer
|
||
|
|
||
|
img
|
||
|
width 100%
|
||
|
margin 0
|
||
|
padding 0
|
||
|
|
||
|
#featured-new-image-btn
|
||
|
position absolute
|
||
|
margin 20px
|
||
|
|
||
|
#new-feature-upload
|
||
|
padding-top 4px
|
||
|
background $white
|
||
|
|
||
|
svg
|
||
|
fill $highlight
|
||
|
|
||
|
#edit-post
|
||
|
width 100%
|
||
|
max-width 900px
|
||
|
margin 0 auto
|
||
|
|
||
|
#edit-post-wrapper
|
||
|
width 98%
|
||
|
max-width 900px
|
||
|
margin 0 auto
|
||
|
border-radius 5px
|
||
|
background $primary - 10%
|
||
|
|
||
|
pre
|
||
|
code
|
||
|
font-family 'Apercu-Mono'
|
||
|
padding 5px
|
||
|
border-radius 5px
|
||
|
line-height 1.6em
|
||
|
font-size 1.25em
|
||
|
color $editorPrimary
|
||
|
word-wrap normal
|
||
|
white-space pre-wrap
|
||
|
line-break normal
|
||
|
-webkit-line-break normal
|
||
|
-o-line-break normal
|
||
|
-moz-line-break normal
|
||
|
display inline-block
|
||
|
width 100%
|
||
|
max-width 900px
|
||
|
|
||
|
/**
|
||
|
-------------------------------
|
||
|
-- Responsive
|
||
|
-------------------------------
|
||
|
* */
|
||
|
@media only screen and (max-width: 800px)
|
||
|
#post-edit-index
|
||
|
#post-edit-index-wrapper
|
||
|
#post-header
|
||
|
#post-title
|
||
|
#post-date
|
||
|
width 37.6%
|
||
|
|
||
|
@media only screen and (max-width: 768px)
|
||
|
#post-edit-index
|
||
|
#post-edit-index-wrapper
|
||
|
#post-header
|
||
|
#post-title
|
||
|
#post-date
|
||
|
width 43.1%
|
||
|
|
||
|
#post-meta
|
||
|
#edit-control
|
||
|
max-width 100%
|
||
|
|
||
|
button
|
||
|
width 9.91%
|
||
|
|
||
|
@media only screen and (max-width: 640px)
|
||
|
#post-edit-index
|
||
|
#post-edit-index-wrapper
|
||
|
#post-header
|
||
|
#post-title
|
||
|
#post-date
|
||
|
width 42%
|
||
|
|
||
|
@media only screen and (max-width: 480px)
|
||
|
#post-index
|
||
|
#post-index-wrapper
|
||
|
#post-index-menu
|
||
|
a
|
||
|
font-size 0.95em
|
||
|
|
||
|
label
|
||
|
display none
|
||
|
visibility hidden
|
||
|
|
||
|
#post-edit-index
|
||
|
#post-edit-index-wrapper
|
||
|
#post-header
|
||
|
#post-title
|
||
|
#post-options
|
||
|
margin 5px 0 0 0
|
||
|
width 100%
|
||
|
padding 0
|
||
|
|
||
|
#post-date
|
||
|
width 89.2%
|
||
|
|
||
|
#post-meta
|
||
|
#edit-control
|
||
|
button
|
||
|
width 9.91%
|
||
|
|
||
|
@media only screen and (max-width: 320px)
|
||
|
#post-index
|
||
|
#post-index-wrapper
|
||
|
#post-index-menu
|
||
|
a
|
||
|
font-size 0.95em
|
||
|
|
||
|
label
|
||
|
display none
|
||
|
visibility hidden
|
||
|
|
||
|
#post-edit-index
|
||
|
#post-edit-index-wrapper
|
||
|
#post-header
|
||
|
#post-title
|
||
|
#post_title
|
||
|
width 96.4%
|
||
|
|
||
|
#post-options
|
||
|
margin 5px 0 0 0
|
||
|
width 100%
|
||
|
padding 0
|
||
|
|
||
|
#post-date
|
||
|
width 83.1%
|
||
|
|
||
|
#post-meta
|
||
|
#post_tags
|
||
|
width 96.4%
|
||
|
|
||
|
#edit-control
|
||
|
.content-editor-btn-icon
|
||
|
svg.icons
|
||
|
width 20px
|
||
|
|
||
|
.post-sumbit-btn
|
||
|
svg.icons
|
||
|
width 20px
|
||
|
|
||
|
button
|
||
|
width 10%
|