1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
extends _layout.pug
include _mixins.pug
block content
.docs-container.off-canvas.off-canvas-sidebar-show
.docs-navbar
a.off-canvas-toggle.btn.btn-link.btn-action(href='#sidebar')
i.icon.icon-menu
.btns
a.btn.btn-primary.float-right(href='https://github.com/picturepan2/spectre' target='_blank') GitHub
a.btn.mr-1.float-right(href='https://www.paypal.me/picturepan2' target='_blank') Sponsor
#sidebar.docs-sidebar.off-canvas-sidebar
.docs-brand
if slug != parent
a.docs-logo(href='../index.html')
img(src='../img/spectre-logo.svg' alt='Spectre.css CSS Framework')
h2 SPECTRE
else
a.docs-logo(href='index.html')
img(src='img/spectre-logo.svg' alt='Spectre.css CSS Framework')
h2 SPECTRE
.docs-nav
.accordion-container
+docs-accordion(
'getting-started',
'Getting started',
{url: 'installation', name: 'Installation'},
{url: 'custom', name: 'Custom version'},
{url: 'browsers', name: 'Browser support'},
{url: 'whatsnew', name: 'What\'s new'}
)
+docs-accordion(
'elements',
'Elements',
{url: 'typography', name: 'Typography'},
{url: 'tables', name: 'Tables'},
{url: 'buttons', name: 'Buttons'},
{url: 'forms', name: 'Forms'},
{url: 'icons', name: 'Icons'},
{url: 'labels', name: 'Labels'},
{url: 'code', name: 'Code'},
{url: 'media', name: 'Media'}
)
+docs-accordion(
'layout',
'Layout',
{url: 'grid', name: 'Flexbox grid'},
{url: 'responsive', name: 'Responsive'},
{url: 'navbar', name: 'Navbar'}
)
+docs-accordion(
'components',
'Components',
{url: 'accordions', name: 'Accordions'},
{url: 'avatars', name: 'Avatars'},
{url: 'badges', name: 'Badges'},
{url: 'bars', name: 'Bars'},
{url: 'breadcrumbs', name: 'Breadcrumbs'},
{url: 'cards', name: 'Cards'},
{url: 'chips', name: 'Chips'},
{url: 'empty', name: 'Empty states'},
{url: 'menu', name: 'Menu'},
{url: 'modals', name: 'Modals'},
{url: 'nav', name: 'Nav'},
{url: 'pagination', name: 'Pagination'},
{url: 'panels', name: 'Panels'},
{url: 'popovers', name: 'Popovers'},
{url: 'steps', name: 'Steps'},
{url: 'tabs', name: 'Tabs'},
{url: 'tiles', name: 'Tiles'},
{url: 'toasts', name: 'Toasts'},
{url: 'tooltips', name: 'Tooltips'}
)
+docs-accordion(
'utilities',
'Utilities',
{url: 'colors', name: 'Colors'},
{url: 'cursors', name: 'Cursors'},
{url: 'display', name: 'Display'},
{url: 'divider', name: 'Divider'},
{url: 'loading', name: 'Loading'},
{url: 'position', name: 'Position'},
{url: 'shapes', name: 'Shapes'},
{url: 'text', name: 'Text'}
)
+docs-accordion(
'experimentals',
'Experimentals',
{url: 'autocomplete', name: 'Autocomplete'},
{url: 'calendars', name: 'Calendars'},
{url: 'carousels', name: 'Carousels'},
{url: 'comparison', name: 'Comparison sliders'},
{url: 'filters', name: 'Filters'},
{url: 'meters', name: 'Meters'},
{url: 'off-canvas', name: 'Off-canvas'},
{url: 'parallax', name: 'Parallax'},
{url: 'progress', name: 'Progress'},
{url: 'sliders', name: 'Sliders'},
{url: 'timelines', name: 'Timelines'}
)
a.off-canvas-overlay(href='#close')
.off-canvas-content
#content.docs-content
block docs-content
|