Skip to content

Commit 933e862

Browse files
FabianWilmsFabianWilms
committed
✨ initial commit
1 parent 9cc1933 commit 933e862

30 files changed

+4417
-24
lines changed

‎.eslintrc.cjs‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
/* eslint-env node */
2+
require('@rushstack/eslint-patch/modern-module-resolution')
3+
4+
module.exports = {
5+
root: true,
6+
'extends': [
7+
'plugin:vue/vue3-essential',
8+
'eslint:recommended',
9+
'@vue/eslint-config-typescript',
10+
'@vue/eslint-config-prettier/skip-formatting'
11+
],
12+
parserOptions: {
13+
ecmaVersion: 'latest'
14+
}
15+
}

‎.gitignore‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
.DS_Store
12+
dist
13+
dist-ssr
14+
coverage
15+
*.local
16+
17+
/cypress/videos/
18+
/cypress/screenshots/
19+
20+
# Editor directories and files
21+
.vscode/*
22+
!.vscode/extensions.json
23+
.idea
24+
*.suo
25+
*.ntvs*
26+
*.njsproj
27+
*.sln
28+
*.sw?
29+
30+
*.tsbuildinfo

‎.npmrc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
registry=https://registry.npmjs.org/

‎.prettierrc.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"$schema": "https://json.schemastore.org/prettierrc",
3+
"semi": false,
4+
"tabWidth": 2,
5+
"singleQuote": true,
6+
"printWidth": 100,
7+
"trailingComma": "none"
8+
}

‎.vscode/extensions.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"recommendations": [
3+
"Vue.volar",
4+
"Vue.vscode-typescript-vue-plugin",
5+
"dbaeumer.vscode-eslint",
6+
"esbenp.prettier-vscode"
7+
]
8+
}

‎Dockerfile‎

Lines changed: 0 additions & 8 deletions
This file was deleted.

‎README.md‎

Lines changed: 36 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
## Customize this file after creating the new REPO and remove this lines.
2+
23
What to adjust:
34
* Add the your project or repo name direct under the logo.
45
* Add a short and long desciption.
@@ -12,40 +13,59 @@ What to adjust:
1213
## ------- end to remove -------
1314
<!-- add Project Logo, if existing -->
1415

15-
# repo or project name
16+
# muc-patternlab-vue
17+
18+
This repository contains a ready-to-use Vue-Components-Library based on munich.de's MDE5 Patternlab patternlab.muenchen.space
1619

17-
*Add a description from your project here.*
20+
In it's current state only some components exist. The library will continuely grow as the need for new components grows.
1821

22+
We intend to let this project be a community project in which every developer who needs new components contributes the results of his work into this library.
1923

2024
### Built With
2125

2226
The documentation project is built with technologies we use in our projects:
2327

24-
* *write here the list of used technologies*
28+
* Vue 3
29+
* MDE5 Patternlab
2530

2631
## Roadmap
2732

28-
*if you have a ROADMAP for your project add this here*
33+
In the near future we plan to
2934

35+
- Integrate Storybook.js to showcase components
36+
- Create more components
37+
- Integrate MDE5 Patternlab npm-Package as soon as it's available
3038

3139
See the [open issues](#) for a full list of proposed features (and known issues).
3240

33-
3441
## Set up
35-
*how can i start and fly this project*
3642

37-
## Documentation
38-
*what insights do you have to tell*
39-
40-
```mermaid
41-
graph TD;
42-
A-->B;
43-
A-->C;
44-
B-->D;
45-
C-->D;
43+
```shell
44+
git clone https://github.com/it-at-m/muc-patternlab-vue.git
45+
cd muc-patternlab-vue
46+
npm install
47+
npm run dev
4648
```
4749

48-
use [diagrams](https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/creating-diagrams).
50+
## Documentation
51+
52+
### Adding a new Component
53+
54+
1. Create a new Folder under `./src/components`-Directory
55+
2. Create Vue-Component (with composition api) and index.ts-File which exports your component
56+
3. Add your new Component to `./src/components/index.ts`
57+
58+
### Using MDE Patternlab-Icons
59+
60+
Patternlab-Icons are provided by a svg-Sprite which is automatically injected in this repos App.vue-File for local testing. You can expect the users of this library to do the same thing.
61+
62+
So to use an icon from Patternlab you can simply follow the official documentation: https://patternlab.muenchen.space/?p=viewall-guidelines-icons
63+
64+
```html
65+
<svg aria-hidden="true" class="icon">
66+
<use xlink:href="#icon-{name}"></use>
67+
</svg>
68+
```
4969

5070
## Contributing
5171

‎env.d.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/// <reference types="vite/client" />

‎index.html‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<link rel="icon" href="/favicon.ico">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Muc Patternlab Vue Components Demo</title>
8+
9+
<!-- Muenchen.de-Styles -->
10+
<link href="src/assets/temporary/muenchende-fontfaces.css" rel="stylesheet">
11+
<link href="src/assets/temporary/muenchende-style.css" rel="stylesheet">
12+
13+
</head>
14+
<body>
15+
<div id="app"></div>
16+
<script type="module" src="/src/main.ts"></script>
17+
</body>
18+
</html>

0 commit comments

Comments
 (0)