transversal links to nav history #786, restored scrolls

This commit is contained in:
2020-07-21 17:38:27 +02:00
parent 44388adaf8
commit f0b6a79bc7
6 changed files with 133 additions and 88 deletions
+71 -66
View File
@@ -6,6 +6,25 @@
@import './base/fonts';
@import './base/transitions';
/* The emerging W3C standard
that is currently Firefox-only */
* {
scrollbar-width: thin;
scrollbar-color: $grisclair rgba(255,255,255,0);
}
/* Works on Chrome/Edge/Safari */
*::-webkit-scrollbar {
width: 12px;
}
*::-webkit-scrollbar-track {
background: rgba(255,255,255,0);
}
*::-webkit-scrollbar-thumb {
background-color: $grisclair;
border-radius: 20px;
border: none;
}
body{
color: #1a1a1a;
@@ -479,8 +498,48 @@ section[role="main-content"]{
}
footer[role="tools"]{
$list-item-h: 5.3em;
$list-item-h: 5em;
@mixin resultItem{
box-sizing: border-box;
// we are only on 10 colls as 2 are occupied by sides
flex-basis: percentage(2/($default_sum - 2));
height: $list-item-h;
overflow: hidden;
padding-bottom: 1em;
padding-right: $default_gap;
article{
max-height: 100%;
overflow: hidden;
}
article.item{
h1{
@include title3black;
font-weight: 600;
max-width: 95%;
}
h2{
@include title3black;
text-transform: none;
}
span{
font-size: 0.882em;
}
// .preview{
// font-size: 0.882em;
// margin:0;
// code{
// @include fontserif;
// background-color: lighten(desaturate($rouge,20%), 20%);
// padding:0 0.2em;
// }
// }
}
}
#history{
z-index: 8;
background-color: $or;
@@ -496,7 +555,7 @@ footer[role="tools"]{
height:100%;
// hidding the scrollbar
overflow-y: auto;
width:calc(100% + 1em);
// width:calc(100% + 1em);
padding-right: 1em;
>ul{
padding:0;
@@ -506,35 +565,7 @@ footer[role="tools"]{
}
}
li.item{
box-sizing: border-box;
// we are only on 10 colls as 2 are occupied by sides
flex-basis: percentage(2/($default_sum - 2));
height: $list-item-h;
overflow: hidden;
padding-bottom: 1em;
padding-right: $default_gap;
article{
max-height: 100%;
overflow: hidden;
}
}
article.history.item{
header{
h1{
font-size: 0.882em;
font-weight: normal;
margin:0 0 0.5em 0;
}
}
.extract{
p{
font-size: 0.882em;
margin:0;
}
code{
background-color: lighten(desaturate($rouge,20%), 20%);
}
}
@include resultItem;
}
}
}
@@ -560,7 +591,7 @@ footer[role="tools"]{
height:100%;
// hidding the scrollbar
overflow-y: auto;
width:calc(100% + 1em);
// width:calc(100% + 1em);
padding-right: 1em;
>ul{
padding:0;
@@ -570,39 +601,7 @@ footer[role="tools"]{
}
}
li.result{
box-sizing: border-box;
// we are only on 10 colls as 2 are occupied by sides
flex-basis: percentage(2/($default_sum - 2));
height: $list-item-h;
overflow: hidden;
padding-bottom: 1em;
padding-right: $default_gap;
article{
max-height: 100%;
overflow: hidden;
}
}
article.result.item{
h1{
@include title3black;
font-weight: 600;
}
h2{
@include title3black;
text-transform: none;
}
span{
font-size: 0.882em;
}
// .preview{
// font-size: 0.882em;
// margin:0;
// code{
// @include fontserif;
// background-color: lighten(desaturate($rouge,20%), 20%);
// padding:0 0.2em;
// }
// }
@include resultItem;
}
.infinite-loading-container{
// TODO: how to center the loading
@@ -652,12 +651,18 @@ footer[role="tools"]{
color: #fff;
background-color: $bleuroi;
form{
// padding: 0.7em;
padding: 0;
// display: flex;
// flex-direction: row;
// flex-wrap: wrap;
fieldset{
padding:0.7em 1em;
border: none;
box-sizing:border-box;
// width correction as row is not the same width as others in the page
// flex-basis: percentage(2/($default_sum - 1));
flex-basis: 17.667%;
// flex-basis: percentage(2 / 11);
&:not(:first-of-type){
border-left: 1px solid $grisclair;
}