73 lines
1.4 KiB
SCSS
73 lines
1.4 KiB
SCSS
@use "../variables/variables" as v;
|
|
|
|
/* POP UP KEYBOARD WITH SPECIAL CHARACTERS AND THE SUGGESTIONS STYLING FILE */
|
|
|
|
.kbd-root {
|
|
height: auto;
|
|
width: 100%;
|
|
.keyboard-popup {
|
|
background-color: v.$nav-white;
|
|
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);
|
|
border-radius: 0 0 6px 6px;
|
|
padding: 1rem 2rem;
|
|
/*width: 100%;*/
|
|
z-index: 1000;
|
|
/*position: fixed;*/
|
|
height: auto;
|
|
|
|
span {
|
|
min-height: 40px;
|
|
button {
|
|
display: block;
|
|
margin-top: auto;
|
|
width: 32px;
|
|
height: 32px;
|
|
padding: 0 10px;
|
|
background-color: #ddd;
|
|
/*box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);*/
|
|
border-radius: 2px;
|
|
border: none;
|
|
|
|
&:hover {
|
|
background-color: #aaa;
|
|
}
|
|
|
|
&:active {
|
|
/* on click if required */
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.suggestion-popup {
|
|
/*position: absolute;*/
|
|
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);
|
|
border-radius: 0px 0px 6px 6px;
|
|
|
|
button {
|
|
border: none;
|
|
background-color: v.$nav-white;
|
|
|
|
&:hover {
|
|
background-color: v.$gray-2;
|
|
}
|
|
}
|
|
}
|
|
|
|
.suggs {
|
|
position: absolute;
|
|
/*top: 150px;*/
|
|
> div {
|
|
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);
|
|
background-color: #fff;
|
|
> button.button-sugg {
|
|
background-color: v.$nav-white;
|
|
|
|
&:hover {
|
|
background-color: #aaa;
|
|
}
|
|
}
|
|
}
|
|
}
|