@ahrowe/ui 0.16.0 → 0.16.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sectionHeader.module.mjs","names":[],"sources":["../../../../package/common/sectionHeader/sectionHeader.module.pcss"],"sourcesContent":[".sectionHeader {\n display: flex;\n flex-wrap: wrap;\n gap: var(--spacing-m, 16px);\n align-items: center;\n color: var(--text-color);\n\n &-leading {\n display: flex;\n justify-content: center;\n align-items: center;\n width: var(--section-header-leading-size);\n height: var(--section-header-leading-size);\n color: var(--primary-color);\n background: var(--background-accent);\n border-radius: var(--default-border-radius);\n overflow: hidden;\n background-size: cover;\n background-position: center;\n flex-shrink: 0;\n font-size: calc(var(--section-header-leading-size) * 0.5);\n }\n\n &-titles {\n display: flex;\n flex-flow: column;\n flex: 0 1 auto;\n gap: 2px;\n min-width: 0;\n }\n\n &-title {\n margin: 0;\n font-size: var(--section-header-title-size);\n font-weight: var(--header-font-weight, 600);\n line-height: 1.2;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &-subtitle {\n color: var(--text-dark);\n font-weight: 300;\n font-size: var(--section-header-subtitle-size);\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &-trailing {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n gap: var(--spacing-m, 16px);\n flex: 1 1 auto;\n }\n\n &-left {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n }\n\n &-center {\n display: flex;\n align-items: center;\n min-width: 0;\n }\n\n &-actions {\n display: flex;\n gap: var(--spacing-s, 8px);\n flex-wrap: wrap;\n flex-shrink: 0;\n align-items: center;\n justify-content: flex-end;\n }\n\n &-divider {\n margin-top: var(--spacing-s, 8px);\n }\n\n &-size {\n &-small {\n --section-header-title-size: var(--header-small-font-size, 16px);\n --section-header-subtitle-size: 12px;\n --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n }\n\n &-medium {\n --section-header-title-size: var(--header-medium-font-size, 18px);\n --section-header-subtitle-size: 14px;\n --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n }\n\n &-large {\n --section-header-title-size: var(--header-font-size, 24px);\n --section-header-subtitle-size: 15px;\n --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n }\n }\n}\n\n@media (max-width: 640px) {\n .sectionHeader-center {\n flex: 1 1 100%;\n }\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"sectionHeader.module.mjs","names":[],"sources":["../../../../package/common/sectionHeader/sectionHeader.module.pcss"],"sourcesContent":[".sectionHeader {\n display: flex;\n flex-wrap: wrap;\n gap: var(--spacing-m, 16px);\n align-items: center;\n color: var(--text-color);\n\n &-leading {\n display: flex;\n justify-content: center;\n align-items: center;\n width: var(--section-header-leading-size);\n height: var(--section-header-leading-size);\n color: var(--primary-color);\n background: var(--background-accent);\n border-radius: var(--default-border-radius);\n overflow: hidden;\n background-size: cover;\n background-position: center;\n flex-shrink: 0;\n font-size: calc(var(--section-header-leading-size) * 0.5);\n }\n\n &-titles {\n display: flex;\n flex-flow: column;\n flex: 0 1 auto;\n gap: 2px;\n min-width: 0;\n }\n\n &-title {\n margin: 0;\n font-size: var(--section-header-title-size);\n font-weight: var(--header-font-weight, 600);\n line-height: 1.2;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &-subtitle {\n color: var(--text-dark);\n font-weight: 300;\n font-size: var(--section-header-subtitle-size);\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &-trailing {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n gap: var(--spacing-m, 16px);\n flex: 1 1 auto;\n }\n\n &-left {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n }\n\n &-center {\n display: flex;\n align-items: center;\n min-width: 0;\n }\n\n &-actions {\n display: flex;\n gap: var(--spacing-s, 8px);\n flex-wrap: wrap;\n flex-shrink: 0;\n align-items: center;\n justify-content: flex-end;\n }\n\n &-divider {\n margin-top: var(--spacing-s, 8px);\n }\n\n &-size {\n &-small {\n --section-header-title-size: var(--header-small-font-size, 16px);\n --section-header-subtitle-size: 12px;\n --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n }\n\n &-medium {\n --section-header-title-size: var(--header-medium-font-size, 18px);\n --section-header-subtitle-size: 14px;\n --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n }\n\n &-large {\n --section-header-title-size: var(--header-font-size, 24px);\n --section-header-subtitle-size: 15px;\n --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n }\n }\n}\n\n@media (max-width: 640px) {\n .sectionHeader-center:not(:empty) {\n flex: 1 1 100%;\n }\n}\n"],"mappings":""}
|