@fundamental-styles/common-css 0.0.1-rc.0 → 0.24.0-rc.102

package/dist/semantic/semantic-label-sap_fiori_3_hcb-sap_fiori_3_light_dark.css

@@ -1,87 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/*
-WHY THIS:
-Other semantic grids don't eaily allow for fixed gutter widths
-nor do they take advantage of the CSS calc function
-and they can get kind of confusing.
-This is meant for simple layout problems — 
-i.e., you have a box and you need three cols inside of equal widths
-with gutters between.
-
-The FLOW terminology is meant to be netural outside of rows and columns
-and comes from the HTML5 spec referring to elements that can contain other elements
-http://w3c.github.io/html/dom.html#kinds-of-content-flow-content
-
-USAGE:
-— Outer containers should contain the `@include flow-box` base styles
-— Columns get `@include flow` with `$span` and `$cols` params
-
-EXAMPLE MARKUP:
-<section>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-</section>
-
-EXAMPLE CSS:
-section {
-  @include flow-box()
-  .box {
-    @include flow(2);
-    &:first-child {
-      @include flow-shift(2);
-    }
-  }
-}
-
-OUTPUT:
-This will render 4 boxes spanning 2 cols each indented 2 cols
-(based on defaults)
-
-|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
-          |  box  | |  box  | |  box  | |  box  |
-
-*/
-/*
-   Fully expanded pseudo element
-   Requires parent to have specified position
-*/
-label {
-  font-size: var(--sapFontSize);
-  line-height: var(--sapContent_LineHeight);
-  color: var(--sapTextColor);
-  font-family: var(--sapFontFamily);
-  font-weight: normal;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: fit-content;
-  position: relative;
-  max-width: 100%;
-  font-size: var(--sapFontSize);
-  color: var(--sapContent_LabelColor);
-  margin-right: 0.5rem;
-  cursor: text;
-  align-self: flex-start;
-}
-
-label::before, label::after {
-  box-sizing: inherit;
-  font-size: inherit;
-}
-
-[dir="rtl"] label, label[dir="rtl"] {
-  margin-left: 0.5rem;
-  margin-right: 0;
-}

package/dist/semantic/semantic-label-sap_fiori_3_hcb.css

@@ -1,87 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/*
-WHY THIS:
-Other semantic grids don't eaily allow for fixed gutter widths
-nor do they take advantage of the CSS calc function
-and they can get kind of confusing.
-This is meant for simple layout problems — 
-i.e., you have a box and you need three cols inside of equal widths
-with gutters between.
-
-The FLOW terminology is meant to be netural outside of rows and columns
-and comes from the HTML5 spec referring to elements that can contain other elements
-http://w3c.github.io/html/dom.html#kinds-of-content-flow-content
-
-USAGE:
-— Outer containers should contain the `@include flow-box` base styles
-— Columns get `@include flow` with `$span` and `$cols` params
-
-EXAMPLE MARKUP:
-<section>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-</section>
-
-EXAMPLE CSS:
-section {
-  @include flow-box()
-  .box {
-    @include flow(2);
-    &:first-child {
-      @include flow-shift(2);
-    }
-  }
-}
-
-OUTPUT:
-This will render 4 boxes spanning 2 cols each indented 2 cols
-(based on defaults)
-
-|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
-          |  box  | |  box  | |  box  | |  box  |
-
-*/
-/*
-   Fully expanded pseudo element
-   Requires parent to have specified position
-*/
-label {
-  font-size: var(--sapFontSize);
-  line-height: var(--sapContent_LineHeight);
-  color: var(--sapTextColor);
-  font-family: var(--sapFontFamily);
-  font-weight: normal;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: fit-content;
-  position: relative;
-  max-width: 100%;
-  font-size: var(--sapFontSize);
-  color: var(--sapContent_LabelColor);
-  margin-right: 0.5rem;
-  cursor: text;
-  align-self: flex-start;
-}
-
-label::before, label::after {
-  box-sizing: inherit;
-  font-size: inherit;
-}
-
-[dir="rtl"] label, label[dir="rtl"] {
-  margin-left: 0.5rem;
-  margin-right: 0;
-}

package/dist/semantic/semantic-label-sap_fiori_3_hcw-sap_fiori_3.css

@@ -1,87 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/*
-WHY THIS:
-Other semantic grids don't eaily allow for fixed gutter widths
-nor do they take advantage of the CSS calc function
-and they can get kind of confusing.
-This is meant for simple layout problems — 
-i.e., you have a box and you need three cols inside of equal widths
-with gutters between.
-
-The FLOW terminology is meant to be netural outside of rows and columns
-and comes from the HTML5 spec referring to elements that can contain other elements
-http://w3c.github.io/html/dom.html#kinds-of-content-flow-content
-
-USAGE:
-— Outer containers should contain the `@include flow-box` base styles
-— Columns get `@include flow` with `$span` and `$cols` params
-
-EXAMPLE MARKUP:
-<section>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-</section>
-
-EXAMPLE CSS:
-section {
-  @include flow-box()
-  .box {
-    @include flow(2);
-    &:first-child {
-      @include flow-shift(2);
-    }
-  }
-}
-
-OUTPUT:
-This will render 4 boxes spanning 2 cols each indented 2 cols
-(based on defaults)
-
-|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
-          |  box  | |  box  | |  box  | |  box  |
-
-*/
-/*
-   Fully expanded pseudo element
-   Requires parent to have specified position
-*/
-label {
-  font-size: var(--sapFontSize);
-  line-height: var(--sapContent_LineHeight);
-  color: var(--sapTextColor);
-  font-family: var(--sapFontFamily);
-  font-weight: normal;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: fit-content;
-  position: relative;
-  max-width: 100%;
-  font-size: var(--sapFontSize);
-  color: var(--sapContent_LabelColor);
-  margin-right: 0.5rem;
-  cursor: text;
-  align-self: flex-start;
-}
-
-label::before, label::after {
-  box-sizing: inherit;
-  font-size: inherit;
-}
-
-[dir="rtl"] label, label[dir="rtl"] {
-  margin-left: 0.5rem;
-  margin-right: 0;
-}

package/dist/semantic/semantic-label-sap_fiori_3_hcw-sap_fiori_3_dark.css

@@ -1,87 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/*
-WHY THIS:
-Other semantic grids don't eaily allow for fixed gutter widths
-nor do they take advantage of the CSS calc function
-and they can get kind of confusing.
-This is meant for simple layout problems — 
-i.e., you have a box and you need three cols inside of equal widths
-with gutters between.
-
-The FLOW terminology is meant to be netural outside of rows and columns
-and comes from the HTML5 spec referring to elements that can contain other elements
-http://w3c.github.io/html/dom.html#kinds-of-content-flow-content
-
-USAGE:
-— Outer containers should contain the `@include flow-box` base styles
-— Columns get `@include flow` with `$span` and `$cols` params
-
-EXAMPLE MARKUP:
-<section>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-</section>
-
-EXAMPLE CSS:
-section {
-  @include flow-box()
-  .box {
-    @include flow(2);
-    &:first-child {
-      @include flow-shift(2);
-    }
-  }
-}
-
-OUTPUT:
-This will render 4 boxes spanning 2 cols each indented 2 cols
-(based on defaults)
-
-|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
-          |  box  | |  box  | |  box  | |  box  |
-
-*/
-/*
-   Fully expanded pseudo element
-   Requires parent to have specified position
-*/
-label {
-  font-size: var(--sapFontSize);
-  line-height: var(--sapContent_LineHeight);
-  color: var(--sapTextColor);
-  font-family: var(--sapFontFamily);
-  font-weight: normal;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: fit-content;
-  position: relative;
-  max-width: 100%;
-  font-size: var(--sapFontSize);
-  color: var(--sapContent_LabelColor);
-  margin-right: 0.5rem;
-  cursor: text;
-  align-self: flex-start;
-}
-
-label::before, label::after {
-  box-sizing: inherit;
-  font-size: inherit;
-}
-
-[dir="rtl"] label, label[dir="rtl"] {
-  margin-left: 0.5rem;
-  margin-right: 0;
-}

package/dist/semantic/semantic-label-sap_fiori_3_hcw-sap_fiori_3_hcb.css

@@ -1,87 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/*
-WHY THIS:
-Other semantic grids don't eaily allow for fixed gutter widths
-nor do they take advantage of the CSS calc function
-and they can get kind of confusing.
-This is meant for simple layout problems — 
-i.e., you have a box and you need three cols inside of equal widths
-with gutters between.
-
-The FLOW terminology is meant to be netural outside of rows and columns
-and comes from the HTML5 spec referring to elements that can contain other elements
-http://w3c.github.io/html/dom.html#kinds-of-content-flow-content
-
-USAGE:
-— Outer containers should contain the `@include flow-box` base styles
-— Columns get `@include flow` with `$span` and `$cols` params
-
-EXAMPLE MARKUP:
-<section>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-</section>
-
-EXAMPLE CSS:
-section {
-  @include flow-box()
-  .box {
-    @include flow(2);
-    &:first-child {
-      @include flow-shift(2);
-    }
-  }
-}
-
-OUTPUT:
-This will render 4 boxes spanning 2 cols each indented 2 cols
-(based on defaults)
-
-|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
-          |  box  | |  box  | |  box  | |  box  |
-
-*/
-/*
-   Fully expanded pseudo element
-   Requires parent to have specified position
-*/
-label {
-  font-size: var(--sapFontSize);
-  line-height: var(--sapContent_LineHeight);
-  color: var(--sapTextColor);
-  font-family: var(--sapFontFamily);
-  font-weight: normal;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: fit-content;
-  position: relative;
-  max-width: 100%;
-  font-size: var(--sapFontSize);
-  color: var(--sapContent_LabelColor);
-  margin-right: 0.5rem;
-  cursor: text;
-  align-self: flex-start;
-}
-
-label::before, label::after {
-  box-sizing: inherit;
-  font-size: inherit;
-}
-
-[dir="rtl"] label, label[dir="rtl"] {
-  margin-left: 0.5rem;
-  margin-right: 0;
-}

package/dist/semantic/semantic-label-sap_fiori_3_hcw-sap_fiori_3_hcw.css

@@ -1,87 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/*
-WHY THIS:
-Other semantic grids don't eaily allow for fixed gutter widths
-nor do they take advantage of the CSS calc function
-and they can get kind of confusing.
-This is meant for simple layout problems — 
-i.e., you have a box and you need three cols inside of equal widths
-with gutters between.
-
-The FLOW terminology is meant to be netural outside of rows and columns
-and comes from the HTML5 spec referring to elements that can contain other elements
-http://w3c.github.io/html/dom.html#kinds-of-content-flow-content
-
-USAGE:
-— Outer containers should contain the `@include flow-box` base styles
-— Columns get `@include flow` with `$span` and `$cols` params
-
-EXAMPLE MARKUP:
-<section>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-</section>
-
-EXAMPLE CSS:
-section {
-  @include flow-box()
-  .box {
-    @include flow(2);
-    &:first-child {
-      @include flow-shift(2);
-    }
-  }
-}
-
-OUTPUT:
-This will render 4 boxes spanning 2 cols each indented 2 cols
-(based on defaults)
-
-|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
-          |  box  | |  box  | |  box  | |  box  |
-
-*/
-/*
-   Fully expanded pseudo element
-   Requires parent to have specified position
-*/
-label {
-  font-size: var(--sapFontSize);
-  line-height: var(--sapContent_LineHeight);
-  color: var(--sapTextColor);
-  font-family: var(--sapFontFamily);
-  font-weight: normal;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: fit-content;
-  position: relative;
-  max-width: 100%;
-  font-size: var(--sapFontSize);
-  color: var(--sapContent_LabelColor);
-  margin-right: 0.5rem;
-  cursor: text;
-  align-self: flex-start;
-}
-
-label::before, label::after {
-  box-sizing: inherit;
-  font-size: inherit;
-}
-
-[dir="rtl"] label, label[dir="rtl"] {
-  margin-left: 0.5rem;
-  margin-right: 0;
-}

package/dist/semantic/semantic-label-sap_fiori_3_hcw-sap_fiori_3_light_dark.css

@@ -1,87 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/*
-WHY THIS:
-Other semantic grids don't eaily allow for fixed gutter widths
-nor do they take advantage of the CSS calc function
-and they can get kind of confusing.
-This is meant for simple layout problems — 
-i.e., you have a box and you need three cols inside of equal widths
-with gutters between.
-
-The FLOW terminology is meant to be netural outside of rows and columns
-and comes from the HTML5 spec referring to elements that can contain other elements
-http://w3c.github.io/html/dom.html#kinds-of-content-flow-content
-
-USAGE:
-— Outer containers should contain the `@include flow-box` base styles
-— Columns get `@include flow` with `$span` and `$cols` params
-
-EXAMPLE MARKUP:
-<section>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-</section>
-
-EXAMPLE CSS:
-section {
-  @include flow-box()
-  .box {
-    @include flow(2);
-    &:first-child {
-      @include flow-shift(2);
-    }
-  }
-}
-
-OUTPUT:
-This will render 4 boxes spanning 2 cols each indented 2 cols
-(based on defaults)
-
-|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
-          |  box  | |  box  | |  box  | |  box  |
-
-*/
-/*
-   Fully expanded pseudo element
-   Requires parent to have specified position
-*/
-label {
-  font-size: var(--sapFontSize);
-  line-height: var(--sapContent_LineHeight);
-  color: var(--sapTextColor);
-  font-family: var(--sapFontFamily);
-  font-weight: normal;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: fit-content;
-  position: relative;
-  max-width: 100%;
-  font-size: var(--sapFontSize);
-  color: var(--sapContent_LabelColor);
-  margin-right: 0.5rem;
-  cursor: text;
-  align-self: flex-start;
-}
-
-label::before, label::after {
-  box-sizing: inherit;
-  font-size: inherit;
-}
-
-[dir="rtl"] label, label[dir="rtl"] {
-  margin-left: 0.5rem;
-  margin-right: 0;
-}

package/dist/semantic/semantic-label-sap_fiori_3_hcw.css

@@ -1,87 +0,0 @@
-@charset "UTF-8";
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/* stylelint-disable */
-/* stylelint-enable */
-/*
-WHY THIS:
-Other semantic grids don't eaily allow for fixed gutter widths
-nor do they take advantage of the CSS calc function
-and they can get kind of confusing.
-This is meant for simple layout problems — 
-i.e., you have a box and you need three cols inside of equal widths
-with gutters between.
-
-The FLOW terminology is meant to be netural outside of rows and columns
-and comes from the HTML5 spec referring to elements that can contain other elements
-http://w3c.github.io/html/dom.html#kinds-of-content-flow-content
-
-USAGE:
-— Outer containers should contain the `@include flow-box` base styles
-— Columns get `@include flow` with `$span` and `$cols` params
-
-EXAMPLE MARKUP:
-<section>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-  <div class="box">x</div>
-</section>
-
-EXAMPLE CSS:
-section {
-  @include flow-box()
-  .box {
-    @include flow(2);
-    &:first-child {
-      @include flow-shift(2);
-    }
-  }
-}
-
-OUTPUT:
-This will render 4 boxes spanning 2 cols each indented 2 cols
-(based on defaults)
-
-|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
-          |  box  | |  box  | |  box  | |  box  |
-
-*/
-/*
-   Fully expanded pseudo element
-   Requires parent to have specified position
-*/
-label {
-  font-size: var(--sapFontSize);
-  line-height: var(--sapContent_LineHeight);
-  color: var(--sapTextColor);
-  font-family: var(--sapFontFamily);
-  font-weight: normal;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: fit-content;
-  position: relative;
-  max-width: 100%;
-  font-size: var(--sapFontSize);
-  color: var(--sapContent_LabelColor);
-  margin-right: 0.5rem;
-  cursor: text;
-  align-self: flex-start;
-}
-
-label::before, label::after {
-  box-sizing: inherit;
-  font-size: inherit;
-}
-
-[dir="rtl"] label, label[dir="rtl"] {
-  margin-left: 0.5rem;
-  margin-right: 0;
-}