1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-12-02 05:57:29 +01:00

Fix long title (#1606)

* slice title in teaser

* title tweaks

* remove dotdotdot
This commit is contained in:
mihaisc 2022-07-28 08:34:34 -07:00 committed by GitHub
parent ed665befc7
commit 6ea0e46840
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 7 additions and 3 deletions

View File

@ -25,7 +25,6 @@ export default function AssetTeaser({
const accessType = isCompute ? 'compute' : 'access' const accessType = isCompute ? 'compute' : 'access'
const { owner } = asset.nft const { owner } = asset.nft
const { orders } = asset.stats const { orders } = asset.stats
return ( return (
<article className={`${styles.teaser} ${styles[type]}`}> <article className={`${styles.teaser} ${styles[type]}`}>
<Link href={`/asset/${asset.id}`}> <Link href={`/asset/${asset.id}`}>
@ -33,7 +32,7 @@ export default function AssetTeaser({
<header className={styles.header}> <header className={styles.header}>
<div className={styles.symbol}>{datatokens[0]?.symbol}</div> <div className={styles.symbol}>{datatokens[0]?.symbol}</div>
<Dotdotdot tagName="h1" clamp={3} className={styles.title}> <Dotdotdot tagName="h1" clamp={3} className={styles.title}>
{name} {name.slice(0, 200)}
</Dotdotdot> </Dotdotdot>
{!noPublisher && ( {!noPublisher && (
<Publisher account={owner} minimal className={styles.publisher} /> <Publisher account={owner} minimal className={styles.publisher} />

View File

@ -8,6 +8,11 @@
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
display: inline-flex; display: inline-flex;
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-word;
hyphens: auto;
} }
@media (min-width: 40rem) { @media (min-width: 40rem) {

View File

@ -26,7 +26,7 @@ export default function Page({
<Container> <Container>
{title && !noPageHeader && ( {title && !noPageHeader && (
<PageHeader <PageHeader
title={<>{title}</>} title={<>{title.slice(0, 400)}</>}
description={description} description={description}
center={headerCenter} center={headerCenter}
/> />