calculationRow.scss

TLDR

This file contains style rules for the CalculationRow and Table components of a table. It defines padding, positioning, height, and background color for the CalculationRow component. It also sets specific styles for the octo-table-cell and title classes within the CalculationRow component. The Table component has additional styles for the octo-table-cell class with the Calculation, focus-within, and hover pseudo-classes.

.CalculationRow {
    padding-left: 32px;
    position: sticky;
    bottom: 0;
    height: 44px;
    border-top: solid 1px rgba(var(--body-color), 0.09);
    // To override table's specific border
    border-bottom: 0 !important;
    background-color: rgb(var(--center-channel-bg-rgb));

    .octo-table-cell {
        background-color: rgb(var(--center-channel-bg-rgb));
        align-items: center;
        justify-content: flex-end;
        border: 0;
    }

    .title {
        padding-left: 40px;
    }

    .CalculationOptions {
        width: 100%;
    }
}

.Table {
    .octo-table-cell.Calculation:focus-within {
        border: unset;
        background-color: rgb(var(--center-channel-bg-rgb));
    }

    .octo-table-cell.Calculation:hover {
        background-color: rgb(var(--center-channel-bg-rgb));
    }
}