@shakthillc/components
Version:
React generic components for shakthi products
64 lines (60 loc) • 1.28 kB
CSS
@import url("https://rsms.me/inter/inter.css");
.font-inter {
font-family: Inter;
font-size: 12px;
font-style: normal;
font-stretch: normal;
line-height: 1.43;
letter-spacing: normal;
}
.droplist {
composes: font-inter;
font-size: 14px;
display: inline-block;
padding: 0px 12px;
color: black;
background-color: #f0f0f0;
cursor: pointer;
border-radius: 4px;
-webkit-user-select: none;
user-select: none;
margin: auto;
text-align: center;
line-height: 32px;
}
.droplist:hover {
background-color: #f0f0f0;
}
.droplist:focus {
border: solid 1px #749be2;
}
.droplist__menu {
display: inline-flex;
flex-direction: column;
position: absolute;
background: white;
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.15);
margin-left: 5px;
z-index: 2;
border-radius: 4px;
padding: 4px 0px;
}
.droplist__menuitems {
composes: font-inter;
padding: 6px 10px;
}
.droplist__menuitems:hover {
background: #f0f0f0;
}
.dropdown__dropdown-list {
user-select: none;
margin-top: 4px;
overflow-y: auto;
max-height: 120px;
border-radius: 4px;
background: #ffffff;
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.15);
z-index: 2;
position: absolute;
min-width: 80px;
}