From 5b1f79d9e61f6c0e8450913a52eb8d6238a97430 Mon Sep 17 00:00:00 2001 From: Wesley B <62723358+wesleyboar@users.noreply.github.com> Date: Tue, 15 Oct 2024 11:42:17 -0500 Subject: [PATCH 01/45] =?UTF-8?q?refactor:=20=5Futils/js=20=E2=9E=94=20scr?= =?UTF-8?q?ipts?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- src/lib/_imports/components/admonition/readme.md | 2 +- src/lib/_imports/components/align/readme.md | 2 +- .../components/bootstrap/bootstrap--container.readme.md | 2 +- src/lib/_imports/components/bootstrap/bootstrap--form.readme.md | 2 +- .../_imports/components/bootstrap/bootstrap--modal.readme.md | 2 +- .../_imports/components/bootstrap/bootstrap--nav-tabs.readme.md | 2 +- .../components/bootstrap3/bootstrap3--breadcrumb.readme.md | 2 +- .../_imports/components/c-data-list/description-list/readme.md | 2 +- src/lib/_imports/components/c-data-list/readme.md | 2 +- src/lib/_imports/components/c-data-list/table/readme.md | 2 +- src/lib/_imports/components/c-form/readme.md | 2 +- src/lib/_imports/components/c-island/readme.md | 2 +- src/lib/_imports/components/c-pill/readme.md | 2 +- src/lib/_imports/components/django-cms-forms/readme.md | 2 +- src/lib/_imports/components/pymdownx/pymdownx.readme.md | 2 +- src/lib/_imports/components/tacc-docs/readme.md | 2 +- src/lib/_imports/elements/form.cms/readme.md | 2 +- src/lib/_imports/elements/headings/readme.md | 2 +- src/lib/_imports/elements/links/readme.md | 2 +- src/lib/_imports/elements/root/readme.md | 2 +- src/lib/_imports/elements/table/readme.md | 2 +- src/lib/_imports/elements/table/table--via-paragraphs.readme.md | 2 +- .../_imports/elements/table/table--with-paragraphs.readme.md | 2 +- src/lib/_imports/objects/o-fixed-header-table/readme.md | 2 +- src/lib/_imports/objects/o-flex-item-table-wrap/readme.md | 2 +- src/lib/_imports/objects/o-section/readme.md | 2 +- .../objects/o-table-wrap/o-table-wrap--flexible-horz.readme.md | 2 +- .../objects/o-table-wrap/o-table-wrap--flexible-vert.readme.md | 2 +- .../o-table-wrap/o-table-wrap--overflow-hidden.readme.md | 2 +- .../o-table-wrap/o-table-wrap--overflow-scroll-extra.readme.md | 2 +- .../o-table-wrap/o-table-wrap--overflow-scroll.readme.md | 2 +- src/lib/_imports/objects/o-table-wrap/readme.md | 2 +- .../js => _imports/scripts}/open-ext-links-in-new-window.js | 0 src/lib/_imports/settings/color/readme.md | 2 +- src/lib/_imports/settings/font/readme.md | 2 +- src/lib/_imports/tools/x-drop-cap/readme.md | 2 +- src/lib/_imports/tools/x-link/readme.md | 2 +- src/lib/_imports/tools/x-tabs/readme.md | 2 +- src/lib/_imports/trumps/s-affixed-input-wrapper/README.md | 2 +- src/lib/_imports/trumps/s-blockquote/readme.md | 2 +- src/lib/_imports/trumps/s-breadcrumbs/s-breadcrumbs.readme.md | 2 +- src/lib/_imports/trumps/s-form/readme.md | 2 +- src/lib/_imports/trumps/s-paragraph-table/readme.md | 2 +- src/lib/_imports/trumps/s-truncated-table/readme.md | 2 +- .../vendors/bootstrap5/bootstrap5--border-spinner.readme.md | 2 +- 46 files changed, 45 insertions(+), 45 deletions(-) rename src/lib/{_utils/js => _imports/scripts}/open-ext-links-in-new-window.js (100%) diff --git a/package.json b/package.json index 99f3ab752..bc43a9f78 100644 --- a/package.json +++ b/package.json @@ -26,7 +26,7 @@ "build:each": "bin/build-each.js", "build:tokens": "bin/build-tokens.js", "postbuild:css": "rm -rf dist/fonts && cp -r src/lib/fonts dist/fonts", - "prebuild:demo": "rm -rf dist/_utils && cp -r src/lib/_utils dist/_utils", + "prebuild:demo": "rm -rf dist/scripts && cp -r src/lib/_imports/scripts dist/scripts", "prestart": "npm run prebuild:demo", "build:demo": "fractal build", "test": "bin/test.js && echo \"Test output at 'dist/_tests' (compare to test input)\"", diff --git a/src/lib/_imports/components/admonition/readme.md b/src/lib/_imports/components/admonition/readme.md index 250f7d4cd..2087f11b1 100644 --- a/src/lib/_imports/components/admonition/readme.md +++ b/src/lib/_imports/components/admonition/readme.md @@ -6,4 +6,4 @@ To style ["Admonition" messages][rtd-admonition]. [rtd-admonition]: https://learning-readthedocs.readthedocs.io/en/latest/Options/admonition.html "ReadTheDocs: Admonition" - @@ -384,31 +267,31 @@
-
+
sample fields in a fieldset {{!-- FAQ: Copied from first two fields --}}
{{#if (eq errorLoc "top")}} - {{> @field-errors class=class.errors wrapClass=class.field_errors_wrap }} + {{> @field-errors class=class.field_errors wrapClass=class.field_errors_wrap }} {{/if}} {{#unless (eq errorLoc "top")}} - {{> @field-errors class=class.errors wrapClass=class.field_errors_wrap }} + {{> @field-errors class=class.field_errors wrapClass=class.field_errors_wrap }} {{/unless}} {{#with helpTextTag as | tag |}} @@ -420,12 +303,12 @@
{{#if (eq errorLoc "top")}} - {{> @field-errors class=class.errors wrapClass=class.field_errors_wrap }} + {{> @field-errors class=class.field_errors wrapClass=class.field_errors_wrap }} {{/if}} - @@ -438,7 +321,7 @@ {{#unless (eq errorLoc "top")}} - {{> @field-errors class=class.errors wrapClass=class.field_errors_wrap }} + {{> @field-errors class=class.field_errors wrapClass=class.field_errors_wrap }} {{/unless}} {{#with helpTextTag as | tag |}} diff --git a/src/lib/_imports/_preview.hbs b/src/lib/_imports/_preview.hbs index 7b4b88983..024ba111e 100644 --- a/src/lib/_imports/_preview.hbs +++ b/src/lib/_imports/_preview.hbs @@ -10,11 +10,11 @@ @layer foundation, base, project; -{{#if _target.context.shouldLoadBootstrap }} +{{#if _target.context.shouldLoadBootstrap4 }} {{#unless _target.context.shouldSkipBootstrap }} {{/unless}} {{/if}} @@ -36,7 +36,9 @@ {{/if}} +{{#unless _target.context.shouldSkipBase }} {{> @import-client-styles styles=globalStyles }} +{{/unless}} {{#if _target.context.shouldLoadCMS }} {{#unless _target.context.shouldSkipCMS }} @@ -91,7 +93,7 @@ -{{#if _target.context.shouldLoadBootstrap}} +{{#if _target.context.shouldLoadBootstrap4}} diff --git a/src/lib/_imports/bootstrap4/README.md b/src/lib/_imports/bootstrap4/README.md new file mode 100644 index 000000000..d1569aba0 --- /dev/null +++ b/src/lib/_imports/bootstrap4/README.md @@ -0,0 +1,4 @@ +# Bootstrap v4 + +- [Known Clients](https://tacc-main.atlassian.net/wiki/x/khJv) +- See individual components for known use cases. diff --git a/src/lib/_imports/components/bootstrap.col.postcss b/src/lib/_imports/bootstrap4/col.postcss similarity index 100% rename from src/lib/_imports/components/bootstrap.col.postcss rename to src/lib/_imports/bootstrap4/col.postcss diff --git a/src/lib/_imports/components/bootstrap/bootstrap--col.hbs b/src/lib/_imports/bootstrap4/col/col.hbs similarity index 100% rename from src/lib/_imports/components/bootstrap/bootstrap--col.hbs rename to src/lib/_imports/bootstrap4/col/col.hbs diff --git a/src/lib/_imports/bootstrap4/col/config.yml b/src/lib/_imports/bootstrap4/col/config.yml new file mode 100644 index 000000000..1bf4d3905 --- /dev/null +++ b/src/lib/_imports/bootstrap4/col/config.yml @@ -0,0 +1,13 @@ +order: 3 +label: 'Grid: Col' +context: + supportStyles: + - ../../assets/components/c-card.css +variants: + - name: default + label: Bootstrap + - name: tacc + label: TACC + status: ready + context: + shouldSkipPattern: false diff --git a/src/lib/_imports/components/bootstrap/bootstrap--col.readme.md b/src/lib/_imports/bootstrap4/col/readme.md similarity index 100% rename from src/lib/_imports/components/bootstrap/bootstrap--col.readme.md rename to src/lib/_imports/bootstrap4/col/readme.md diff --git a/src/lib/_imports/bootstrap4/config.yml b/src/lib/_imports/bootstrap4/config.yml new file mode 100644 index 000000000..190335bc4 --- /dev/null +++ b/src/lib/_imports/bootstrap4/config.yml @@ -0,0 +1,4 @@ +label: Bootstrap 4 +context: + shouldLoadBootstrap4: true + subdir: "bootstrap4" diff --git a/src/lib/_imports/components/bootstrap.container.postcss b/src/lib/_imports/bootstrap4/container.postcss similarity index 100% rename from src/lib/_imports/components/bootstrap.container.postcss rename to src/lib/_imports/bootstrap4/container.postcss diff --git a/src/lib/_imports/bootstrap4/container/config.yml b/src/lib/_imports/bootstrap4/container/config.yml new file mode 100644 index 000000000..e5ced94bb --- /dev/null +++ b/src/lib/_imports/bootstrap4/container/config.yml @@ -0,0 +1,15 @@ +order: 1 +label: 'Grid: Container' +context: + shouldSkipBase: true + supportStyles: + - ../../assets/components/c-message.css + - ../../assets/components/c-message--expanded.css +variants: + - name: default + label: Bootstrap + - name: tacc + label: TACC + status: ready + context: + shouldSkipPattern: false diff --git a/src/lib/_imports/bootstrap4/container/container.hbs b/src/lib/_imports/bootstrap4/container/container.hbs new file mode 100644 index 000000000..eecc836cc --- /dev/null +++ b/src/lib/_imports/bootstrap4/container/container.hbs @@ -0,0 +1,8 @@ +
+
+ {{> @message + type="info" + scope="section" + content="See \"Notes\". Difference is only visible at very wide viewports." + }} +
diff --git a/src/lib/_imports/components/bootstrap/bootstrap--container.readme.md b/src/lib/_imports/bootstrap4/container/readme.md similarity index 93% rename from src/lib/_imports/components/bootstrap/bootstrap--container.readme.md rename to src/lib/_imports/bootstrap4/container/readme.md index ed8a1e509..fb99097c6 100644 --- a/src/lib/_imports/components/bootstrap/bootstrap--container.readme.md +++ b/src/lib/_imports/bootstrap4/container/readme.md @@ -17,10 +17,10 @@ To add wider [Bootstrap Grid](https://getbootstrap.com/docs/4.0/layout/grid/) co - Extra extra large
+ Extra extra wide
≥1680px - Extra extra extra large
+ Extra extra extra wide
≥1920px diff --git a/src/lib/_imports/bootstrap4/form.postcss b/src/lib/_imports/bootstrap4/form.postcss new file mode 100644 index 000000000..0920de0e8 --- /dev/null +++ b/src/lib/_imports/bootstrap4/form.postcss @@ -0,0 +1,15 @@ +/* FAQ: c-form.css styles most of all form patterns */ +@import url("../components/c-form.postcss"); + +.form-check { + padding-left: unset; /* to overwrite Bootstrap */ +} +.form-check label { + margin-bottom: unset; +} +/* To overwrite Bootstrap's muted text color that they often suggest */ +@layer foundation { + .form-text.text-muted { + color: inherit !important; + } +} diff --git a/src/lib/_imports/bootstrap4/form.selectors.postcss b/src/lib/_imports/bootstrap4/form.selectors.postcss new file mode 100644 index 000000000..dc3144731 --- /dev/null +++ b/src/lib/_imports/bootstrap4/form.selectors.postcss @@ -0,0 +1,58 @@ +@custom-selector :--bs4-form + .c-form; + +/* Generic */ + +@custom-selector :--bs4-form__desc + form > :is(h1, h2, h3, h4, h5, h6) + p; +@custom-selector :--bs4-form__title + form > :is(h1, h2, h3, h4, h5, h6); + +@custom-selector :--bs4-form__errors + :where( + :--bs4-form__errors--form, + :--bs4-form__errors--field + ); +@custom-selector :--bs4-form__errors_list + :where( + :--bs4-form__errors--form > ul + ); +@custom-selector :--bs4-form__errors--form /* submission errors */ + .alert.alert-danger; +@custom-selector :--bs4-form__errors--field /* validation errors */ + .invalid-feedback; + +@custom-selector :--bs4-form__field + .form-group; +@custom-selector :--bs4-form__field--has-required + :--bs4-form__field:has([required]); +@custom-selector :--bs4-form__field--has-checkbox + :--bs4-form__field.form-check; + +@custom-selector :--bs4-form__menu + .form-group-checklist, + .form-group-radiolist; +@custom-selector :--bs4-form__menu_item + :--bs4-form__menu > .form-check; +@custom-selector :--bs4-form__menu_line + :--bs4-form__menu_item; +@custom-selector :--bs4-form__menu_label + :--bs4-form__menu_item > label; + +@custom-selector :--bs4-form__help + .form-text; + +@custom-selector :--bs4-form__badge + .badge.badge-danger; + +@custom-selector :--bs4-form__buttons + .form-group:has(.btn); +@custom-selector :--bs4-form__button + .btn; + +/* Login */ + +@custom-selector :--bs4-form--login + .form-login; +@custom-selector :--bs4-form__nav + .form-nav; diff --git a/src/lib/_imports/bootstrap4/form/config.yml b/src/lib/_imports/bootstrap4/form/config.yml new file mode 100644 index 000000000..4cf417247 --- /dev/null +++ b/src/lib/_imports/bootstrap4/form/config.yml @@ -0,0 +1,41 @@ +context: + helpTextTag: small + inputListTag: menu + inputListItemClass: form-check + isSemantic: false + selectors: + errorList: .alert.alert-danger, .invalid-feedback + wrap: .form-group + classNames: + root: null + title: null + desc: null + form_errors: null + field_errors: invalid-feedback + form_errors_wrap: alert alert-danger + field_errors_wrap: null + field: form-group + control: form-control + file_control: form-control-file + checkbox_control: form-check-input + radio_control: form-check-input + badge: badge badge-danger + hint: form-text text-muted + has_required: js-has-required + has_checkbox: form-check + has_spam_filter: null + radio_menu: form-group-radiolist + check_menu: form-group-checklist + buttons: form-group + button: btn btn-primary +variants: + - name: default + label: Bootstrap + context: + shouldSkipBase: true + - name: tacc + label: TACC (Portal) + status: prototype + context: + shouldSkipPattern: false + shouldLoadPortal: true diff --git a/src/lib/_imports/bootstrap4/form/demo.css b/src/lib/_imports/bootstrap4/form/demo.css new file mode 100644 index 000000000..e8a60960f --- /dev/null +++ b/src/lib/_imports/bootstrap4/form/demo.css @@ -0,0 +1,4 @@ +/* To let validtion errors show */ +.invalid-feedback.js-show-errors { + display: unset; /* FAQ: Bootstrap sets `display: none` by default */ +} diff --git a/src/lib/_imports/bootstrap4/form/form.hbs b/src/lib/_imports/bootstrap4/form/form.hbs new file mode 100644 index 000000000..dbcc6cfbf --- /dev/null +++ b/src/lib/_imports/bootstrap4/form/form.hbs @@ -0,0 +1 @@ +{{> @form class=classNames selectors=selectors message=message }} diff --git a/src/lib/_imports/bootstrap4/form/readme.md b/src/lib/_imports/bootstrap4/form/readme.md new file mode 100644 index 000000000..b22efac82 --- /dev/null +++ b/src/lib/_imports/bootstrap4/form/readme.md @@ -0,0 +1,8 @@ +To override and extend [Bootstrap Forms](https://getbootstrap.com/docs/4.6/components/forms/). + + +| Class | Description +| - | - | +| `.form-group-checklist` | A list of `.form-check` elements + +