@import '~styles/base'

.ThreadMedia
    display: flex
    margin-bottom: 4px

    &:not(.toggled)
        margin-right: 10px
        float: left

    &.toggled
        margin-bottom: 0.8em
        display: inline-block


    video, img
        max-width: 100%
        align-self: center

    .ThreadMedia--expanded
        display: inline-block
        // TODO: dynamic class setting on thread images; limit height
        max-height: calc(100vh - $header-height)

    .ThreadMedia__FullscreenIcon
        +clickable
        display: none
        position: absolute
        top: 0
        right: 0
        margin: 0

        .Icon
            text-shadow: 0 0 0 grey(7)

            &:hover
                text-shadow: 0 0 1px grey(8)

    .ThreadMedia--IWC:hover
        .ThreadMedia__FullscreenIcon
            display: initial

@import '~styles/base'

.ThreadMedia
    display: flex
    margin-bottom: 4px

    &:not(.toggled)
        margin-right: 10px
        float: left

    &.toggled
        margin-bottom: 0.8em
        display: inline-block


    video, img
        max-width: 100%
        align-self: center
        +clickable

    .ThreadMedia--expanded
        display: inline-block
        // TODO: dynamic class setting on thread images; limit height
        max-height: calc(100vh - $header-height)

    .ThreadMedia__FullscreenIcon
        +clickable
        display: none
        position: absolute
        top: 0
        right: 0
        margin: 0

        .Icon
            text-shadow: 0 0 0 grey(7)

            &:hover
                text-shadow: 0 0 1px grey(8)

    .ThreadMedia--IWC:hover
        .ThreadMedia__FullscreenIcon
            display: initial

Add clickable icon to media
feat(ThreadPost): Add clickable icon to media
