ajout scrollbar colone de gauche
This commit is contained in:
parent
c4c1881b43
commit
d040b3b893
|
|
@ -51,6 +51,17 @@ body {
|
|||
/* flex: 50%; */
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.column .scrollbar {
|
||||
/* margin-left: 30px; */
|
||||
/* float: left; */
|
||||
height: 950px;
|
||||
/* width: 300px; */
|
||||
background: #fff;
|
||||
overflow-y: scroll;
|
||||
/* margin-bottom: 25px; */
|
||||
}
|
||||
|
||||
.left {
|
||||
width: 25%;
|
||||
}
|
||||
|
|
@ -58,6 +69,7 @@ body {
|
|||
.right {
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
|
|
@ -134,7 +146,7 @@ body {
|
|||
height: 90px;
|
||||
}
|
||||
|
||||
.sidebar .channel-logo > img {
|
||||
.sidebar .channel-logo>img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -259,22 +271,119 @@ body {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
/* .svg-icon {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
.force-overflow {
|
||||
min-height: 450px;
|
||||
}
|
||||
|
||||
.svg-icon:hover {
|
||||
fill: var(--animation-duration);
|
||||
.scrollbar-primary::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.svg-icon path,
|
||||
.svg-icon polygon,
|
||||
.svg-icon rect {
|
||||
fill: #4691f6;
|
||||
.scrollbar-primary::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #4285F4;
|
||||
}
|
||||
|
||||
.svg-icon circle {
|
||||
stroke: #4691f6;
|
||||
stroke-width: 1;
|
||||
} */
|
||||
.scrollbar-danger::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-danger::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.scrollbar-danger::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #ff3547;
|
||||
}
|
||||
|
||||
.scrollbar-warning::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-warning::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.scrollbar-warning::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #FF8800;
|
||||
}
|
||||
|
||||
.scrollbar-success::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-success::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.scrollbar-success::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #00C851;
|
||||
}
|
||||
|
||||
.scrollbar-info::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-info::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.scrollbar-info::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #33b5e5;
|
||||
}
|
||||
|
||||
.scrollbar-default::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-default::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.scrollbar-default::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #2BBBAD;
|
||||
}
|
||||
|
||||
.scrollbar-secondary::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.scrollbar-secondary::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.scrollbar-secondary::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #aa66cc;
|
||||
}
|
||||
|
|
@ -146,11 +146,15 @@
|
|||
</aside>
|
||||
<div class="row">
|
||||
<div class="column left">
|
||||
# var title = templ_title("NOTEBOOKS")
|
||||
${title}
|
||||
# for i in all_notebooks.title:
|
||||
<p> ${i} </p>
|
||||
# end for
|
||||
<div class="scrollbar scrollbar-primary">
|
||||
<div class="force-overflow">
|
||||
# var title = templ_title("NOTEBOOKS")
|
||||
${title}
|
||||
# for i in all_notebooks.title:
|
||||
<p> ${i} </p>
|
||||
# end for
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column right" style="background-color:#bbb;">
|
||||
<h2>Column 2</h2>
|
||||
|
|
|
|||
Loading…
Reference in New Issue