Skip to content

Commit f49addf

Browse files
authored
Merge pull request #405 from matthewlarkin/markup-semantics
adds semantic classes, ids, and tags
2 parents f4c17af + b2aff24 commit f49addf

File tree

1 file changed

+65
-62
lines changed

1 file changed

+65
-62
lines changed

sqlpage/templates/shell.handlebars

Lines changed: 65 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!DOCTYPE html>
2-
<html lang="{{language}}" style="font-size: {{default font_size 18}}px">
2+
<html lang="{{language}}" style="font-size: {{default font_size 18}}px" {{#if class}}class="{{class}}"{{/if}}>
33
<head>
44
<meta charset="utf-8"/>
55
<title>{{default title "SQLPage"}}</title>
@@ -50,75 +50,78 @@
5050
</head>
5151

5252
<body class="layout-{{default layout 'boxed'}}" {{#if theme}}data-bs-theme="{{theme}}"{{/if}}>
53-
<div class="page">
53+
<div class="page" id="sqlpage_page_wrapper">
5454
{{#if title}}
55+
<header id="sqlpage_header">
5556
<nav class="navbar navbar-expand-md navbar-light">
56-
<div class="container-fluid">
57-
<a class="navbar-brand flex-grow-1 overflow-hidden" href="{{#if link}}{{link}}{{else}}/{{/if}}">
58-
{{#if image}}
59-
<img src="{{image}}" alt="{{title}}" width="32" height="32"
60-
class="navbar-brand-image">
61-
{{/if}}
62-
{{#if icon}}
63-
{{~icon_img icon~}}
64-
{{/if}}
65-
<h1 class="mb-0 w-0 fs-2">{{title}}</h1>
66-
</a>
67-
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
68-
data-bs-target="#navbar-menu" aria-controls="navbar-menu" aria-expanded="false"
69-
aria-label="Toggle navigation">
70-
<span class="navbar-toggler-icon"></span>
71-
</button>
72-
<div class="collapse navbar-collapse" id="navbar-menu">
73-
<ul class="navbar-nav ms-auto">
74-
{{#each (to_array menu_item)}}
75-
{{#if (eq (typeof this) 'object')}}
76-
<li class="nav-item{{#if this.submenu}} dropdown{{/if}}">
77-
<a class="nav-link {{#if this.submenu}}dropdown-toggle{{/if}}" href="{{#if this.link}}{{this.link}}{{else}}#{{/if}}"
78-
{{#if this.submenu}}data-bs-toggle="dropdown" data-bs-auto-close="outside"{{/if}}
79-
role="button"
80-
>
81-
{{this.title}}
82-
</a>
83-
{{#if this.submenu}}
84-
<div class="dropdown-menu dropdown-menu-end" data-bs-popper="static">
85-
{{#each this.submenu}}
86-
<a class="dropdown-item" href="{{this.link}}">
87-
{{this.title}}
88-
</a>
89-
{{/each}}
90-
</div>
91-
{{/if}}
92-
</li>
93-
{{else}}
94-
<li class="nav-item">
95-
<a class="nav-link text-capitalize" href="{{this}}.sql">{{this}}</a>
96-
</li>
57+
<div class="container-fluid">
58+
<a class="navbar-brand flex-grow-1 overflow-hidden" href="{{#if link}}{{link}}{{else}}/{{/if}}">
59+
{{#if image}}
60+
<img src="{{image}}" alt="{{title}}" width="32" height="32"
61+
class="navbar-brand-image">
62+
{{/if}}
63+
{{#if icon}}
64+
{{~icon_img icon~}}
65+
{{/if}}
66+
<h1 class="mb-0 w-0 fs-2">{{title}}</h1>
67+
</a>
68+
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
69+
data-bs-target="#navbar-menu" aria-controls="navbar-menu" aria-expanded="false"
70+
aria-label="Toggle navigation">
71+
<span class="navbar-toggler-icon"></span>
72+
</button>
73+
<div class="collapse navbar-collapse" id="navbar-menu">
74+
<ul class="navbar-nav ms-auto">
75+
{{#each (to_array menu_item)}}
76+
{{#if (eq (typeof this) 'object')}}
77+
<li class="nav-item{{#if this.submenu}} dropdown{{/if}}">
78+
<a class="nav-link {{#if this.submenu}}dropdown-toggle{{/if}}" href="{{#if this.link}}{{this.link}}{{else}}#{{/if}}"
79+
{{#if this.submenu}}data-bs-toggle="dropdown" data-bs-auto-close="outside"{{/if}}
80+
role="button"
81+
>
82+
{{this.title}}
83+
</a>
84+
{{#if this.submenu}}
85+
<div class="dropdown-menu dropdown-menu-end" data-bs-popper="static">
86+
{{#each this.submenu}}
87+
<a class="dropdown-item" href="{{this.link}}">
88+
{{this.title}}
89+
</a>
90+
{{/each}}
91+
</div>
9792
{{/if}}
98-
{{/each}}
99-
</ul>
100-
{{#if search_target}}
101-
<form class="d-flex" role="search" action="{{search_target}}">
102-
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search"
103-
name="search" value="{{search_value}}">
104-
<button class="btn btn-outline-success" type="submit">Search</button>
105-
</form>
106-
{{/if}}
107-
</div>
93+
</li>
94+
{{else}}
95+
<li class="nav-item">
96+
<a class="nav-link text-capitalize" href="{{this}}.sql">{{this}}</a>
97+
</li>
98+
{{/if}}
99+
{{/each}}
100+
</ul>
101+
{{#if search_target}}
102+
<form class="d-flex" role="search" action="{{search_target}}">
103+
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search" name="search" value="{{search_value}}">
104+
<button class="btn btn-outline-success" type="submit">Search</button>
105+
</form>
106+
{{/if}}
108107
</div>
108+
</div>
109109
</nav>
110+
</header>
110111
{{/if}}
111-
<main class="page-wrapper container-xl pt-3 px-md-5 px-sm-3">
112+
<main class="page-wrapper container-xl pt-3 px-md-5 px-sm-3" id="sqlpage_main_wrapper">
112113
{{~#each_row~}}{{~/each_row~}}
113114
</main>
114115
</div>
115-
<div class="w-100 text-center fs-6 my-2 text-secondary">
116-
{{#if footer}}
117-
{{{markdown footer}}}
118-
{{else}}
119-
<!-- You can change this footer using the 'footer' parameter of the 'shell' component -->
120-
Built with <a class="text-reset" href="https://sql.ophir.dev" title="SQLPage v{{buildinfo 'CARGO_PKG_VERSION'}}">SQLPage</a>
121-
{{/if}}
122-
</div>
116+
<footer class="w-100 text-center fs-6 my-2 text-secondary" id="sqlpage_footer">
117+
<div class="sqlpage_footer_content">
118+
{{#if footer}}
119+
{{{markdown footer}}}
120+
{{else}}
121+
<!-- You can change this footer using the 'footer' parameter of the 'shell' component -->
122+
Built with <a class="text-reset" href="https://sql.ophir.dev" title="SQLPage v{{buildinfo 'CARGO_PKG_VERSION'}}">SQLPage</a>
123+
{{/if}}
124+
</div>
125+
</footer>
123126
</body>
124127
</html>

0 commit comments

Comments
 (0)