From d790e2a7525161a5f4148da56614a6d73adca351 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= Date: Wed, 13 Sep 2023 14:00:29 +0200 Subject: [PATCH] MOBILE-4348 mod-icon: Sort Mod icon css variables --- src/addons/block/timeline/components/events/events.scss | 2 +- src/addons/notifications/notifications.scss | 2 +- src/addons/notifications/pages/list/list.scss | 2 +- .../pages/course-storage/course-storage.scss | 2 +- src/core/components/mod-icon/mod-icon.scss | 8 ++++---- .../course/components/module-info/course-module-info.scss | 1 + .../course/components/module-summary/module-summary.scss | 2 +- src/core/features/grades/pages/course/course.scss | 2 +- .../global-search-result/global-search-result.scss | 2 +- src/theme/theme.light.scss | 3 --- 10 files changed, 12 insertions(+), 14 deletions(-) diff --git a/src/addons/block/timeline/components/events/events.scss b/src/addons/block/timeline/components/events/events.scss index f55d845f1..07634e1d5 100644 --- a/src/addons/block/timeline/components/events/events.scss +++ b/src/addons/block/timeline/components/events/events.scss @@ -23,7 +23,7 @@ h4.core-bold { } core-mod-icon { - padding: 8px; + --padding: 8px; --margin-end: 0.5rem; --margin-vertical: 0; } diff --git a/src/addons/notifications/notifications.scss b/src/addons/notifications/notifications.scss index fa061dafe..60caa6312 100644 --- a/src/addons/notifications/notifications.scss +++ b/src/addons/notifications/notifications.scss @@ -11,7 +11,7 @@ position: absolute; right: -4px; bottom: -4px; - padding: 0.2rem; + --padding: 0.2rem; } .core-avatar-extra-img { diff --git a/src/addons/notifications/pages/list/list.scss b/src/addons/notifications/pages/list/list.scss index 28bc96fc3..cc83595d1 100644 --- a/src/addons/notifications/pages/list/list.scss +++ b/src/addons/notifications/pages/list/list.scss @@ -39,7 +39,7 @@ ion-item { div.core-notification-icon, core-mod-icon.core-notification-icon { - padding: 8px; + --padding: 8px; max-width: var(--core-avatar-size); max-height: var(--core-avatar-size); } diff --git a/src/addons/storagemanager/pages/course-storage/course-storage.scss b/src/addons/storagemanager/pages/course-storage/course-storage.scss index cf6193060..becd7cebb 100644 --- a/src/addons/storagemanager/pages/course-storage/course-storage.scss +++ b/src/addons/storagemanager/pages/course-storage/course-storage.scss @@ -51,7 +51,7 @@ ion-badge { ion-item core-mod-icon { --size: 18px; - padding: 9px; + --padding: 9px; --margin-vertical: 8px; --margin-end: 8px; } diff --git a/src/core/components/mod-icon/mod-icon.scss b/src/core/components/mod-icon/mod-icon.scss index 5ab0db1f0..8a6085ae4 100644 --- a/src/core/components/mod-icon/mod-icon.scss +++ b/src/core/components/mod-icon/mod-icon.scss @@ -2,10 +2,11 @@ :host { display: inline-block; - --size: var(--module-icon-size); + --size: var(--module-icon-size, 24px); + --padding: var(--module-icon-padding, 8px); + --icon-radius: var(--module-icon-radius, var(--radius-xs)); --margin-end: 0px; --margin-vertical: 0px; - --icon-radius: var(--small-radius); --filter: brightness(0) invert(1); margin-top: var(--margin-vertical); @@ -13,7 +14,7 @@ @include margin-horizontal(null, var(--margin-end)); border-radius: var(--icon-radius); - padding: 0.7rem; + padding: var(--padding); background-color: $gray-100; line-height: var(--size); @@ -57,5 +58,4 @@ img { :host-context(ion-card ion-item) { --margin-vertical: 12px; --margin-end: 12px; - --icon-radius: var(--module-icon-radius); } diff --git a/src/core/features/course/components/module-info/course-module-info.scss b/src/core/features/course/components/module-info/course-module-info.scss index e9030e723..e9f9146ff 100644 --- a/src/core/features/course/components/module-info/course-module-info.scss +++ b/src/core/features/course/components/module-info/course-module-info.scss @@ -10,6 +10,7 @@ core-mod-icon { align-self: flex-start; + --padding: 12px; } h1 ion-icon { diff --git a/src/core/features/course/components/module-summary/module-summary.scss b/src/core/features/course/components/module-summary/module-summary.scss index a4bb647d2..e524c4757 100644 --- a/src/core/features/course/components/module-summary/module-summary.scss +++ b/src/core/features/course/components/module-summary/module-summary.scss @@ -11,7 +11,7 @@ h1 { .core-modulename { text-transform: uppercase; core-mod-icon { - padding: 3px; + --padding: 3px; --size: 10px; margin: 0; } diff --git a/src/core/features/grades/pages/course/course.scss b/src/core/features/grades/pages/course/course.scss index 870b68b36..60ff2ab0a 100644 --- a/src/core/features/grades/pages/course/course.scss +++ b/src/core/features/grades/pages/course/course.scss @@ -86,7 +86,7 @@ } core-mod-icon { - padding: 0px; + --padding: 0px; --size: 16px; background: transparent; --filter: var(--mod-icon-filter); diff --git a/src/core/features/search/components/global-search-result/global-search-result.scss b/src/core/features/search/components/global-search-result/global-search-result.scss index 7be59d0c0..566a5a56d 100644 --- a/src/core/features/search/components/global-search-result/global-search-result.scss +++ b/src/core/features/search/components/global-search-result/global-search-result.scss @@ -19,7 +19,7 @@ margin-inline-end: var(--spacing-2); margin-top: 0px; margin-bottom: 0px; - padding: 0px; + --padding: 0px; background: transparent; } diff --git a/src/theme/theme.light.scss b/src/theme/theme.light.scss index 3994ff948..067c14541 100644 --- a/src/theme/theme.light.scss +++ b/src/theme/theme.light.scss @@ -70,9 +70,6 @@ html { --core-input-radius: var(--radius-xs); --core-input-border-width: 1px; - --module-icon-size: 24px; - --module-icon-radius: var(--sm-radius); - --list-item-max-width: 768px; --modal-lateral-max-width: 320px;