main

mattermost/focalboard

Last updated at: 29/12/2023 09:40

attachment.scss

TLDR

This file defines the styling for the "Attachment" component.

Classes

.Attachment

This class represents the main container for the attachment component. It sets the block display and width to 100%.

.attachment-header

This class represents the header section of the attachment component. It sets the display to flex.

.attachment-plus-btn

This class represents a button for adding attachments. It is positioned to the right of the header section using the margin-left: auto; property.

.attachment-content

This class represents the content section of the attachment component. It sets the padding-bottom to 20px, enables horizontal scrolling, and uses a flex layout.

.attachment-plus-icon

This class represents the plus icon used for adding attachments. It sets the color to a semi-transparent version of the center channel color and sets the cursor to a pointer.

.attachment-title

This class represents the title of the attachment component. It sets the font family to 'Open Sans', font size to 14px, and font weight to 600.

.Attachment {
    display: block;
    width: 100%;

    .attachment-header {
        display: flex;
    }

    .attachment-plus-btn {
        margin-left: auto;
    }

    .attachment-content {
        padding-bottom: 20px;
        display: flex;
        overflow-x: auto;
    }

    .attachment-plus-icon {
        color: rgba(var(--center-channel-color-rgb), 0.56);
        cursor: pointer;
    }

    .attachment-title {
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
    }
}