diff --git a/docs/styles-and-scripts.md b/docs/styles-and-scripts.md index f4a832372..a46882c04 100644 --- a/docs/styles-and-scripts.md +++ b/docs/styles-and-scripts.md @@ -60,6 +60,18 @@ +
for one app + + ```django + + + ``` + + > **Warning** + > Undesired for scripts. Create a module script any page could use. + +
+
for one page > **Warning** @@ -94,6 +106,18 @@
+
for one app + + ```django + + + ``` + + > **Warning** + > Undesired for scripts. Create a module script any page could use. + +
+
for one page > **Warning** @@ -162,4 +186,4 @@ [Core Styles]: https://github.com/TACC/Core-Styles -[CMS UI Organization]: https://confluence.tacc.utexas.edu/x/54AZCg "CMS UI - Organization" +[CMS UI Organization]: https://tacc-main.atlassian.net/wiki/x/vxVv "CMS UI - Organization" diff --git a/taccsite_cms/static/djangocms_blog/css/djangocms_blog.css b/taccsite_cms/static/djangocms_blog/css/djangocms_blog.css deleted file mode 100644 index 22f25fb28..000000000 --- a/taccsite_cms/static/djangocms_blog/css/djangocms_blog.css +++ /dev/null @@ -1,3 +0,0 @@ -/* SEE: ../../site_cms/css/src/app.blog.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 */ diff --git a/taccsite_cms/static/djangocms_blog/css/djangocms_blog_pages.css b/taccsite_cms/static/djangocms_blog/css/djangocms_blog_pages.css new file mode 100644 index 000000000..c9b074f12 --- /dev/null +++ b/taccsite_cms/static/djangocms_blog/css/djangocms_blog_pages.css @@ -0,0 +1,3 @@ +/* SEE: /taccsite_cms/static/site_cms/css/src/app.blog.pages.css */ +/* FAQ: We use processed CSS built within taccsite_cms app */ +@import url("../site_cms/css/build/app.blog.pages.css"); diff --git a/taccsite_cms/static/djangocms_blog/css/djangocms_blog_plugins.css b/taccsite_cms/static/djangocms_blog/css/djangocms_blog_plugins.css new file mode 100644 index 000000000..5eeea9942 --- /dev/null +++ b/taccsite_cms/static/djangocms_blog/css/djangocms_blog_plugins.css @@ -0,0 +1,3 @@ +/* SEE: /taccsite_cms/static/site_cms/css/src/app.blog.plugins.css */ +/* FAQ: We use processed CSS built within taccsite_cms app */ +@import url("../site_cms/css/build/app.blog.plugins.css"); diff --git a/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/README.md b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/README.md new file mode 100644 index 000000000..393d5ff0b --- /dev/null +++ b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/README.md @@ -0,0 +1,7 @@ +# Stylesheets - … - Django CMS Blog - App Pages + +Pages available under one route, not pages that add blog plugins. + +## Resources + +- [Django CMS Blog Templates](https://github.com/nephila/djangocms-blog/tree/2.0.3/djangocms_blog/templates/djangocms_blog) diff --git a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.page.css b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/article.css similarity index 94% rename from taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.page.css rename to taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/article.css index 1f18d9819..037d73cb1 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.page.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/article.css @@ -1,18 +1,11 @@ -/* -Django CMS Blog App Page (Article/Post) Components +/* https://github.com/nephila/djangocms-blog/blob/2.0.3/djangocms_blog/templates/djangocms_blog/post_detail.html */ -Reference: - -- [`post_detail.html`](https://github.com/nephila/djangocms-blog/blob/1.2.3/djangocms_blog/templates/djangocms_blog/post_detail.html) - -Styleguide Components.DjangoCMS.Blog.App.Page -*/ @import url("@tacc/core-styles/src/lib/_imports/objects/o-offset-content.css"); @import url("@tacc/core-styles/src/lib/_imports/tools/x-drop-cap.css"); @import url("../tools/x-news.css"); -@import url("./django.cms.blog.selectors.css"); +@import url("../selectors.css"); diff --git a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.item.css b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/feed.css similarity index 90% rename from taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.item.css rename to taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/feed.css index 059dac9e5..a1b612f65 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.item.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/feed.css @@ -1,17 +1,10 @@ -/* -Django CMS Blog App Item (Post/Article in a List) Components +/* https://github.com/nephila/djangocms-blog/blob/2.0.3/djangocms_blog/templates/djangocms_blog/includes/blog_item.html */ -Reference: - -- [`includes/blog_item.html`](https://github.com/nephila/djangocms-blog/blob/1.2.3/djangocms_blog/templates/djangocms_blog/includes/blog_item.html) - -Styleguide Components.DjangoCMS.Blog.App.Item -*/ @import url("@tacc/core-styles/src/lib/_imports/tools/media-queries.css"); @import url("../tools/x-news.css"); -@import url("./django.cms.blog.selectors.css"); +@import url("../selectors.css"); /* Root */ diff --git a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.css b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/shared.css similarity index 82% rename from taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.css rename to taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/shared.css index dcda6fc3a..7ed135916 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.app.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/pages/shared.css @@ -1,28 +1,8 @@ -/* -Django CMS Blog App Components - -Shared among blog pages and plugins. - -Reference: - -- [Django CMS Blog App Templates](https://github.com/nephila/djangocms-blog/tree/1.2.3/djangocms_blog/templates/djangocms_blog) - -Styleguide Components.DjangoCMS.Blog.App -*/ @import url("@tacc/core-styles/dist/djangocms-blog/cms-pagination.css"); @import url("../tools/x-news.css"); -@import url("./django.cms.blog.app.page.css"); -@import url("./django.cms.blog.app.item.css"); -@import url("./django.cms.blog.selectors.css"); - - -/* Root */ - -.app-blog { - @mixin news; -} +@import url("../selectors.css"); /* Header */ diff --git a/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/plugins/README.md b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/plugins/README.md new file mode 100644 index 000000000..3e8a2f758 --- /dev/null +++ b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/plugins/README.md @@ -0,0 +1,7 @@ +# Stylesheets - … - Django CMS Blog - Plugin Instances + +Plugins can be loaded anywhere on the site, not just on blog app pages. + +## Resources + +- [Django CMS Blog Plugin Templates](https://github.com/nephila/djangocms-blog/tree/2.0.3/djangocms_blog/templates/djangocms_blog/plugins) diff --git a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.plugins.css b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/plugins/feed.css similarity index 60% rename from taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.plugins.css rename to taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/plugins/feed.css index 3312e359a..e2f7b8360 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.plugins.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/plugins/feed.css @@ -1,19 +1,10 @@ -/* -Django CMS Blog Plugin Components - -These plugins can be loaded anywhere on the site, not just on blog pages. - -Reference: - -- [Django CMS Blog Plugin Templates](https://github.com/nephila/djangocms-blog/tree/1.2.3/djangocms_blog/templates/djangocms_blog/plugins) - -Styleguide Components.DjangoCMS.Blog.Plugins -*/ -@import url("@tacc/core-styles/src/lib/_imports/tools/media-queries.css"); +/* https://github.com/nephila/djangocms-blog/blob/2.0.3/djangocms_blog/templates/djangocms_blog/plugins/latest_entries.html */ +/* https://github.com/nephila/djangocms-blog/blob/2.0.3/djangocms_blog/templates/djangocms_blog/plugins/featured_posts.html */ +/* https://github.com/nephila/djangocms-blog/blob/2.0.3/djangocms_blog/templates/djangocms_blog/plugins/authors_posts.html */ @import url("../tools/x-news.css"); -@import url("./django.cms.blog.selectors.css"); +@import url("../selectors.css"); @@ -21,21 +12,19 @@ Styleguide Components.DjangoCMS.Blog.Plugins /* ROOT */ /* to enable container queries */ -.plugin-blog { - @mixin news; - +.plugin-blog:has(:--news-feed-list) { container-type: inline-size; } -/* FEED: LATEST BLOG ARTICLES */ +/* FEED */ /* Root */ -:--news-feed-embed { +:--news-feed-list { @mixin news-feed; margin-bottom: var(--global-space--bootstrap-gap); @@ -53,12 +42,12 @@ Styleguide Components.DjangoCMS.Blog.Plugins /* Article */ /* to hide article details (attribution and metadata) */ -:--news-feed-embed article .post-detail { +:--news-feed-list article .post-detail { display: none; } /* for article layout */ -:--news-feed-embed article { +:--news-feed-list article { @mixin news-feed__article; & header { grid-area: head; } @@ -67,34 +56,34 @@ Styleguide Components.DjangoCMS.Blog.Plugins @mixin news-feed--grid-layout__article; } -:--news-feed-embed article:not(:has(.blog-visual > *)) { +:--news-feed-list article:not(:has(.blog-visual > *)) { @mixin news-feed__article--no-media; } /* Article - Titles */ /* to style h3 like an h4 */ -:--news-feed-embed article h3 { +:--news-feed-list article h3 { margin-bottom: 0.5rem; /* Bootstrap _type.css */ font-size: var(--global-font-size--medium); font-weight: var(--bold); } -:--news-feed-embed article h4 { +:--news-feed-list article h4 { display: none; } /* Article - Details */ /* to hide stuff that is not in a simple feed */ -:--news-feed-embed article h4, -:--news-feed-embed article .post-detail { +:--news-feed-list article h4, +:--news-feed-list article .post-detail { display: none; } /* Article - Visual */ -:--news-feed-embed article .blog-visual { +:--news-feed-list article .blog-visual { @mixin news-feed-article__media; @mixin news-feed-article__media--above-text; @mixin news-feed-article__media--constrain-content; @@ -102,13 +91,13 @@ Styleguide Components.DjangoCMS.Blog.Plugins /* Article - Lead */ -:--news-feed-embed article .blog-lead { +:--news-feed-list article .blog-lead { @mixin news-feed-article__lead; } /* Article - Footer */ -:--news-feed-embed article .read-more { +:--news-feed-list article .read-more { @mixin news-feed-article__link-overlay; } diff --git a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.selectors.css b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/selectors.css similarity index 95% rename from taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.selectors.css rename to taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/selectors.css index 7698e2c0f..05223b56e 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.blog.selectors.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/components/djangocms_blog/selectors.css @@ -12,6 +12,6 @@ @custom-selector :--news-article-item--in-list :--news-feed-page--as-list article; @custom-selector :--news-article-item--in-grid :--news-feed-page--as-grid article; -@custom-selector :--news-feed-embed +@custom-selector :--news-feed-list .blog-latest-entries, .blog-featured-posts; diff --git a/taccsite_cms/static/site_cms/css/src/_imports/tools/x-news.css b/taccsite_cms/static/site_cms/css/src/_imports/tools/x-news.css index 895159160..5c4dfc332 100644 --- a/taccsite_cms/static/site_cms/css/src/_imports/tools/x-news.css +++ b/taccsite_cms/static/site_cms/css/src/_imports/tools/x-news.css @@ -10,14 +10,7 @@ /* BASE */ -/* Root */ - -@define-mixin news { - /* … */ -} - - -/* Details */ +/* Roots */ @define-mixin news-details { margin-bottom: 1rem; /* to not rely on