aljaz/rabbit
1
0
Fork 0
mirror of https://github.com/aljazceru/rabbit.git synced 2025-12-18 06:24:25 +01:00
Code Issues Packages Projects Releases Wiki Activity

Revert "feat: remove scrollbar"

Browse Source 
This reverts commit 605a87558e.
This commit is contained in:
Shusui MOYATANI
2023-07-10 20:04:34 +09:00
parent 4ee3ba9613
commit ba8b08dc90
3 changed files with 25 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/column/Column.tsx
View File

@@ -59,7 +59,9 @@ const Column: Component<ColumnProps> = (props) => {
fallback={
<>
<div class="shrink-0 border-b">{props.header}</div>
<div class="flex flex-col overflow-y-scroll scroll-smooth">{props.children}</div>
<div class="scrollbar flex flex-col overflow-y-scroll scroll-smooth">
{props.children}
</div>
</>
}
>
@@ -76,7 +78,7 @@ const Column: Component<ColumnProps> = (props) => {
<div>{i18n()('column.back')}</div>
</button>
</div>
<ul class="flex h-full flex-col overflow-y-scroll scroll-smooth pb-8">
<ul class="scrollbar flex h-full flex-col overflow-y-scroll scroll-smooth pb-8">
<TimelineContentDisplay timelineContent={timeline} />
</ul>
</div>

6
src/components/column/ColumnSettings.tsx
View File

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

17
src/index.css
View File

@@ -38,3 +38,20 @@ 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;
}