Skip to content
Snippets Groups Projects
Unverified Commit 91f9f0df authored by Jack Reed's avatar Jack Reed Committed by GitHub
Browse files

Merge pull request #2734 from ProjectMirador/2726-more-link-styling

Adjust styling for 'more' link in content search results
parents c0806c2b 9d65d2a1
No related branches found
No related tags found
No related merge requests found
...@@ -36,6 +36,7 @@ export class SearchHit extends Component { ...@@ -36,6 +36,7 @@ export class SearchHit extends Component {
annotationLabel, annotationLabel,
canvasLabel, canvasLabel,
classes, classes,
companionWindowId,
containerRef, containerRef,
hit, hit,
focused, focused,
...@@ -49,6 +50,7 @@ export class SearchHit extends Component { ...@@ -49,6 +50,7 @@ export class SearchHit extends Component {
const truncatedHit = focused ? hit : hit && new TruncatedHit(hit); const truncatedHit = focused ? hit : hit && new TruncatedHit(hit);
const truncated = hit && truncatedHit.before !== hit.before && truncatedHit.after !== hit.after; const truncated = hit && truncatedHit.before !== hit.before && truncatedHit.after !== hit.after;
const canvasLabelHtmlId = `${companionWindowId}-${index}`;
return ( return (
<ScrollTo <ScrollTo
...@@ -73,7 +75,9 @@ export class SearchHit extends Component { ...@@ -73,7 +75,9 @@ export class SearchHit extends Component {
<ListItemText primaryTypographyProps={{ variant: 'body1' }}> <ListItemText primaryTypographyProps={{ variant: 'body1' }}>
<Typography variant="subtitle2" className={classes.subtitle}> <Typography variant="subtitle2" className={classes.subtitle}>
<Chip component="span" label={index + 1} className={classes.hitCounter} /> <Chip component="span" label={index + 1} className={classes.hitCounter} />
<span id={canvasLabelHtmlId}>
{canvasLabel} {canvasLabel}
</span>
</Typography> </Typography>
{annotationLabel && ( {annotationLabel && (
<Typography variant="subtitle2">{annotationLabel}</Typography> <Typography variant="subtitle2">{annotationLabel}</Typography>
...@@ -89,7 +93,7 @@ export class SearchHit extends Component { ...@@ -89,7 +93,7 @@ export class SearchHit extends Component {
<SanitizedHtml ruleSet="iiif" htmlString={truncatedHit.after} /> <SanitizedHtml ruleSet="iiif" htmlString={truncatedHit.after} />
{' '} {' '}
{ truncated && !focused && ( { truncated && !focused && (
<Button className={classes.inlineButton} onClick={showDetails} color="secondary" size="small"> <Button className={classes.inlineButton} onClick={showDetails} color="secondary" size="small" aria-describedby={canvasLabelHtmlId}>
{t('more')} {t('more')}
</Button> </Button>
)} )}
...@@ -112,6 +116,7 @@ SearchHit.propTypes = { ...@@ -112,6 +116,7 @@ SearchHit.propTypes = {
annotationLabel: PropTypes.string, annotationLabel: PropTypes.string,
canvasLabel: PropTypes.string, canvasLabel: PropTypes.string,
classes: PropTypes.objectOf(PropTypes.string), classes: PropTypes.objectOf(PropTypes.string),
companionWindowId: PropTypes.string,
containerRef: PropTypes.oneOfType([ containerRef: PropTypes.oneOfType([
PropTypes.func, PropTypes.func,
PropTypes.shape({ current: PropTypes.instanceOf(Element) }), PropTypes.shape({ current: PropTypes.instanceOf(Element) }),
...@@ -137,6 +142,7 @@ SearchHit.defaultProps = { ...@@ -137,6 +142,7 @@ SearchHit.defaultProps = {
annotationLabel: undefined, annotationLabel: undefined,
canvasLabel: undefined, canvasLabel: undefined,
classes: {}, classes: {},
companionWindowId: undefined,
containerRef: undefined, containerRef: undefined,
focused: false, focused: false,
hit: undefined, hit: undefined,
......
...@@ -59,9 +59,11 @@ const styles = theme => ({ ...@@ -59,9 +59,11 @@ const styles = theme => ({
verticalAlign: 'inherit', verticalAlign: 'inherit',
}, },
inlineButton: { inlineButton: {
'& span': {
lineHeight: '1.5em',
},
margin: 0, margin: 0,
padding: 0, padding: 0,
textDecoration: 'underline',
textTransform: 'none', textTransform: 'none',
}, },
listItem: { listItem: {
......
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
"mirador": "Mirador", "mirador": "Mirador",
"miradorResources": "Mirador resources", "miradorResources": "Mirador resources",
"miradorViewer": "Mirador viewer", "miradorViewer": "Mirador viewer",
"more": "More...", "more": "more...",
"moreResults": "More results", "moreResults": "More results",
"mosaic": "Mosaic", "mosaic": "Mosaic",
"mosaicDescription": "Move and size windows in relation to each other, within the visible frame.", "mosaicDescription": "Move and size windows in relation to each other, within the visible frame.",
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment