MOBILE-3833 badges: Fix missing expired overlay
parent
f81ddb374d
commit
cff39f065f
|
@ -1,21 +1,42 @@
|
|||
:host .core-block-content ::ng-deep {
|
||||
ul.badges {
|
||||
list-style: none;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-padding-start: 0;
|
||||
:host {
|
||||
--badge-size: 100px;
|
||||
--badge-container-size: 150px;
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
padding-top: 1em;
|
||||
text-align: center;
|
||||
vertical-align: top;
|
||||
width: 150px;
|
||||
.core-block-content ::ng-deep {
|
||||
|
||||
.badge-name {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
ul.badges {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
margin-top: 1em;
|
||||
vertical-align: top;
|
||||
width: var(--badge-container-size);
|
||||
|
||||
.badge-name {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
}
|
||||
.badge-image {
|
||||
width: var(--badge-size);
|
||||
}
|
||||
|
||||
.expireimage {
|
||||
content: 'expired';
|
||||
background-image: url('/assets/img/expired.svg');
|
||||
background-repeat: no-repeat;
|
||||
background-size: var(--badge-size) var(--badge-size);
|
||||
width: var(--badge-size);
|
||||
height: var(--badge-size);
|
||||
left: calc((var(--badge-container-size) - var(--badge-size)) /2);
|
||||
top: 0;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
opacity: .85;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1 @@
|
|||
<svg width="150" height="150" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMid meet"><title>Layer 1</title><path stroke="#fff" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="8" fill="none" d="M6.773 112.162L113.546 5.39l29.7 29.698L36.47 141.86z"/><path stroke-width="5" stroke="#bf3b08" fill="none" d="M7 112.066L113.066 6l29.34 29.34L36.342 141.408z"/><text stroke="#fff" fill="#bf3b08" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="72.605" y="79.727" font-size="20" font-family="Sans-serif" text-anchor="middle" font-weight="bold" transform="rotate(-45 74.918 71.252) scale(1.00967 1)">E X P I R E D</text></svg>
|
After Width: | Height: | Size: 693 B |
|
@ -6,7 +6,7 @@
|
|||
position: relative;
|
||||
width: 100%;
|
||||
height: 230px;
|
||||
background: url('../../../../../assets/img/icons/h5p.svg') center top 25px / 100px auto no-repeat var(--core-h5p-placeholder-bg-color);
|
||||
background: url('/assets/img/icons/h5p.svg') center top 25px / 100px auto no-repeat var(--core-h5p-placeholder-bg-color);
|
||||
color: var(--core-h5p-placeholder-text-color);
|
||||
|
||||
.icon:not([color="success"]) {
|
||||
|
|
Loading…
Reference in New Issue