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:
@@ -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);
|
||||
|
||||
Reference in New Issue
Block a user