MOBILE-3149 style: Change light to outline in buttons

main
Pau Ferrer Ocaña 2022-02-25 15:45:39 +01:00
parent be1bacba0c
commit 859230ddf3
21 changed files with 38 additions and 38 deletions

View File

@ -68,7 +68,7 @@
<div class="ion-padding ion-text-center" *ngIf="canLoadMore && !empty">
<!-- Button and spinner to show more attempts. -->
<ion-button expand="block" (click)="loadMoreEvents()" color="light" *ngIf="!loadingMore">
<ion-button expand="block" (click)="loadMoreEvents()" fill="outline" *ngIf="!loadingMore">
{{ 'core.loadmore' | translate }}
</ion-button>
<ion-spinner *ngIf="loadingMore" [attr.aria-label]="'core.loading' | translate"></ion-spinner>

View File

@ -235,16 +235,16 @@
<ion-item>
<ion-label>
<ion-row>
<ion-col *ngIf="hasOffline && eventId && eventId < 0">
<ion-button expand="block" fill="outline" (click)="discard()">
{{ 'core.discard' | translate }}
</ion-button>
</ion-col>
<ion-col>
<ion-button expand="block" (click)="submit()" [disabled]="!form.valid" type="submit">
{{ 'core.save' | translate }}
</ion-button>
</ion-col>
<ion-col *ngIf="hasOffline && eventId && eventId < 0">
<ion-button expand="block" color="light" (click)="discard()">
{{ 'core.discard' | translate }}
</ion-button>
</ion-col>
</ion-row>
</ion-label>
</ion-item>

View File

@ -157,7 +157,7 @@
<ion-button expand="block" class="ion-text-wrap ion-margin-bottom" (click)="confirmContactRequest()">
{{ 'addon.messages.acceptandaddcontact' | translate }}
</ion-button>
<ion-button expand="block" class="ion-text-wrap ion-margin-bottom" color="light" (click)="declineContactRequest()">
<ion-button expand="block" class="ion-text-wrap ion-margin-bottom" fill="outline" (click)="declineContactRequest()">
{{ 'addon.messages.decline' | translate }}
</ion-button>
</div>

View File

@ -68,7 +68,7 @@
<!-- Load more button for contacts and non-contacts -->
<ng-container *ngIf="item.type != 'messages'">
<div class="ion-padding-horizontal" *ngIf="item.canLoadMore && !item.loadingMore">
<ion-button expand="block" color="light" (click)="search(query, item.type)">
<ion-button expand="block" fill="outline" (click)="search(query, item.type)">
{{ 'core.loadmore' | translate }}
</ion-button>
</div>

View File

@ -119,7 +119,7 @@
(onSubmit)="sendMessage($event)" [placeholder]="'addon.messages.newmessage' | translate">
</core-send-message-form>
<ion-button *ngIf="isOnline && !polling && loaded" (click)="reconnect()" expand="block" color="light">
<ion-button *ngIf="isOnline && !polling && loaded" (click)="reconnect()" expand="block" fill="outline">
{{ 'core.login.reconnect' | translate }}
</ion-button>
</ion-toolbar>

View File

@ -134,15 +134,15 @@
</ng-container>
<ion-grid>
<ion-row>
<ion-col>
<ion-button expand="block" fill="outline" (click)="cancel()">{{ 'core.cancel' | translate }}</ion-button>
</ion-col>
<ion-col>
<ion-button expand="block" (click)="send()" [disabled]="formData.subject == '' || formData.message == null">
<span *ngIf="formData.isEditing">{{ 'core.savechanges' | translate }}</span>
<span *ngIf="!formData.isEditing">{{ 'addon.mod_forum.posttoforum' | translate }}</span>
</ion-button>
</ion-col>
<ion-col>
<ion-button expand="block" color="light" (click)="cancel()">{{ 'core.cancel' | translate }}</ion-button>
</ion-col>
</ion-row>
</ion-grid>
</form>

View File

@ -69,15 +69,15 @@
<ion-item>
<ion-label>
<ion-row>
<ion-col *ngIf="hasOffline">
<ion-button expand="block" fill="outline" (click)="discard()">{{ 'core.discard' | translate }}</ion-button>
</ion-col>
<ion-col>
<ion-button expand="block" [disabled]="newDiscussion.subject == '' || newDiscussion.message == null"
(click)="add()">
{{ 'addon.mod_forum.posttoforum' | translate }}
</ion-button>
</ion-col>
<ion-col *ngIf="hasOffline">
<ion-button expand="block" color="light" (click)="discard()">{{ 'core.discard' | translate }}</ion-button>
</ion-col>
</ion-row>
</ion-label>
</ion-item>

View File

@ -113,7 +113,7 @@
<!-- Content page, display a button and the content. -->
<ion-row>
<ion-col>
<ion-button expand="block" class="ion-text-wrap" color="light" [disabled]="true">
<ion-button expand="block" class="ion-text-wrap" fill="outline" [disabled]="true">
{{ answer[0].buttonText }}
</ion-button>
</ion-col>

View File

@ -125,13 +125,13 @@
<ion-grid>
<ion-row class="ion-align-items-center">
<ion-col class="ion-text-start">
<ion-button color="light" *ngIf="previousPage >= 0" (click)="changePage(previousPage)"
<ion-button fill="outline" *ngIf="previousPage >= 0" (click)="changePage(previousPage)"
[title]="'core.previous' | translate">
<ion-icon name="fas-chevron-left" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button>
</ion-col>
<ion-col class="ion-text-end">
<ion-button color="light" *ngIf="nextPage >= -1" (click)="changePage(nextPage)" [attr.aria-label]="'core.next' | translate">
<ion-button *ngIf="nextPage >= -1" (click)="changePage(nextPage)" [attr.aria-label]="'core.next' | translate">
<ion-icon name="fas-chevron-right" slot="icon-only" aria-hidden="true"></ion-icon>
</ion-button>
</ion-col>

View File

@ -17,7 +17,7 @@
</ion-refresher>
<core-loading [hideUntil]="notificationsLoaded">
<div class="ion-padding" *ngIf="canMarkAllNotificationsAsRead">
<ion-button [disabled]="loadingMarkAllNotificationsAsRead" expand="block" (click)="markAllNotificationsAsRead()" color="light">
<ion-button [disabled]="loadingMarkAllNotificationsAsRead" expand="block" (click)="markAllNotificationsAsRead()" fill="outline">
<ion-icon slot="start" name="fas-check" aria-hidden="true" *ngIf="!loadingMarkAllNotificationsAsRead"></ion-icon>
<ion-spinner slot="start" [attr.aria-label]="'core.loading' | translate" *ngIf="loadingMarkAllNotificationsAsRead">
</ion-spinner>

View File

@ -62,7 +62,7 @@
<ion-icon *ngIf="option.isCorrect === 0" class="core-correct-icon" name="fas-times" color="danger"
[attr.aria-label]="'core.question.incorrect' | translate"></ion-icon>
</ion-item>
<ion-button *ngIf="!multiQuestion.disabled" class="ion-text-wrap ion-margin" expand="full" color="light"
<ion-button *ngIf="!multiQuestion.disabled" class="ion-text-wrap ion-margin-top" expand="block" fill="outline"
[disabled]="!multiQuestion.singleChoiceModel" (click)="clear()" type="reset">
{{ 'addon.mod_quiz.clearchoice' | translate }}
</ion-button>

View File

@ -1,9 +1,9 @@
<ng-container *ngIf="!loadingMore && position != 'top'">
<div *ngIf="enabled || error" class="ion-padding-horizontal" #bottombutton>
<ion-button *ngIf="!error" expand="block" (click)="loadMore()" color="light">
<ion-button *ngIf="!error" expand="block" (click)="loadMore()" fill="outline">
{{ 'core.loadmore' | translate }}
</ion-button>
<ion-button *ngIf="error" expand="block" (click)="loadMore()" color="light">
<ion-button *ngIf="error" expand="block" (click)="loadMore()" fill="outline">
{{ 'core.tryagain' | translate }}
</ion-button>
</div>
@ -15,10 +15,10 @@
<ng-container *ngIf="!loadingMore && position == 'top'">
<div *ngIf="enabled || error" class="ion-padding-horizontal" #topbutton>
<ion-button *ngIf="!error" expand="block" (click)="loadMore()" color="light">
<ion-button *ngIf="!error" expand="block" (click)="loadMore()" fill="outline">
{{ 'core.loadmore' | translate }}
</ion-button>
<ion-button *ngIf="error" expand="block" (click)="loadMore()" color="light">
<ion-button *ngIf="error" expand="block" (click)="loadMore()" fill="outline">
{{ 'core.tryagain' | translate }}
</ion-button>
</div>

View File

@ -1,7 +1,7 @@
<!-- ReCAPTCHA V2 -->
<div *ngIf="publicKey && siteUrl && model">
<!-- A button to open the recaptcha modal. -->
<ion-button expand="block" color="light" class="ion-margin" *ngIf="!model[modelValueName]" (click)="answerRecaptcha()">
<ion-button expand="block" fill="outline" class="ion-margin" *ngIf="!model[modelValueName]" (click)="answerRecaptcha()">
{{ 'core.opensecurityquestion' | translate }}
</ion-button>
<ion-item *ngIf="model[modelValueName]">

View File

@ -24,10 +24,10 @@
</h3>
<div *ngIf="step == 0" class="core-login-onboarding-step">
<ion-button expand="block" (click)="skip($event)" class="ion-margin-bottom" color="light">
<ion-button expand="block" (click)="skip($event)" class="ion-margin-bottom" fill="outline">
{{'core.login.onboardingimalearner' | translate}}
</ion-button>
<ion-button expand="block" (click)="next($event)" class="ion-margin-bottom" color="light">
<ion-button expand="block" (click)="next($event)" class="ion-margin-bottom" fill="outline">
{{'core.login.onboardingimaneducator' | translate}}
</ion-button>
</div>
@ -36,7 +36,7 @@
<p class="core-login-onboarding-text">
{{ 'core.login.onboardingtoconnect' | translate }}
</p>
<ion-button expand="block" (click)="skip($event)" class="ion-margin-bottom" color="light">
<ion-button expand="block" (click)="skip($event)" class="ion-margin-bottom" fill="outline">
{{ 'core.login.onboardingialreadyhaveasite' | translate }}
</ion-button>
<ion-button expand="block" (click)="next($event)" class="ion-margin-bottom">

View File

@ -43,7 +43,7 @@
<p>{{ 'core.login.changepasswordlogoutinstructions' | translate }}</p>
</ion-label>
</ion-item>
<ion-button class="ion-text-wrap ion-margin" expand="block" color="light" (click)="logout()">
<ion-button class="ion-text-wrap ion-margin" expand="block" fill="outline" (click)="logout()">
{{ logoutLabel | translate }}
</ion-button>
</ion-list>

View File

@ -54,7 +54,7 @@
<ng-container *ngIf="showScanQR">
<div class="ion-text-center ion-padding">{{ 'core.login.or' | translate }}</div>
<ion-button expand="block" color="light" class="ion-margin" (click)="showInstructionsAndScanQR()">
<ion-button expand="block" fill="outline" class="ion-margin" (click)="showInstructionsAndScanQR()">
<ion-icon slot="start" name="fas-qrcode" aria-hidden="true"></ion-icon>
{{ 'core.scanqr' | translate }}
</ion-button>
@ -93,7 +93,7 @@
</p>
</ion-label>
</ion-item>
<ion-button expand="block" class="ion-margin ion-text-wrap" color="light" (click)="openEmailSignup()">
<ion-button expand="block" class="ion-margin ion-text-wrap" fill="outline" (click)="openEmailSignup()">
{{ 'core.login.startsignup' | translate }}
</ion-button>
</ion-list>

View File

@ -53,7 +53,7 @@
<ion-grid class="ion-padding">
<ion-row>
<ion-col>
<ion-button expand="block" color="light" (click)="cancel($event)">
<ion-button expand="block" fill="outline" (click)="cancel($event)">
{{ 'core.login.cancel' | translate }}
</ion-button>
</ion-col>
@ -67,7 +67,7 @@
<ng-container *ngIf="showScanQR">
<div class="ion-text-center ion-padding">{{ 'core.login.or' | translate }}</div>
<ion-button expand="block" color="light" class="ion-margin" (click)="showInstructionsAndScanQR()">
<ion-button expand="block" fill="outline" class="ion-margin" (click)="showInstructionsAndScanQR()">
<ion-icon slot="start" name="fas-qrcode" aria-hidden="true"></ion-icon>
{{ 'core.scanqr' | translate }}
</ion-button>
@ -96,7 +96,7 @@
<!-- If OAuth, display cancel button since the form isn't displayed. -->
<ion-list *ngIf="isOAuth">
<ion-button expand="block" class="ion-margin" color="light" (click)="cancel($event)">
<ion-button expand="block" class="ion-margin" fill="outline" (click)="cancel($event)">
{{ 'core.login.cancel' | translate }}
</ion-button>
</ion-list>

View File

@ -30,7 +30,7 @@
<ion-button class="ion-text-wrap ion-margin-horizontal" expand="block" (click)="accept()">
{{ 'core.login.policyacceptmandatory' | translate }}
</ion-button>
<ion-button class="ion-text-wrap ion-margin-horizontal ion-margin-bottom" expand="block" color="light" (click)="cancel()">
<ion-button class="ion-text-wrap ion-margin-horizontal ion-margin-bottom" expand="block" fill="outline" (click)="cancel()">
{{ 'core.login.cancel' | translate }}
</ion-button>
</ion-list>

View File

@ -101,7 +101,7 @@
<ng-container *ngIf="showScanQR && !hasSites && !enteredSiteUrl">
<div class="ion-text-center ion-padding ion-margin-top">{{ 'core.login.or' | translate }}</div>
<ion-button expand="block" color="light" class="ion-margin" (click)="showInstructionsAndScanQR()" aria-haspopup="dialog">
<ion-button expand="block" fill="outline" class="ion-margin" (click)="showInstructionsAndScanQR()" aria-haspopup="dialog">
<ion-icon slot="start" name="fas-qrcode" aria-hidden="true"></ion-icon>
{{ 'core.scanqr' | translate }}
</ion-button>

View File

@ -19,7 +19,7 @@
</ion-item>
<!-- Question behaviour buttons. -->
<ion-button *ngFor="let button of question?.behaviourButtons" class="ion-margin ion-text-wrap" expand="block"
<ion-button *ngFor="let button of question?.behaviourButtons" class="ion-margin-vertical ion-text-wrap" expand="block"
(click)="buttonClicked.emit(button)" [disabled]="button.disabled">
{{ button.value }}
</ion-button>

View File

@ -20,7 +20,7 @@
</ion-card>
</ion-content>
<ion-footer *ngIf="displayCopyButton">
<ion-button expand="block" color="light" (click)="copyText()">
<ion-button expand="block" fill="outline" (click)="copyText()">
<ion-icon name="fas-copy" aria-hidden="true" slot="start"></ion-icon>
{{ 'core.copytoclipboard' | translate }}
</ion-button>