diff --git a/src/scss/cdb-components/forms/tabsForms.scss b/src/scss/cdb-components/forms/tabsForms.scss new file mode 100644 index 0000000..d0b5f34 --- /dev/null +++ b/src/scss/cdb-components/forms/tabsForms.scss @@ -0,0 +1,101 @@ +// Tabs Forms styles +// ---------------------------------------------- + +/* SG +# Forms/TabsForms + +``` +
+ +
+``` +*/ + +@import '../../cdb-utilities/mixins'; +@import '../../cdb-variables/sizes'; +@import '../../cdb-variables/colors'; + + +.CDB-TabsForms { + border: 1px solid $cMainLine; + border-radius: 4px; +} +.CDB-TabsForms-inner { + @include display-flex(); +} +.CDB-TabsForms-item { + border-left: 1px solid $cSecondaryLine; +} +.CDB-TabsForms-item:first-child { + border-left: 0; +} +.CDB-TabsForms-button { + padding: 7px 8px; +} + + + + + + diff --git a/src/scss/cdb-components/shapes/paragraph.scss b/src/scss/cdb-components/shapes/paragraph.scss new file mode 100644 index 0000000..548b574 --- /dev/null +++ b/src/scss/cdb-components/shapes/paragraph.scss @@ -0,0 +1,112 @@ +/* SG +# Shapes/Paragrapgh + +Description + +``` +

16px

+
+
+
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+``` +*/ + +@import '../../cdb-variables/colors'; + +.CDB-Shape-paragraph { + padding-top: 3px; + text-align: left; +} +.CDB-Shape-paragraph.is-center { + text-align: center; +} +.CDB-Shape-paragraph.is-right { + text-align: right; +} +.CDB-Shape-paragraphItem { + height: 1px; + margin-bottom: 2px; +} +.CDB-Shape-paragraphItem:last-child { + margin-bottom: 0; +} + +.CDB-Shape-paragraphBar { + display: inline-block; + height: 1px; + margin-bottom: 2px; + background: $cSecondaryLine; + vertical-align: top; +} + +.CDB-Shape-paragraph.is-active .CDB-Shape-paragraphBar { + background: $cBlue; +} + +.CDB-Shape-paragraphBar--01 { + width: 12px; +} +.CDB-Shape-paragraphBar--02 { + width: 6px; +} +.CDB-Shape-paragraphBar--03 { + width: 8px; +} +.CDB-Shape-paragraphBar--04 { + width: 4px; +}