github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-10-18 21:30:15 -04:00
Code Issues Projects Releases Packages Wiki Activity

Improve css in preparation for the sync scroll (#380)

Browse source 
* Improve css in preparation for the sync scroll

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Remove scroll behaviour

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
This commit is contained in:
mrdrogdrog 2020-08-03 20:06:32 +02:00 committed by GitHub
parent 6add1b2f1f
commit 512bca02e7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 7 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/common/splitter/splitter.tsx
View file

@ -54,7 +54,7 @@ export const Splitter: React.FC<SplitterProps> = ({ containerClassName, left, ri
</div> </div>
</ShowIf> </ShowIf>
<ShowIf condition={showRight}> <ShowIf condition={showRight}>
<div className='splitter right overflow-y-scroll'> <div className='splitter right'>
{right} {right}
</div> </div>
</ShowIf> </ShowIf>

13
src/components/editor/markdown-toc/markdown-toc.scss
View file

@ -4,9 +4,7 @@
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
&.sticky { &.sticky {
position: sticky; position: fixed;
top: 0;
left: 0;
} }
>ul>li { >ul>li {
@ -52,12 +50,9 @@
} }
} }
.markdown-toc-sidebar-button { .markdown-toc-sidebar-button {
position: absolute; position: fixed;
height: 100%; right: 40px;
right: 20px; bottom: 20px;
display: flex;
justify-content: flex-end;
flex-direction: column;
&>.dropup { &>.dropup {
position: sticky; position: sticky;

4
src/components/editor/renderer-window/markdown-render-window.tsx
View file

@ -23,7 +23,7 @@ export const MarkdownRenderWindow: React.FC<RenderWindowProps> = ({ content, onM
const realWidth = width || 0 const realWidth = width || 0
return ( return (
<div className={'bg-light flex-fill pb-5 flex-row d-flex min-h-100'} ref={renderer}> <div className={'bg-light flex-fill pb-5 flex-row d-flex w-100 h-100 overflow-y-scroll'} ref={renderer}>
<div className={'col-md'}/> <div className={'col-md'}/>
<MarkdownRenderer <MarkdownRenderer
className={'flex-fill'} className={'flex-fill'}
@ -34,7 +34,7 @@ export const MarkdownRenderWindow: React.FC<RenderWindowProps> = ({ content, onM
onFirstHeadingChange={onFirstHeadingChange} onFirstHeadingChange={onFirstHeadingChange}
/> />
<div className={`col-md d-flex flex-column ${realWidth < 1280 ? 'justify-content-end' : ''}`}> <div className={'col-md'}>
<ShowIf condition={realWidth >= 1280 && !!tocAst}> <ShowIf condition={realWidth >= 1280 && !!tocAst}>
<MarkdownToc ast={tocAst as TocAst} sticky={true}/> <MarkdownToc ast={tocAst as TocAst} sticky={true}/>
</ShowIf> </ShowIf>

4
src/global-style/index.scss
View file

@ -36,7 +36,3 @@ body {
.overflow-y-scroll { .overflow-y-scroll {
overflow-y: scroll; overflow-y: scroll;
} }
.min-h-100 {
min-height: 100%;
}