docs: Update README
Change project description to current toolset and update usage.
This commit is contained in:
parent
d3ab17d5a1
commit
c4947a9c04
2 changed files with 35 additions and 20 deletions
|
|
@ -137,6 +137,6 @@ export default async function (eleventyConfig) {
|
||||||
includes: '../templates',
|
includes: '../templates',
|
||||||
data: '../data'
|
data: '../data'
|
||||||
},
|
},
|
||||||
templateFormats: ['html', 'liquid', 'md']
|
templateFormats: ['html', 'liquid', 'md', 'njk']
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
|
||||||
47
README.md
47
README.md
|
|
@ -5,14 +5,19 @@ Hippie interweaves preeminent personal interface elements
|
||||||
> WORK IN PROGRESS (it is not ready to be used)
|
> WORK IN PROGRESS (it is not ready to be used)
|
||||||
|
|
||||||
This is a [Node.js](https://nodejs.org/) based generator for static HTML documents.
|
This is a [Node.js](https://nodejs.org/) based generator for static HTML documents.
|
||||||
|
It uses the [Eleventy](https://www.11ty.dev/) project to fiddle everything together.
|
||||||
|
|
||||||
It uses the [gulp](https://gulpjs.com/) module to fiddle everything together. Styling is powered by the CSS extension language [SASS](https://sass-lang.com/). The HTML pages itself are made with the templating engine [Nunjucks](https://mozilla.github.io/nunjucks/).
|
Styling is powered by the CSS extension language [SASS](https://sass-lang.com/). The HTML pages are written with
|
||||||
|
templating engines or directly as HTML files. Mainly [Liquid](https://liquidjs.com/) is used,
|
||||||
|
but [Markdown](https://daringfireball.net/projects/markdown/) and [Nunjucks](https://mozilla.github.io/nunjucks/) are
|
||||||
|
also options.
|
||||||
|
|
||||||
## Installing
|
## Installing
|
||||||
|
|
||||||
Clone the repository `https://quelltext.interaktionsweise.de/interaktionsweise/hippie.git` to a folder to create your build environment.
|
Clone the repository `https://quelltext.interaktionsweise.de/interaktionsweise/hippie.git` to a folder to create your
|
||||||
|
build environment.
|
||||||
|
|
||||||
Change to the newly created folder. By default this would be *hippie*.
|
Change to the newly created folder. By default, this would be *hippie*.
|
||||||
|
|
||||||
Run the command `git submodule update --init`.
|
Run the command `git submodule update --init`.
|
||||||
This will load the submodules.
|
This will load the submodules.
|
||||||
|
|
@ -22,21 +27,26 @@ This will install all dependencies into the folder *node_modules*.
|
||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|
||||||
The command `gulp --tasks` will give you an overview of possible actions.
|
Different *scripts* are provided through `package.json`:
|
||||||
|
|
||||||
Run the command `gulp` for a live development environment.
|
Run the command `npm run serve` for a live development environment.
|
||||||
This will create a folder *build* with the resulting files.
|
This will create a folder `/build` with the resulting files.
|
||||||
Also the source files will be watched for changes which are reflected live at [localhost:3000](http://localhost:3000) and the *build* directory.
|
Also, the source files will be watched for changes which are reflected live at [localhost:8080](http://localhost:8080)
|
||||||
|
and the `/build` directory.
|
||||||
|
|
||||||
`gulp build` will create the resulting *build* directory ready for deployment.
|
`npm run build` will just create the resulting `/build` directory and `npm run deploy` will use a path prefix (*hippie*
|
||||||
|
by default) and create the results in `/deploy` ready for deployment.
|
||||||
|
|
||||||
HIPPIE is intended to be used as a basis when creating HTML sites. It can be used without changes. It can be modified to have a different look and feel. It also can be used to build a new basis on top of it.
|
HIPPIE is intended to be used as a basis when creating HTML sites. It can be used without changes. It can be modified to
|
||||||
|
have a different look and feel. It also can be used to build a new basis on top of it.
|
||||||
|
|
||||||
## Content
|
## Content
|
||||||
|
|
||||||
### Intro
|
### Intro
|
||||||
|
|
||||||
There is an *intro* page which explains the main elements and their intended usage. It uses the default styling methods and also shows variations. The page is written in german language. However it has a semantic structure and the text itself can also just be seen as example content.
|
There is an *intro* page which explains the main elements and their intended usage. It uses the default styling methods
|
||||||
|
and also shows variations. The page is written in german language. However, it has a semantic structure and the text
|
||||||
|
itself can also just be seen as example content.
|
||||||
|
|
||||||
### Sass (CSS)
|
### Sass (CSS)
|
||||||
|
|
||||||
|
|
@ -44,7 +54,8 @@ Everything has its default style.
|
||||||
|
|
||||||
CSS classes follow a naming scheme of `<object>_<description>`.
|
CSS classes follow a naming scheme of `<object>_<description>`.
|
||||||
|
|
||||||
- *Object* usually is the name of the HTML element. If it is not a element directly it is the thing which receives the styling
|
- *Object* usually is the name of the HTML element. If it is not an element directly it is the thing which receives the
|
||||||
|
styling
|
||||||
- *Description* is a name of the style e.g. what it does, how it looks
|
- *Description* is a name of the style e.g. what it does, how it looks
|
||||||
|
|
||||||
### JavaScript (JS)
|
### JavaScript (JS)
|
||||||
|
|
@ -65,19 +76,23 @@ If the ID is for an interactive element the first part is an abbreviation of the
|
||||||
|
|
||||||
## Versioning
|
## Versioning
|
||||||
|
|
||||||
This project uses [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository](https://quelltext.interaktionsweise.de/interaktionsweise/hippie/tags).
|
This project uses [SemVer](http://semver.org/) for versioning. For the versions available, see
|
||||||
|
the [tags on this repository](https://quelltext.interaktionsweise.de/interaktionsweise/hippie/tags).
|
||||||
|
|
||||||
## Contribution
|
## Contribution
|
||||||
|
|
||||||
For contribution please use the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/#summary) specification.
|
For contribution please use the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/#summary)
|
||||||
|
specification.
|
||||||
The commit *type* can include the following:
|
The commit *type* can include the following:
|
||||||
|
|
||||||
- feat – A new feature is introduced with the changes
|
- feat – A new feature is introduced with the changes
|
||||||
- fix – A bug fix has occurred
|
- fix – A bug fix has occurred
|
||||||
- chore – Changes that do not relate to a fix or feature and don't modify src or test files (for example updating dependencies)
|
- chore – Changes that do not relate to a fix or feature and don't modify src or test files (for example updating
|
||||||
|
dependencies)
|
||||||
- refactor – Refactored code that neither fixes a bug nor adds a feature
|
- refactor – Refactored code that neither fixes a bug nor adds a feature
|
||||||
- docs – Updates to documentation such as a the README or other markdown files
|
- docs – Updates to documentation such as the README or other Markdown files
|
||||||
- style – Changes that do not affect the meaning of the code, likely related to code formatting such as white-space, missing semi-colons, and so on.
|
- style – Changes that do not affect the meaning of the code, likely related to code formatting such as white-space,
|
||||||
|
missing semicolons, and so on.
|
||||||
- test – Including new or correcting previous tests
|
- test – Including new or correcting previous tests
|
||||||
- perf – Performance improvements
|
- perf – Performance improvements
|
||||||
- ci – Continuous integration related
|
- ci – Continuous integration related
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue