dm-website/src/Components/Utils/SearchBar/SearchBar.scss
2024-06-10 12:00:38 +03:00

112 lines
2.4 KiB
SCSS
Executable File

.SearchBar {
.group {
display: flex;
align-items: center;
position: relative;
max-width: 190px;
}
.input {
width: 100%;
height: 40px;
padding: 0 1rem;
padding-left: 2.5rem;
border-radius: 8px;
outline: none;
font-weight: 500;
background: var(--primary);
color: var(--bg);
border: none;
box-shadow: 2px 2px 7px 0 var(--primary);
}
.input::placeholder {
color: var(--bg);
}
.icon {
position: absolute;
left: 1rem;
fill: var(--bg);
width: 1rem;
height: 1rem;
}
}
.InputAutoComplete{
width: 78%;
height: 48px;
margin-top: 0px;margin-bottom: 38px;
.ant-select-arrow{
font-size: 32px;
color: var(--DarkGray) !important;
svg{
font-size: 20px;
}
}
.ant-select-selector{
border-radius: 10px !important;
border: 1.4px solid var(--DarkGray) !important;
padding-left: 18px !important;
span{
color: var(--DarkGray) !important;
font-size: 14px;
}
}
}
.Drawer_search_Body{
width: 90%;
margin-inline: auto;
.recent_search_text{
display: flex; justify-content: space-between;align-items: center;
.recent_search_text_container{
margin-block: 8px;
width: 100%;
display: flex; justify-content: space-between;
div{
display: flex;
p{
text-transform: capitalize;
font-size: 20px;
}
svg{
opacity: .6;
font-size: 20px;
margin-right: 10px;
}
}
}
svg{
font-size: 10px;
opacity: .6;
}
}
}
.search_first_section{
width: 91%;
margin-inline: auto;
display: flex;justify-content: space-between;align-items: center;
.delete_icon{
height: 75px;
cursor: pointer;
svg{
font-size: 30px;
}
}
}
.ViewSearch{
.ant-drawer .ant-drawer-content {
height: 50% !important ;width: 100% ;
min-height: 50% !important;
display: flex; flex-direction: column;
border-radius: 5px 0 0 5px;
}
}
.search_comp{
display: flex;
flex-direction: column;
}