MOBILE-4348 mod-icon: Sort Mod icon css variables

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;
     }

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 {

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);
     }

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;
 }

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);
 }

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 {

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;
     }

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);

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;
         }
 

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;