Decapod Styling

.ds-shared-decapod h1
.ds-shared-decapod h2
.ds-shared-decapod h3
.ds-shared-decapod em
.ds-shared-decapod a

Custom text styles.

.ds-shared-disabled-text

Text when disabled. Used on buttons, links, and text content throughout application.

.ds-shared-decapod

Class shared by all Decapod components.

.ds-shared-titleBar

Top title bar

.ds-shared-titleBar-flatList li:first-child p

The first item in the title bar appears differently than the rest. Useful if using it as a navigation link to "Home".

.ds-shared-titleBar-flatList p

The style for content in the title bar.

.ds-shared-titleBar-flatList li:after

Contains the chevron seen in the title bar.

.ds-shared-decapod footer

The bottom footer / border of the Decapod interface.

.ds-shared-mainPane

Shared styles for the content that appears between the title bar at top, and the footer at the bottom.

.ds-shared-mainPane header

The area that contains the page title, menu links.

.ds-shared-menuBar

The menu bar that contains Restart and Help links.

.ds-shared-insetContentArea

Styles for a container that appears inset to the page.

.ds-shared-insetContentArea .ds-shared-linkButton:hover

Link styles for the inset content area.

.ds-shared-insetContentArea .ds-shared-linkButton:active
.ds-shared-menuBar .ds-shared-linkButton:active

Link style when link is active.

@media screen and (max-width: 1100px)

Resize the UI when the screen is between 841px and 1100px.

@media screen and (max-width: 840px)

Resize the UI when the screen is 840px or less.

.ds-shared-linkButton
.ds-shared-menuBar .ds-shared-linkButton
.ds-shared-helpButton
.ds-shared-restartButton

Links that look like buttons which are used throughout the application. Sometimes overridden to match the style of a different container.

.ds-shared-disabled-button

Disabled styling for link buttons.

.ds-shared-grey-button

A link button that is grey. Used predominantly inside Inset Content containers.

.ds-shared-uploadControls

The "Browse" button used throughout the application.