nicholas/storage-manager
1
0
Fork 0
Code Issues Pull Requests Activity

skinny scollbar on html elem overflow

Browse Source
This commit is contained in:
np.w
2020-12-16 22:34:08 -06:00
parent 25321bb1c1
commit 0a6551169b
4 changed files with 9 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/public/index.html
+1 -1
View File
@@ -8,7 +8,7 @@
<title>React App</title>
</head>
<body>
<body class="scroll-container">
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
client/src/app.js
+1 -1
View File
@@ -341,7 +341,7 @@ function App() {
{<button className='button' onClick={handleAddBox}>new box</button>}
</div>
<div className='body-container'>
<div className='body-container scroll-container'>
<ul className="list-box">
{filteredData.map((box, index) => {
return (
client/src/box.js
+1 -1
View File
@@ -47,7 +47,7 @@ const Box = ({ boxData, boxHandler, itemHandler }) => {
<span className='menu-more box material-icons' onClick={handleBoxMenuClick}>more_vert</span>
</div>
<div className='head-divider'></div>
<ul className='list-box-item'>
<ul className='list-box-item scroll-container'>
{boxData.item.map(((item, index) => {
return <Item
key={index}
client/src/styles/app.css
+6 -5
View File
@@ -6,7 +6,7 @@
--white_light:#fafafa;
--white_darker: #e0e0e0;
}
html, body {
html, body, #root {
margin: 0;
}
@@ -15,7 +15,8 @@ html {
color: var(--black_dark)
}
.body-container {
margin-left: 2em;
margin: 0 2em;
overflow:auto;
}
form > fieldset > label {
display: flex;
@@ -154,13 +155,13 @@ li.box {
max-height: 200px;
overflow-y: auto;
}
.list-box-item::-webkit-scrollbar {
.scroll-container::-webkit-scrollbar {
width: 5px;
}
.list-box-item::-webkit-scrollbar-track {
.scroll-container::-webkit-scrollbar-track {
background: #ddd;
}
.list-box-item::-webkit-scrollbar-thumb {
.scroll-container::-webkit-scrollbar-thumb {
background: #666;
}
li.item {