MOBILE-3814 style: Remove drop shadows and add borders

main
Pau Ferrer Ocaña 2022-02-10 11:03:54 +01:00
parent 13de3b9776
commit 4b075f0e6d
7 changed files with 10 additions and 19 deletions

View File

@ -20,9 +20,7 @@
@include safe-area-padding-end(null, 0px);
height: var(--height);
color: var(--tabs-color);
-webkit-filter: drop-shadow(0px 3px 3px rgba(var(--drop-shadow)));
filter: drop-shadow(0px 3px 3px rgba(var(--drop-shadow)));
border: 0;
border-bottom: 1px solid var(--stroke);
display: flex;
align-items: flex-end;

View File

@ -2,7 +2,6 @@
:host {
display: block;
box-shadow: 0px 3px 3px rgba(var(--drop-shadow));
margin-bottom: 8px;
padding-bottom: 1px; // To allow margins inside.
background-color: var(--contrast-background);

View File

@ -11,7 +11,7 @@
display: block;
bottom: 0;
z-index: 3;
box-shadow: 0px -3px 3px rgba(var(--drop-shadow));
border-top: 1px solid var(--stroke);
@include core-transition(all, 200ms);

View File

@ -6,12 +6,7 @@ core-user-avatar {
display: none;
}
:host-context(ion-toolbar) core-user-avatar ::ng-deep img {
padding: 2px !important;
border: 1px solid var(--color);
}
:host-context(ion-toolbar) core-user-avatar ::ng-deep img,
:host-context(ion-tab-bar) core-user-avatar ::ng-deep img {
padding: 2px !important;
border: 1px solid var(--color);
}

View File

@ -58,7 +58,7 @@ export class CoreMainMenuUserButtonComponent implements OnInit {
CoreDomUtils.openSideModal<void>({
component: CoreMainMenuUserMenuComponent,
cssClass: 'core-modal-lateral-sm',
cssClass: 'core-modal-lateral',
});
}

View File

@ -5,7 +5,6 @@
ion-tab-bar {
height: var(--menutabbar-size);
box-shadow: 0px -3px 3px rgba(var(--drop-shadow));
}
@if ($core-always-show-main-menu) {
@ -83,7 +82,6 @@
height: calc(100% - var(--ion-safe-area-top) - var(--ion-safe-area-bottom));
flex-direction: column;
@include border-end(var(--border));
box-shadow: 3px 0 3px rgba(var(--drop-shadow));
border-top: 0;
justify-content: flex-start;

View File

@ -121,8 +121,8 @@
--core-header-toolbar-button-image-size: var(--a11y-min-target-size);
--core-header-toolbar-background: var(--white);
--core-header-toolbar-border-width: 3px;
--core-header-toolbar-border-color: var(--brand);
--core-header-toolbar-border-width: 1px;
--core-header-toolbar-border-color: var(--stroke);
--core-header-toolbar-color: var(--gray-900);
--core-header-toolbar-height: 56px;
html.ios {
@ -146,6 +146,10 @@
}
}
ion-header::after {
display: none;
}
ion-header.header-ios ion-toolbar:last-of-type {
--border-width: 0 0 var(--core-header-toolbar-border-width) 0;
}
@ -301,9 +305,6 @@
--drop-shadow: 0, 0, 0, 0.18;
--core-menu-box-shadow-end: -4px 0px 16px rgba(var(--drop-shadow));
--core-menu-box-shadow-start: 4px 0px 16px rgba(var(--drop-shadow));
--core-question-correct-color: var(--success-shade);
--core-question-correct-color-bg: var(--success-tint);
--core-question-incorrect-color: var(--danger);