#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%
