mirror of
https://github.com/codex-team/codex.docs.git
synced 2025-08-04 13:05:22 +02:00
update view
This commit is contained in:
parent
20747407f7
commit
443edb4c98
3 changed files with 16 additions and 10 deletions
|
@ -3,7 +3,7 @@
|
||||||
{% block body %}
|
{% block body %}
|
||||||
|
|
||||||
{# Remove after testing #}
|
{# Remove after testing #}
|
||||||
<div class="page-intersection-field"></div>
|
{# <div class="page-intersection-field"></div>#}
|
||||||
|
|
||||||
<article class="page" data-module="page">
|
<article class="page" data-module="page">
|
||||||
<header class="page__header">
|
<header class="page__header">
|
||||||
|
|
|
@ -107,8 +107,12 @@ export default class TableOfContent {
|
||||||
const targetLink = target.querySelector('a').getAttribute('href');
|
const targetLink = target.querySelector('a').getAttribute('href');
|
||||||
|
|
||||||
// @todo remove after testing
|
// @todo remove after testing
|
||||||
document.querySelector('.page-intersection-field').style.top = `${entry.rootBounds.top}px`;
|
try {
|
||||||
document.querySelector('.page-intersection-field').style.height = `${entry.rootBounds.height}px`;
|
const pageIntersectionField = document.querySelector('.page-intersection-field');
|
||||||
|
|
||||||
|
pageIntersectionField.style.top = `${entry.rootBounds.top}px`;
|
||||||
|
pageIntersectionField.style.height = `${entry.rootBounds.height}px`;
|
||||||
|
} catch (e) {}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Intersection state of block
|
* Intersection state of block
|
||||||
|
|
|
@ -32,14 +32,8 @@
|
||||||
gap: 6px;
|
gap: 6px;
|
||||||
|
|
||||||
&-item {
|
&-item {
|
||||||
padding: 4px 8px;
|
|
||||||
font-size: 14px;
|
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
|
|
||||||
letter-spacing: -0.01em;
|
|
||||||
font-size: 14px;
|
|
||||||
line-height: 150%;
|
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: #F3F6F8;
|
background-color: #F3F6F8;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -53,6 +47,14 @@
|
||||||
&--h4 { margin-left: 12px; }
|
&--h4 { margin-left: 12px; }
|
||||||
&--h5 { margin-left: 18px; }
|
&--h5 { margin-left: 18px; }
|
||||||
&--h6 { margin-left: 24px; }
|
&--h6 { margin-left: 24px; }
|
||||||
|
|
||||||
|
& > a {
|
||||||
|
margin: 4px 8px;
|
||||||
|
display: block;
|
||||||
|
font-size: 14px;
|
||||||
|
letter-spacing: -0.01em;
|
||||||
|
line-height: 150%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -64,7 +66,7 @@
|
||||||
|
|
||||||
|
|
||||||
.page-intersection-field {
|
.page-intersection-field {
|
||||||
//background-color: rgba(255,0,0,.1);
|
background-color: rgba(255,0,0,.1);
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue