Skip to content

Commit 8df7978

Browse files
SimonPadburySimonPadbury
committed
v.4.0.11
1 parent 5ca97d0 commit 8df7978

File tree

93 files changed

+787
-747
lines changed

Some content is hidden

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

93 files changed

+787
-747
lines changed

‎LOG.md

+5-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
# Log
22

3-
## 14 June 2011 - Codebase 4.0.10
3+
## 19 June 2021 - Codebase 4.0.11
4+
5+
* Re-factored the flex pseudo grid system to use _x-axis padding_ for vertical gutters, and to add media query breakpoint modifiers to flex-items rather than relying on the breakpoint modifiers on the flex wrapper. Introduced a new `.flex-grid` wrapper class to _set up the flexbox and cause wrapping of pseudo grid flex-items_. Now the flex-items can have their columnar spanning individually controlled at multiple media query breakpoint widths. These will become 100% width below their media query breakpoints. **Backward compatibility is maintained:** `.flex-grid` is doing the same thing as `.flex.flex-wrap`.It is still possible to use the `.flex.flex-wrap`, `.flex-sm.flex-wrap` etc. on flex pseudo grids, but the new way gives you granular control of indivicual pseudo columns at more than one breakpoint.
6+
7+
## 14 June 2021 - Codebase 4.0.10
48

59
* Fixed a bug in `activator.jquery.js` that interfered with resetting Activator components after moving focus off and back on to them (now they close with a single click).
610
* Added media query breakpoint widths to `.flex-gap` (which is handled by margins not flexbox gap, for backwards compatibility). Now the `.flex-gap` only take effect above the `.flex` (all), or `.flex-sm`/ `.flex-md`/ `.flex-lg` breakpoint (and therefore smaller layouts are not messed up by unwanted margins).

‎README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
The super tiny website frontend library.
44

5-
_Version 4.0.10_
5+
_Version 4.0.11_
66

77
## Features
88

‎docs/dist.zip

574 Bytes
Binary file not shown.

‎docs/dist/codebase-l-d.css

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/dist/codebase-l-d.css.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/dist/codebase.css

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/dist/codebase.css.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

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

+6-6
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?v=4.0.10" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.10" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.11" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.11" rel="stylesheet">
2121

2222
<style>
2323
html {
@@ -111,7 +111,7 @@
111111
</style>
112112

113113
<script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js" defer></script>
114-
<script src="/codebase-4/dist/activator.js?v=4.0.10" defer></script>
114+
<script src="/codebase-4/dist/activator.js?v=4.0.11" defer></script>
115115
<script src="/codebase-4/js/theme-switcher.js" defer></script>
116116
</head>
117117
<body>
@@ -624,20 +624,20 @@ <h1 class="mb-0">Using AlpineJS or Activator in Codebase</h1>
624624
<!-- Codebase logo-->
625625
<svg style="height: 4rem; margin-bottom: 1rem;" viewBox="0 0 340 180" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-miterlimit="2"><path d="M195.956 115.956c14.059-14.059 36.853-14.059 50.912 0 14.058 14.059 14.058 36.853 0 50.912L323.235 90.5l-76.367-76.368c14.058 14.059 14.058 36.853 0 50.912-14.059 14.059-36.853 14.059-50.912 0-14.059-14.059-36.853-14.059-50.912 0-14.059 14.059-14.059 36.853 0 50.912 14.059 14.059 36.853 14.059 50.912 0M17.765 90.5l76.367-76.368c-42.176 42.177-42.176 110.559 0 152.736L17.765 90.5z" fill-rule="nonzero" fill="currentColor" stroke="currentColor" stroke-width="10"/></svg>
626626
<span>
627-
Codebase <span class="t-thin">4.0.10</span>
627+
Codebase <span class="t-thin">4.0.11</span>
628628
</span>
629629

630630
</span>
631631
</a>
632632
</p>
633633
<p><a href="https://github.com/codebase-frontend-library/codebase-4/blob/master/LICENSE">MIT licence</a> • Project developer: <a class="t-nowrap" href="https://github.com/SimonPadbury">Simon Padbury</a></p>
634-
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>. Icon size was set to 24px, stroke set to 1.5px, and stroke color edited to <code class="b-thin">stroke="currentColor"</code></p>
634+
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>.</p>
635635
<p>Codebase is developed on <a href="https://gulpjs.com/" target="_blank">Gulp</a> with various plugins for <a href="https://sass-lang.com/" target="_blank">Sass</a> and <a href="https://babeljs.io/" target="_blank">Babel</a>. The documentation is developed on the <a href="https://www.11ty.dev/" target="_blank">Eleventy</a> static website generator, with Gulp and the plugins added in.</p>
636636

637637
</footer>
638638

639639
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js" integrity="sha512-DUC8yqWf7ez3JD1jszxCWSVB0DMP78eOyBpMa5aJki1bIRARykviOuImIczkxlj1KhVSyS16w2FSQetkD4UU2w==" crossorigin="anonymous"></script>
640-
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.10"></script> -->
640+
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.11"></script> -->
641641

642642
<script>
643643
// Used only on the docs sidebar (below 1024px width)

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

+6-6
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?v=4.0.10" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.10" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.11" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.11" rel="stylesheet">
2121

2222
<style>
2323
html {
@@ -111,7 +111,7 @@
111111
</style>
112112

113113
<script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js" defer></script>
114-
<script src="/codebase-4/dist/activator.js?v=4.0.10" defer></script>
114+
<script src="/codebase-4/dist/activator.js?v=4.0.11" defer></script>
115115
<script src="/codebase-4/js/theme-switcher.js" defer></script>
116116
</head>
117117
<body>
@@ -617,20 +617,20 @@ <h1 class="mb-0">The Codebase SCSS Library</h1>
617617
<!-- Codebase logo-->
618618
<svg style="height: 4rem; margin-bottom: 1rem;" viewBox="0 0 340 180" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-miterlimit="2"><path d="M195.956 115.956c14.059-14.059 36.853-14.059 50.912 0 14.058 14.059 14.058 36.853 0 50.912L323.235 90.5l-76.367-76.368c14.058 14.059 14.058 36.853 0 50.912-14.059 14.059-36.853 14.059-50.912 0-14.059-14.059-36.853-14.059-50.912 0-14.059 14.059-14.059 36.853 0 50.912 14.059 14.059 36.853 14.059 50.912 0M17.765 90.5l76.367-76.368c-42.176 42.177-42.176 110.559 0 152.736L17.765 90.5z" fill-rule="nonzero" fill="currentColor" stroke="currentColor" stroke-width="10"/></svg>
619619
<span>
620-
Codebase <span class="t-thin">4.0.10</span>
620+
Codebase <span class="t-thin">4.0.11</span>
621621
</span>
622622

623623
</span>
624624
</a>
625625
</p>
626626
<p><a href="https://github.com/codebase-frontend-library/codebase-4/blob/master/LICENSE">MIT licence</a> • Project developer: <a class="t-nowrap" href="https://github.com/SimonPadbury">Simon Padbury</a></p>
627-
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>. Icon size was set to 24px, stroke set to 1.5px, and stroke color edited to <code class="b-thin">stroke="currentColor"</code></p>
627+
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>.</p>
628628
<p>Codebase is developed on <a href="https://gulpjs.com/" target="_blank">Gulp</a> with various plugins for <a href="https://sass-lang.com/" target="_blank">Sass</a> and <a href="https://babeljs.io/" target="_blank">Babel</a>. The documentation is developed on the <a href="https://www.11ty.dev/" target="_blank">Eleventy</a> static website generator, with Gulp and the plugins added in.</p>
629629

630630
</footer>
631631

632632
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js" integrity="sha512-DUC8yqWf7ez3JD1jszxCWSVB0DMP78eOyBpMa5aJki1bIRARykviOuImIczkxlj1KhVSyS16w2FSQetkD4UU2w==" crossorigin="anonymous"></script>
633-
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.10"></script> -->
633+
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.11"></script> -->
634634

635635
<script>
636636
// Used only on the docs sidebar (below 1024px width)

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

+6-6
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?v=4.0.10" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.10" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.11" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.11" rel="stylesheet">
2121

2222
<style>
2323
html {
@@ -111,7 +111,7 @@
111111
</style>
112112

113113
<script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js" defer></script>
114-
<script src="/codebase-4/dist/activator.js?v=4.0.10" defer></script>
114+
<script src="/codebase-4/dist/activator.js?v=4.0.11" defer></script>
115115
<script src="/codebase-4/js/theme-switcher.js" defer></script>
116116
</head>
117117
<body>
@@ -658,20 +658,20 @@ <h2 id="using-the-codebase-light-and-dark-themes">Using the Codebase Light and D
658658
<!-- Codebase logo-->
659659
<svg style="height: 4rem; margin-bottom: 1rem;" viewBox="0 0 340 180" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-miterlimit="2"><path d="M195.956 115.956c14.059-14.059 36.853-14.059 50.912 0 14.058 14.059 14.058 36.853 0 50.912L323.235 90.5l-76.367-76.368c14.058 14.059 14.058 36.853 0 50.912-14.059 14.059-36.853 14.059-50.912 0-14.059-14.059-36.853-14.059-50.912 0-14.059 14.059-14.059 36.853 0 50.912 14.059 14.059 36.853 14.059 50.912 0M17.765 90.5l76.367-76.368c-42.176 42.177-42.176 110.559 0 152.736L17.765 90.5z" fill-rule="nonzero" fill="currentColor" stroke="currentColor" stroke-width="10"/></svg>
660660
<span>
661-
Codebase <span class="t-thin">4.0.10</span>
661+
Codebase <span class="t-thin">4.0.11</span>
662662
</span>
663663

664664
</span>
665665
</a>
666666
</p>
667667
<p><a href="https://github.com/codebase-frontend-library/codebase-4/blob/master/LICENSE">MIT licence</a> • Project developer: <a class="t-nowrap" href="https://github.com/SimonPadbury">Simon Padbury</a></p>
668-
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>. Icon size was set to 24px, stroke set to 1.5px, and stroke color edited to <code class="b-thin">stroke="currentColor"</code></p>
668+
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>.</p>
669669
<p>Codebase is developed on <a href="https://gulpjs.com/" target="_blank">Gulp</a> with various plugins for <a href="https://sass-lang.com/" target="_blank">Sass</a> and <a href="https://babeljs.io/" target="_blank">Babel</a>. The documentation is developed on the <a href="https://www.11ty.dev/" target="_blank">Eleventy</a> static website generator, with Gulp and the plugins added in.</p>
670670

671671
</footer>
672672

673673
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js" integrity="sha512-DUC8yqWf7ez3JD1jszxCWSVB0DMP78eOyBpMa5aJki1bIRARykviOuImIczkxlj1KhVSyS16w2FSQetkD4UU2w==" crossorigin="anonymous"></script>
674-
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.10"></script> -->
674+
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.11"></script> -->
675675

676676
<script>
677677
// Used only on the docs sidebar (below 1024px width)

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

+6-6
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?v=4.0.10" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.10" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.11" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.11" rel="stylesheet">
2121

2222
<style>
2323
html {
@@ -111,7 +111,7 @@
111111
</style>
112112

113113
<script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js" defer></script>
114-
<script src="/codebase-4/dist/activator.js?v=4.0.10" defer></script>
114+
<script src="/codebase-4/dist/activator.js?v=4.0.11" defer></script>
115115
<script src="/codebase-4/js/theme-switcher.js" defer></script>
116116
</head>
117117
<body>
@@ -682,20 +682,20 @@ <h2 id="the-codebase-light-and-dark-themes-css">The Codebase Light and Dark Them
682682
<!-- Codebase logo-->
683683
<svg style="height: 4rem; margin-bottom: 1rem;" viewBox="0 0 340 180" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-miterlimit="2"><path d="M195.956 115.956c14.059-14.059 36.853-14.059 50.912 0 14.058 14.059 14.058 36.853 0 50.912L323.235 90.5l-76.367-76.368c14.058 14.059 14.058 36.853 0 50.912-14.059 14.059-36.853 14.059-50.912 0-14.059-14.059-36.853-14.059-50.912 0-14.059 14.059-14.059 36.853 0 50.912 14.059 14.059 36.853 14.059 50.912 0M17.765 90.5l76.367-76.368c-42.176 42.177-42.176 110.559 0 152.736L17.765 90.5z" fill-rule="nonzero" fill="currentColor" stroke="currentColor" stroke-width="10"/></svg>
684684
<span>
685-
Codebase <span class="t-thin">4.0.10</span>
685+
Codebase <span class="t-thin">4.0.11</span>
686686
</span>
687687

688688
</span>
689689
</a>
690690
</p>
691691
<p><a href="https://github.com/codebase-frontend-library/codebase-4/blob/master/LICENSE">MIT licence</a> • Project developer: <a class="t-nowrap" href="https://github.com/SimonPadbury">Simon Padbury</a></p>
692-
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>. Icon size was set to 24px, stroke set to 1.5px, and stroke color edited to <code class="b-thin">stroke="currentColor"</code></p>
692+
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>.</p>
693693
<p>Codebase is developed on <a href="https://gulpjs.com/" target="_blank">Gulp</a> with various plugins for <a href="https://sass-lang.com/" target="_blank">Sass</a> and <a href="https://babeljs.io/" target="_blank">Babel</a>. The documentation is developed on the <a href="https://www.11ty.dev/" target="_blank">Eleventy</a> static website generator, with Gulp and the plugins added in.</p>
694694

695695
</footer>
696696

697697
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js" integrity="sha512-DUC8yqWf7ez3JD1jszxCWSVB0DMP78eOyBpMa5aJki1bIRARykviOuImIczkxlj1KhVSyS16w2FSQetkD4UU2w==" crossorigin="anonymous"></script>
698-
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.10"></script> -->
698+
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.11"></script> -->
699699

700700
<script>
701701
// Used only on the docs sidebar (below 1024px width)

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

+6-6
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?v=4.0.10" rel="stylesheet"> -->
20-
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.10" rel="stylesheet">
19+
<!-- <link href="/codebase-4/dist/codebase.css?v=4.0.11" rel="stylesheet"> -->
20+
<link href="/codebase-4/dist/codebase-l-d.css?v=4.0.11" rel="stylesheet">
2121

2222
<style>
2323
html {
@@ -111,7 +111,7 @@
111111
</style>
112112

113113
<script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js" defer></script>
114-
<script src="/codebase-4/dist/activator.js?v=4.0.10" defer></script>
114+
<script src="/codebase-4/dist/activator.js?v=4.0.11" defer></script>
115115
<script src="/codebase-4/js/theme-switcher.js" defer></script>
116116
</head>
117117
<body>
@@ -641,20 +641,20 @@ <h2 id="codebase-media-query-breakpoint-widths">Codebase Media Query Breakpoint
641641
<!-- Codebase logo-->
642642
<svg style="height: 4rem; margin-bottom: 1rem;" viewBox="0 0 340 180" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-miterlimit="2"><path d="M195.956 115.956c14.059-14.059 36.853-14.059 50.912 0 14.058 14.059 14.058 36.853 0 50.912L323.235 90.5l-76.367-76.368c14.058 14.059 14.058 36.853 0 50.912-14.059 14.059-36.853 14.059-50.912 0-14.059-14.059-36.853-14.059-50.912 0-14.059 14.059-14.059 36.853 0 50.912 14.059 14.059 36.853 14.059 50.912 0M17.765 90.5l76.367-76.368c-42.176 42.177-42.176 110.559 0 152.736L17.765 90.5z" fill-rule="nonzero" fill="currentColor" stroke="currentColor" stroke-width="10"/></svg>
643643
<span>
644-
Codebase <span class="t-thin">4.0.10</span>
644+
Codebase <span class="t-thin">4.0.11</span>
645645
</span>
646646

647647
</span>
648648
</a>
649649
</p>
650650
<p><a href="https://github.com/codebase-frontend-library/codebase-4/blob/master/LICENSE">MIT licence</a> • Project developer: <a class="t-nowrap" href="https://github.com/SimonPadbury">Simon Padbury</a></p>
651-
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>. Icon size was set to 24px, stroke set to 1.5px, and stroke color edited to <code class="b-thin">stroke="currentColor"</code></p>
651+
<p>All example icons in these docs are from <a href="https://tablericons.com/" target="_blank">Tabler Icons</a>.</p>
652652
<p>Codebase is developed on <a href="https://gulpjs.com/" target="_blank">Gulp</a> with various plugins for <a href="https://sass-lang.com/" target="_blank">Sass</a> and <a href="https://babeljs.io/" target="_blank">Babel</a>. The documentation is developed on the <a href="https://www.11ty.dev/" target="_blank">Eleventy</a> static website generator, with Gulp and the plugins added in.</p>
653653

654654
</footer>
655655

656656
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js" integrity="sha512-DUC8yqWf7ez3JD1jszxCWSVB0DMP78eOyBpMa5aJki1bIRARykviOuImIczkxlj1KhVSyS16w2FSQetkD4UU2w==" crossorigin="anonymous"></script>
657-
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.10"></script> -->
657+
<script src="/codebase-4/dist/activator.jquery.js?v=4.0.11"></script> -->
658658

659659
<script>
660660
// Used only on the docs sidebar (below 1024px width)

0 commit comments

Comments
 (0)