PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

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

Browse source 
* 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
Show stats Download patch file Download diff file Expand all files Collapse all files

4
res/css/views/messages/_CreateEvent.scss
View file

@ -14,7 +14,9 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
.mx_CreateEvent { .mx_EventTileBubble.mx_CreateEvent {
margin: var(--EventTileBubble_margin-block) auto;
&::before { &::before {
background-color: $header-panel-text-primary-color; background-color: $header-panel-text-primary-color;
mask-image: url('$(res)/img/element-icons/chat-bubbles.svg'); mask-image: url('$(res)/img/element-icons/chat-bubbles.svg');

2
res/css/views/messages/_EventTileBubble.scss
View file

@ -15,6 +15,8 @@ limitations under the License.
*/ */
.mx_EventTileBubble { .mx_EventTileBubble {
--EventTileBubble_margin-block: 10px; // TODO: Use a spacing variable
background-color: $dark-panel-bg-color; background-color: $dark-panel-bg-color;
padding: 10px; // TODO: Use a spacing variable padding: 10px; // TODO: Use a spacing variable
border-radius: 8px; border-radius: 8px;

2
res/css/views/messages/_MJitsiWidgetEvent.scss
View file

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

4
res/css/views/messages/_common_CryptoEvent.scss
View file

@ -14,7 +14,9 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
.mx_cryptoEvent { .mx_EventTileBubble.mx_cryptoEvent {
margin: var(--EventTileBubble_margin-block) auto;
// white infill for the transparency // white infill for the transparency
&.mx_cryptoEvent_icon::before { &.mx_cryptoEvent_icon::before {
background-color: #ffffff; background-color: #ffffff;

6
res/css/views/rooms/_EventTile.scss
View file

@ -74,7 +74,7 @@ $left-gutter: 64px;
} }
.mx_EventTileBubble { .mx_EventTileBubble {
margin-block: 10px; // TODO: Use a spacing variable margin-block: var(--EventTileBubble_margin-block);
} }
.mx_MImageBody { .mx_MImageBody {
@ -238,6 +238,10 @@ $left-gutter: 64px;
.mx_EventTileBubble { .mx_EventTileBubble {
position: relative; position: relative;
left: var(--EventTile_irc_line_info-inset-inline-start); left: var(--EventTile_irc_line_info-inset-inline-start);
&.mx_cryptoEvent {
left: unset;
}
} }
.mx_ReplyTile .mx_EventTileBubble { .mx_ReplyTile .mx_EventTileBubble {

6
res/css/views/rooms/_HistoryTile.scss
View file

@ -14,7 +14,11 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
.mx_HistoryTile::before { .mx_EventTileBubble.mx_HistoryTile {
margin: var(--EventTileBubble_margin-block) auto;
&::before {
background-color: $header-panel-text-primary-color; background-color: $header-panel-text-primary-color;
mask-image: url('$(res)/img/element-icons/hide.svg'); mask-image: url('$(res)/img/element-icons/hide.svg');
} }
}