mirror of
https://github.com/zombieFox/nightTab.git
synced 2024-10-05 01:31:57 +02:00
showcase type
This commit is contained in:
parent
0207b40c01
commit
d51b6d93a7
@ -28,4 +28,18 @@
|
|||||||
.showcase-content {
|
.showcase-content {
|
||||||
grid-area: content;
|
grid-area: content;
|
||||||
max-width: 50em;
|
max-width: 50em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.showcase-type h1,
|
||||||
|
.showcase-type h2,
|
||||||
|
.showcase-type h3,
|
||||||
|
.showcase-type h4,
|
||||||
|
.showcase-type h5,
|
||||||
|
.showcase-type h6 {
|
||||||
|
margin-bottom: 0.5em;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.showcase-type {
|
||||||
|
flex-basis: 100%;
|
||||||
}
|
}
|
@ -291,6 +291,30 @@ showcase.area.assemble = () => {
|
|||||||
applyCSSVar('theme.radius');
|
applyCSSVar('theme.radius');
|
||||||
}
|
}
|
||||||
}),
|
}),
|
||||||
|
displayFont: new Control_textReset({
|
||||||
|
object: state.get.current(),
|
||||||
|
path: 'theme.font.display.name',
|
||||||
|
id: 'theme-font-display-name',
|
||||||
|
value: state.get.current().theme.font.display.name,
|
||||||
|
defaultValue: state.get.default().theme.font.display.name,
|
||||||
|
placeholder: 'Google font name',
|
||||||
|
labelText: 'Display font',
|
||||||
|
action: () => {
|
||||||
|
theme.font.display.delay();
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
uiFont: new Control_textReset({
|
||||||
|
object: state.get.current(),
|
||||||
|
path: 'theme.font.ui.name',
|
||||||
|
id: 'theme-font-ui-name',
|
||||||
|
value: state.get.current().theme.font.ui.name,
|
||||||
|
defaultValue: state.get.default().theme.font.ui.name,
|
||||||
|
placeholder: 'Google font name',
|
||||||
|
labelText: 'User interface font',
|
||||||
|
action: () => {
|
||||||
|
theme.font.ui.delay();
|
||||||
|
}
|
||||||
|
}),
|
||||||
};
|
};
|
||||||
|
|
||||||
showcase.control.input.radio = {
|
showcase.control.input.radio = {
|
||||||
@ -565,11 +589,45 @@ showcase.area.assemble = () => {
|
|||||||
showcase.control.side.accent.wrap(),
|
showcase.control.side.accent.wrap(),
|
||||||
showcase.control.side.shadow.wrap(),
|
showcase.control.side.shadow.wrap(),
|
||||||
showcase.control.side.radius.wrap(),
|
showcase.control.side.radius.wrap(),
|
||||||
|
showcase.control.side.displayFont.wrap(),
|
||||||
|
showcase.control.side.uiFont.wrap(),
|
||||||
])
|
])
|
||||||
);
|
);
|
||||||
|
|
||||||
showcase.element.showcase.appendChild(
|
showcase.element.showcase.appendChild(
|
||||||
node('div|class:showcase-content', [
|
node('div|class:showcase-content', [
|
||||||
|
form.wrap({
|
||||||
|
children: [
|
||||||
|
form.inline({
|
||||||
|
gap: 'large',
|
||||||
|
children: [
|
||||||
|
node('div|class:showcase-type', [
|
||||||
|
node('h1:Heading 1'),
|
||||||
|
node('h2:Heading 2'),
|
||||||
|
node('h3:Heading 3'),
|
||||||
|
node('h4:Heading 4'),
|
||||||
|
node('h5:Heading 5'),
|
||||||
|
node('h6:Heading 6'),
|
||||||
|
]),
|
||||||
|
node('div|class:showcase-type', [
|
||||||
|
node('p:Sed dolores doloremque id iure Quis est suscipit deleniti cum doloremque nihil.'),
|
||||||
|
node('ul', [
|
||||||
|
node('li:List item 1'),
|
||||||
|
node('li:List item 2'),
|
||||||
|
node('li:List item 3'),
|
||||||
|
]),
|
||||||
|
node('a:Lorem ipsum dolor sit amet|href:https://github.com/zombieFox/nightTab,target:_blank'),
|
||||||
|
]),
|
||||||
|
node('div|class:showcase-type', [
|
||||||
|
new Control_helperText({
|
||||||
|
text: ['Et iure voluptas non accusantium voluptatibus et necessitatibus.']
|
||||||
|
}).wrap()
|
||||||
|
]),
|
||||||
|
]
|
||||||
|
})
|
||||||
|
]
|
||||||
|
}),
|
||||||
|
node('hr'),
|
||||||
showcase.control.input.radio.a.inline(),
|
showcase.control.input.radio.a.inline(),
|
||||||
node('hr'),
|
node('hr'),
|
||||||
form.wrap({
|
form.wrap({
|
||||||
|
Loading…
Reference in New Issue
Block a user