@caweb/template 1.0.0-beta.1 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/.github/workflows/publish.yml +0 -1
  2. package/CHANGELOG.md +4 -1
  3. package/components/{alerts.html → alert/alert.html} +2 -1
  4. package/components/card/attributes.json +28 -0
  5. package/components/card/card.html +42 -0
  6. package/package.json +5 -2
  7. package/patterns/index.html +10 -4
  8. package/semantics/footer.html +3 -16
  9. package/semantics/nav-footer.html +18 -0
  10. package/semantics/nav-header.html +2 -2
  11. package/semantics/utility-header.html +2 -2
  12. package/content/sample.html +0 -49
package/.github/workflows/publish.yml CHANGED
@@ -17,7 +17,6 @@ jobs:
17
17
  with:
18
18
  node-version: 20
19
19
  registry-url: https://registry.npmjs.org/
20
- - run: npm ci
21
20
  - run: npm publish
22
21
  env:
23
22
  NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
package/CHANGELOG.md CHANGED
@@ -1,2 +1,5 @@
1
1
  v1.0.0
2
- - Removed templating out of @caweb/html-webpack-plugin and into it's own individual package
2
+ - Removed templating out of @caweb/html-webpack-plugin and into it's own individual package
3
+ - Updated nav.header and utility.links references
4
+ - Added new navFooter partial
5
+ - Added Card component
package/components/{alerts.html → alert/alert.html} RENAMED
@@ -31,4 +31,5 @@
31
31
  </button>
32
32
  </div>
33
33
  </div>
34
- </div>
34
+ </div>
35
+ <!-- End of Alert -->
package/components/card/attributes.json ADDED
@@ -0,0 +1,28 @@
1
+ {
2
+ "card":{
3
+ "heading": "string",
4
+ "headingColor": "string",
5
+ "headingAlignment": "string",
6
+ "subHeading": "string",
7
+ "subHeadingColor": "string",
8
+ "subHeadingAlignment": "string",
9
+ "content": "string",
10
+ "contentColor": "string",
11
+ "contentAlignment": "string",
12
+ "icon": "string",
13
+ "layout": [
14
+ "none",
15
+ "default",
16
+ "overstated",
17
+ "understated",
18
+ "standout",
19
+ "standout-highlight"
20
+ ],
21
+ "img": "string",
22
+ "imgPlacement": "string",
23
+ "imgAlignment": "string",
24
+ "url": "string",
25
+ "urlText": "string",
26
+ "divi": "string"
27
+ }
28
+ }
package/components/card/card.html ADDED
@@ -0,0 +1,42 @@
1
+ {{!--
2
+ This is a simple card component that can be used to display information in a structured format.
3
+ It includes a title, an image, and a description.
4
+ The card can be customized with different colors and sizes.
5
+ --}}
6
+ <!-- Card -->
7
+ <div class="card card-
8
+ {{~#if this.layout}}{{ this.layout }}{{else}}default{{/if}}
9
+ {{~#if this.divi}}{{#ifCond 'blurb' '===' this.divi }} {{ this.divi }} bg-transparent{{/ifCond}}{{/if}}">
10
+ {{#if this.img }}
11
+ {{#ifCond (ifCond this.imgPlacement '===' 'top' ) '||' (not this.imgPlacement ) }}
12
+ <img class="{{#if this.imgAlignment }}d-block{{{bsAttr 'spacing' this.imgAlignment }}}{{else}}card-img-top{{/if}}" src="{{ this.img }}" alt="Card image size">
13
+ {{/ifCond}}
14
+ {{/if}}
15
+ {{#if this.heading}}
16
+ <div class="card-header{{bsAttr 'text' this.headingAlignment}}">
17
+ <h4 class="card-title{{bsAttr 'text' this.headerColor }}">
18
+ {{~#if this.icon ~}}
19
+ <span class="ca-gov-icon-{{ this.icon }}"></span>
20
+ {{~/if~}}
21
+ {{~ this.heading ~}}
22
+ </h4>
23
+ {{#if this.url }}
24
+ <div class="options">
25
+ <a href="{{ this.url }}" class="btn btn-light" target="_blank">{{#if this.urlText}}{{ this.urlText }}{{else}}Read More{{/if}}</a>
26
+ </div>
27
+ {{/if}}
28
+ </div>
29
+ {{/if}}
30
+ <div class="card-body{{bsAttr 'text' this.contentColor }}">
31
+ {{#if this.subHeading }}
32
+ <div class="card-title{{bsAttr 'text' this.subHeadingAlignment }}">{{~ this.subHeading ~}}</div>
33
+ {{/if}}
34
+ {{{ this.content }}}
35
+ </div>
36
+ {{#if this.img }}
37
+ {{#ifCond this.imgPlacement '==' 'bottom' }}
38
+ <img class="{{#if this.imgAlignment }}d-block{{{bsAttr 'spacing' this.imgAlignment }}}{{else}}card-img-bottom{{/if}}" src="{{ this.img }}" alt="Card image size">
39
+ {{/ifCond}}
40
+ {{/if}}
41
+ </div>
42
+ <!-- End of Card -->
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@caweb/template",
3
- "version": "1.0.0-beta.1",
3
+ "version": "1.0.0",
4
4
  "author": "CAWebPublishing",
5
5
  "description": "CAWebPublishing Template",
6
6
  "license": "ISC",
@@ -30,7 +30,10 @@
30
30
  "serve": "set NODE_OPTIONS='--template ./patterns/index.html --search-template ./patterns/search.html' && webpack serve --config ./node_modules/@caweb/webpack/webpack.config.js --host danny.com --port 8888"
31
31
  },
32
32
  "dependencies": {
33
- "@caweb/framework": "^1.8.0-beta.1",
33
+ "@caweb/framework": "^1.8.0",
34
34
  "@caweb/icon-library": "^1.1.0"
35
+ },
36
+ "devDependencies": {
37
+ "@caweb/webpack": "^1.4.2"
35
38
  }
36
39
  }
package/patterns/index.html CHANGED
@@ -11,30 +11,36 @@
11
11
  {{/if}}
12
12
 
13
13
 
14
- {{#if htmlWebpackPlugin.options.meta }}
15
- {{#each htmlWebpackPlugin.options.meta }}
16
- <meta name="{{ @key }}" content="{{ this }}">
14
+ {{#if meta }}
15
+ {{#each meta }}
16
+ <meta name="{{ @key }}" content="{{ this }}" />
17
17
  {{/each}}
18
18
  {{/if}}
19
19
 
20
20
  {{#if assets }}
21
21
  {{#each assets }}
22
22
  {{#if (endsWith this ".css") }}
23
- <link rel="stylesheet" href="{{ this }}" />
23
+ <link rel="stylesheet" href="{{ this }}" />
24
24
  {{/if}}
25
25
  {{/each}}
26
26
  {{/if}}
27
+
27
28
  </head>
29
+
28
30
  <body>
31
+
29
32
  {{> header }}
33
+
30
34
  <div id="page-container" class="page-container">
31
35
  <div id="main-content" class="main-content" tabindex="-1">
32
36
  <main class="main-primary">
37
+
33
38
  {{#if htmlWebpackPlugin.options.templateParameters.bodyHtmlSnippet }}
34
39
  {{{ htmlWebpackPlugin.options.templateParameters.bodyHtmlSnippet }}}
35
40
  {{else}}
36
41
  {{> index }}
37
42
  {{/if}}
43
+
38
44
  </main>
39
45
  </div>
40
46
  </div>
package/semantics/footer.html CHANGED
@@ -1,22 +1,9 @@
1
1
  <footer class="global-footer">
2
2
  <div class="container">
3
3
  <div class="d-flex">
4
- {{#if footer.nav }}
5
- <ul class="nav footer-links">
6
- <li class="nav-item">
7
- <a href="https://www.ca.gov?utm_campaign=state_template_link&amp;utm_medium=footer&amp;utm_source=external" class="nav-link ps-0" title="CA.gov" target="_blank">
8
- <span class="ca-gov-logo-svg"></span>
9
- </a>
10
- </li>
11
- {{#each footer.nav }}
12
- {{#if this.url }}{{#if this.label }}
13
- <li class="nav-item">
14
- <a href="{{ this.url }}" class="nav-link">{{ this.label }}</a>
15
- </li>
16
- {{/if}}{{/if}}
17
- {{/each}}
18
- </ul>
19
- {{/if}}
4
+
5
+ {{> navFooter }}
6
+
20
7
  {{#if social }}
21
8
  <ul class="nav social-share-links">
22
9
  {{#each social }}
package/semantics/nav-footer.html ADDED
@@ -0,0 +1,18 @@
1
+ <!-- Navigation -->
2
+ {{#if footer.nav }}
3
+ <ul class="nav footer-links">
4
+ <li class="nav-item">
5
+ <a href="https://www.ca.gov?utm_campaign=state_template_link&amp;utm_medium=footer&amp;utm_source=external" class="nav-link ps-0" title="CA.gov" target="_blank">
6
+ <span class="ca-gov-logo-svg"></span>
7
+ </a>
8
+ </li>
9
+ {{#each footer.nav }}
10
+ {{#if this.url }}{{#if this.label }}
11
+ <li class="nav-item">
12
+ <a href="{{ this.url }}" class="nav-link">{{ this.label }}</a>
13
+ </li>
14
+ {{/if}}{{/if}}
15
+ {{/each}}
16
+ </ul>
17
+ {{/if}}
18
+
package/semantics/nav-header.html CHANGED
@@ -1,9 +1,9 @@
1
1
  <!-- Navigation -->
2
2
  <div class="navigation border-bottom">
3
3
  <div class="container">
4
- {{#if nav.header }}
4
+ {{#if header.nav }}
5
5
  <ul class="nav" aria-label="Main navigation">
6
- {{#each nav.header }}
6
+ {{#each header.nav }}
7
7
  {{#if this.sub }}
8
8
  <li class="nav-item dropdown">
9
9
  <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false" data-bs-popper-config='{"placement": "bottom-start", "strategy": "fixed"}'>{{ this.label }}</a>
package/semantics/utility-header.html CHANGED
@@ -13,9 +13,9 @@
13
13
  </div>
14
14
  <p class="official-tag">Official website of the State of California</p>
15
15
  </div>
16
- {{#if header.utility.links }}
16
+ {{#if header.utility }}
17
17
  <div class="settings-links">
18
- {{#each header.utility.links }}
18
+ {{#each header.utility }}
19
19
  {{#if this.url }}{{#if this.label }}
20
20
  <a href="{{ this.url }}">{{ this.label }}</a>
21
21
  {{/if}}{{/if}}
package/content/sample.html DELETED
@@ -1,49 +0,0 @@
1
- <div class="container">
2
- <nav aria-label="Breadcrumb" class="breadcrumbs">
3
- <ol>
4
- <li><a href="https://getbootstrap.com/" target="_blank">Bootstrap 5.3.3</a></li>
5
- <li><a href="https://www.npmjs.com/package/bootstrap-forced-colors-css" target="_blank">Bootstrap Forced CSS for Windows High Contrast Mode</a></li>
6
- <li><a href="https://animate.style/" target="_blank">Animate Styles</a></li>
7
- </ol>
8
- </nav>
9
- </div>
10
- <h1 class="page-title">CAWeb Template</h1>
11
- <p class="page-date"><time datetime="Sept 12, 2024">Sept 12, 2024</time></p>
12
- <div class="container">
13
- <p>CAWeb Template is built with Bootstrap 5.3.3</p>
14
- <h2>Key Features</h2>
15
- <ul>
16
- <li><a href="https://getbootstrap.com/" target="_blank">Bootstrap 5.3.3</a></li>
17
- <li><a href="https://www.npmjs.com/package/bootstrap-forced-colors-css" target="_blank">Bootstrap Forced CSS for Windows High Contrast Mode</a></li>
18
- <li><a href="https://animate.style/" target="_blank">Animate Styles</a></li>
19
- </ul>
20
- <h2>Components</h2>
21
- <ul>
22
- <li>
23
- <a href="./components/animations.html" target="_blank">Animations</a>
24
- </li>
25
- <li>
26
- <a href="./components/blockquotes.html" target="_blank">Blockquotes</a>
27
- </li>
28
- <li>
29
- <a href="./components/lists.html" target="_blank">Lists</a>
30
- </li>
31
- <li>
32
- <a href="./components/locations.html" target="_blank">Locations</a>
33
- </li>
34
- <li>
35
- <a href="./components/profile-banners.html" tdarget="_blank">Profile Banners</a>
36
- </li>
37
- <li>
38
- <a href="./components/sections.html" target="_blank">Sections</a>
39
- </li>
40
- <li>
41
- <a href="./components/service-tiles.html" target="_blank">Service Tiles</a>
42
- </li>
43
- <li>
44
- <a href="./components/typography.html" target="_blank">Typography</a>
45
- </li>
46
- </ul>
47
- </div>
48
-
49
- {{> '../src/components/lists.html' }}