Updated the default class name

• Updated:
- the default class name
This commit is contained in:
mgabdev
2020-08-18 15:49:11 -05:00
parent d5ad398d53
commit 176ddc22f2
174 changed files with 812 additions and 812 deletions

View File

@@ -117,7 +117,7 @@ class StatusCard extends ImmutablePureComponent {
return (
<div
ref={this.setRef}
className={[_s._, _s.bgTertiary, _s.posAbs, _s.top0, _s.right0, _s.bottom0, _s.left0, _s.statusCardVideo].join(' ')}
className={[_s.d, _s.bgTertiary, _s.posAbs, _s.top0, _s.right0, _s.bottom0, _s.left0, _s.statusCardVideo].join(' ')}
dangerouslySetInnerHTML={content}
/>
)
@@ -139,7 +139,7 @@ class StatusCard extends ImmutablePureComponent {
const title = interactive ?
(
<a
className={[_s._, _s.displayFlex, _s.text, _s.noUnderline, _s.overflowWrapBreakWord, _s.cPrimary, _s.fs15PX, _s.fw500].join(' ')}
className={[_s.d, _s.displayFlex, _s.text, _s.noUnderline, _s.overflowWrapBreakWord, _s.cPrimary, _s.fs15PX, _s.fw500].join(' ')}
href={card.get('url')}
title={cardTitle}
rel={DEFAULT_REL}
@@ -149,18 +149,18 @@ class StatusCard extends ImmutablePureComponent {
</a>
)
: (
<span className={[_s._, _s.displayFlex, _s.text, _s.overflowWrapBreakWord, _s.cPrimary, _s.fs15PX, _s.fw500].join(' ')}>
<span className={[_s.d, _s.displayFlex, _s.text, _s.overflowWrapBreakWord, _s.cPrimary, _s.fs15PX, _s.fw500].join(' ')}>
{cardTitle}
</span>
)
const description = (
<div className={[_s._, _s.flexNormal, _s.px10, _s.py10, _s.borderColorSecondary, _s.borderLeft1PX].join(' ')}>
<div className={[_s.d, _s.flexNormal, _s.px10, _s.py10, _s.borderColorSecondary, _s.borderLeft1PX].join(' ')}>
{title}
<p className={[_s._, _s.displayFlex, _s.text, _s.mt5, _s.mb5, _s.overflowWrapBreakWord, _s.cSecondary, _s.fs13PX, _s.fw400].join(' ')}>
<p className={[_s.d, _s.displayFlex, _s.text, _s.mt5, _s.mb5, _s.overflowWrapBreakWord, _s.cSecondary, _s.fs13PX, _s.fw400].join(' ')}>
{trim(card.get('description') || '', maxDescription)}
</p>
<span className={[_s._, _s.mtAuto, _s.flexRow, _s.aiCenter, _s.cSecondary, _s.text, _s.displayFlex, _s.textOverflowEllipsis, _s.fs13PX].join(' ')}>
<span className={[_s.d, _s.mtAuto, _s.flexRow, _s.aiCenter, _s.cSecondary, _s.text, _s.displayFlex, _s.textOverflowEllipsis, _s.fs13PX].join(' ')}>
<Icon id='link' size='10px' className={[_s.cSecondary, _s.mr5].join(' ')} fixedWidth />
{provider}
</span>
@@ -170,15 +170,15 @@ class StatusCard extends ImmutablePureComponent {
// : todo : use <Image />
let embed = ''
const thumbnail = interactive ?
<img loading='lazy' alt={''} src={cardImg} className={[_s._, _s.objectFitCover, _s.posAbs, _s.w100PC, _s.h100PC, _s.top0, _s.right0, _s.bottom0, _s.left0].join(' ')} />
<img loading='lazy' alt={''} src={cardImg} className={[_s.d, _s.objectFitCover, _s.posAbs, _s.w100PC, _s.h100PC, _s.top0, _s.right0, _s.bottom0, _s.left0].join(' ')} />
:
(
<ResponsiveClassesComponent
classNames={[_s._, _s.h220PX, _s.w330PX].join(' ')}
classNamesSmall={[_s._, _s.h260PX, _s.w100PC].join(' ')}
classNamesXS={[_s._, _s.h200PX, _s.w100PC].join(' ')}
classNames={[_s.d, _s.h220PX, _s.w330PX].join(' ')}
classNamesSmall={[_s.d, _s.h260PX, _s.w100PC].join(' ')}
classNamesXS={[_s.d, _s.h200PX, _s.w100PC].join(' ')}
>
<img loading='lazy' alt={''} src={cardImg} className={[_s._, _s.objectFitCover, _s.w100PC, _s.h100PC].join(' ')} />
<img loading='lazy' alt={''} src={cardImg} className={[_s.d, _s.objectFitCover, _s.w100PC, _s.h100PC].join(' ')} />
</ResponsiveClassesComponent>
)
@@ -194,18 +194,18 @@ class StatusCard extends ImmutablePureComponent {
}
return (
<div className={[_s._, _s.w100PC, _s.px10].join(' ')}>
<div className={[_s._, _s.overflowHidden, _s.w100PC, _s.borderColorSecondary, _s.border1PX, _s.radiusSmall].join(' ')}>
<div className={[_s.d, _s.w100PC, _s.px10].join(' ')}>
<div className={[_s.d, _s.overflowHidden, _s.w100PC, _s.borderColorSecondary, _s.border1PX, _s.radiusSmall].join(' ')}>
{
!isReduced &&
<div className={[_s._, _s.w100PC].join(' ')}>
<div className={[_s._, _s.w100PC, _s.pt5625PC].join(' ')}>
<div className={[_s.d, _s.w100PC].join(' ')}>
<div className={[_s.d, _s.w100PC, _s.pt5625PC].join(' ')}>
{!!embed && embed}
{!embed && thumbnail}
{!embed &&
<div className={[_s._, _s.posAbs, _s.top0, _s.right0, _s.left0, _s.bottom0, _s.aiCenter, _s.jcCenter].join(' ')}>
<div className={[_s.d, _s.posAbs, _s.top0, _s.right0, _s.left0, _s.bottom0, _s.aiCenter, _s.jcCenter].join(' ')}>
<button
className={[_s._, _s.cursorPointer, _s.bgBlackOpaque, _s.radiusSmall, _s.py15, _s.px15].join(' ')}
className={[_s.d, _s.cursorPointer, _s.bgBlackOpaque, _s.radiusSmall, _s.py15, _s.px15].join(' ')}
onClick={this.handleEmbedClick}
>
<Icon id={iconVariant} size='22px' className={[_s.cWhite].join(' ')} />
@@ -221,30 +221,30 @@ class StatusCard extends ImmutablePureComponent {
)
} else if (cardImg) {
embed = (
<div className={[_s._].join(' ')}>
<div className={[_s.d].join(' ')}>
{thumbnail}
</div>
)
} else {
embed = (
<div className={[_s._, _s.py15, _s.px15, _s.w72PX, _s.aiCenter, _s.jcCenter].join(' ')}>
<div className={[_s.d, _s.py15, _s.px15, _s.w72PX, _s.aiCenter, _s.jcCenter].join(' ')}>
<Icon id='website' size='22px' className={_s.cSecondary} />
</div>
)
}
return (
<div className={[_s._, _s.w100PC, _s.px10].join(' ')}>
<div className={[_s.d, _s.w100PC, _s.px10].join(' ')}>
<a
href={card.get('url')}
rel={DEFAULT_REL}
ref={this.setRef}
target='_blank'
className={[_s._, _s.cursorPointer, _s.overflowHidden, _s.noUnderline, _s.w100PC, _s.bgSubtle_onHover, _s.borderColorSecondary, _s.border1PX, _s.radiusSmall].join(' ')}
className={[_s.d, _s.cursorPointer, _s.overflowHidden, _s.noUnderline, _s.w100PC, _s.bgSubtle_onHover, _s.borderColorSecondary, _s.border1PX, _s.radiusSmall].join(' ')}
>
<ResponsiveClassesComponent
classNames={[_s._, _s.flexRow, _s.w100PC].join(' ')}
classNamesSmall={!cardImg ? undefined : [_s._, _s.w100PC].join(' ')}
classNames={[_s.d, _s.flexRow, _s.w100PC].join(' ')}
classNamesSmall={!cardImg ? undefined : [_s.d, _s.w100PC].join(' ')}
>
{!isReduced && embed}
{description}