vipassana-design-standards 0.0.19 → 0.0.21

package/src/stylesheets/fonts.scss

@@ -1,331 +0,0 @@
-/* Declare font base on language.
-   Code generated in index.html #css-variables
-*/
-
-:root { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="en"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="bg"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="cs"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="de"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="el"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="es"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="fa"] { --vds-font-family: 'Noto Sans Arabic'; --vds-headings-font-family: 'Noto Sans Arabic'; }
-[lang="fi"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="fr"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="gu"] { --vds-font-family: 'Noto Sans Gujarati'; --vds-headings-font-family: 'Noto Sans Gujarati'; }
-[lang="he"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="hi"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="hu"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="id"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="it"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="ja"] { --vds-font-family: 'Noto Sans JP'; --vds-headings-font-family: 'Noto Sans JP'; }
-[lang="km"] { --vds-font-family: 'Noto Sans Khmer'; --vds-headings-font-family: 'Noto Sans Khmer'; }
-[lang="ko"] { --vds-font-family: 'Noto Sans KR'; --vds-headings-font-family: 'Noto Sans KR'; }
-[lang="lt"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="lv"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="mk"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="mr"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="nl"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="or"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="pl"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="pt"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="ro"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="ru"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="si"] { --vds-font-family: 'Noto Sans Sinhala'; --vds-headings-font-family: 'Noto Sans Sinhala'; }
-[lang="sl"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="sr"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="sv"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="ta"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="te"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="th"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="tr"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="vi"] { --vds-font-family: 'Noto Sans'; --vds-headings-font-family: 'FootLight'; }
-[lang="zh-HANS"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="zh-HANT"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-[lang="zh-HANT-HK"] { --vds-font-family: 'Lato'; --vds-headings-font-family: 'FootLight'; }
-
-/* Main fonts */
-
-@font-face {
-  font-family: 'FootLight';
-  src: url('https://design-standards.dhamma.org/dist/fonts/FootlightMTProLight.woff');
-  font-weight: normal;
-  font-style: normal;
-}
-@font-face {
-  font-family: 'FootLight';
-  src: url('https://design-standards.dhamma.org/dist/fonts/FootlightMTProRegular.woff');
-  font-weight: 600;
-  font-style: normal;
-}
-@font-face {
-  font-family: 'Lato';
-  src: url('https://design-standards.dhamma.org/dist/fonts/Lato-Regular.woff');
-  font-weight: normal;
-  font-style: normal;
-}
-@font-face {
-  font-family: 'Lato';
-  src: url('https://design-standards.dhamma.org/dist/fonts/Lato-Light.woff');
-  font-weight: 300;
-  font-style: normal;
-}
-@font-face {
-  font-family: 'Lato';
-  src: url('https://design-standards.dhamma.org/dist/fonts/Lato-Bold.woff');
-  font-weight: 800;
-  font-style: normal;
-}
-
-/* Special fonts downloaded from google for specific languages */
-/* <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Gujarati:wght@300;400
-family=Noto+Sans+JP:wght@300;400
-family=Noto+Sans+KR:wght@300;400
-family=Noto+Sans+Sinhala:wght@300;500
-family=Noto+Sans:wght@200
-family=Noto+Sans+Khmer:wght@300;400
-family=Noto+Sans+Arabic:wght@200;400&display=swap" rel="stylesheet"> */
-/* <link href="https://fonts.googleapis.com/css2?
-
-family=Noto+Sans+Gujarati:wght@300;400
-family=Noto+Sans+JP:wght@300;400
-family=Noto+Sans+KR:wght@300;400
-family=Noto+Sans+Sinhala:wght@300;500
-family=Noto+Sans:wght@200
-family=Noto+Sans+Khmer:wght@300;400
-family=Noto+Sans+Arabic:wght@200;400
-
-
-/* cyrillic-ext */
-@font-face {
-  font-family: 'Noto Sans';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosans/v28/o-0NIpQlx3QUlC5A4PNjKhVVadyB1Wk.woff2) format('woff2');
-  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
-}
-
-/* cyrillic */
-@font-face {
-  font-family: 'Noto Sans';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosans/v28/o-0NIpQlx3QUlC5A4PNjKhVVYNyB1Wk.woff2) format('woff2');
-  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
-}
-
-/* devanagari */
-@font-face {
-  font-family: 'Noto Sans';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosans/v28/o-0NIpQlx3QUlC5A4PNjKhVVZdyB1Wk.woff2) format('woff2');
-  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF;
-}
-
-/* greek-ext */
-@font-face {
-  font-family: 'Noto Sans';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosans/v28/o-0NIpQlx3QUlC5A4PNjKhVVaNyB1Wk.woff2) format('woff2');
-  unicode-range: U+1F00-1FFF;
-}
-
-/* greek */
-@font-face {
-  font-family: 'Noto Sans';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosans/v28/o-0NIpQlx3QUlC5A4PNjKhVVZ9yB1Wk.woff2) format('woff2');
-  unicode-range: U+0370-03FF;
-}
-
-/* vietnamese */
-@font-face {
-  font-family: 'Noto Sans';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosans/v28/o-0NIpQlx3QUlC5A4PNjKhVVa9yB1Wk.woff2) format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
-}
-
-/* latin-ext */
-@font-face {
-  font-family: 'Noto Sans';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosans/v28/o-0NIpQlx3QUlC5A4PNjKhVVatyB1Wk.woff2) format('woff2');
-  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-  font-family: 'Noto Sans';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosans/v28/o-0NIpQlx3QUlC5A4PNjKhVVZNyB.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* arabic */
-@font-face {
-  font-family: 'Noto Sans Arabic';
-  font-style: normal;
-  font-weight: 200;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosansarabic/v18/nwpCtLGrOAZMl5nJ_wfgRg3DrWFZWsnVBJ_sS6tlqHHFlj4wv4o.woff2) format('woff2');
-  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* arabic */
-@font-face {
-  font-family: 'Noto Sans Arabic';
-  font-style: normal;
-  font-weight: 400;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosansarabic/v18/nwpCtLGrOAZMl5nJ_wfgRg3DrWFZWsnVBJ_sS6tlqHHFlj4wv4o.woff2) format('woff2');
-  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* khmer */
-@font-face {
-  font-family: 'Noto Sans Khmer';
-  font-style: normal;
-  font-weight: 300;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanskhmer/v23/ijwCs5roRME5LLRxjsRb-gssOenAyendxrgV2c-Zw-9vR1IFeh7j.woff2) format('woff2');
-  unicode-range: U+1780-17FF, U+19E0-19FF, U+200C, U+25CC;
-}
-
-/* latin-ext */
-@font-face {
-  font-family: 'Noto Sans Khmer';
-  font-style: normal;
-  font-weight: 300;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanskhmer/v23/ijwCs5roRME5LLRxjsRb-gssOenAyendxrgV2c-Zw-9vR1cFeh7j.woff2) format('woff2');
-  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-  font-family: 'Noto Sans Khmer';
-  font-style: normal;
-  font-weight: 300;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanskhmer/v23/ijwCs5roRME5LLRxjsRb-gssOenAyendxrgV2c-Zw-9vR1kFeg.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* khmer */
-@font-face {
-  font-family: 'Noto Sans Khmer';
-  font-style: normal;
-  font-weight: 400;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanskhmer/v23/ijwCs5roRME5LLRxjsRb-gssOenAyendxrgV2c-Zw-9vR1IFeh7j.woff2) format('woff2');
-  unicode-range: U+1780-17FF, U+19E0-19FF, U+200C, U+25CC;
-}
-
-/* latin-ext */
-@font-face {
-  font-family: 'Noto Sans Khmer';
-  font-style: normal;
-  font-weight: 400;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanskhmer/v23/ijwCs5roRME5LLRxjsRb-gssOenAyendxrgV2c-Zw-9vR1cFeh7j.woff2) format('woff2');
-  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-  font-family: 'Noto Sans Khmer';
-  font-style: normal;
-  font-weight: 400;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanskhmer/v23/ijwCs5roRME5LLRxjsRb-gssOenAyendxrgV2c-Zw-9vR1kFeg.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* sinhala */
-@font-face {
-  font-family: 'Noto Sans Sinhala';
-  font-style: normal;
-  font-weight: 300;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanssinhala/v26/yMJ7MJBya43H0SUF_WmcBEEf4rQVO2P524V5N_MxQzQtb-t19Pqq4-E.woff2) format('woff2');
-  unicode-range: U+0964-0965, U+0D81-0DF4, U+200C-200D, U+25CC, U+111E1-111F4;
-}
-
-/* latin-ext */
-@font-face {
-  font-family: 'Noto Sans Sinhala';
-  font-style: normal;
-  font-weight: 300;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanssinhala/v26/yMJ7MJBya43H0SUF_WmcBEEf4rQVO2P524V5N_MxQzQtb-t15_qq4-E.woff2) format('woff2');
-  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-  font-family: 'Noto Sans Sinhala';
-  font-style: normal;
-  font-weight: 300;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanssinhala/v26/yMJ7MJBya43H0SUF_WmcBEEf4rQVO2P524V5N_MxQzQtb-t16fqq.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* sinhala */
-@font-face {
-  font-family: 'Noto Sans Sinhala';
-  font-style: normal;
-  font-weight: 500;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanssinhala/v26/yMJ7MJBya43H0SUF_WmcBEEf4rQVO2P524V5N_MxQzQtb-t19Pqq4-E.woff2) format('woff2');
-  unicode-range: U+0964-0965, U+0D81-0DF4, U+200C-200D, U+25CC, U+111E1-111F4;
-}
-
-/* latin-ext */
-@font-face {
-  font-family: 'Noto Sans Sinhala';
-  font-style: normal;
-  font-weight: 500;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanssinhala/v26/yMJ7MJBya43H0SUF_WmcBEEf4rQVO2P524V5N_MxQzQtb-t15_qq4-E.woff2) format('woff2');
-  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-  font-family: 'Noto Sans Sinhala';
-  font-style: normal;
-  font-weight: 500;
-  font-stretch: 100%;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/notosanssinhala/v26/yMJ7MJBya43H0SUF_WmcBEEf4rQVO2P524V5N_MxQzQtb-t16fqq.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}

package/src/stylesheets/index.css

@@ -1,179 +0,0 @@
-:root {
-  --gold-dark: #9C6B14;
-  --black: #4F4D47;
-  --gold: #B78730;
-  --blue: #1E3461;
-}
-
-body {
-  font-size: 18px;
-  font-family: 'Lato';
-  line-height: 1.7;
-  margin: 0;
-  padding: 0;
-  color: var(--black);
-}
-.container {
-  visibility: hidden;
-  width: 900px;
-  margin: 0 auto;
-  padding: 1rem;
-}
-.container.ready {
-  visibility: visible;
-}
-.container h2:not(:first-child) {
-  margin-top: 5rem;
-}
-header {
-  font-size: 2rem;
-  margin: 0;
-}
-header .container {
-  padding-bottom: .5rem;
-}
-
-section.main {
-  background: var(--black);
-  padding: 1rem 0;
-  text-align: center
-}
-section.main h2 {
-  line-height: 2rem;
-  margin-top: 0;
-  color: white;
-}
-.logo-container {
-  margin-top: 2rem;
-  margin-bottom: 2rem;
-}
-.logo-container.night {
-  background: var(--black);
-  padding: 1rem;
-  padding-bottom: 0.4rem;
-  border-radius: 3px;
-}
-a {
-  color: var(--gold-dark) !important;
-}
-button {
-  border: none;
-  padding: .4rem .7rem;
-  border-radius: .3rem;
-  font-weight: bold;
-  font-family: inherit;
-  color: white;
-  background-color: var(--black);
-  cursor: pointer;
-  font-size: 1rem;
-  display: inline-flex;
-  align-items: center;
-}
-button.btn-primary {
-  background-color: var(--gold);
-}
-button.btn-outline-primary {
-  border: 1px solid var(--gold);
-  background-color: transparent;
-  color: var(--gold);
-}
-
-button i {
-  display: inline-block !important;
-  margin-right: .25em;
-  --ggs: .8;
-}
-
-select {
-  color: var(--black);
-  --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
-  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
-  font-size: 1rem;
-  font-weight: 400;
-  background-color: white;
-  background-image: var(--bs-form-select-bg-img),var(--bs-form-select-bg-icon,none);
-  background-repeat: no-repeat;
-  background-position: right 0.75rem center;
-  background-size: 16px 12px;
-  border: 1px solid #dee2e6;
-  border-radius: 3px;
-  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.filters {
-  margin-bottom: 1rem;
-  display: flex;
-  align-items: center;
-}
-
-select, button {
-  margin-right: .5em;
-}
-
-.alert {
-  font-size: .8em;
-  background: #b787301c;
-  padding: 0.7rem 1.2rem;
-  margin-top: 0.25rem;
-  display: inline-block;
-  border-radius: 3px;
-}
-
-.vipassana-logo, canvas {
-  /* out of screen */
-  visibility: hidden;
-  position: absolute;
-  left: -200vw;
-}
-
-.main-links a {
-  text-decoration: none !important;
-}
-.main-links a small {
-  margin-top: 3px;
-  font-size: .8em;
-  opacity: .8;
-  margin-left: 0.25em;
-}
-.main-links p {
-  margin-bottom: 0;
-}
-
-.color-container {
-  display: flex;
-  align-items: center;
-  margin-bottom: 1rem;
-}
-.color-container .background {
-  height: 2.5rem;
-  color: white;
-  display: flex;
-  align-items: center;
-  width: 7rem;
-  justify-content: center;
-  font-size: .9em;
-  border-radius: 3px;
-}
-.color-container .description {
-  padding-left: 1rem;
-}
-footer {
-  background: #4f4d471c;
-  text-align: center;
-  padding: 2rem 0;
-  margin-top: 2rem;
-  font-size: .9rem,
-}
-footer a {
-  color: inherit !important;
-}
-pre {
-  overflow: auto;
-  border-radius: 3px;
-  font-size: .9rem;
-  padding: 1rem;
-  background-color: #f8f9fa;
-}

package/src/stylesheets/layout/vds-header.scss

@@ -1,42 +0,0 @@
-.vds-header {
-  text-align: center;
-  position: relative;
-  background-color: white;
-  color: $primary;
-  display: flex;
-  align-items: center;
-  @extend .d-print-none;
-
-  border-bottom: 2px solid $secondary;
-  @include media-breakpoint-up(md) {
-    border-top: 1.25rem solid $primary;
-  }
-
-  .vds-container {
-    --header-y-padding: 1rem;
-    @include media-breakpoint-down(md) {
-      --header-y-padding: .5rem;
-    }
-    padding: var(--header-y-padding) var(--layout-padding);
-  }
-
-  .vds-logo-link {
-    display: inline-flex;
-    text-decoration: none;
-
-    svg {
-      max-height: 40px;
-      max-width: 100%;
-      @include media-breakpoint-up(md) {
-        max-height: 70px;
-      }
-    }
-  }
-
-  .vds-locale-picker {
-    border: none;
-    padding-left: 0.7em;
-    color: $primary;
-    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 18'%3e%3cpath fill='none' stroke='%231e3461' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
-  }
-}

package/src/stylesheets/layout/vds-layout.scss

@@ -1,90 +0,0 @@
-html, body {
-  height: 100%;
-}
-
-.vds-body {
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-
-  --page-max-width: 100%;
-
-  &:not(.iframe) {
-    @include media-breakpoint-up(xl) {
-      --page-max-width: 900px;
-      &.with-sidenav {
-        --page-max-width: 1100px;
-      }
-    }
-  }
-
-  .vds-page {
-    display: flex;
-    flex-grow: 1;
-
-    .vds-page-content {
-      flex-grow: 1;
-      @extend .bg-body;
-
-      & > h1:first-child, & > h2:first-child {
-        margin-top: 0;
-      }
-    }
-  }
-
-}
-
-// The container so eery part of the page have same content-width
-.vds-container {
-  width: 100%;
-  max-width: var(--page-max-width);
-  margin-left: auto;
-  margin-right: auto;
-}
-
-// wait for vue to be loaded to display it
-.vue-container {
-  --page-content-opacity: 0;
-  &.mounted {
-    --page-content-opacity: 1;
-  }
-
-  .vds-page-real-content {
-    transition: opacity .3s;
-    opacity: var(--page-content-opacity);
-  }
-}
-
-//  Sticky footer
-.vds-header-and-content {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  flex-grow: 1;
-
-  .vds-page-content {
-    padding: var(--layout-padding);
-  }
-}
-
-.vds-footer {
-  background-color: var(--bs-primary);
-  color: white;
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-
-  .vds-container {
-    padding: 1rem var(--layout-padding);
-  }
-
-  a {
-    color: white;
-    text-decoration: none;
-    &:hover {
-      color: white;
-      text-decoration: underline;
-    }
-  }
-}

package/src/stylesheets/layout/vds-mixins.scss

@@ -1,5 +0,0 @@
-@mixin page-width($width) {
-  .vds-page {
-    --page-max-width: #{$width};
-  }
-}

package/src/stylesheets/layout/vds-sidenav.scss

@@ -1,43 +0,0 @@
-.vds-sidenav {
-  background-color: $gold-200;
-  margin-right: 1rem;
-  padding: var(--layout-padding);
-  font-size: 1.25rem;
-  @extend .d-none;
-  @extend .d-lg-block;
-  @extend .d-print-none;
-  @extend .flex-shrink-0;
-
-  ul {
-    @extend .sticky-top;
-    top: 1rem;
-    z-index: 100;
-
-    a {
-      font-family: $headings-font-family;
-      font-weight: 600;
-      &.active {
-        color: $gold-600;
-      }
-    }
-  }
-}
-
-.vds-mobile-sidenav {
-  .locale-icon {
-    display: none;
-  }
-}
-
-.vds-sidenav, .vds-mobile-sidenav {
-  ul {
-    @extend .list-unstyled;
-    @extend .flex-column;
-
-    li {
-      a {
-        @extend .text-decoration-none;
-      }
-    }
-  }
-}