@ni/spright-components/dist/esm/chat/message/inbound/styles.js

NI Spright Components

import { css } from '@ni/fast-element';
import { anchorButtonTag } from '@ni/nimble-components/dist/esm/anchor-button';
import { buttonTag } from '@ni/nimble-components/dist/esm/button';
import { menuButtonTag } from '@ni/nimble-components/dist/esm/menu-button';
import { toggleButtonTag } from '@ni/nimble-components/dist/esm/toggle-button';
import { bodyFont, bodyFontColor, controlSlimHeight, largePadding, mediumPadding, standardPadding } from '@ni/nimble-components/dist/esm/theme-provider/design-tokens';
import { display } from '../../../utilities/style/display';
export const styles = css `
    ${display('flex')}

    :host {
        min-width: ${standardPadding};
        min-height: ${standardPadding};

        flex-direction: row;
        justify-content: flex-start;
        flex-shrink: 0;
        font: ${bodyFont};
        color: ${bodyFontColor};
    }

    .container {
        display: flex;
        flex-direction: column;
        max-width: calc(90%);
    }

    [part='start'] {
        display: none;
    }

    .message-content {
        width: fit-content;
        height: fit-content;
        overflow-x: auto;
    }

    .footer-actions {
        display: none;
    }

    :host .footer-actions.has-content {
        display: flex;
        column-gap: ${standardPadding};
        margin-top: ${mediumPadding};
    }

    .footer-actions ::slotted(${buttonTag}),
    .footer-actions ::slotted(${toggleButtonTag}),
    .footer-actions ::slotted(${anchorButtonTag}),
    .footer-actions ::slotted(${menuButtonTag}) {
        height: ${controlSlimHeight};
    }

    .end {
        display: none;
    }

    :host .end {
        display: flex;
        column-gap: ${standardPadding};
        margin-top: ${largePadding};
    }
`;
//# sourceMappingURL=styles.js.map