Skip to content

Commit 1116fb3

Browse files
SimonPadburySimonPadbury
committed
v4.0.5
1 parent c62a267 commit 1116fb3

File tree

76 files changed

+332
-328
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

76 files changed

+332
-328
lines changed

‎.eleventy.js

+4
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,10 @@ module.exports = function(eleventyConfig) {
1111
templateFormats: ["*"]
1212
});
1313

14+
eleventyConfig.addFilter('date', function (date, dateFormat) {
15+
return format(date, dateFormat)
16+
})
17+
1418
eleventyConfig.addPassthroughCopy("src/img");
1519
eleventyConfig.addPassthroughCopy("src/dist");
1620
eleventyConfig.addPassthroughCopy("src/js");

‎docs/dist.zip

0 Bytes
Binary file not shown.

‎docs/docs/1-getting-started/alpinejs-or-activator/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/1-getting-started/codebase-scss-library/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/1-getting-started/introduction/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/1-getting-started/light-and-dark-themes/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/1-getting-started/responsive-design/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/audio-and-video/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/blockquotes/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/details/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/element-grid/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/form-elements/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/headings/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/horizontal-rules/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/images/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/lists/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/paragraphs/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/simple-text-elements/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/2-codebase-basics/tables/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/3-responsive-layouts/bleeds/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/3-responsive-layouts/containers/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;

‎docs/docs/3-responsive-layouts/flex-pseudo-grids/index.html

+7-7
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
<meta name="theme-color" content="#262626">
1717

1818
<link href="/codebase-4/prism/prism.css" rel="stylesheet">
19-
<!-- <link href="/codebase-4/dist/codebase.css" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.5" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.5" rel="stylesheet">
2121
<style>
2222
html {
2323
scroll-behavior: smooth;
@@ -587,9 +587,9 @@ <h1 class="mb-0">Flex Pseudo Grids</h1>
587587
<p>While Codebase’s <a href="/codebase-4/docs/3-responsive-layouts/grid">real grid system</a> works on modern (2017 and up) browsers that support <a href="https://caniuse.com/css-grid">CSS grid</a> (that’s <a href="https://www.stetic.com/market-share/browser/">vast the vast majoity of internet users in 2021</a>), some people prefer the old way of setting up a page layout. And if they must support Internet Explorer 11 or other ancient browsers, then they have to go with the flex pseudo grid.</p>
588588
<p>To use Codebase’s 12-column pseudo grid system, all you need to do is use prefix <code>.flex-cols-</code> with a suffix from <code>1</code> to <code>12</code>:</p>
589589
<div class="flex mt-3 mb-6">
590-
<div class="flex-cols-4 b-thick b-color-success rounded p-1 t-heavy t-color-success">cols-4</div>
591-
<div class="flex-cols-6 b-thick b-color-success rounded p-1 t-heavy t-color-success">cols-6</div>
592-
<div class="flex-cols-2 b-thick b-color-success rounded p-1 t-heavy t-color-success">cols-2</div>
590+
<div class="flex-cols-4 rounded p-2 bg-color-secondary t-color-ui-text">cols-4</div>
591+
<div class="flex-cols-6 rounded p-2 bg-color-secondary t-color-ui-text">cols-6</div>
592+
<div class="flex-cols-2 rounded p-2 bg-color-secondary t-color-ui-text">cols-2</div>
593593
</div>
594594
<pre class="language-html"><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>flex<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>flex-cols-4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>cols-4<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>flex-cols-6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>cols-6<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>flex-cols-2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>cols-2<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span><br><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre>
595595
<p><strong>Notes:</strong></p>
@@ -637,8 +637,8 @@ <h1 class="mb-0">Flex Pseudo Grids</h1>
637637
</li>
638638
</ol>
639639
<div class="flex-md flex-gap flex-row-reverse my-6">
640-
<div class="flex-cols-3 b-thick b-color-success rounded p-1 t-heavy t-color-success">One quarter</div>
641-
<div class="flex-cols-9 b-thick b-color-success rounded p-1 t-heavy t-color-success">Three quarters</div>
640+
<div class="flex-cols-3 rounded p-2 bg-color-secondary t-color-ui-text">One quarter</div>
641+
<div class="flex-cols-9 rounded p-2 bg-color-secondary t-color-ui-text">Three quarters</div>
642642
</div>
643643
<pre class="language-html"><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>flex-md flex-gap flex-row-reverse<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>flex-cols-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>One quarter<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>flex-cols-9<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Three quarters<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span><br><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></code></pre>
644644
<ol start="6">

0 commit comments

Comments
 (0)