Theaninova/openstapps
1
0
Fork 0
mirror of https://gitlab.com/openstapps/openstapps.git synced 2026-01-20 16:42:56 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: correct data path color

Browse Source 
fix: missing ionic component icons
feat: parallax detail background
This commit is contained in:
Thea Schöbl
2022-09-08 07:23:58 +00:00
parent d22a67f842
commit 0d755bcbd3
10 changed files with 159 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/app/util/ion-icon/ion-breadcrumb.directive.ts
View File

@@ -1,16 +1,16 @@
/*
* Copyright (C) 2022 StApps
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU General Public License as published by the Free
* Software Foundation, version 3.
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU General Public License as published by the Free
* Software Foundation, version 3.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
* more details.
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
* more details.
*
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
import {Directive, ElementRef, ViewContainerRef} from '@angular/core';
@@ -26,12 +26,22 @@ export class IonBreadcrumbDirective extends IconReplacer {
}
replace() {
this.replaceIcon(
this.host.querySelector('span[part="separator"]'),
{
name: SCIcon`arrow_forward_ios`,
size: 16,
style: `color: var(--ion-color-tint);`,
},
'-separator',
);
this.replaceIcon(
this.host.querySelector('button[part="collapsed-indicator"]'),
{
name: SCIcon`more_horiz`,
size: 24,
},
'-collapsed',
);
}
}

23
src/app/util/ion-icon/ion-icon.directive.ts
View File

@@ -1,16 +1,16 @@
/*
* Copyright (C) 2022 StApps
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU General Public License as published by the Free
* Software Foundation, version 3.
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU General Public License as published by the Free
* Software Foundation, version 3.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
* more details.
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
* more details.
*
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
import {
@@ -54,6 +54,8 @@ export class IonIconDirective implements OnInit, OnDestroy, OnChanges {
@Input() grade: number;
@Input() style: string;
private mutationObserver: MutationObserver;
iconComponent?: ComponentRef<IconComponent>;
@@ -121,6 +123,9 @@ export class IonIconDirective implements OnInit, OnDestroy, OnChanges {
if (this.size) {
this.element.nativeElement.style.cssText = `font-size: ${this.size}px;`;
}
if (this.style) {
this.element.nativeElement.style.cssText += this.style;
}
}
disableProperty(name: string) {

24
src/app/util/ion-icon/replace-util.ts
View File

@@ -1,16 +1,16 @@
/*
* Copyright (C) 2022 StApps
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU General Public License as published by the Free
* Software Foundation, version 3.
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU General Public License as published by the Free
* Software Foundation, version 3.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
* more details.
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
* more details.
*
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
import {
@@ -121,7 +121,7 @@ export abstract class IconReplacer implements OnInit, OnDestroy {
});
}
replaceIcon(parent: HTMLElement | null, iconData: IconData) {
replaceIcon(parent: HTMLElement | null, iconData: IconData, slotName = '') {
if (!parent) return;
const icon = parent.querySelector('ion-icon');
@@ -135,10 +135,10 @@ export abstract class IconReplacer implements OnInit, OnDestroy {
// shadow dom needs to utilize slotting, to put it outside
// the shadow dom, otherwise it won't receive any css data
const slot = document.createElement('slot');
slot.name = this.slotName;
slot.name = this.slotName + slotName;
icon.replaceWith(slot);
scIcon.location.nativeElement.slot = this.slotName;
scIcon.location.nativeElement.slot = this.slotName + slotName;
this.element.nativeElement.append(scIcon.location.nativeElement);
} else {
icon.replaceWith(scIcon.location.nativeElement);