mirror of
https://github.com/Zagrios/bs-manager.git
synced 2026-07-03 14:08:25 +02:00
ajout scroll bar
This commit is contained in:
Generated
+50
-18008
File diff suppressed because it is too large
Load Diff
@@ -219,6 +219,7 @@
|
||||
"sass": "^1.49.11",
|
||||
"sass-loader": "^12.6.0",
|
||||
"style-loader": "^3.3.1",
|
||||
"tailwind-scrollbar": "^1.3.1",
|
||||
"tailwindcss": "^3.0.24",
|
||||
"terser-webpack-plugin": "^5.3.1",
|
||||
"ts-jest": "^27.1.4",
|
||||
|
||||
Generated
+1
-10
@@ -1,14 +1,5 @@
|
||||
{
|
||||
"name": "electron-react-boilerplate",
|
||||
"version": "4.5.0",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "electron-react-boilerplate",
|
||||
"version": "4.5.0",
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT"
|
||||
}
|
||||
}
|
||||
"lockfileVersion": 1
|
||||
}
|
||||
|
||||
@@ -21,3 +21,9 @@
|
||||
background-blend-mode: luminosity;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
#versions{
|
||||
scrollbar-gutter: stable;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -5,65 +5,66 @@ import './nav-bar.component.css'
|
||||
|
||||
export function NavBar() {
|
||||
return (
|
||||
<div className='flex flex-col items-center w-fit h-full max-h-full p-2 bg-gray-200 dark:bg-[#202225]'>
|
||||
<div id='nav-bar' className='flex flex-col items-center w-fit h-full max-h-full p-2 bg-gray-200 dark:bg-[#202225]'>
|
||||
<div className='w-full flex items-start content-start justify-center relative mb-3'>
|
||||
<div className='relative aspect-square w-16'>
|
||||
<span id='logo-bottom' className='bg-green-400 aspect-square w-16'> </span>
|
||||
<span id='logo-top' className='bg-purple-500 aspect-square w-16'> </span>
|
||||
<span id='logo-bottom' className='bg-blue-500 aspect-square w-16'> </span>
|
||||
<span id='logo-top' className='bg-red-500 aspect-square w-16'> </span>
|
||||
</div>
|
||||
</div>
|
||||
<div className='grow overflow-y-scroll scrollbar-hide'>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div id='versions' className='relative left-1 w-full grow overflow-y-hidden scrollbar-th scrollbar-track-transparent scrollbar-thin scrollbar-thumb-neutral-900 hover:overflow-y-scroll'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div><div className='grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow relative pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<div className='grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
<div className='cursor-pointer grow pr-4 pl-4 w-full h-fit flex justify-center items-center content-center pt-2 pb-2 text-center rounded-full overflow-hidden hover:bg-[#2C2F33]'>
|
||||
<span className='font-bold text-gray-200'>1.19.0</span>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
::-webkit-scrollbar {
|
||||
width: 4px !important;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 20px;
|
||||
}
|
||||
@@ -2,6 +2,7 @@ import { createRoot } from 'react-dom/client';
|
||||
import { InitDownloadInfoInterface } from 'main/ipcs/bs-download-ipcs';
|
||||
import App from './App';
|
||||
import 'tailwindcss/tailwind.css';
|
||||
import './index.css'
|
||||
|
||||
const container = document.getElementById('root')!;
|
||||
const root = createRoot(container);
|
||||
|
||||
+4
-1
@@ -1,5 +1,8 @@
|
||||
module.exports = {
|
||||
content: ['./src/renderer/**/*.tsx'],
|
||||
mode: 'jit',
|
||||
plugins: [require('tailwind-scrollbar-hide')],
|
||||
plugins: [require('tailwind-scrollbar-hide'), require('tailwind-scrollbar')],
|
||||
variants: {
|
||||
scrollbar: ['rounded']
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user