EVOgeek
/
Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-3814 home: Add cards to improve site home styling

main
Pau Ferrer Ocaña 2022-02-10 11:43:06 +01:00
parent 98fe7224b9
commit 9b4e15efeb
3 changed files with 39 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/core/features/sitehome/pages/index/index.html
View File

@ -55,12 +55,14 @@
</ion-content>
<ng-template #allCourseList>
<ion-item button class="ion-text-wrap" (click)="openAvailableCourses()">
<ion-icon name="fas-graduation-cap" fixed-width slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.courses.availablecourses' | translate}}</h2>
</ion-label>
</ion-item>
<ion-card>
<ion-item button class="ion-text-wrap" (click)="openAvailableCourses()">
<ion-icon name="fas-graduation-cap" fixed-width slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.courses.availablecourses' | translate}}</h2>
</ion-label>
</ion-item>
</ion-card>
</ng-template>
<ng-template #news>
@ -69,29 +71,35 @@
</ng-template>
<ng-template #categories>
<ion-item button class="ion-text-wrap" (click)="openCourseCategories()">
<ion-icon name="fas-folder" slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.courses.categories' | translate}}</h2>
</ion-label>
</ion-item>
<ion-card>
<ion-item button class="ion-text-wrap" (click)="openCourseCategories()">
<ion-icon name="fas-folder" slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.courses.categories' | translate}}</h2>
</ion-label>
</ion-item>
</ion-card>
</ng-template>
<ng-template #enrolledCourseList>
<ion-item button class="ion-text-wrap" (click)="openMyCourses()">
<ion-icon name="fas-graduation-cap" fixed-width slot="start" aria-hidden="true">
</ion-icon>
<ion-label>
<h2>{{ 'core.courses.mycourses' | translate}}</h2>
</ion-label>
</ion-item>
<ion-card>
<ion-item button class="ion-text-wrap" (click)="openMyCourses()">
<ion-icon name="fas-graduation-cap" fixed-width slot="start" aria-hidden="true">
</ion-icon>
<ion-label>
<h2>{{ 'core.courses.mycourses' | translate}}</h2>
</ion-label>
</ion-item>
</ion-card>
</ng-template>
<ng-template #courseSearch>
<ion-item button class="ion-text-wrap" (click)="openSearch()">
<ion-icon name="fas-search" slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.courses.searchcourses' | translate}}</h2>
</ion-label>
</ion-item>
<ion-card>
<ion-item button class="ion-text-wrap" (click)="openSearch()">
<ion-icon name="fas-search" slot="start" aria-hidden="true"></ion-icon>
<ion-label>
<h2>{{ 'core.courses.searchcourses' | translate}}</h2>
</ion-label>
</ion-item>
</ion-card>
</ng-template>

12
src/core/features/sitehome/pages/index/index.scss
View File

@ -4,18 +4,16 @@ ion-item ion-icon {
display: inline-block;
border-radius: var(--module-icon-radius);
padding: 0.7rem;
background-color: $gray-100;
background-color: var(--gray-100);
line-height: var(--size);
--margin-end: 1rem;
@include margin-horizontal(null, var(--margin-end));
}
core-course-module.core-sitehome-news ::ng-deep ion-card {
--border-width: 0;
margin: 0;
padding: 0;
}
core-spacer ::ng-deep .item {
border-radius: var(--medium-radius);
--horizontal-margin: 10px;
margin-left: var(--horizontal-margin);
margin-right: var(--horizontal-margin);
width: auto;
}

2
src/theme/components/format-text.scss
View File

@ -179,7 +179,7 @@ core-format-text {
position: absolute;
@include position(null, 10px, 10px, null);
color: var(--ion-text-color);
border-radius: var(--small-radius);
border-radius: var(--huge-radius);
background-color: var(--core-format-text-viewer-icon-background);
display: flex;