feat: remove scrollbar

src/components/column/Column.tsx

@@ -57,9 +57,7 @@ const Column: Component<ColumnProps> = (props) => {
           fallback={
             <>
               <div class="shrink-0 border-b">{props.header}</div>
-              <div class="scrollbar flex flex-col overflow-y-scroll scroll-smooth">
-                {props.children}
-              </div>
+              <div class="flex flex-col overflow-y-scroll scroll-smooth">{props.children}</div>
             </>
           }
         >
@@ -76,7 +74,7 @@ const Column: Component<ColumnProps> = (props) => {
                   <div>ホームに戻る</div>
                 </button>
               </div>
-              <ul class="scrollbar flex h-full flex-col overflow-y-scroll scroll-smooth pb-8">
+              <ul class="flex h-full flex-col overflow-y-scroll scroll-smooth pb-8">
                 <TimelineContentDisplay timelineContent={timeline} />
               </ul>
             </div>

src/components/column/ColumnSettings.tsx

@@ -19,14 +19,12 @@ type ColumnSettingsSectionProps = {
   children: JSX.Element;
 };
 
-const ColumnSettingsSection: Component<ColumnSettingsSectionProps> = (props) => {
-  return (
+const ColumnSettingsSection: Component<ColumnSettingsSectionProps> = (props) => (
     <div class="flex flex-col gap-2 border-b p-2">
       <div>{props.title}</div>
       <div>{props.children}</div>
     </div>
   );
-};
 
 const ColumnSettings: Component<ColumnSettingsProps> = (props) => {
   const i18n = useTranslation();
@@ -45,7 +43,7 @@ const ColumnSettings: Component<ColumnSettingsProps> = (props) => {
   return (
     <div class="flex flex-col border-t">
       <ColumnSettingsSection title={i18n()('column.config.columnWidth')}>
-        <div class="scrollbar flex h-9 gap-2 overflow-x-scroll">
+        <div class="flex h-9 gap-2 overflow-x-scroll">
           <button
             class="rounded-md border px-4 hover:bg-stone-100"
             onClick={() => setColumnWidth('widest')}

src/index.css

@@ -38,20 +38,3 @@ em-emoji-picker {
   width: 360px;
   max-width: 90vw;
 }
-
-.scrollbar::-webkit-scrollbar:vertical {
-  width: 8px;
-}
-.scrollbar::-webkit-scrollbar:horizontal {
-  height: 8px;
-}
-.scrollbar::-webkit-scrollbar {
-  background-color: #fbf9f9;
-}
-.scrollbar::-webkit-scrollbar-thumb {
-  background-color: #fce9ec;
-  border-radius: 8px;
-}
-.scrollbar::-webkit-scrollbar-thumb:hover {
-  background-color: #fcd9dc;
-}