moodle/moodle
3
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-08-08 02:16:41 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

MDL-80183 message: render user online status as an accessible icon.

Browse source
This commit is contained in:
Paul Holden 2024-02-22 11:27:46 +00:00
parent d3ad77e476
commit 45f83c203f
No known key found for this signature in database
GPG key ID: A81A96D6045F6164
7 changed files with 22 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

4
message/templates/message_drawer_contacts_list.mustache
View file

@ -65,7 +65,9 @@
style="height: 38px" style="height: 38px"
> >
{{#showonlinestatus}} {{#showonlinestatus}}
<span class="contact-status {{#isonline}}online{{/isonline}}"></span> <span class="contact-status icon-size-2 {{#isonline}}online{{/isonline}}">
{{#isonline}} {{#pix}} t/online, core, {{#str}} online, core_message {{/str}} {{/pix}} {{/isonline}}
</span>
{{/showonlinestatus}} {{/showonlinestatus}}
<h6 class="ml-2 font-weight-bold">{{#highlight}}{{{highlight}}}{{/highlight}}{{^highlight}}{{fullname}}{{/highlight}}</h6> <h6 class="ml-2 font-weight-bold">{{#highlight}}{{{highlight}}}{{/highlight}}{{^highlight}}{{fullname}}{{/highlight}}</h6>
<div <div

4
message/templates/message_drawer_conversations_list.mustache
View file

@ -54,7 +54,9 @@
> >
{{/imageurl}} {{/imageurl}}
{{#showonlinestatus}} {{#showonlinestatus}}
<span class="contact-status {{#isonline}}online{{/isonline}}"></span> <span class="contact-status icon-size-2 {{#isonline}}online{{/isonline}}">
{{#isonline}} {{#pix}} t/online, core, {{#str}} online, core_message {{/str}} {{/pix}} {{/isonline}}
</span>
{{/showonlinestatus}} {{/showonlinestatus}}
<div class="w-100 text-truncate ml-2 my-2"> <div class="w-100 text-truncate ml-2 my-2">
<div class="d-flex"> <div class="d-flex">

4
message/templates/message_drawer_messages_list.mustache
View file

@ -64,7 +64,9 @@
style="height: 38px" style="height: 38px"
> >
{{#showonlinestatus}} {{#showonlinestatus}}
<span class="contact-status {{#isonline}}online{{/isonline}}"></span> <span class="contact-status icon-size-2 {{#isonline}}online{{/isonline}}">
{{#isonline}} {{#pix}} t/online, core, {{#str}} online, core_message {{/str}} {{/pix}} {{/isonline}}
</span>
{{/showonlinestatus}} {{/showonlinestatus}}
<div class="w-100 text-truncate ml-2"> <div class="w-100 text-truncate ml-2">
<div class="d-flex"> <div class="d-flex">

4
message/templates/message_drawer_view_group_info_participants_list.mustache
View file

@ -59,7 +59,9 @@
style="height: 38px" style="height: 38px"
> >
{{#showonlinestatus}} {{#showonlinestatus}}
<span class="contact-status {{#isonline}}online{{/isonline}}"></span> <span class="contact-status icon-size-2 {{#isonline}}online{{/isonline}}">
{{#isonline}} {{#pix}} t/online, core, {{#str}} online, core_message {{/str}} {{/pix}} {{/isonline}}
</span>
{{/showonlinestatus}} {{/showonlinestatus}}
<h6 class="ml-2">{{fullname}}</h6> <h6 class="ml-2">{{fullname}}</h6>
<div <div

10
theme/boost/scss/moodle/message.scss
View file

@ -442,13 +442,11 @@ $message-day-color: color-yiq($message-app-bg) !default;
.contact-status { .contact-status {
position: absolute; position: absolute;
left: 39px; left: 39px;
top: 39px; top: 34px;
width: 10px;
height: 10px;
border-radius: 50%;
&.online { &.online {
border: 1px solid $body-bg; .icon {
background-color: $green; color: $green;
}
} }
} }

10
theme/boost/style/moodle.css
View file

@ -31565,14 +31565,10 @@ a.ygtvspacer:hover {
.message-app .contact-status { .message-app .contact-status {
position: absolute; position: absolute;
left: 39px; left: 39px;
top: 39px; top: 34px;
width: 10px;
height: 10px;
border-radius: 50%;
} }
.message-app .contact-status.online { .message-app .contact-status.online .icon {
border: 1px solid #fff; color: #357a32;
background-color: #357a32;
} }
.message-app .message p { .message-app .message p {
margin: 0; margin: 0;

10
theme/classic/style/moodle.css
View file

@ -31565,14 +31565,10 @@ a.ygtvspacer:hover {
.message-app .contact-status { .message-app .contact-status {
position: absolute; position: absolute;
left: 39px; left: 39px;
top: 39px; top: 34px;
width: 10px;
height: 10px;
border-radius: 50%;
} }
.message-app .contact-status.online { .message-app .contact-status.online .icon {
border: 1px solid #fff; color: #357a32;
background-color: #357a32;
} }
.message-app .message p { .message-app .message p {
margin: 0; margin: 0;