Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-27 22:49:56 -05:00
Code Issues Activity

Refined content scrolling in AdminX Settings

Browse source 
refs. https://github.com/TryGhost/Team/issues/3150
This commit is contained in:
Peter Zimon 2023-05-23 11:54:42 +02:00
parent 4a0e59487f
commit 10e48d613c
2 changed files with 8 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ghost/admin-x-settings/src/admin-x-ds/settings/SettingSection.tsx
View file

@ -9,7 +9,7 @@ interface Props {
const SettingSection: React.FC<Props> = ({title, children}) => {
return (
<>
{title && <SettingSectionHeader title={title} />}
{title && <SettingSectionHeader sticky={true} title={title} />}
{children &&
<div className="mb-[100px] flex flex-col gap-9">
{children}

9
ghost/admin-x-settings/src/admin-x-ds/settings/SettingSectionHeader.tsx
View file

@ -2,11 +2,16 @@ import React from 'react';
interface Props {
title: string;
sticky?: boolean;
}
const SettingSectionHeader: React.FC<Props> = ({title}) => {
const SettingSectionHeader: React.FC<Props> = ({title, sticky = false}) => {
let styles = 'pb-4 text-2xs font-semibold uppercase tracking-wide text-grey-700';
if (sticky) {
styles += ' sticky top-0 -mt-4 pt-4 bg-white';
}
return (
<h2 className="mb-4 text-2xs font-semibold uppercase tracking-wide text-grey-700">{title}</h2>
<h2 className={styles}>{title}</h2>
);
};