<commit_before>/* ==========================================================================
   Capital Framework
   Table Styling
   ========================================================================== */

//
// Theme variables
//

// Color variables
// `$color-` variables referenced in comments are from 18F's U.S. Web Design Standards
// https://github.com/18F/web-design-standards/blob/staging/src/stylesheets/core/_variables.scss)

@table-cell-bg:              #ffffff; // $color-white
@table-cell-bg_alt:          #f1f1f1; // $color-gray-lightest
@table-row-link-bg-hover:    #205493; // $color-cool-blue
@table-row-link-hover-color: #ffffff; // $color-white
@table-scrolling-border:     #e4e2e0; // $color-gray-warm-light


//
// Import external dependencies
//

@import '../../cf-core/src/cf-core.less';


// Mixins
.striped-table() {
    & > tbody > tr:nth-child(even) {
        & > th,
        & > td {
            background: @table-cell-bg_alt;
        }
    }
}

.o-table_cell__right-align {
    text-align: right;
}

.o-table__row-links {
    .respond-to-min( @bp-med-min, {
        tr:hover {
            td {
                background: @table-row-link-bg-hover;
                color: @table-row-link-hover-color;
                cursor: pointer;
            }
            a {
                color: @table-row-link-hover-color;
            }
        }
    } );
}

.o-table-wrapper__scrolling {
    box-sizing: border-box;
    overflow-y: hidden;
    table {
        border: 1px solid @table-scrolling-border;
        .striped-table();
    }
}

.o-table__sortable {
    button.sortable {
        width: 100%;
        height: 100%;
        padding: 0;
        margin: 0;
        border: none;
        background: none;
        font-family: inherit;
        font-weight: inherit;
        line-height: inherit;
        outline: none;
        text-align: left;
        text-transform: inherit;
    }

    .sortable:after {
        display: inline-block;
        position: relative;
        top: -1px;
        content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAJCAYAAAACTR1pAAAAXUlEQVR4AWPABZw9/C4A8Qlscvg0LQXi/1A8k1hNjXBNCFxNSFMcXDEmjsOlyQakgAB2RNckD8S/idD4D4jVYZq4gfgJXJIwfgPEIiCNt0ECJOKXII13gPgTifgaAHk0kQqUakHYAAAAAElFTkSuQmCC);
        visibility: hidden;
    }

    .sortable:hover:after,
    .sortable.sorted-up:after,
    .sortable.sorted-down:after {
        visibility: visible;
    }

    .sortable.sorted-down:after,
    .sortable.sorted-up:hover:after {
        transform: rotate(180deg);
    }

    .sortable.sorted-down:hover:after {
        transform: rotate(0deg);
    }
}

.respond-to-min( @bp-sm-min, {
    .o-table__striped {
        .striped-table();
    }
} );

.respond-to-max( @bp-xs-max, {
    .o-table {
        width: 100%;
    }

    .o-table__striped tr:nth-child(even) {
        & > th,
        & > td {
            background: @table-cell-bg;
        }
    }

    .o-table__stack-on-small {
        tr,
        td {
            display: block;
        }

        & > thead {
          display: none
        }

        td[data-label]:before {
            .u-webfont-demi();
            display: block;
            margin-top: 0;
            margin-bottom: .41666667em;
            content: attr(data-label);
            font-size: .875em;
            line-height: 1.83333333;
            text-transform: uppercase;
        }

        td:last-child {
            margin-bottom: unit( 30px / @base-font-size-px, em );
        }
    }

    .o-table__entry-header-on-small {
        & > tbody td:first-child {
            padding-bottom: .75em;
            border-bottom: 1px solid @table-border;
            margin-bottom: unit( 10px / @base-font-size-px, em);
            margin-top: 0;
            background-color: @thead-bg;
            font-size: 1.125em;
            font-weight: 400;
            line-height: 1.22222222;
        }

        & > tbody td:first-child:before {
            display: none;
        }

        & > tbody > tr {
            border-bottom: none;
            margin-bottom: unit( 30px / @base-font-size-px, em );
        }
    }
} );
<commit_msg>This commit adds a small fix for stacking tables on small screens. By specifying width: 100%, we override a fixed width for the column, forcing the columns to use the full width available when stacked.<commit_after>/* ==========================================================================
   Capital Framework
   Table Styling
   ========================================================================== */

//
// Theme variables
//

// Color variables
// `$color-` variables referenced in comments are from 18F's U.S. Web Design Standards
// https://github.com/18F/web-design-standards/blob/staging/src/stylesheets/core/_variables.scss)

@table-cell-bg:              #ffffff; // $color-white
@table-cell-bg_alt:          #f1f1f1; // $color-gray-lightest
@table-row-link-bg-hover:    #205493; // $color-cool-blue
@table-row-link-hover-color: #ffffff; // $color-white
@table-scrolling-border:     #e4e2e0; // $color-gray-warm-light


//
// Import external dependencies
//

@import '../../cf-core/src/cf-core.less';


// Mixins
.striped-table() {
    & > tbody > tr:nth-child(even) {
        & > th,
        & > td {
            background: @table-cell-bg_alt;
        }
    }
}

.o-table_cell__right-align {
    text-align: right;
}

.o-table__row-links {
    .respond-to-min( @bp-med-min, {
        tr:hover {
            td {
                background: @table-row-link-bg-hover;
                color: @table-row-link-hover-color;
                cursor: pointer;
            }
            a {
                color: @table-row-link-hover-color;
            }
        }
    } );
}

.o-table-wrapper__scrolling {
    box-sizing: border-box;
    overflow-y: hidden;
    table {
        border: 1px solid @table-scrolling-border;
        .striped-table();
    }
}

.o-table__sortable {
    button.sortable {
        width: 100%;
        height: 100%;
        padding: 0;
        margin: 0;
        border: none;
        background: none;
        font-family: inherit;
        font-weight: inherit;
        line-height: inherit;
        outline: none;
        text-align: left;
        text-transform: inherit;
    }

    .sortable:after {
        display: inline-block;
        position: relative;
        top: -1px;
        content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAJCAYAAAACTR1pAAAAXUlEQVR4AWPABZw9/C4A8Qlscvg0LQXi/1A8k1hNjXBNCFxNSFMcXDEmjsOlyQakgAB2RNckD8S/idD4D4jVYZq4gfgJXJIwfgPEIiCNt0ECJOKXII13gPgTifgaAHk0kQqUakHYAAAAAElFTkSuQmCC);
        visibility: hidden;
    }

    .sortable:hover:after,
    .sortable.sorted-up:after,
    .sortable.sorted-down:after {
        visibility: visible;
    }

    .sortable.sorted-down:after,
    .sortable.sorted-up:hover:after {
        transform: rotate(180deg);
    }

    .sortable.sorted-down:hover:after {
        transform: rotate(0deg);
    }
}

.respond-to-min( @bp-sm-min, {
    .o-table__striped {
        .striped-table();
    }
} );

.respond-to-max( @bp-xs-max, {
    .o-table {
        width: 100%;
    }

    .o-table__striped tr:nth-child(even) {
        & > th,
        & > td {
            background: @table-cell-bg;
        }
    }

    .o-table__stack-on-small {
        tr,
        td {
            display: block;
        }

        th,
        td {
            width: 100%;
        }

        & > thead {
          display: none
        }

        td[data-label]:before {
            .u-webfont-demi();
            display: block;
            margin-top: 0;
            margin-bottom: .41666667em;
            content: attr(data-label);
            font-size: .875em;
            line-height: 1.83333333;
            text-transform: uppercase;
        }

        td:last-child {
            margin-bottom: unit( 30px / @base-font-size-px, em );
        }
    }

    .o-table__entry-header-on-small {
        & > tbody td:first-child {
            padding-bottom: .75em;
            border-bottom: 1px solid @table-border;
            margin-bottom: unit( 10px / @base-font-size-px, em);
            margin-top: 0;
            background-color: @thead-bg;
            font-size: 1.125em;
            font-weight: 400;
            line-height: 1.22222222;
        }

        & > tbody td:first-child:before {
            display: none;
        }

        & > tbody > tr {
            border-bottom: none;
            margin-bottom: unit( 30px / @base-font-size-px, em );
        }
    }
} );

{'fraction_non_alphanumeric': 0.16379209198638978, 'fraction_numerical': 0.024639211545230553, 'mean_word_length': 1.7461340206185567, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 25, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 4, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4101257', 'n_tokens_mistral': 3074, 'n_tokens_neox': 2853, 'n_words': 456}