MOBILE-3320 tabs: Fix tab arrow icon color

main
Pau Ferrer Ocaña 2021-05-26 09:51:12 +02:00
parent 59cf068936
commit 676d4f3edf
5 changed files with 3 additions and 52 deletions

View File

@ -32,7 +32,6 @@ import { IonRefresher } from '@ionic/angular';
selector: 'page-addon-messages-contacts', selector: 'page-addon-messages-contacts',
templateUrl: 'contacts.html', templateUrl: 'contacts.html',
styleUrls: [ styleUrls: [
'tabs.scss',
'../../messages-common.scss', '../../messages-common.scss',
], ],
}) })

View File

@ -1,48 +0,0 @@
:host {
ion-tab-bar.core-tabs-bar {
position: relative;
width: 100%;
background: var(--core-tabs-background);
color: var(--core-tab-color);
-webkit-filter: drop-shadow(0px 3px 3px rgba(var(--drop-shadow)));
filter: drop-shadow(0px 3px 3px rgba(var(--drop-shadow)));
border: 0;
ion-row {
width: 100%;
}
.tab-slide {
border-bottom: 2px solid transparent;
min-width: 100px;
min-height: 56px;
cursor: pointer;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
margin-bottom: 1px;
ion-label {
font-size: 16px;
font-weight: 400;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
word-wrap: break-word;
max-width: 100%;
line-height: 1.2em;
margin: 16px auto;
}
&[aria-selected=true] {
color: var(--core-tab-border-color-active);
border-bottom-color: var(--core-tab-color-active);
ion-tab-button {
color: var(--core-tab-border-color-active);
}
}
}
}
}

View File

@ -1,6 +1,6 @@
:host { :host {
--tabs-background: var(--core-tabs-background); --tabs-background: var(--core-tabs-background);
--tabs-color: var(--color); --tabs-color: var(--core-tab-color);
--height: 56px; --height: 56px;
height: 100%; height: 100%;
display: block; display: block;

View File

@ -1,6 +1,6 @@
<ion-tabs #mainTabs [hidden]="!showTabs" [class]="'placement-' + tabsPlacement" [class.tabshidden]="hidden" <ion-tabs #mainTabs [hidden]="!showTabs" [class]="'placement-' + tabsPlacement" [class.tabshidden]="hidden"
(ionTabsDidChange)="tabChanged($event)"> (ionTabsDidChange)="tabChanged($event)">
<ion-tab-bar slot="bottom" [hidden]="hidden"> <ion-tab-bar slot="bottom" [hidden]="hidden" class="mainmenu-tabs">
<ion-spinner *ngIf="!loaded"></ion-spinner> <ion-spinner *ngIf="!loaded"></ion-spinner>
<ion-tab-button <ion-tab-button

View File

@ -89,7 +89,7 @@
--core-bottom-tabs-color-selected: #{$bottom-tabs-color-selected}; --core-bottom-tabs-color-selected: #{$bottom-tabs-color-selected};
--core-bottom-tabs-badge-color: #{$bottom-tabs-badge-color}; --core-bottom-tabs-badge-color: #{$bottom-tabs-badge-color};
--core-bottom-tabs-badge-text-color: #{$bottom-tabs-badge-text-color}; --core-bottom-tabs-badge-text-color: #{$bottom-tabs-badge-text-color};
ion-tab-bar { ion-tab-bar.mainmenu-tabs {
--background: var(--core-bottom-tabs-background); --background: var(--core-bottom-tabs-background);
--color: var(--core-bottom-tabs-color); --color: var(--core-bottom-tabs-color);
--color-selected: var(--core-bottom-tabs-color-selected); --color-selected: var(--core-bottom-tabs-color-selected);