Commit 0b627f81 authored by Matija Obreza's avatar Matija Obreza
Browse files

Merge branch '156-fix-toc-navigation'

* 156-fix-toc-navigation:
  Fix TOC navigation
parents 566dece5 ac200f61
......@@ -207,8 +207,30 @@ interface IDocumentationSectionProps extends React.ClassAttributes<any> {
class DocumentationSection extends React.Component<IDocumentationSectionProps> {
public state = {
basePath: '',
};
private replaceImgSrc = (content) => {
return content.replace('<img src="images', '<img src="/proxy/api/v1/cms/d/images');
return content.split('<img src="images').join('<img src="/proxy/api/v1/cms/d/images');
}
public componentWillReceiveProps(nextProps) {
if (typeof document !== 'undefined') {
this.setState({basePath: document.location.pathname});
}
}
public componentWillUpdate(nextProps, nextState) {
if (typeof document !== 'undefined' && nextState.basePath !== this.state.basePath) {
this.setState({basePath: document.location.pathname});
}
}
public componentDidMount() {
if (typeof document !== 'undefined') {
this.setState({basePath: document.location.pathname});
}
}
public render() {
......@@ -222,7 +244,7 @@ class DocumentationSection extends React.Component<IDocumentationSectionProps> {
<Grid item sm={ 12 } md={ 3 } className={ classes.tocContainer }>
<div className={ `${classes.toc} ${classes.white}` }>
<div className={ classes.tocHeader }>{ t('cms.public.c.documentationSection.toc') }</div>
<div className={ `${classes.toc} ${classes.white}` } dangerouslySetInnerHTML={ {__html: documentation.toc} }/>
<div className={ `${classes.toc} ${classes.white}` } dangerouslySetInnerHTML={ {__html: documentation.toc.split('href="#').join(`href="${this.state.basePath}#`)} }/>
</div>
</Grid>
</GridContainer>
......
......@@ -14,7 +14,6 @@ import DescriptorList from 'model/catalog/DescriptorList';
import Loading from 'ui/common/Loading';
import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
import BackButton from 'ui/common/buttons/BackButton';
import { ScrollToTopOnMount } from 'ui/common/page/scrollers';
import PageLayout from 'ui/layout/PageLayout';
import DescriptorListDisplay from './c/DescriptorListDisplay';
......@@ -62,7 +61,6 @@ class DescriptorListPage extends React.Component<IDescriptorListPageProps, any>
return (
<PageLayout>
<ScrollToTopOnMount/>
<ContentHeaderWithButton title={ t('descriptorlists.public.p.display.title') }
buttons={ <BackButton defaultTarget="/descriptorlists"/> }
/>
......
......@@ -49,6 +49,10 @@ const styles = (theme) => ({
},
/* tslint:enable */
},
descriptorCard: {
paddingTop: '83px',
marginTop: '-83px',
},
cardsContainer: {
paddingRight: '1.5rem',
[theme.breakpoints.down('sm')]: {
......@@ -72,6 +76,10 @@ interface IDetailInfoProps extends React.ClassAttributes<any> {
class DetailInfo extends React.Component<IDetailInfoProps, any> {
public state = {
basePath: '',
};
protected onPublish = () => {
const { descriptorList, publishDescriptorList, t } = this.props;
......@@ -182,6 +190,19 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
super(props);
}
public componentWillUpdate(nextProps, nextState) {
if (typeof document !== 'undefined' && nextState.basePath !== this.state.basePath) {
this.setState({basePath: document.location.pathname});
}
}
public componentDidMount() {
if (typeof document !== 'undefined') {
this.setState({basePath: document.location.pathname});
}
}
public render() {
const { classes, descriptorList, review, t } = this.props;
......@@ -299,7 +320,7 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
<Grid item xs={ 12 } md={ 9 } className={ classes.cardsContainer }>
{ descriptorList.descriptors && descriptorList.descriptors.length > 0 && descriptorList.descriptors.map((descriptor: Descriptor) => (
<div key={ `${descriptor.uuid}` } id={ `d-${descriptor.uuid}` }>
<div key={ `${descriptor.uuid}` } id={ `d-${descriptor.uuid}` } className={ classes.descriptorCard }>
<DescriptorCard
id={ `d-${descriptor.uuid}` }
className={ classes.card }
......@@ -316,7 +337,7 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
<Grid item xs={ 12 } md={ 3 }>
<Section title={ t('descriptorlists.public.c.descrListsDisplay.table') } className="p-20">
{ descriptorList.descriptors && descriptorList.descriptors.length > 0 && descriptorList.descriptors.map((descriptor: Descriptor) => (
<div key={ `${descriptor.uuid}` }><a href={ `#d-${descriptor.uuid}` }>{ descriptor.title }</a></div>
<div key={ `${descriptor.uuid}` }><a href={ `${this.state.basePath}#d-${descriptor.uuid}` }>{ descriptor.title }</a></div>
)) }
</Section>
</Grid>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment