MOBILE-4660 course: Improve module card styles
parent
8f6c1fd4c2
commit
d63c06e328
Binary file not shown.
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
@ -7,7 +7,7 @@
|
||||||
--card-border-width: 0px;
|
--card-border-width: 0px;
|
||||||
--card-radius: 0px;
|
--card-radius: 0px;
|
||||||
--card-background: transparent;
|
--card-background: transparent;
|
||||||
--activity-border: 2px solid var(--stroke);
|
--activity-border: 1px solid var(--stroke);
|
||||||
--card-padding-bottom: var(--vertical-spacing);
|
--card-padding-bottom: var(--vertical-spacing);
|
||||||
|
|
||||||
ion-card {
|
ion-card {
|
||||||
|
@ -132,15 +132,16 @@
|
||||||
margin-bottom: var(--vertical-spacing);
|
margin-bottom: var(--vertical-spacing);
|
||||||
}
|
}
|
||||||
|
|
||||||
.activity-extrabadges,
|
|
||||||
.core-module-description {
|
.core-module-description {
|
||||||
border-top: 1px solid var(--stroke);
|
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.activity-extrabadges {
|
.activity-extrabadges {
|
||||||
font: var(--mdl-typography-body-font-md);
|
font: var(--mdl-typography-body-font-md);
|
||||||
color: var(--medium);
|
color: var(--medium);
|
||||||
|
border: 1px solid var(--stroke);
|
||||||
|
border-radius: var(--mdl-shape-borderRadius-sm);
|
||||||
|
padding: var(--mdl-spacing-2) var(--mdl-spacing-3) var(--mdl-spacing-2) var(--mdl-spacing-3);
|
||||||
}
|
}
|
||||||
|
|
||||||
.activity-description-availabilityinfo .core-module-availabilityinfo {
|
.activity-description-availabilityinfo .core-module-availabilityinfo {
|
||||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 39 KiB |
Binary file not shown.
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 44 KiB |
|
@ -1,15 +1,28 @@
|
||||||
ion-accordion {
|
ion-accordion {
|
||||||
.ion-accordion-toggle-icon[slot="start"] {
|
> [slot="header"] .ion-accordion-toggle-icon[slot="start"] {
|
||||||
@include margin-horizontal(null, var(--mdl-spacing-2));
|
@include margin-horizontal(null, var(--mdl-spacing-2));
|
||||||
background-color: var(--gray-100);
|
background-color: var(--gray-100);
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
padding: var(--mdl-spacing-1);
|
padding: var(--mdl-spacing-1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Change arrow direction to match LMS: expanded is down, collapsed is right.
|
||||||
|
*/
|
||||||
|
&.accordion-expanding > [slot="header"] .ion-accordion-toggle-icon,
|
||||||
|
&.accordion-expanded > [slot="header"] .ion-accordion-toggle-icon {
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.accordion-collapsing > [slot="header"] .ion-accordion-toggle-icon,
|
||||||
|
&.accordion-collapsed > [slot="header"] .ion-accordion-toggle-icon {
|
||||||
|
transform: rotate(-90deg);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
:root.dark {
|
:root.dark {
|
||||||
ion-accordion {
|
ion-accordion {
|
||||||
.ion-accordion-toggle-icon[slot="start"] {
|
> [slot="header"] .ion-accordion-toggle-icon[slot="start"] {
|
||||||
background-color: var(--gray-800);
|
background-color: var(--gray-800);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue