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

Decor in categories, and testing methods

Browse Source
This commit is contained in:
Макс Овсяников 2022-10-14 15:26:17 +03:00
parent 3d47a8fd55
commit 0fcb6c9926
3 changed files with 21 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/cg-dropdown.js
View File

@ -50,12 +50,14 @@ export class DropDown {
selectIndex(index) { selectIndex(index) {
const options = this.#element.querySelectorAll('.list__item'); const options = this.#element.querySelectorAll('.list__item');
// const selected = this.#element.querySelector('.selected');
if (index > options.length) { if (index > options.length) {
return; return;
} }
const select = options[index].innerText; const select = options[index].innerText;
// selected.innerText = select;
this.#render(select); this.#render(select);
} }
@ -164,7 +166,6 @@ export class DropDown {
} else { } else {
this.#initSelected(); this.#initSelected();
} }
const ulList = document.createElement('ul'); const ulList = document.createElement('ul');
if (styles) { if (styles) {
@ -178,6 +179,7 @@ export class DropDown {
} }
ulList.classList.add('list'); ulList.classList.add('list');
this.#element.appendChild(ulList); this.#element.appendChild(ulList);
this.#items.forEach((dataItem) => { this.#items.forEach((dataItem) => {
@ -185,6 +187,7 @@ export class DropDown {
const strongItem = document.createElement('strong'); const strongItem = document.createElement('strong');
liItem.classList.add('list__item'); liItem.classList.add('list__item');
strongItem.classList.add('category');
if (multiselect) { if (multiselect) {
const checkBox = document.createElement('input'); const checkBox = document.createElement('input');

4
src/index.js
View File

@ -101,10 +101,10 @@ const dropdown4 = new DropDown({
multiselect: true, multiselect: true,
multiselectTag: true, multiselectTag: true,
}); });
// dropdown4.selectIndex(5);
// dropdown4.addItem('Харьков'); // dropdown4.addItem('Харьков');
// dropdown4.disabled(true); // dropdown4.deleteItemAll();
// dropdown4.selectIndex(5);
// const buttonOpen = document.querySelector('.button__open'); // const buttonOpen = document.querySelector('.button__open');
// const buttonClose = document.querySelector('.button__close'); // const buttonClose = document.querySelector('.button__close');

15
src/style/main.scss
View File

@ -146,6 +146,16 @@ body {
} }
} }
.category {
height: 20px;
margin: 6px 5px 0 7px;
font-size: 17px;
border-bottom: 1px solid;
display: flex;
align-items: center;
}
input[type='checkbox'] { input[type='checkbox'] {
cursor: pointer; cursor: pointer;
margin: 0 5px 0 0; margin: 0 5px 0 0;
@ -164,6 +174,7 @@ input[type='checkbox'] {
background-color: #ffffff; background-color: #ffffff;
} }
} }
.svg-icon path { .svg-icon path {
color: black; color: black;
stroke: currentcolor; stroke: currentcolor;
@ -179,6 +190,10 @@ input[type='checkbox'] {
transition: 0.5s; transition: 0.5s;
display: block; display: block;
opacity: 1; opacity: 1;
&_none {
opacity: 0 !important;
}
} }
::-webkit-scrollbar { ::-webkit-scrollbar {