mirror of
https://github.com/gethomepage/homepage.git
synced 2026-01-09 01:44:24 +08:00
Enhancement: icons-only bookmarks style (#4384)
This commit is contained in:
@@ -4,16 +4,22 @@ import { columnMap } from "../../utils/layout/columns";
|
||||
|
||||
import Item from "components/bookmarks/item";
|
||||
|
||||
export default function List({ bookmarks, layout }) {
|
||||
export default function List({ bookmarks, layout, bookmarksStyle }) {
|
||||
let classes =
|
||||
layout?.style === "row" ? `grid ${columnMap[layout?.columns]} gap-x-2` : "flex flex-col mt-3 bookmark-list";
|
||||
const style = {};
|
||||
if (layout?.iconsOnly || bookmarksStyle === "icons") {
|
||||
classes = "grid gap-3 mt-3 bookmark-list";
|
||||
style.gridTemplateColumns = "repeat(auto-fill, minmax(60px, 1fr))";
|
||||
}
|
||||
return (
|
||||
<ul
|
||||
className={classNames(
|
||||
layout?.style === "row" ? `grid ${columnMap[layout?.columns]} gap-x-2` : "flex flex-col",
|
||||
"mt-3 bookmark-list",
|
||||
)}
|
||||
>
|
||||
<ul className={classNames(classes)} style={style}>
|
||||
{bookmarks.map((bookmark) => (
|
||||
<Item key={`${bookmark.name}-${bookmark.href}`} bookmark={bookmark} />
|
||||
<Item
|
||||
key={`${bookmark.name}-${bookmark.href}`}
|
||||
bookmark={bookmark}
|
||||
iconOnly={layout?.iconsOnly || bookmarksStyle === "icons"}
|
||||
/>
|
||||
))}
|
||||
</ul>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user