MOBILE-3833 activities: Use black and white icons on the activity block

main
Pau Ferrer Ocaña 2022-02-23 10:12:57 +01:00
parent 82419c3f50
commit 0c684f238e
3 changed files with 20 additions and 8 deletions

View File

@ -0,0 +1,13 @@
:host {
--mod-icon-filter: brightness(0);
core-mod-icon {
background: transparent;
margin: 0;
--filter: var(--mod-icon-filter);
}
}
:host-context(body.dark) {
--mod-icon-filter: brightness(0) invert(1);
}

View File

@ -28,6 +28,7 @@ import { CoreNavigator } from '@services/navigator';
@Component({
selector: 'addon-block-activitymodules',
templateUrl: 'addon-block-activitymodules.html',
styleUrls: ['activitymodules.scss'],
})
export class AddonBlockActivityModulesComponent extends CoreBlockBaseComponent implements OnInit {
@ -96,16 +97,13 @@ export class AddonBlockActivityModulesComponent extends CoreBlockBaseComponent i
// Sort the modnames alphabetically.
modFullNames = CoreUtils.sortValues(modFullNames);
for (const modName in modFullNames) {
let icon: string;
const iconModName = modName === 'resources' ? 'page' : modName;
if (modName === 'resources') {
icon = await CoreCourse.getModuleIconSrc('page', modIcons['page']);
} else {
icon = await CoreCourseModuleDelegate.getModuleIconSrc(modName, modIcons[modName]);
}
const icon = await CoreCourseModuleDelegate.getModuleIconSrc(iconModName, modIcons[iconModName]);
this.entries.push({
icon: icon,
icon,
iconModName,
name: modFullNames[modName],
modName,
});
@ -145,4 +143,5 @@ type AddonBlockActivityModuleEntry = {
icon: string;
name: string;
modName: string;
iconModName: string;
};

View File

@ -5,7 +5,7 @@
</ion-item-divider>
<core-loading [hideUntil]="loaded" [fullscreen]="false">
<ion-item class="ion-text-wrap" *ngFor="let entry of entries" detail="true" button (click)="gotoCoureListModType(entry)">
<core-mod-icon slot="start" [modicon]="entry.icon" [modname]="entry.modName" [showAlt]="false">
<core-mod-icon slot="start" [modicon]="entry.icon" [modname]="entry.iconModName" [showAlt]="false">
</core-mod-icon>
<ion-label>{{ entry.name }}</ion-label>
</ion-item>