Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
U
ui-styleguide
Manage
Activity
Members
Labels
Plan
Issues
Issue boards
Milestones
Wiki
Code
Merge requests
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Build
Pipelines
Jobs
Pipeline schedules
Artifacts
Deploy
Releases
Model registry
Operate
Environments
Monitor
Incidents
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
Community forum
Contribute to GitLab
Provide feedback
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
TO
Weby
ui-styleguide
Commits
a948039b
Commit
a948039b
authored
4 years ago
by
xaralis
Browse files
Options
Downloads
Patches
Plain Diff
Update readme
parent
0d65733d
No related branches found
No related tags found
No related merge requests found
Pipeline
#1319
passed
4 years ago
Stage: build
Changes
1
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
README.md
+40
-1
40 additions, 1 deletion
README.md
with
40 additions
and
1 deletion
README.md
+
40
−
1
View file @
a948039b
...
@@ -35,7 +35,6 @@ The `npm` command will install project dependencies and the `npm run develop`
...
@@ -35,7 +35,6 @@ The `npm` command will install project dependencies and the `npm run develop`
command builds the project, sets up a local server for the Patternlab UI and
command builds the project, sets up a local server for the Patternlab UI and
watches relevant template files to rebuild on any changes.
watches relevant template files to rebuild on any changes.
### Build
### Build
The build command compiles the styleguide CSS and the Patternlab output but it
The build command compiles the styleguide CSS and the Patternlab output but it
...
@@ -92,3 +91,43 @@ current project settings. Add/modify icons and finally download your new icon
...
@@ -92,3 +91,43 @@ current project settings. Add/modify icons and finally download your new icon
font. Delete contents of the
`source/icons`
and put all the content from your
font. Delete contents of the
`source/icons`
and put all the content from your
downloaded font. When finished, run
`npm run update-iconset`
that will update
downloaded font. When finished, run
`npm run update-iconset`
that will update
both the style and pattern file automatically.
both the style and pattern file automatically.
## Developing other websites with pirati-ui
In order to integrate
`pirati-ui`
with other websites, you will need to include
at least the CSS source that defines look and feel. Simply place the following
code in your
`<head>`
:
```
html
<link
rel=
"stylesheet"
href=
"[ROOT_URL]/css/styles.css"
>
```
If you want to use the JS enahancements as well, you will also need to:
1.
Include Vue.js:
```html
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script>
```
2.
Include
`pirati-ui`
JS bundle:
```html
<script src="[ROOT_URL]/js/main.bundle.js"></script>
```
Make sure that Vue.js is included
*before*
the JS bundle. The best place for
both of the JS sources is at the end of your HTML document.
The
`[ROOT_URL]`
should point to the root address of your
`pirati-ui`
installation. This can either be
one of official bundles hosted at
`https://styleguide.pir-test.eu`
:
-
https://styleguide.pir-test.eu/latest/
-
https://styleguide.pir-test.eu/1.x.x/
-
... and so on
Alternatively, you can run the
`pirati-ui`
locally. In this case, just run
`npm run develop`
and use whatever opens in the browser as your
`ROOT_URL`
.
Usually, this will be
`http://localhost:3000/`
.
This diff is collapsed.
Click to expand it.
Preview
0%
Loading
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Save comment
Cancel
Please
register
or
sign in
to comment