diff options
| author | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2019-05-13 15:03:08 +0200 |
|---|---|---|
| committer | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2019-05-13 15:03:08 +0200 |
| commit | f7842265d839f355f6df463c7497aec78f8453e6 (patch) | |
| tree | 173cb3d58f9e4b68ebaabb59225665e8d5ac8a43 /css | |
| parent | 8463ce63c2d5651a4a4c979de1a333a8bee148bf (diff) | |
Update template and css
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
Diffstat (limited to 'css')
| -rw-r--r-- | css/ContactDetails.scss | 13 | ||||
| -rw-r--r-- | css/ContactDetailsAvatar.scss | 11 | ||||
| -rw-r--r-- | css/Properties/Properties.scss | 16 |
3 files changed, 15 insertions, 25 deletions
diff --git a/css/ContactDetails.scss b/css/ContactDetails.scss index 2be765e8..6c4e53f7 100644 --- a/css/ContactDetails.scss +++ b/css/ContactDetails.scss @@ -68,14 +68,11 @@ #contact-header-actions { position: relative; display: flex; - .menu-icon { - position: relative; - height: 44px; - width: 44px; - // ! override default server class - > .icon-more-white { - // using #fffffe to trick the accessibility dark theme icon invert - @include icon-color('more', 'actions', '#fffffe', 1, true); + .header-menu { + margin-right: 10px; + .action-item__menutoggle { + // force white over header colour + color: white; } } .header-icon { diff --git a/css/ContactDetailsAvatar.scss b/css/ContactDetailsAvatar.scss index 3f1dd3bf..f86c1709 100644 --- a/css/ContactDetailsAvatar.scss +++ b/css/ContactDetailsAvatar.scss @@ -74,8 +74,15 @@ opacity: .7; } &__popovermenu { - top: calc(50% + 24px); - right: calc(50% - 22px); + // center + margin: calc((100% - 44px) / 2); + & /deep/ .action-item__menutoggle { + // hide three dot menu, in favour of icon-picture-force-white + z-index: -1; + &::before { + opacity: 0; + } + } } } // if picture is set, hide the menu diff --git a/css/Properties/Properties.scss b/css/Properties/Properties.scss index 8aa23f78..9ba2f0d3 100644 --- a/css/Properties/Properties.scss +++ b/css/Properties/Properties.scss @@ -179,24 +179,10 @@ $property-value-max-width: 250px; position: absolute !important; top: 0; left: 100%; - margin: 0; - margin-top: -3px; // align with line because of the 44x44px size + margin: -2px 2px; // align with line because of the 44x44px size border: 0; background-color: transparent; z-index: 10; - // opacity applies on the single action OR - &:not(.action-item--multiple), - &.action-item--multiple .icon-more { - opacity: 0.5; - } - &:hover, - &:active, - &:focus { - &:not(.action-item--multiple), - &.action-item--multiple .icon-more { - opacity: 0.7; - } - } } .property__value { margin-right: 0; |