-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: bump core-styles & use its django-cms-forms (#678)
* feat: bump core-styles & use its django-cms-forms Core-Styles v2.15 provides django-cms-forms via `core-styles.base.css`. Core-Styes v12–14 do not include any breaking changes. * feat: load django-cms-forms.css from core-styles Core-Styles loads shared form styles via c-form. Those shared styles to apply to Django CMS Forms. But django-cms-forms.css has specific custom styles CMS needs. * fix: django-cms-forms.css (core-styles ~2.22.1) * fix: django-cms-forms.css (core-styles) not built * docs: fix djangocms_forms comment/redirect typo * Revert "fix: django-cms-forms.css (core-styles) not built" This reverts commit c07ec5b. * fix: django-cms-forms.css (core-styles) not built
- Loading branch information
1 parent
8ad3ecb
commit 71bdb4c
Showing
9 changed files
with
8 additions
and
684 deletions.
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -11,7 +11,7 @@ | |
"dependencies": { | ||
"@frctl/fractal": "^1.5.14", | ||
"@frctl/mandelbrot": "^1.10.1", | ||
"@tacc/core-styles": "^2.22.0", | ||
"@tacc/core-styles": "github:TACC/Core-Styles#9315ebbd", | ||
"minimist": "^1.2.6" | ||
}, | ||
"repository": "[email protected]:TACC/Core-CMS.git", | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,3 @@ | ||
/* SEE: ../../site_cms/css/src/_imports/django-cms-forms.css */ | ||
/* SEE: ../../site_cms/css/src/django-cms-forms.css */ | ||
/* FAQ: We uses future syntax that must be processed to work in the present; | ||
and the process does not support outputting files to this directory */ |
23 changes: 0 additions & 23 deletions
23
...ms/static/site_cms/css/src/_imports/components/django-cms-forms--errors-via-c-message.css
This file was deleted.
Oops, something went wrong.
175 changes: 1 addition & 174 deletions
175
taccsite_cms/static/site_cms/css/src/_imports/components/django-cms-forms.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,174 +1 @@ | ||
@import url("@tacc/core-styles/src/lib/_imports/components/c-button.css"); | ||
|
||
@import url("./django-cms-forms.hacks.css"); | ||
@import url("./django-cms-forms--errors-via-c-message.css"); | ||
|
||
|
||
|
||
/* Title & Description */ | ||
|
||
.description { | ||
margin-block: 25px; | ||
} | ||
|
||
|
||
|
||
/* Help Text */ | ||
|
||
.help-text { | ||
font-size: var(--global-font-size--small); | ||
font-style: italic; | ||
} | ||
:not( | ||
ul, /* FAQ: Lists already have margin-bottom */ | ||
label /* FAQ: Labels already have margin-bottom */ | ||
) + .help-text { | ||
margin-top: 0.3em; /* mimic Bootstrap _reboot.css label margin-bottom */ | ||
} | ||
/* To prevent help text font-style from affecting any tags */ | ||
/* FAQ: Help text can contain inline elements like <samp> */ | ||
/* FAQ: Help text can be (ab)used to add headings between form fields */ | ||
.help-text > :not(details, a, samp) { | ||
font-style: initial; | ||
} | ||
|
||
|
||
|
||
/* Fields */ | ||
|
||
.field-wrapper { | ||
margin-bottom: 2rem; /* mimic <p> `margin-bottom` */ | ||
} | ||
|
||
.field-wrapper:not(.checkboxinput) { | ||
display: flex; | ||
flex-direction: column; | ||
} | ||
.field-wrapper:not(.checkboxinput) > .field-errors { | ||
order: 1; /* i.e. move to end */ | ||
} | ||
|
||
.field-wrapper.checkboxinput { | ||
display: inline-grid; | ||
|
||
column-gap: 0.5em; | ||
align-items: center; | ||
grid-template-columns: min-content auto; /* shrink input, let label extend */ | ||
grid-template-areas: | ||
'error _____' | ||
'input label' | ||
'notes notes'; | ||
} | ||
.field-wrapper.checkboxinput .field-errors { grid-area: error; } | ||
.field-wrapper.checkboxinput input { grid-area: input; } | ||
.field-wrapper.checkboxinput label { grid-area: label; } | ||
.field-wrapper.checkboxinput .help-text { grid-area: notes; } | ||
.field-wrapper.checkboxinput label { | ||
margin-bottom: 0; /* overwrite forms.css label */ | ||
} | ||
|
||
ul.radioselect label, | ||
ul.checkboxselectmultiple label { | ||
display: flex; | ||
gap: 0.5em; | ||
align-items: center; | ||
font-weight: revert; /* undo html-elements.cms.css */ | ||
} | ||
ul.radioselect li:last-child label, | ||
ul.checkboxselectmultiple li:last-child label { | ||
margin-bottom: 0; /* overwrite forms.css label */ | ||
} | ||
|
||
/* Field: Required, Asterisk, Important */ | ||
|
||
.field-wrapper .asterisk { | ||
margin-left: 0.5em; | ||
} | ||
.field-wrapper.required .asterisk { | ||
color: var(--global-color-danger--dark); | ||
} | ||
.field-wrapper:not(.required) .asterisk | ||
/* NOTE: Manual markup ONLY; form plugin can't render non-required asterisk */ { | ||
color: var(--global-color-warning--dark); | ||
} | ||
/* To replace asterisk character with text */ | ||
.field-wrapper .asterisk { | ||
width: 0; | ||
display: inline-block; | ||
visibility: hidden; | ||
line-height: 0; | ||
} | ||
.field-wrapper .asterisk::after { | ||
visibility: visible; | ||
line-height: initial; | ||
} | ||
.field-wrapper.required .asterisk::after { | ||
content: '(required)'; | ||
} | ||
.field-wrapper:not(.required) .asterisk::after | ||
/* NOTE: Manual markup ONLY; form plugin can't render non-required asterisk */ { | ||
content: '(important)'; | ||
} | ||
|
||
|
||
|
||
/* Errors */ | ||
|
||
.field-errors ul { | ||
margin-top: 1rem; /* mimic ul margin-bottom */ | ||
} | ||
.form-errors ul, | ||
.field-errors ul { | ||
margin-bottom: 0; /* overwrite ul margin-bottom */ | ||
} | ||
.form-errors { | ||
margin-bottom: 1rem; /* mimic ul margin-bottom */ | ||
} | ||
|
||
.form-errors ul, | ||
.field-errors ul { | ||
list-style: none; | ||
padding-inline: 0; | ||
} | ||
|
||
|
||
|
||
/* Lists */ | ||
|
||
ul.radioselect, | ||
ul.checkboxselectmultiple { | ||
list-style: none; | ||
|
||
padding-left: 0; | ||
} | ||
|
||
|
||
|
||
/* Layout */ | ||
|
||
.button-wrapper { | ||
margin-top: 35px; | ||
} | ||
|
||
|
||
|
||
/* Button */ | ||
|
||
/* To style obvious buttons that neglect class */ | ||
.button-wrapper button[type="submit"] { | ||
@extend :--c-button; | ||
@extend :--c-button--primary; | ||
} | ||
|
||
.form-button { | ||
@extend :--c-button; | ||
} | ||
.form-button[type="submit"] { | ||
@extend :--c-button--primary; | ||
} | ||
.form-button:where(:not([type="submit"], [type="reset"])) { | ||
@extend :--c-button--secondary; | ||
} | ||
.form-button[type="reset"] { | ||
@extend :--c-button--tertiary; | ||
} | ||
@import url("@tacc/core-styles/dist/components/django-cms-forms.css"); |
48 changes: 0 additions & 48 deletions
48
taccsite_cms/static/site_cms/css/src/_imports/components/django-cms-forms.hacks.css
This file was deleted.
Oops, something went wrong.
4 changes: 0 additions & 4 deletions
4
taccsite_cms/static/site_cms/css/src/_imports/components/django-cms-forms/config.yml
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.