GuzhavinAleksey/Vmeda.Online
1
0
Fork 0
forked from CIT/Vmeda.Online
Code Pull Requests Activity

MOBILE-3670 messages: Arrange space to make discussion index wider

Browse Source
This commit is contained in:
Pau Ferrer Ocaña 2021-05-14 14:14:52 +02:00
parent 4925e47ab9
commit ac99f5585a
7 changed files with 71 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/addons/messages/messages-common.scss
View File

@ -1,6 +1,11 @@
:host {
.addon-messages-conversation-item,
.addon-message-discussion {
ion-label {
margin-right: 0;
margin-left: 0;
}
h2 {
core-format-text {
font-weight: bold;
@ -12,10 +17,18 @@
}
ion-note {
ion-badge {
margin-left: 6px;
margin-right: 6px;
vertical-align: middle;
display: flex;
flex-direction: column;
align-self: flex-start;
margin-left: 2px;
ion-badge, ion-icon {
margin-top: 3px;
align-self: flex-end;
}
.addon-message-last-message-date {
white-space: nowrap;
font-size: 11px;
}
}

2
src/addons/messages/pages/discussion/discussion.scss
View File

@ -23,6 +23,8 @@
color: var(--ion-color-primary);
background-color: transparent;
margin-top: 6px;
margin-left: auto;
margin-right: auto;
ion-icon {
color: var(--ion-color-primary);
background-color: transparent;

22
src/addons/messages/pages/discussions-35/discussions.html
View File

@ -52,16 +52,22 @@
<ng-container *ngIf="!search.showResults">
<ion-item class="ion-text-wrap addon-message-discussion" *ngFor="let discussion of discussions" button
[attr.aria-label]="discussion.fullname" (click)="gotoDiscussion(discussion.message!.user)"
[attr.aria-current]="discussion.message!.user == discussionUserId ? 'page' : 'false'">
[attr.aria-current]="discussion.message!.user == discussionUserId ? 'page' : 'false'" detail="false">
<core-user-avatar [user]="discussion" slot="start" checkOnline="false"></core-user-avatar>
<ion-label>
<h2>{{ discussion.fullname }}</h2>
<ion-note *ngIf="discussion.message!.timecreated > 0 || discussion.unread">
<span *ngIf="discussion.unread" class="core-primary-circle"></span>
<span *ngIf="discussion.message!.timecreated > 0">
{{discussion.message!.timecreated / 1000 | coreDateDayOrTime}}
</span>
</ion-note>
<div class="flex-row ion-justify-content-between">
<h2>{{ discussion.fullname }}</h2>
<ion-note *ngIf="discussion.message!.timecreated > 0 || discussion.unread">
<span *ngIf="discussion.message!.timecreated > 0" class="addon-message-last-message-date">
{{discussion.message!.timecreated / 1000 | coreDateDayOrTime}}
</span>
<ion-icon *ngIf="discussion.unread" name="fas-circle" color="primary" aria-hidden="true">
</ion-icon>
<span *ngIf="discussion.unread" class="sr-only">
{{ 'addon.messages.unreadmessages' | translate }}
</span>
</ion-note>
</div>
<p>
<core-format-text clean="true" singleLine="true" [text]="discussion.message!.message"
contextLevel="system" [contextInstanceId]="0">

34
src/addons/messages/pages/group-conversations/group-conversations.html
View File

@ -146,7 +146,7 @@
<!-- Template to render a list of conversations. -->
<ng-template #conversationsTemplate let-conversations="conversations">
<ion-item class="ion-text-wrap addon-message-discussion" *ngFor="let conversation of conversations" button
<ion-item class="ion-text-wrap addon-message-discussion" *ngFor="let conversation of conversations" button detail="false"
[attr.aria-label]="conversation.name" (click)="gotoConversation(conversation.id, conversation.userid)"
[attr.aria-current]="((conversation.id && conversation.id == selectedConversationId) ||
(conversation.userid && conversation.userid == selectedUserId)) ? 'page': 'false'"
@ -162,13 +162,24 @@
[linkProfile]="false" [checkOnline]="conversation.showonlinestatus" slot="start"></core-user-avatar>
<ion-label>
<h2>
<core-format-text [text]="conversation.name" contextLevel="system" [contextInstanceId]="0"></core-format-text>
<ion-icon name="fas-user-slash" *ngIf="conversation.isblocked"
[title]="'addon.messages.contactblocked' | translate"></ion-icon>
<ion-icon *ngIf="conversation.ismuted" name="fas-volume-mute"
[title]="'addon.messages.mutedconversation' | translate"></ion-icon>
</h2>
<div class="flex-row ion-justify-content-between">
<h2>
<core-format-text [text]="conversation.name" contextLevel="system" [contextInstanceId]="0"></core-format-text>
<ion-icon name="fas-user-slash" *ngIf="conversation.isblocked"
[title]="'addon.messages.contactblocked' | translate"></ion-icon>
<ion-icon *ngIf="conversation.ismuted" name="fas-volume-mute"
[title]="'addon.messages.mutedconversation' | translate"></ion-icon>
</h2>
<ion-note *ngIf="conversation.lastmessagedate > 0 || conversation.unreadcount">
<span *ngIf="conversation.lastmessagedate > 0" class="addon-message-last-message-date">
{{conversation.lastmessagedate | coreDateDayOrTime}}
</span>
<ion-badge *ngIf="conversation.unreadcount > 0" aria-label="true">{{ conversation.unreadcount }}</ion-badge>
<span *ngIf="conversation.unreadcount > 0" class="sr-only">
{{ 'addon.messages.unreadmessages' | translate:{$a: conversation.unreadcount} }}
</span>
</ion-note>
</div>
<p *ngIf="conversation.subname"><core-format-text [text]="conversation.subname" contextLevel="system"
[contextInstanceId]="0"></core-format-text></p>
<p class="addon-message-last-message">
@ -181,12 +192,5 @@
class="addon-message-last-message-text" contextLevel="system" [contextInstanceId]="0"></core-format-text>
</p>
</ion-label>
<ion-note *ngIf="conversation.lastmessagedate > 0 || conversation.unreadcount" slot="end">
<ion-badge *ngIf="conversation.unreadcount > 0" aria-label="true">{{ conversation.unreadcount }}</ion-badge>
<span *ngIf="conversation.unreadcount > 0" class="sr-only">
{{ 'addon.messages.unreadmessages' | translate:{$a: conversation.unreadcount} }}
</span>
<span *ngIf="conversation.lastmessagedate > 0">{{conversation.lastmessagedate | coreDateDayOrTime}}</span>
</ion-note>
</ion-item>
</ng-template>

4
src/addons/mod/quiz/pages/review/review.html
View File

@ -24,7 +24,9 @@
<ion-card-header class="ion-text-wrap">
<ion-card-title>
<ng-container *ngIf="attempt.preview">{{ 'addon.mod_quiz.reviewofpreview' | translate }}</ng-container>
<ng-container *ngIf="!attempt.preview">{{ 'addon.mod_quiz.reviewofattempt' | translate:{$a: attempt.attempt} }}</ng-container>
<ng-container *ngIf="!attempt.preview">
{{ 'addon.mod_quiz.reviewofattempt' | translate:{$a: attempt.attempt} }}
</ng-container>
</ion-card-title>
</ion-card-header>
<ion-list lines="none">

11
src/core/features/search/components/search-box/search-box.scss
View File

@ -1,5 +1,5 @@
:host {
height: 80px;
height: 73px;
display: block;
position: relative;
@ -8,9 +8,11 @@
left: 0;
right: 0;
z-index: 4;
margin-top: 10px;
margin-bottom: 10px;
}
ion-button.button:last-child {
ion-button.button {
margin-left: unset;
margin-inline-start: 10px;
}
@ -28,4 +30,9 @@
ion-label {
margin: 0;
}
ion-input {
--padding-start: 0;
--padding-end: 0;
}
}

7
src/theme/theme.base.scss
View File

@ -554,6 +554,13 @@ textarea, button, select, input, a {
}
}
ion-loading:focus-visible,
ion-alert:focus-visible,
ion-popover:focus-visible,
ion-modal:focus-visible {
box-shadow: none;
}
ion-input .native-input{
&:focus, &:focus-visible {
box-shadow: none;