transversal links to nav history #786, restored scrolls
This commit is contained in:
+71
-66
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user