@dndbuilder.com/react
Version:
Drag and drop builder for React
268 lines (267 loc) • 7.34 kB
JavaScript
import { Breakpoint as o } from "../types/responsive.js";
import { PseudoClass as e, Unit as t, BackgroundType as l } from "../types/style.js";
import { createId as i } from "../../../../utils.js";
import { a as n } from "../../../../node_modules/.pnpm/tailwindcss@4.1.8/node_modules/tailwindcss/dist/chunk-HTB5LLOP.js";
const d = {
settings: {
layout: {},
color: {
backgroundColor: n.white,
textColor: "#000000",
accentColor: "#1e293b",
presets: [
{ id: i(), name: "Primary", value: "#1e293b" },
{
id: i(),
name: "Secondary",
value: "#cbd5e1"
}
]
},
typography: {
body: {
fontFamily: { desktop: "Lato", tablet: "Lato", mobile: "Lato" },
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 14 } },
fontWeight: { desktop: 500, tablet: 500, mobile: 500 },
fontStyle: { desktop: "" },
lineHeight: { [o.DESKTOP]: { unit: t.PX, value: 24 } },
letterSpacing: { [o.DESKTOP]: { unit: t.PX, value: 0 } },
wordSpacing: { [o.DESKTOP]: { unit: t.PX, value: 0 } }
},
h1: {
fontFamily: { desktop: "Roboto", tablet: "Roboto", mobile: "Roboto" },
fontSize: {
[o.DESKTOP]: { unit: t.PX, value: 48 },
[o.MOBILE]: {
unit: t.PX,
value: 36
}
},
fontStyle: { desktop: "bold", tablet: "bold", mobile: "bold" },
lineHeight: { [o.DESKTOP]: { unit: t.PX, value: 56 } }
},
h2: {
fontFamily: { desktop: "Roboto", tablet: "Roboto", mobile: "Roboto" },
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 36 } },
fontStyle: { desktop: "bold", tablet: "bold", mobile: "bold" },
lineHeight: { [o.DESKTOP]: { unit: t.PX, value: 40 } }
},
h3: {
fontFamily: { desktop: "Roboto", tablet: "Roboto", mobile: "Roboto" },
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 24 } },
fontStyle: { desktop: "bold", tablet: "bold", mobile: "bold" },
lineHeight: { [o.DESKTOP]: { unit: t.PX, value: 32 } }
},
h4: {
fontFamily: { desktop: "Roboto", tablet: "Roboto", mobile: "Roboto" },
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 20 } },
fontStyle: { desktop: "bold", tablet: "bold", mobile: "bold" },
lineHeight: { [o.DESKTOP]: { unit: t.PX, value: 24 } }
},
h5: {
fontFamily: { desktop: "Roboto", tablet: "Roboto", mobile: "Roboto" },
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 16 } },
fontStyle: { desktop: "bold", tablet: "bold", mobile: "bold" },
lineHeight: { [o.DESKTOP]: { unit: t.PX, value: 20 } }
},
h6: {
fontFamily: { desktop: "Roboto", tablet: "Roboto", mobile: "Roboto" },
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 14 } },
fontStyle: { desktop: "bold", tablet: "bold", mobile: "bold" },
lineHeight: { [o.DESKTOP]: { unit: t.PX, value: 20 } }
},
presets: [
{
id: i(),
name: "Display 1",
value: {
fontFamily: { desktop: "Lato", tablet: "Lato", mobile: "Lato" },
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 16 } },
fontWeight: { desktop: 500, tablet: 500, mobile: 500 },
lineHeight: { [o.DESKTOP]: { unit: t.PX, value: 24 } }
}
}
]
},
button: {
typography: {
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 14 } }
},
color: {
[e.DEFAULT]: n.white
},
background: {
color: {
[e.DEFAULT]: "#1e293b",
[e.HOVER]: "#09090b"
},
type: {
[e.DEFAULT]: l.CLASSIC,
[e.HOVER]: l.CLASSIC
}
},
borderRadius: {
default: { unit: t.PX, top: 5, right: 5, bottom: 5, left: 5 }
},
padding: {
desktop: {
default: {
top: 0.5,
right: 1,
bottom: 0.5,
left: 1,
linked: !0,
unit: t.REM
}
},
tablet: {
default: {
top: 0.5,
right: 1,
bottom: 0.5,
left: 1,
linked: !0,
unit: t.REM
}
},
mobile: {
default: {
top: 0.5,
right: 1,
bottom: 0.5,
left: 1,
linked: !0,
unit: t.REM
}
}
},
presets: [
{
id: i(),
name: "Primary",
value: {
typography: {
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 14 } },
lineHeight: {
[o.DESKTOP]: { unit: t.PX, value: 20 }
}
},
background: {
color: {
[e.DEFAULT]: "#1e293b",
[e.HOVER]: "#09090b"
},
type: {
[e.DEFAULT]: l.CLASSIC,
[e.HOVER]: l.CLASSIC
}
}
}
}
]
},
link: {
color: {
[e.DEFAULT]: "#1e293b",
[e.HOVER]: "#09090b"
}
},
form: {
label: {
typography: {
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 14 } }
},
color: "#000000"
},
input: {
typography: {
fontSize: { [o.DESKTOP]: { unit: t.PX, value: 14 } }
},
color: {
[e.DEFAULT]: "#000000",
[e.FOCUS]: "#000000"
},
backgroundColor: {
[e.DEFAULT]: n.white,
[e.FOCUS]: n.white
},
borderRadius: {
[e.DEFAULT]: {
unit: t.PX,
top: 5,
right: 5,
bottom: 5,
left: 5
},
[e.FOCUS]: {
unit: t.PX,
top: 5,
right: 5,
bottom: 5,
left: 5
}
},
borderWidth: {
[e.DEFAULT]: {
unit: t.PX,
top: 1,
right: 1,
bottom: 1,
left: 1
},
[e.FOCUS]: {
unit: t.PX,
top: 1,
right: 1,
bottom: 1,
left: 1
}
},
borderColor: {
[e.DEFAULT]: "#E0E0E0",
[e.FOCUS]: "#1e293b"
},
boxShadow: {
[e.DEFAULT]: {
horizontal: 0,
vertical: 0,
blur: 0,
spread: 0,
color: "transparent",
position: "none"
},
[e.FOCUS]: {
horizontal: 0,
vertical: 0,
blur: 0,
spread: 0,
color: "transparent",
position: "none"
}
},
padding: {
[o.DESKTOP]: {
[e.DEFAULT]: {
unit: t.PX,
top: 8,
right: 8,
bottom: 8,
left: 8
},
[e.FOCUS]: {
unit: t.PX,
top: 8,
right: 8,
bottom: 8,
left: 8
}
}
}
}
}
}
};
export {
d as ThemeConfiguration
};
//# sourceMappingURL=theme.config.js.map