mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Convert CloseButton styles out from css modules (#4723)
* Convert CloseButton styles out from css modules Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Fix close button styling Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
parent
4b71e02274
commit
f200005616
@ -19,7 +19,8 @@
|
||||
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
.closeButton {
|
||||
.SettingsCloseButton {
|
||||
.closeIcon {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
display: grid;
|
||||
@ -35,18 +36,19 @@
|
||||
&:active {
|
||||
transform: translateY(1px);
|
||||
}
|
||||
}
|
||||
|
||||
.icon {
|
||||
.Icon {
|
||||
color: var(--textColorAccent);
|
||||
opacity: 0.6;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.esc {
|
||||
.escLabel {
|
||||
text-align: center;
|
||||
margin-top: var(--margin);
|
||||
font-weight: bold;
|
||||
user-select: none;
|
||||
color: var(--textColorDimmed);
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
@ -19,7 +19,7 @@
|
||||
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
import styles from "./close-button.module.scss";
|
||||
import "./close-button.scss";
|
||||
|
||||
import React, { HTMLAttributes } from "react";
|
||||
import { Icon } from "../icon";
|
||||
@ -29,11 +29,11 @@ interface Props extends HTMLAttributes<HTMLDivElement> {
|
||||
|
||||
export function CloseButton(props: Props) {
|
||||
return (
|
||||
<div {...props}>
|
||||
<div className={styles.closeButton} role="button" aria-label="Close">
|
||||
<Icon material="close" className={styles.icon}/>
|
||||
<div className="SettingsCloseButton" {...props}>
|
||||
<div className="closeIcon" role="button" aria-label="Close">
|
||||
<Icon material="close" />
|
||||
</div>
|
||||
<div className={styles.esc} aria-hidden="true">
|
||||
<div className="escLabel" aria-hidden="true">
|
||||
ESC
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user