UNPKG

@aws-amplify/ui

Version:

`@aws-amplify/ui` contains low-level logic & styles for stand-alone usage or re-use in framework-specific implementations.

49 lines 1.42 kB
@layer amplify.components { .amplify-divider { --amplify-internal-divider-size: var( --amplify-components-divider-border-width ); border-color: var(--amplify-components-divider-border-color); border-style: var(--amplify-components-divider-border-style); border-width: 0; opacity: var(--amplify-components-divider-opacity); padding: 0; display: flex; position: relative; text-align: center; justify-content: center; } .amplify-divider::after { content: attr(data-label); position: absolute; transform: translateY(-50%); font-size: var(--amplify-components-divider-label-font-size); padding-inline: var(--amplify-components-divider-label-padding-inline); background-color: var(--amplify-components-divider-label-background-color); color: var(--amplify-components-divider-label-color); } .amplify-divider--small { --amplify-internal-divider-size: var( --amplify-components-divider-small-border-width ); } .amplify-divider--large { --amplify-internal-divider-size: var( --amplify-components-divider-large-border-width ); } .amplify-divider--horizontal { width: 100%; border-bottom-width: var(--amplify-internal-divider-size); } .amplify-divider--vertical { border-left-width: var(--amplify-internal-divider-size); flex-direction: column; } .amplify-divider--vertical::after { top: auto; transform: translateX(-50%); padding-block: 0; padding-inline: 0; } }