forked from xriley/devdesk-theme
-
Notifications
You must be signed in to change notification settings - Fork 0
/
help-category-alt.html
200 lines (167 loc) · 13.1 KB
/
help-category-alt.html
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
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
<!DOCTYPE html>
<html lang="en">
<head>
<title>DevDesk - Bootstrap Knowledge Base & Help Centre Template For Tech Products</title>
<!-- Meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Bootstrap Knowledge Base and Help Centre Template">
<meta name="author" content="Xiaoying Riley at 3rd Wave Media">
<link rel="shortcut icon" href="favicon.ico">
<!-- Google Font -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500&display=swap" rel="stylesheet">
<!-- Bootstrap Icons -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
<!-- FontAwesome JS-->
<script defer src="assets/fontawesome/js/all.min.js"></script>
<!-- Theme CSS -->
<link id="theme-style" rel="stylesheet" href="assets/css/devdesk.css">
</head>
<body>
<div class="page-header-wrapper">
<div class="page-header-bg-pattern-holder">
<div class="bg-pattern-top"></div>
<div class="bg-pattern-bottom"></div>
</div><!--//page-header-bg-pattern-holder-->
<header class="header">
<div class="container">
<nav class="navbar navbar-expand-lg" >
<div class="site-logo me-3">
<a class="navbar-brand" href="index.html">
<img class="logo-icon" src="assets/images/site-logo.svg" alt="logo">
</a>
</div><!--//site-logo-->
<button class="navbar-toggler collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#navigation" aria-controls="navigation" aria-expanded="false" aria-label="Toggle navigation">
<span> </span>
<span> </span>
<span> </span>
</button>
<div class="collapse navbar-collapse ms-auto" id="navigation">
<ul class="navbar-nav ms-auto align-items-lg-center">
<li class="nav-item me-lg-4">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item dropdown me-lg-4">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Categories</a>
<ul class="dropdown-menu dropdown-menu-lg-end rounded shadow">
<li><a class="dropdown-item" href="help-category.html">Get Started</a></li>
<li><a class="dropdown-item" href="help-category-alt.html">Product Guide</a></li>
<li><a class="dropdown-item" href="help-category-alt.html">Integrations</a></li>
<li><a class="dropdown-item" href="help-category-alt.html">Collaboration</a></li>
<li><a class="dropdown-item" href="help-category-alt.html">Billing & Subscription</a></li>
<li><a class="dropdown-item" href="help-category-alt.html">Developers & APIs</a></li>
<li><a class="dropdown-item" href="help-category-alt.html">Support & Troubleshooting</a></li>
<li><a class="dropdown-item" href="help-category-alt.html">Best Practices</a></li>
<li><a class="dropdown-item" href="help-category-alt.html">Resources</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-btn btn btn-primary text-white" href="https://themes.3rdwavemedia.com/bootstrap-templates/product/devdesk-free-bootstrap-5-knowledge-base-help-centre-template-for-tech-products/">Free Trial</a>
</li>
</ul><!--//navbar-nav-->
</div>
</nav>
</div><!--//container-->
</header><!--//header-->
<div class="page-heading-holder">
<div class="container text-center">
<div class="page-heading-sub single-col-max mx-auto">
<div class="help-search-main d-block mx-auto">
<form class="search-form w-100">
<input type="text" placeholder="Search the knowledge base..." name="search" class="form-control search-input">
<button type="submit" class="btn search-btn" value="Search">
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="search" transform="translate(-1.000000, 0.000000)" fill="#FFFFFF" fill-rule="nonzero">
<path d="M11.7297644,1.56712981 C9.1503137,-0.644294379 5.30290309,-0.496046815 2.90126795,1.90730746 C0.499632815,4.31066174 0.354138355,8.15817744 2.56740774,10.7360451 C4.78067712,13.3139128 8.60590394,13.7523024 11.345,11.742 L11.344,11.742 C11.3733333,11.782 11.406,11.8203333 11.442,11.857 L15.292,15.707 C15.6824653,16.0977414 16.3157585,16.0979653 16.7065,15.7075 C17.0972414,15.3170347 17.0974653,14.6837415 16.707,14.293 L12.857,10.443 C12.8212661,10.40679 12.7828212,10.3733596 12.742,10.343 C14.7503419,7.60346614 14.3092152,3.778554 11.7297644,1.56712981 Z M9.75000002,10.3971144 C8.35769516,11.200962 6.64230484,11.200962 5.24999998,10.3971144 C3.85769513,9.5932668 2.99999998,8.10769519 3,6.50000001 C3.00000004,4.01471867 5.01471865,2.00000008 7.5,2.00000008 C9.98528135,2.00000008 12,4.01471867 12,6.50000001 C12,8.10769519 11.1423049,9.5932668 9.75000002,10.3971144 Z" id="Shape"></path>
</g>
</g>
</svg>
</button>
</form>
</div><!--//help-search-main-->
</div>
</div>
</div><!--//page-heading-holder-->
</div><!--//page-header-wrapper-->
<div class="help-breadcrumb-container pt-4">
<div class="container">
<nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Help Article Category</li>
</ol>
</nav>
</div><!--//container-->
</div><!--//help-breadcrumb-container-->
<div class="help-content-wrapper theme-section pt-4">
<div class="container">
<div class="row g-x-5">
<div class="col-lg-8 col-xl-9">
<section class="main-section order-lg-last mb-5">
<h2 class="main-section-heading mb-4">Help Article Category Example</h2>
<div class="intro mb-5">Category intro goes here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae elit vitae nulla feugiat auctor. Maecenas congue lacus at massa dignissim, eget sodales libero tincidunt. Vestibulum vulputate nulla a dui elementum sollicitudin. Integer dapibus malesuada ultricies. </div>
<ul class="article-list list-unstyled">
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title lorem Ipsum</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title maecenas congue lacus at massa dignissim</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title fusce tristique nunc vel mauris ornare sollicitudin</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title aliquam vel porttitor sem</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title commodo dui pharetra</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title imperdiet mollis ante</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title sollicitudin ac maximus</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title lorem Ipsum</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title maecenas congue lacus at massa dignissim</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title fusce tristique nunc vel mauris ornare sollicitudin</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title aliquam vel porttitor sem</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title commodo dui pharetra</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title imperdiet mollis ante</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title sollicitudin ac maximus</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title lorem Ipsum</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title maecenas congue lacus at massa dignissim</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title fusce tristique nunc vel mauris ornare sollicitudin</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title aliquam vel porttitor sem</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title commodo dui pharetra</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title imperdiet mollis ante</a></li>
<li class="list-item"><div class="help-article-icon-holder flex-shrink-0"></div><a href="help-article.html">Help article title sollicitudin ac maximus</a></li>
</ul><!--//article-list-->
</section><!--//main-section-->
</div><!--//col-->
<div class="col-lg-4 col-xl-3 order-lg-first">
<div class="side-bar">
<h3 class="side-bar-heading mb-4">Categories</h3>
<nav class="side-bar-nav">
<ul class="sidebar-nav-items list-unstyled flex-column">
<li class="nav-item"><a href="help-category.html">Getting Started</a></li>
<li class="nav-item"><a href="help-category-alt.html">Product Guide</a></li>
<li class="nav-item"><a href="help-category-alt.html">Integrations</a></li>
<li class="nav-item"><a href="help-category-alt.html">Collaboration</a></li>
<li class="nav-item"><a href="help-category-alt.html">Billing & Subscription</a></li>
<li class="nav-item"><a href="help-category-alt.html">Developers & APIs</a></li>
<li class="nav-item"><a href="help-category-alt.html">Support & Troubleshooting</a></li>
<li class="nav-item"><a href="help-category-alt.html">Best Practices</a></li>
<li class="nav-item"><a href="help-category-alt.html">Resources</a></li>
<li class="nav-item"><a class="active" href="help-category-alt.html">Another Category</a></li>
</ul><!--//sidebar-nav-items-->
</nav><!--//side-bar-nav-->
</div><!--//side-bar-->
</div><!--//col-->
</div><!--//row-->
</div><!--//container-->
</div><!--//help-category-section-->
<footer class="footer py-3">
<div class="container text-center">
<!--/* This template is free as long as you keep the footer attribution link. If you'd like to use the template without the attribution link, you can buy the commercial license via our website: themes.3rdwavemedia.com Thank you for your support. :) */-->
<small class="copyright">Designed with <span class="sr-only">love</span><i class="bi bi-heart-fill" style="color:#DE5547"></i> by <a class="theme-link" href="http://themes.3rdwavemedia.com" target="_blank">Xiaoying Riley</a> for developers</small>
</div><!--//container-->
</footer><!--//footer-->
<!-- Javascript -->
<script src="assets/plugins/popper.min.js"></script>
<script src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>
<!-- Page Specific JS -->
<script src="assets/plugins/stickyfill/dist/stickyfill.min.js"></script>
<script src="assets/js/sticky-custom.js"></script>
</body>
</html>