Re-add margin to tiles based on EventTileBubble (#9015)

* Re-add margin to HistoryTile, which is based on EventTileBubble

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Readd margin to the other tiles based on EventTileBubble

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Default margin is not required for mx_MJitsiWidgetEvent as it appears inside EventTile

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Cancel left value for cryptoEvent on IRC layout

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
This commit is contained in:
Suguru Hirahara 2022-07-08 08:58:49 +00:00 committed by GitHub
parent 39816f67e4
commit b1f8d36a69
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 21 additions and 7 deletions

View file

@ -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');

View file

@ -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;

View file

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MJitsiWidgetEvent {
.mx_EventTileBubble.mx_MJitsiWidgetEvent {
&::before {
background-color: $header-panel-text-primary-color; // XXX: Variable abuse
mask-image: url('$(res)/img/element-icons/call/video-call.svg');

View file

@ -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;

View file

@ -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 {
@ -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 {

View file

@ -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');
}
}