From af34a41a7215248372e918df9cfc6d0aa0ab6cd8 Mon Sep 17 00:00:00 2001 From: Suguru Hirahara Date: Fri, 8 Jul 2022 00:16:49 +0900 Subject: [PATCH 1/4] Re-add margin to HistoryTile, which is based on EventTileBubble Signed-off-by: Suguru Hirahara --- res/css/views/messages/_EventTileBubble.scss | 2 ++ res/css/views/rooms/_EventTile.scss | 2 +- res/css/views/rooms/_HistoryTile.scss | 10 +++++++--- 3 files changed, 10 insertions(+), 4 deletions(-) diff --git a/res/css/views/messages/_EventTileBubble.scss b/res/css/views/messages/_EventTileBubble.scss index 6813fec6665..4135dc09f2f 100644 --- a/res/css/views/messages/_EventTileBubble.scss +++ b/res/css/views/messages/_EventTileBubble.scss @@ -15,6 +15,8 @@ limitations under the License. */ .mx_EventTileBubble { + --EventTileBubble_margin-block: 10px; // TODO: Use a spacing variable + background-color: $dark-panel-bg-color; padding: 10px; // TODO: Use a spacing variable border-radius: 8px; diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 257170636b4..1a240749d01 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -74,7 +74,7 @@ $left-gutter: 64px; } .mx_EventTileBubble { - margin-block: 10px; // TODO: Use a spacing variable + margin-block: var(--EventTileBubble_margin-block); } .mx_MImageBody { diff --git a/res/css/views/rooms/_HistoryTile.scss b/res/css/views/rooms/_HistoryTile.scss index 48f5a4ce2e4..1cd9dd062f3 100644 --- a/res/css/views/rooms/_HistoryTile.scss +++ b/res/css/views/rooms/_HistoryTile.scss @@ -14,7 +14,11 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_HistoryTile::before { - background-color: $header-panel-text-primary-color; - mask-image: url('$(res)/img/element-icons/hide.svg'); +.mx_EventTileBubble.mx_HistoryTile { + margin: var(--EventTileBubble_margin-block) auto; + + &::before { + background-color: $header-panel-text-primary-color; + mask-image: url('$(res)/img/element-icons/hide.svg'); + } } From ec75abbda74d14ef5805974730313dd28967d3d3 Mon Sep 17 00:00:00 2001 From: Suguru Hirahara Date: Fri, 8 Jul 2022 01:00:59 +0900 Subject: [PATCH 2/4] Readd margin to the other tiles based on EventTileBubble Signed-off-by: Suguru Hirahara --- res/css/views/messages/_CreateEvent.scss | 4 +++- res/css/views/messages/_MJitsiWidgetEvent.scss | 4 +++- res/css/views/messages/_common_CryptoEvent.scss | 4 +++- 3 files changed, 9 insertions(+), 3 deletions(-) diff --git a/res/css/views/messages/_CreateEvent.scss b/res/css/views/messages/_CreateEvent.scss index b3f1ad4e4d7..db6e0244425 100644 --- a/res/css/views/messages/_CreateEvent.scss +++ b/res/css/views/messages/_CreateEvent.scss @@ -14,7 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_CreateEvent { +.mx_EventTileBubble.mx_CreateEvent { + margin: var(--EventTileBubble_margin-block) auto; + &::before { background-color: $header-panel-text-primary-color; mask-image: url('$(res)/img/element-icons/chat-bubbles.svg'); diff --git a/res/css/views/messages/_MJitsiWidgetEvent.scss b/res/css/views/messages/_MJitsiWidgetEvent.scss index 6360d089fa0..161a39e0435 100644 --- a/res/css/views/messages/_MJitsiWidgetEvent.scss +++ b/res/css/views/messages/_MJitsiWidgetEvent.scss @@ -14,7 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_MJitsiWidgetEvent { +.mx_EventTileBubble.mx_MJitsiWidgetEvent { + margin: var(--EventTileBubble_margin-block) auto; + &::before { background-color: $header-panel-text-primary-color; // XXX: Variable abuse mask-image: url('$(res)/img/element-icons/call/video-call.svg'); diff --git a/res/css/views/messages/_common_CryptoEvent.scss b/res/css/views/messages/_common_CryptoEvent.scss index 5938f4fcb9d..5753a8bf79f 100644 --- a/res/css/views/messages/_common_CryptoEvent.scss +++ b/res/css/views/messages/_common_CryptoEvent.scss @@ -14,7 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_cryptoEvent { +.mx_EventTileBubble.mx_cryptoEvent { + margin: var(--EventTileBubble_margin-block) auto; + // white infill for the transparency &.mx_cryptoEvent_icon::before { background-color: #ffffff; From c1ca46b4fe5ebc339eb13b1193260b31234ef3c4 Mon Sep 17 00:00:00 2001 From: Suguru Hirahara Date: Fri, 8 Jul 2022 01:17:24 +0900 Subject: [PATCH 3/4] Default margin is not required for mx_MJitsiWidgetEvent as it appears inside EventTile Signed-off-by: Suguru Hirahara --- res/css/views/messages/_MJitsiWidgetEvent.scss | 2 -- 1 file changed, 2 deletions(-) diff --git a/res/css/views/messages/_MJitsiWidgetEvent.scss b/res/css/views/messages/_MJitsiWidgetEvent.scss index 161a39e0435..0d811a74b0d 100644 --- a/res/css/views/messages/_MJitsiWidgetEvent.scss +++ b/res/css/views/messages/_MJitsiWidgetEvent.scss @@ -15,8 +15,6 @@ limitations under the License. */ .mx_EventTileBubble.mx_MJitsiWidgetEvent { - margin: var(--EventTileBubble_margin-block) auto; - &::before { background-color: $header-panel-text-primary-color; // XXX: Variable abuse mask-image: url('$(res)/img/element-icons/call/video-call.svg'); From bac319e98308b4b9447659c407708a3d63e2dfa3 Mon Sep 17 00:00:00 2001 From: Suguru Hirahara Date: Fri, 8 Jul 2022 01:31:25 +0900 Subject: [PATCH 4/4] Cancel left value for cryptoEvent on IRC layout Signed-off-by: Suguru Hirahara --- res/css/views/rooms/_EventTile.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 1a240749d01..d9a1ffd2023 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -238,6 +238,10 @@ $left-gutter: 64px; .mx_EventTileBubble { position: relative; left: var(--EventTile_irc_line_info-inset-inline-start); + + &.mx_cryptoEvent { + left: unset; + } } .mx_ReplyTile .mx_EventTileBubble {