apuc/cg-select
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix packege.json

Browse Source
This commit is contained in:
Макс Овсяников 2022-11-14 12:23:18 +03:00
parent 585387c415
commit f9dbbb01a9
5 changed files with 1421 additions and 298 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
README.md
View File

@ -1,33 +1,40 @@
# CG-SELECT
## version ~1.0.0
## version ~ 0.0.1
Этот компонент позволяет создать кастомный селект. Он предлагает более гибкую настройку и использование селекта.
Доступна кастомизация, мультивыбор и живой поиск по елементам.
### Доступна возможность кастомизации основных элементов, таких как:
* Кнопка селекта.
* Список c элементами селекта.
* Placeholder.
* При режиме мультиселект доступна кастомизация chips(выбранных эл-ов).
* Label элемента(если он был указан)
* Переключение тем с темной на светлую
- Кнопка селекта.
- Список c элементами селекта.
- Placeholder.
- При режиме мультиселект доступна кастомизация chips(выбранных эл-ов).
- Label элемента(если он был указан)
- Переключение тем с темной на светлую
## Installation
TODO: Describe the installation process
## Usage
### Для создания компонета нужно:
1. Создать обычный button елемент.
2. Присвоить ему класс cg-dropdown.
```
<button class="cg-dropdown"></button>
```
3. Присвоить ему **уникальный класс**, например(cg-dropdown_categories)
```
<button class="cg-dropdown cg-dropdown_categories"></button>
```
4. Создать новый экземпляр класса(new DropDown)
5. Передать все желаемые настройки как объект
@ -52,9 +59,7 @@ const dropdown = new DropDown({
'MAN',
'Ferari',
],
});
```
#### Примеры разных селектов
@ -67,10 +72,13 @@ const dropdown = new DropDown({
Вся документация по CG-SELECT находится в одноименной папке. В документации описаны все методы и переменные, также есть примеры передачи настроек в select. Чтобы просмотреть его, откройте файл index.html в браузере из папки с документацией.
## Contributing
1. Fork it!
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -am 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D
## History
TODO: Write history

1639
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

16
package.json
View File

@ -3,22 +3,28 @@
"version": "0.0.1",
"description": "",
"scripts": {
"start": "parcel ./index.html -p 4500 --open",
"build": "parcel build ./src/index.html"
"start": "parcel ./src/index.html -p 4500 --open ",
"build": "parcel build ./src/index.html --public-url /cg-select/",
"deploy": "gh-pages -d dist",
"predeploy": "npm run build"
},
"repository": {
"type": "git",
"url": "git+https://github.com/MaxOvs19/Dropdown-list.git"
"url": "git+https://github.com/MaxOvs19/Cg-select.git"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/MaxOvs19/Dropdown-list/issues"
"url": "https://github.com/MaxOvs19/Cg-select/issues"
},
"homepage": "https://github.com/MaxOvs19/Dropdown-list#readme",
"homepage": "https://github.com/MaxOvs19/Cg-select",
"devDependencies": {
"@parcel/transformer-sass": "^2.7.0",
"parcel": "^2.7.0",
"prettier": "^2.7.1"
},
"dependencies": {
"@parcel/optimizer-css": "^2.8.0",
"gh-pages": "^4.0.0"
}
}

4
index.html → src/index.html
View File

@ -5,13 +5,13 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Cg-Select</title>
<link href="./src/style/main.scss" rel="stylesheet" />
<link href="style/main.scss" rel="stylesheet" />
</head>
<body>
<div class="container">
<header class="header">
<h1>CG-SELECT</h1>
<img src="src/images/logoCG.jpg" alt="#" class="header__logo" />
<img src="/src/images/logoCG.jpg" alt="#" class="header__logo" />
</header>
</div>

2
src/style/main.scss
View File

@ -1,4 +1,4 @@
@import 'src/style/nativSelect.scss';
@import './nativSelect.scss';
@import './scrolbar.scss';
@import './whiteTheme.scss';
@import './svgStyle.scss';