diff --git a/Dockerfile b/Dockerfile
index 8b37fa2de..8e143f0f5 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -69,4 +69,4 @@ WORKDIR /code
RUN npm ci
ARG PROJECT_NAME
ARG BUILD_ID
-RUN npm run build --project=$PROJECT_NAME --build-id=$BUILD_ID
+RUN npm run build:css --project=$PROJECT_NAME --build-id=$BUILD_ID
diff --git a/docs/develop-project.md b/docs/develop-project.md
index cdb7c54a1..b70c21f35 100644
--- a/docs/develop-project.md
+++ b/docs/develop-project.md
@@ -70,17 +70,11 @@ A demo of any documented CSS modules from [Core Styles] and [Core CMS].
```sh
docker exec -it core_cms /bin/bash
# That opens a command prompt within the container.
- npm run build:css-demo --project="core-cms"
+ npm run build:ui-demo
```
-2. Serve:
-
- This feature is not built-in yet. You have options:
-
- | option | steps |
- | - | - |
- | clone small Django app | [working app in tup-ui](https://github.com/TACC/tup-ui/tree/v1.0.5/apps/ui-patterns) |
- | serve locally with Node | `npx serve taccsite_ui/dist` |
+2. Give the server time to automatically restart.
+3. Open http://localhost:8000/static/ui/index.html.
## Develop with [Core Styles] Simultaneously
diff --git a/package.json b/package.json
index 8fa5f1626..e93bad819 100644
--- a/package.json
+++ b/package.json
@@ -16,12 +16,12 @@
},
"repository": "git@github.com:TACC/Core-CMS.git",
"scripts": {
- "build": "npm run build:css && npm run build:css-demo",
+ "build": "npm run build:css && npm run build:ui-demo",
"build:css": "bin/build-css.js --project=$npm_config_project --build-id=$npm_config_build_id",
"postbuild:css": "cp -r node_modules/@tacc/core-styles/src/lib/fonts/* taccsite_cms/static/site_cms/fonts",
- "build:css-demo": "cd taccsite_ui && fractal build --project=$npm_config_project",
- "prebuild:css-demo": "cp -r node_modules/@tacc/core-styles/src/lib/_imports/_preview.hbs taccsite_cms/static/site_cms/css/src/_imports/",
- "postbuild:css-demo": "rm taccsite_cms/static/site_cms/css/src/_imports/_preview.hbs"
+ "build:ui-demo": "cd taccsite_ui && fractal build",
+ "prebuild:ui-demo": "cp -r node_modules/@tacc/core-styles/src/lib/_imports/_preview.hbs taccsite_cms/static/site_cms/css/src/_imports/",
+ "postbuild:ui-demo": "rm taccsite_cms/static/site_cms/css/src/_imports/_preview.hbs"
},
"homepage": "https://github.com/TACC/Core-CMS"
}
diff --git a/taccsite_cms/settings.py b/taccsite_cms/settings.py
index 46146329f..ba99f25a9 100644
--- a/taccsite_cms/settings.py
+++ b/taccsite_cms/settings.py
@@ -299,10 +299,10 @@ def gettext(s): return s
os.path.join(BASE_DIR, 'taccsite_custom', '*', 'static')
))
-# If the UI Pattern Library exists, serve it at .../ui
-staticfiles_dir_ui = os.path.join(BASE_DIR, 'taccsite_ui', 'dist')
-if os.path.exists(staticfiles_dir_ui):
- STATICFILES_DIRS += (('ui', staticfiles_dir_ui),)
+# Serve UI Demo (if it exists) at .../ui
+ui_demo_dir = os.path.join(BASE_DIR, 'taccsite_ui', 'dist')
+if os.path.exists(ui_demo_dir):
+ STATICFILES_DIRS += (('ui', ui_demo_dir),)
# User Uploaded Files Location.
MEDIA_URL = '/media/'
diff --git a/taccsite_cms/templates/assets_site.html b/taccsite_cms/templates/assets_site.html
index 972bdb12e..00e44da49 100644
--- a/taccsite_cms/templates/assets_site.html
+++ b/taccsite_cms/templates/assets_site.html
@@ -17,7 +17,7 @@
-{# CAVEAT: Requires `npm run build` step before running the Django project. #}
+{# CAVEAT: Requires `npm run build:css` step #}
diff --git a/taccsite_ui/fractal.config.js b/taccsite_ui/fractal.config.js
index 8a614c30e..86f7ce162 100644
--- a/taccsite_ui/fractal.config.js
+++ b/taccsite_ui/fractal.config.js
@@ -1,37 +1,18 @@
'use strict';
-const path = require('path');
-const mandelbrot = require('@frctl/mandelbrot');
-const minimist = require('minimist');
-
-// Get base config
const fractal = require('@tacc/core-styles/fractal.config.js');
-const themeConfig = require('./fractal.theme.js');
const defaultContext = fractal.components.get('default.context');
-// Get project
-// (name)
-const args = minimist( process.argv.slice( 2 ));
-let cmsName = 'core-cms';
-let projName = args['project'] || '';
- projName = ( projName !== cmsName ) ? projName : '';
-// (stylesheet)
-const escapeDemoDir = '/../..'; // i.e. back out of '/static/ui'
-const cmsCSSFiles = [
+// Customize styles
+const cmsStyles = [
...defaultContext.cmsStyles,
{
isInternal: false,
layer: 'project',
- path: `${escapeDemoDir}/static/site_cms/css/build/site.cms.css`
+ // FAQ: The '/../..' backs out of '/static/ui'
+ path: `/../../static/site_cms/css/build/core-cms.css`
},
];
-const projCSSFiles = ( projName ) ? [
- {
- isInternal: false,
- layer: 'cosmetic',
- path: `${escapeDemoDir}/static/${projName}/css/build/site.cms.css`
- },
-] : [];
// Set source paths
// (for components)
@@ -39,16 +20,12 @@ fractal.components.set('exclude', '*.md');
fractal.components.set('path', __dirname + '/patterns');
// (for stylesheets)
fractal.components.set('default.context', {
- ...fractal.components.get('default.context'),
- shouldSkipPattern: true, // true, because …base.css loads most components
- cmsStyles: cmsCSSFiles.concat( projCSSFiles )
+ ...defaultContext,
+ shouldSkipPattern: true, // true, because Core-Styles loads most patterns
+ cmsStyles: cmsStyles
});
-fractal.cli.log(`+ Included CSS for "${cmsName}"`);
-cmsCSSFiles.forEach( file => { fractal.cli.log(file.path) });
-if ( projCSSFiles.length > 0 ) {
- fractal.cli.log(`+ Included CSS for "${projName}"`);
- projCSSFiles.forEach( file => { fractal.cli.log(file.path) });
-}
+fractal.cli.log(`+ Included Core-CMS stylesheets`);
+cmsStyles.forEach( file => { fractal.cli.log(file.path) });
// Set website paths
// FAQ: Setting static.path results in `shouldSkipPattern: false` letting ONLY Core-CMS assets load, because that directory ONLY has Core-CMS assets
@@ -57,6 +34,8 @@ if ( projCSSFiles.length > 0 ) {
fractal.web.set('builder.dest', __dirname + '/dist');
// Customize theme
+const mandelbrot = require('@frctl/mandelbrot');
+const themeConfig = require('./fractal.theme.js');
const theme = mandelbrot( themeConfig );
fractal.web.theme( theme );