Fix: info widget gaps (#3038)

pull/2708/head
shamoon 2 months ago
parent 70f0eb3af6
commit fc1bf53f8f

@ -16,7 +16,7 @@ export function getAllClasses(options, additionalClassNames = "") {
} }
return classNames( return classNames(
"flex flex-col justify-center ml-2 mr-2", "flex flex-col justify-center",
"mt-2 m:mb-0 rounded-md shadow-md shadow-theme-900/10 dark:shadow-theme-900/20 bg-theme-100/20 dark:bg-white/5 p-2 pl-3 pr-3", "mt-2 m:mb-0 rounded-md shadow-md shadow-theme-900/10 dark:shadow-theme-900/20 bg-theme-100/20 dark:bg-white/5 p-2 pl-3 pr-3",
additionalClassNames, additionalClassNames,
); );
@ -24,7 +24,7 @@ export function getAllClasses(options, additionalClassNames = "") {
let widgetAlignedClasses = "flex flex-col max-w:full sm:basis-auto self-center grow-0 flex-wrap"; let widgetAlignedClasses = "flex flex-col max-w:full sm:basis-auto self-center grow-0 flex-wrap";
if (options?.style?.isRightAligned) { if (options?.style?.isRightAligned) {
widgetAlignedClasses = "flex flex-col justify-center first:ml-auto ml-2 mr-2 "; widgetAlignedClasses = "flex flex-col justify-center";
} }
return classNames(widgetAlignedClasses, additionalClassNames); return classNames(widgetAlignedClasses, additionalClassNames);

@ -161,10 +161,10 @@ function Index({ initialSettings, fallback }) {
const headerStyles = { const headerStyles = {
boxed: boxed:
"m-6 mb-0 sm:m-9 sm:mb-0 rounded-md shadow-md shadow-theme-900/10 dark:shadow-theme-900/20 bg-theme-100/20 dark:bg-white/5 p-3", "m-5 mb-0 sm:m-9 sm:mb-0 rounded-md shadow-md shadow-theme-900/10 dark:shadow-theme-900/20 bg-theme-100/20 dark:bg-white/5 p-3",
underlined: "m-6 mb-0 sm:m-9 sm:mb-1 border-b-2 pb-4 border-theme-800 dark:border-theme-200/50", underlined: "m-5 mb-0 sm:m-9 sm:mb-1 border-b-2 pb-4 border-theme-800 dark:border-theme-200/50",
clean: "m-6 mb-0 sm:m-9 sm:mb-0", clean: "m-5 mb-0 sm:m-9 sm:mb-0",
boxedWidgets: "m-6 mb-0 sm:m-9 sm:mb-0 sm:mt-1", boxedWidgets: "m-5 mb-0 sm:m-9 sm:mb-0 sm:mt-1",
}; };
function Home({ initialSettings }) { function Home({ initialSettings }) {
@ -282,7 +282,7 @@ function Home({ initialSettings }) {
return ( return (
<> <>
{tabs.length > 0 && ( {tabs.length > 0 && (
<div key="tabs" id="tabs" className="m-6 sm:m-9 sm:mt-4 sm:mb-0"> <div key="tabs" id="tabs" className="m-5 sm:m-9 sm:mt-4 sm:mb-0">
<ul <ul
className={classNames( className={classNames(
"sm:flex rounded-md bg-theme-100/20 dark:bg-white/5", "sm:flex rounded-md bg-theme-100/20 dark:bg-white/5",
@ -415,11 +415,7 @@ function Home({ initialSettings }) {
`backdrop-blur${settings.cardBlur.length ? "-" : ""}${settings.cardBlur}`, `backdrop-blur${settings.cardBlur.length ? "-" : ""}${settings.cardBlur}`,
)} )}
> >
<div <div id="widgets-wrap" className={classNames("flex flex-row w-full flex-wrap justify-between gap-x-2")}>
id="widgets-wrap"
style={{ width: "calc(100% + 1rem)" }}
className={classNames("flex flex-row w-full flex-wrap justify-between -ml-2 -mr-2")}
>
{widgets && ( {widgets && (
<> <>
{widgets {widgets
@ -436,7 +432,7 @@ function Home({ initialSettings }) {
id="information-widgets-right" id="information-widgets-right"
className={classNames( className={classNames(
"m-auto flex flex-wrap grow sm:basis-auto justify-between md:justify-end", "m-auto flex flex-wrap grow sm:basis-auto justify-between md:justify-end",
headerStyle === "boxedWidgets" ? "sm:ml-4" : "sm:ml-2", "m-auto flex flex-wrap grow sm:basis-auto justify-between md:justify-end gap-x-2",
)} )}
> >
{widgets {widgets

Loading…
Cancel
Save