<commit_before>@import '../ui-base/z-index'

/*------------------------------------*\
  Modals
  ======

  This file contains all needs for modals
\*------------------------------------*/

$modals
    modal-width = em(480px)

    .coz-overlay
        z-index     $modal-index
        position    fixed
        top         0
        left        0
        height      100%
        width       100%
        background  rgba(charcoal-grey, .5)
        visibility  visible
        transition  opacity .3s, visibility 0s ease-out

        &.coz-overlay--hidden
            opacity     0
            visibility  hidden
            transition  opacity .3s 0s, visibility 0s ease-in .3s


    .coz-modal-wrapper
        position          fixed
        top               0
        left              0
        display           flex
        flex-direction    row
        box-sizing        border-box
        width             100vw
        height            100vh
        overflow-y        scroll
        padding           (16/basefont)em

    .coz-modal
        position          relative
        margin            5vh auto auto
        border-radius     em(8px)
        max-width         90%
        min-width         modal-width
        height            auto
        background-color  white
        color             charcoal-grey

        .coz-modal-content:first-child
        .coz-btn-modal-close + .coz-modal-content
            padding-top    1.5em

        .coz-modal-content:last-child
            padding-bottom    1.5em

        .coz-modal-content
            padding 0 1.5em

        .coz-modal-section
            border-top 1px solid silver

        .coz-modal-content.coz-modal-title
            margin       0 0 1em
            // font is 1.5em
            padding      1em 3em 0 1em
            font-weight  bold

        .coz-btn-modal-close
            position         absolute
            top              1.3em
            right            1em
            margin           0
            padding          0
            background-size  2em
            background-color transparent
            cursor           pointer

        .coz-modal-buttons
            top-spaced  2em
            text-align  right

            button
                right-spaced  0
                left-spaced   10px
                font-size     .9em

        &.coz-modal--hidden
            top                         -25%
            opacity                     0
            transition-timing-function  ease-in


    @media (max-width (modal-width + 2em))
        .coz-modal
            max-width   modal-width
            min-width   auto
            width       100%<commit_msg>feat: new optional class to modal for overflowing<commit_after>@import '../ui-base/z-index'

/*------------------------------------*\
  Modals
  ======

  This file contains all needs for modals
\*------------------------------------*/

$modals
    modal-width = em(480px)

    .coz-overlay
        z-index     $modal-index
        position    fixed
        top         0
        left        0
        height      100%
        width       100%
        background  rgba(charcoal-grey, .5)
        visibility  visible
        transition  opacity .3s, visibility 0s ease-out

        &.coz-overlay--hidden
            opacity     0
            visibility  hidden
            transition  opacity .3s 0s, visibility 0s ease-in .3s


    .coz-modal-wrapper
        position          fixed
        top               0
        left              0
        display           flex
        flex-direction    row
        box-sizing        border-box
        width             100vw
        height            100vh
        overflow-y        scroll
        padding           (16/basefont)em

    .coz-modal
        position          relative
        margin            5vh auto auto
        border-radius     em(8px)
        max-width         90%
        min-width         modal-width
        height            auto
        background-color  white
        color             charcoal-grey

        .coz-modal-content:first-child
        .coz-btn-modal-close + .coz-modal-content
            padding-top    1.5em

        .coz-modal-content:last-child
            padding-bottom    1.5em

        .coz-modal-content
            padding 0 1.5em

        .coz-modal-section
            border-top 1px solid silver

        .coz-modal-content.coz-modal-title
            margin       0 0 1em
            // font is 1.5em
            padding      1em 3em 0 1em
            font-weight  bold

        .coz-btn-modal-close
            position         absolute
            top              1.3em
            right            1em
            margin           0
            padding          0
            background-size  2em
            background-color transparent
            cursor           pointer

        .coz-modal-buttons
            top-spaced  2em
            text-align  right

            button
                right-spaced  0
                left-spaced   10px
                font-size     .9em

        &.coz-modal--hidden
            top                         -25%
            opacity                     0
            transition-timing-function  ease-in

    .coz-modal--fullbleed
        overflow hidden

    @media (max-width (modal-width + 2em))
        .coz-modal
            max-width   modal-width
            min-width   auto
            width       100%
{'fraction_non_alphanumeric': 0.08492999263080324, 'fraction_numerical': 0.025055268975681652, 'mean_word_length': 0.8727147292169714, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1861654', 'n_tokens_mistral': 1481, 'n_tokens_neox': 1362, 'n_words': 347}