mirror of
https://github.com/open-webui/docs
synced 2025-06-16 11:28:36 +00:00
refac
This commit is contained in:
@@ -1,30 +1,47 @@
|
||||
export const TopBanner = ({ item }) => {
|
||||
export const TopBanner = ({item, bannerClassName = 'h-18 ', label = true, description= true,mobile = true }) => {
|
||||
return (
|
||||
<div className="pb-4">
|
||||
<div className="mb-2">
|
||||
<div className="w-full">
|
||||
<div className="flex flex-col justify-center w-full">
|
||||
{label &&
|
||||
<div className="mb-1 text-xs font-semibold text-gray-600 underline dark:text-gray-300">
|
||||
Sponsored by {item.name}
|
||||
</div>
|
||||
}
|
||||
|
||||
<a href={item.url} target="_blank" className="flex items-center justify-center w-full">
|
||||
|
||||
{mobile ? <>
|
||||
<img
|
||||
className={`hidden md:block w-full rounded-xl object-cover ${bannerClassName}`}
|
||||
loading="lazy"
|
||||
alt={item.name}
|
||||
src={item.imgSrc}
|
||||
/>
|
||||
|
||||
<img
|
||||
className={`block w-full rounded-xl md:hidden object-cover ${bannerClassName}`}
|
||||
loading="lazy"
|
||||
alt={item.name}
|
||||
src={item?.mobileImgSrc || item.imgSrc}
|
||||
/>
|
||||
</> : <>
|
||||
|
||||
<a href={item.url} target="_blank">
|
||||
<img
|
||||
className="hidden w-full rounded-xl md:block h-18 object-cover"
|
||||
className={`w-full rounded-xl object-cover ${bannerClassName}`}
|
||||
loading="lazy"
|
||||
alt={item.name}
|
||||
src={item.imgSrc}
|
||||
/>
|
||||
|
||||
<img
|
||||
className="block w-full rounded-xl md:hidden h-18 object-cover"
|
||||
loading="lazy"
|
||||
alt={item.name}
|
||||
src={item?.mobileImgSrc || item.imgSrc}
|
||||
/>
|
||||
</> }
|
||||
</a>
|
||||
|
||||
{description &&
|
||||
|
||||
<div className="mt-1 line-clamp-1 text-right text-xs font-semibold text-gray-600 dark:text-gray-300">
|
||||
{item.description}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { TopBanner } from "@site/src/components/Sponsors/TopBanner";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
export const TopBanners = () => {
|
||||
export const TopBanners = ({bannerClassName = 'h-18', label= true, description= true, mobile = true }) => {
|
||||
const items = [
|
||||
{
|
||||
imgSrc: "/sponsors/banners/n8n-banner.png",
|
||||
@@ -80,5 +80,5 @@ export const TopBanners = () => {
|
||||
}, []);
|
||||
|
||||
|
||||
return <TopBanner item={items[selectedItemIdx]} />;
|
||||
return <TopBanner bannerClassName={bannerClassName} item={items[selectedItemIdx]} label={label} description={description} mobile={mobile} />;
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user