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

Added nativ select in mobile scrin

Browse Source
This commit is contained in:
Макс Овсяников 2022-10-28 16:56:14 +03:00
parent e5f2df8b2c
commit bb22c0dc85
4 changed files with 34 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/index.html
View File

@ -6,7 +6,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Cg-Select</title> <title>Cg-Select</title>
<link href="./style/main.scss" rel="stylesheet" /> <link href="./style/main.scss" rel="stylesheet" />
<link href="./style/nativSelect.scss" rel="stylesheet" />
</head> </head>
<body> <body>
<div class="container"> <div class="container">

1
src/index.js
View File

@ -23,6 +23,7 @@ const dropdown = new DropDown({
borderRadius: '5px', borderRadius: '5px',
}, },
}, },
// multiselect: true,
}); });
// ------------------------------URL-------------------- // ------------------------------URL--------------------

16
src/style/main.scss
View File

@ -1,3 +1,5 @@
@import 'src/style/nativSelect.scss';
* { * {
font-size: 14px; font-size: 14px;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
@ -230,3 +232,17 @@ input[type='checkbox'] {
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background-color: #4d4d4d; background-color: #4d4d4d;
} }
@media (max-width: 425px) {
.list {
display: none !important;
}
.open {
display: none !important;
}
.cg-select {
display: none !important;
}
}

17
src/style/nativSelect.scss
View File

@ -6,8 +6,25 @@
background: #2a2f3b; background: #2a2f3b;
box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.5); box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.5);
border-radius: 5px; border-radius: 5px;
margin: 0;
&__nativOption { &__nativOption {
border: 1px #0a0b0e solid; border: 1px #0a0b0e solid;
} }
} }
@media (max-width: 425px) {
.nativSelect {
display: block;
min-width: 235px;
height: 50px;
border: none;
border-radius: 10px;
}
select[multiple='multiple'] {
color: black;
background-color: white;
border-radius: 0;
}
}