@guebbit/css-toolkit 1.1.2 → 1.1.3
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.
- package/CHANGELOG +2 -0
- package/docs/.vitepress/dist/404.html +3 -3
- package/docs/.vitepress/dist/assets/{app.CpyNzro9.js → app.BlbAZR_S.js} +1 -1
- package/docs/.vitepress/dist/assets/chunks/@localSearchIndexroot.KjYvZcUz.js +1 -0
- package/docs/.vitepress/dist/assets/chunks/VPLocalSearchBox.BwVVD-os.js +7 -0
- package/docs/.vitepress/dist/assets/chunks/framework.Bt53DRYp.js +18 -0
- package/docs/.vitepress/dist/assets/chunks/{theme.CviQ0biq.js → theme.VODMs8XS.js} +2 -2
- package/docs/.vitepress/dist/assets/{colors_bootstrap.md.DiC9aO06.js → colors_bootstrap.md.Bfy-p7dM.js} +1 -1
- package/docs/.vitepress/dist/assets/{colors_bootstrap.md.DiC9aO06.lean.js → colors_bootstrap.md.Bfy-p7dM.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{colors_brands.md.Bp8_jfHR.js → colors_brands.md.Ch21qzT7.js} +1 -1
- package/docs/.vitepress/dist/assets/{colors_brands.md.Bp8_jfHR.lean.js → colors_brands.md.Ch21qzT7.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{colors_customs.md.DyEXln8b.js → colors_customs.md.CrumAnve.js} +1 -1
- package/docs/.vitepress/dist/assets/{colors_customs.md.DyEXln8b.lean.js → colors_customs.md.CrumAnve.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{functions_colors.md.CtYahXnA.js → functions_colors.md.Dz-AUCFY.js} +2 -4
- package/docs/.vitepress/dist/assets/{functions_colors.md.CtYahXnA.lean.js → functions_colors.md.Dz-AUCFY.lean.js} +2 -4
- package/docs/.vitepress/dist/assets/{functions_helpers.md.DZRTPA4t.js → functions_helpers.md.BLiEkjA1.js} +1 -1
- package/docs/.vitepress/dist/assets/{functions_helpers.md.DZRTPA4t.lean.js → functions_helpers.md.BLiEkjA1.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{functions_strings.md.BMMJdTdo.js → functions_strings.md.BHTeKsax.js} +1 -1
- package/docs/.vitepress/dist/assets/{functions_strings.md.BMMJdTdo.lean.js → functions_strings.md.BHTeKsax.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{index.md.2uetSBMH.js → index.md.Dwdim14B.js} +1 -1
- package/docs/.vitepress/dist/assets/{index.md.2uetSBMH.lean.js → index.md.Dwdim14B.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_build-aspect-ratio.md.8mabvpDg.js → mixins_build-aspect-ratio.md.l9MRJQQl.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_build-aspect-ratio.md.8mabvpDg.lean.js → mixins_build-aspect-ratio.md.l9MRJQQl.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_build-compatibility.md.cOIJ58bq.js → mixins_build-compatibility.md.t0sS5a2s.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_build-compatibility.md.cOIJ58bq.lean.js → mixins_build-compatibility.md.t0sS5a2s.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_build-scrollbar.md.DrR7vY38.js → mixins_build-scrollbar.md.C-TaPgpo.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_build-scrollbar.md.DrR7vY38.lean.js → mixins_build-scrollbar.md.C-TaPgpo.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_create-colors.md.FiVBK2v9.js → mixins_create-colors.md.Bs8hXar1.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_create-colors.md.FiVBK2v9.lean.js → mixins_create-colors.md.Bs8hXar1.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_create-helper-margin.md.B85aWiR9.js → mixins_create-helper-margin.md.BFzwO-0T.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_create-helper-margin.md.B85aWiR9.lean.js → mixins_create-helper-margin.md.BFzwO-0T.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_create-helper-padding.md._fxbDV5T.js → mixins_create-helper-padding.md.Ci6DL4m-.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_create-helper-padding.md._fxbDV5T.lean.js → mixins_create-helper-padding.md.Ci6DL4m-.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_create-instruction.md.DKI2LvdM.js → mixins_create-instruction.md.CGTPQqQv.js} +1 -1
- package/docs/.vitepress/dist/assets/{mixins_create-instruction.md.DKI2LvdM.lean.js → mixins_create-instruction.md.CGTPQqQv.lean.js} +1 -1
- package/docs/.vitepress/dist/assets/{style.DDLX1Ber.css → style.B-ztagZG.css} +1 -1
- package/docs/.vitepress/dist/colors/bootstrap.html +6 -6
- package/docs/.vitepress/dist/colors/brands.html +6 -6
- package/docs/.vitepress/dist/colors/customs.html +6 -6
- package/docs/.vitepress/dist/functions/colors.html +7 -9
- package/docs/.vitepress/dist/functions/helpers.html +6 -6
- package/docs/.vitepress/dist/functions/strings.html +6 -6
- package/docs/.vitepress/dist/hashmap.json +1 -1
- package/docs/.vitepress/dist/index.html +6 -6
- package/docs/.vitepress/dist/mixins/build-aspect-ratio.html +6 -6
- package/docs/.vitepress/dist/mixins/build-compatibility.html +6 -6
- package/docs/.vitepress/dist/mixins/build-scrollbar.html +6 -6
- package/docs/.vitepress/dist/mixins/create-colors.html +6 -6
- package/docs/.vitepress/dist/mixins/create-helper-margin.html +6 -6
- package/docs/.vitepress/dist/mixins/create-helper-padding.html +6 -6
- package/docs/.vitepress/dist/mixins/create-instruction.html +6 -6
- package/docs/functions/colors.md +1 -3
- package/package.json +13 -13
- package/src/colors/_bootstrap.scss +90 -89
- package/src/colors/_customs.scss +18 -16
- package/src/functions/_colors.scss +26 -35
- package/test/compile.test.js +9 -15
- package/test/test.css +5804 -5816
- package/test/test.scss +0 -6
- package/docs/.vitepress/dist/assets/chunks/@localSearchIndexroot.CYE7S9pS.js +0 -1
- package/docs/.vitepress/dist/assets/chunks/VPLocalSearchBox.DrgBd5f4.js +0 -7
- package/docs/.vitepress/dist/assets/chunks/framework.DJJi9g99.js +0 -17
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.Bt53DRYp.js";const o=JSON.parse('{"title":"Build Compatibility","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/build-compatibility.md","filePath":"mixins/build-compatibility.md"}'),l={name:"mixins/build-compatibility.md"};function e(h,s,p,k,r,d){return n(),a("div",null,s[0]||(s[0]=[t(`<h1 id="build-compatibility" tabindex="-1">Build Compatibility <a class="header-anchor" href="#build-compatibility" aria-label="Permalink to "Build Compatibility""></a></h1><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><p>Compatibility mode for browsers Firefox, Internet Explorer, Microsoft Edge, Opera (TODO), Safari (TODO)</p><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> guebbit-compatibility</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"ie"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ...</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h1 id="code" tabindex="-1">Code <a class="header-anchor" href="#code" aria-label="Permalink to "Code""></a></h1><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">/**</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">* Compatibility mode for browsers</span></span>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.Bt53DRYp.js";const o=JSON.parse('{"title":"Build Compatibility","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/build-compatibility.md","filePath":"mixins/build-compatibility.md"}'),l={name:"mixins/build-compatibility.md"};function e(h,s,p,k,r,d){return n(),a("div",null,s[0]||(s[0]=[t(`<h1 id="build-compatibility" tabindex="-1">Build Compatibility <a class="header-anchor" href="#build-compatibility" aria-label="Permalink to "Build Compatibility""></a></h1><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><p>Compatibility mode for browsers Firefox, Internet Explorer, Microsoft Edge, Opera (TODO), Safari (TODO)</p><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> guebbit-compatibility</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"ie"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ...</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h1 id="code" tabindex="-1">Code <a class="header-anchor" href="#code" aria-label="Permalink to "Code""></a></h1><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">/**</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">* Compatibility mode for browsers</span></span>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as l,o as t}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as l,o as t}from"./chunks/framework.Bt53DRYp.js";const g=JSON.parse('{"title":"Scrollbar","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/build-scrollbar.md","filePath":"mixins/build-scrollbar.md"}'),n={name:"mixins/build-scrollbar.md"};function h(e,s,k,p,r,d){return t(),a("div",null,s[0]||(s[0]=[l(`<h1 id="scrollbar" tabindex="-1">Scrollbar <a class="header-anchor" href="#scrollbar" aria-label="Permalink to "Scrollbar""></a></h1><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><p>Scrollbars of element</p><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> @include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> build-scrollbar</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">4</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">#fff</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">#000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">10</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div><h2 id="code" tabindex="-1">Code <a class="header-anchor" href="#code" aria-label="Permalink to "Code""></a></h2><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">/**</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * Builder - scrollbars of element</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * @param string $color</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * @param pixels $size</span></span>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as l,o as t}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as l,o as t}from"./chunks/framework.Bt53DRYp.js";const g=JSON.parse('{"title":"Scrollbar","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/build-scrollbar.md","filePath":"mixins/build-scrollbar.md"}'),n={name:"mixins/build-scrollbar.md"};function h(e,s,k,p,r,d){return t(),a("div",null,s[0]||(s[0]=[l(`<h1 id="scrollbar" tabindex="-1">Scrollbar <a class="header-anchor" href="#scrollbar" aria-label="Permalink to "Scrollbar""></a></h1><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><p>Scrollbars of element</p><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> @include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> build-scrollbar</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">4</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">#fff</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">#000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">10</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div><h2 id="code" tabindex="-1">Code <a class="header-anchor" href="#code" aria-label="Permalink to "Code""></a></h2><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">/**</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * Builder - scrollbars of element</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * @param string $color</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> * @param pixels $size</span></span>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_ as t,c as o,j as a,a as r,o as s}from"./chunks/framework.
|
|
1
|
+
import{_ as t,c as o,j as a,a as r,o as s}from"./chunks/framework.Bt53DRYp.js";const _=JSON.parse('{"title":"TODO","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/create-colors.md","filePath":"mixins/create-colors.md"}'),c={name:"mixins/create-colors.md"};function n(i,e,d,l,m,p){return s(),o("div",null,e[0]||(e[0]=[a("h1",{id:"todo",tabindex:"-1"},[r("TODO "),a("a",{class:"header-anchor",href:"#todo","aria-label":'Permalink to "TODO"'},"")],-1)]))}const x=t(c,[["render",n]]);export{_ as __pageData,x as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_ as t,c as o,j as a,a as r,o as s}from"./chunks/framework.
|
|
1
|
+
import{_ as t,c as o,j as a,a as r,o as s}from"./chunks/framework.Bt53DRYp.js";const _=JSON.parse('{"title":"TODO","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/create-colors.md","filePath":"mixins/create-colors.md"}'),c={name:"mixins/create-colors.md"};function n(i,e,d,l,m,p){return s(),o("div",null,e[0]||(e[0]=[a("h1",{id:"todo",tabindex:"-1"},[r("TODO "),a("a",{class:"header-anchor",href:"#todo","aria-label":'Permalink to "TODO"'},"")],-1)]))}const x=t(c,[["render",n]]);export{_ as __pageData,x as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.Bt53DRYp.js";const F=JSON.parse('{"title":"Create Margin","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/create-helper-margin.md","filePath":"mixins/create-helper-margin.md"}'),h={name:"mixins/create-helper-margin.md"};function l(k,s,p,e,r,E){return n(),a("div",null,s[0]||(s[0]=[t(`<h1 id="create-margin" tabindex="-1">Create Margin <a class="header-anchor" href="#create-margin" aria-label="Permalink to "Create Margin""></a></h1><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> create-helper-margin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">((</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">auto</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">auto</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">12</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">12</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.Bt53DRYp.js";const F=JSON.parse('{"title":"Create Margin","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/create-helper-margin.md","filePath":"mixins/create-helper-margin.md"}'),h={name:"mixins/create-helper-margin.md"};function l(k,s,p,e,r,E){return n(),a("div",null,s[0]||(s[0]=[t(`<h1 id="create-margin" tabindex="-1">Create Margin <a class="header-anchor" href="#create-margin" aria-label="Permalink to "Create Margin""></a></h1><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> create-helper-margin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">((</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">auto</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">auto</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">12</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">12</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.Bt53DRYp.js";const F=JSON.parse('{"title":"Create Padding","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/create-helper-padding.md","filePath":"mixins/create-helper-padding.md"}'),h={name:"mixins/create-helper-padding.md"};function l(k,s,p,e,r,d){return n(),a("div",null,s[0]||(s[0]=[t(`<h1 id="create-padding" tabindex="-1">Create Padding <a class="header-anchor" href="#create-padding" aria-label="Permalink to "Create Padding""></a></h1><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> create-helper-padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">((</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">12</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">12</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">24</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.Bt53DRYp.js";const F=JSON.parse('{"title":"Create Padding","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/create-helper-padding.md","filePath":"mixins/create-helper-padding.md"}'),h={name:"mixins/create-helper-padding.md"};function l(k,s,p,e,r,d){return n(),a("div",null,s[0]||(s[0]=[t(`<h1 id="create-padding" tabindex="-1">Create Padding <a class="header-anchor" href="#create-padding" aria-label="Permalink to "Create Padding""></a></h1><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> create-helper-padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">((</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">12</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">12</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">24</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.Bt53DRYp.js";const g=JSON.parse('{"title":"Create Instruction","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/create-instruction.md","filePath":"mixins/create-instruction.md"}'),e={name:"mixins/create-instruction.md"};function l(h,s,k,p,d,r){return n(),a("div",null,s[0]||(s[0]=[t(`<h1 id="create-instruction" tabindex="-1">Create Instruction <a class="header-anchor" href="#create-instruction" aria-label="Permalink to "Create Instruction""></a></h1><p>Create instructions. Given name and size. Example: width and min-width</p><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> create-instructions</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"width"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, (</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">25</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">25</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">50</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">50</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">75</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">75</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.
|
|
1
|
+
import{_ as i,c as a,a2 as t,o as n}from"./chunks/framework.Bt53DRYp.js";const g=JSON.parse('{"title":"Create Instruction","description":"","frontmatter":{},"headers":[],"relativePath":"mixins/create-instruction.md","filePath":"mixins/create-instruction.md"}'),e={name:"mixins/create-instruction.md"};function l(h,s,k,p,d,r){return n(),a("div",null,s[0]||(s[0]=[t(`<h1 id="create-instruction" tabindex="-1">Create Instruction <a class="header-anchor" href="#create-instruction" aria-label="Permalink to "Create Instruction""></a></h1><p>Create instructions. Given name and size. Example: width and min-width</p><h2 id="example" tabindex="-1">Example <a class="header-anchor" href="#example" aria-label="Permalink to "Example""></a></h2><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">@include</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> create-instructions</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"width"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, (</span></span>
|
|
2
2
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">25</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">25</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
3
3
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">50</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">50</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|
|
4
4
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">75</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">75</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">),</span></span>
|