diff options
Diffstat (limited to 'src/client/views/nodes/button')
-rw-r--r-- | src/client/views/nodes/button/FontIconBox.scss | 21 | ||||
-rw-r--r-- | src/client/views/nodes/button/FontIconBox.tsx | 2 |
2 files changed, 14 insertions, 9 deletions
diff --git a/src/client/views/nodes/button/FontIconBox.scss b/src/client/views/nodes/button/FontIconBox.scss index 72fab74d9..8dfb66e30 100644 --- a/src/client/views/nodes/button/FontIconBox.scss +++ b/src/client/views/nodes/button/FontIconBox.scss @@ -6,7 +6,11 @@ justify-content: center; align-items: center; font-size: 80%; - border-radius: 7px; + border-radius: 2px; + + &:hover { + background-color: rgba(0,0,0,0.3) !important; + } .menuButton-wrap { grid-column: 1; @@ -94,8 +98,7 @@ width: 100px; display: grid; grid-auto-columns: 80px 20px; - justify-items: flex-start; - padding-left: 10px; + justify-items: center; font-family: 'Roboto'; white-space: nowrap; text-overflow: ellipsis; @@ -113,14 +116,15 @@ height: fit-content; top: 100%; z-index: 21; - background-color: #e3e3e3; - box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.3); - border-radius: 3px; + background-color: $white; + box-shadow: 0px 3px 4px rgba(0,0,0,0.3); + padding: 1px; .list-item { - color: black; + color: $black; width: 100%; height: 25px; + font-weight: 400; display: flex; justify-content: left; align-items: center; @@ -169,7 +173,8 @@ .menuButton-dropdown-header{ width: 100%; font-weight: 300; - overflow:hidden; + padding: 5px; + overflow: hidden; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; diff --git a/src/client/views/nodes/button/FontIconBox.tsx b/src/client/views/nodes/button/FontIconBox.tsx index 9a54579dc..84ad03fa2 100644 --- a/src/client/views/nodes/button/FontIconBox.tsx +++ b/src/client/views/nodes/button/FontIconBox.tsx @@ -169,7 +169,7 @@ export class FontIconBox extends DocComponent<ButtonProps, FontIconDocument>(Fon return ( <div className={`menuButton ${this.type} ${active}`} - style={{ display: show ? undefined : "none", backgroundColor: this.rootDoc.dropDownOpen ? Colors.LIGHT_BLUE : backgroundColor, color: this.rootDoc.dropDownOpen ? Colors.BLACK : color, borderBottomLeftRadius: this.dropdown ? 0 : undefined }} + style={{ display: show ? undefined : "none", backgroundColor: this.rootDoc.dropDownOpen ? Colors.MEDIUM_BLUE : backgroundColor, color: color, borderBottomLeftRadius: this.dropdown ? 0 : undefined }} onClick={dropdown ? () => this.rootDoc.dropDownOpen = !this.rootDoc.dropDownOpen : undefined}> <div className="menuButton-dropdown-header"> {text && text[0].toUpperCase() + text.slice(1)} |