mirror of
https://github.com/cheveguerra/bot-whatsapp.git
synced 2026-04-18 11:39:15 +00:00
feat(ci): 🎨 relases script
This commit is contained in:
@@ -1,25 +1,25 @@
|
||||
nav.breadcrumbs {
|
||||
padding: 5px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding: 5px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
nav.breadcrumbs > span {
|
||||
display: inline-block;
|
||||
padding: 5px 0;
|
||||
font-size: 12px;
|
||||
display: inline-block;
|
||||
padding: 5px 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
nav.breadcrumbs > span a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
nav.breadcrumbs > span::after {
|
||||
content: '>';
|
||||
padding: 0 5px;
|
||||
opacity: 0.4;
|
||||
content: '>';
|
||||
padding: 0 5px;
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
nav.breadcrumbs > span:last-child::after {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -1,74 +1,77 @@
|
||||
import { component$, useStyles$ } from '@builder.io/qwik';
|
||||
import { useContent, useLocation, ContentMenu } from '@builder.io/qwik-city';
|
||||
import styles from './breadcrumbs.css?inline';
|
||||
import { component$, useStyles$ } from '@builder.io/qwik'
|
||||
import { useContent, useLocation, ContentMenu } from '@builder.io/qwik-city'
|
||||
import styles from './breadcrumbs.css?inline'
|
||||
|
||||
export const Breadcrumbs = component$(() => {
|
||||
useStyles$(styles);
|
||||
useStyles$(styles)
|
||||
|
||||
const { menu } = useContent();
|
||||
const loc = useLocation();
|
||||
const { menu } = useContent()
|
||||
const loc = useLocation()
|
||||
|
||||
const breadcrumbs = createBreadcrumbs(menu, loc.pathname);
|
||||
if (breadcrumbs.length === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<nav class="breadcrumbs">
|
||||
{breadcrumbs.map((b) => (
|
||||
<span>{b.href ? <a href={b.href}>{b.text}</a> : b.text}</span>
|
||||
))}
|
||||
</nav>
|
||||
);
|
||||
});
|
||||
|
||||
export function createBreadcrumbs(menu: ContentMenu | undefined, pathname: string) {
|
||||
if (menu?.items) {
|
||||
for (const indexA of menu.items) {
|
||||
const breadcrumbA: ContentBreadcrumb = {
|
||||
text: indexA.text,
|
||||
};
|
||||
if (typeof indexA.href === 'string') {
|
||||
breadcrumbA.href = indexA.href;
|
||||
}
|
||||
if (indexA.href === pathname) {
|
||||
return [breadcrumbA];
|
||||
}
|
||||
|
||||
if (indexA.items) {
|
||||
for (const indexB of indexA.items) {
|
||||
const breadcrumbB: ContentBreadcrumb = {
|
||||
text: indexB.text,
|
||||
};
|
||||
if (typeof indexB.href === 'string') {
|
||||
breadcrumbB.href = indexB.href;
|
||||
}
|
||||
if (indexB.href === pathname) {
|
||||
return [breadcrumbA, breadcrumbB];
|
||||
}
|
||||
|
||||
if (indexB.items) {
|
||||
for (const indexC of indexB.items) {
|
||||
const breadcrumbC: ContentBreadcrumb = {
|
||||
text: indexC.text,
|
||||
};
|
||||
if (typeof indexC.href === 'string') {
|
||||
breadcrumbC.href = indexC.href;
|
||||
}
|
||||
if (indexC.href === pathname) {
|
||||
return [breadcrumbA, breadcrumbB, breadcrumbC];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
const breadcrumbs = createBreadcrumbs(menu, loc.pathname)
|
||||
if (breadcrumbs.length === 0) {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
return [];
|
||||
return (
|
||||
<nav class="breadcrumbs">
|
||||
{breadcrumbs.map((b) => (
|
||||
<span>{b.href ? <a href={b.href}>{b.text}</a> : b.text}</span>
|
||||
))}
|
||||
</nav>
|
||||
)
|
||||
})
|
||||
|
||||
export function createBreadcrumbs(
|
||||
menu: ContentMenu | undefined,
|
||||
pathname: string
|
||||
) {
|
||||
if (menu?.items) {
|
||||
for (const indexA of menu.items) {
|
||||
const breadcrumbA: ContentBreadcrumb = {
|
||||
text: indexA.text,
|
||||
}
|
||||
if (typeof indexA.href === 'string') {
|
||||
breadcrumbA.href = indexA.href
|
||||
}
|
||||
if (indexA.href === pathname) {
|
||||
return [breadcrumbA]
|
||||
}
|
||||
|
||||
if (indexA.items) {
|
||||
for (const indexB of indexA.items) {
|
||||
const breadcrumbB: ContentBreadcrumb = {
|
||||
text: indexB.text,
|
||||
}
|
||||
if (typeof indexB.href === 'string') {
|
||||
breadcrumbB.href = indexB.href
|
||||
}
|
||||
if (indexB.href === pathname) {
|
||||
return [breadcrumbA, breadcrumbB]
|
||||
}
|
||||
|
||||
if (indexB.items) {
|
||||
for (const indexC of indexB.items) {
|
||||
const breadcrumbC: ContentBreadcrumb = {
|
||||
text: indexC.text,
|
||||
}
|
||||
if (typeof indexC.href === 'string') {
|
||||
breadcrumbC.href = indexC.href
|
||||
}
|
||||
if (indexC.href === pathname) {
|
||||
return [breadcrumbA, breadcrumbB, breadcrumbC]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return []
|
||||
}
|
||||
|
||||
interface ContentBreadcrumb {
|
||||
text: string;
|
||||
href?: string;
|
||||
text: string
|
||||
href?: string
|
||||
}
|
||||
|
||||
@@ -1,22 +1,22 @@
|
||||
footer {
|
||||
border-top: 0.5px solid #ddd;
|
||||
margin-top: 40px;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
border-top: 0.5px solid #ddd;
|
||||
margin-top: 40px;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
footer a {
|
||||
color: #9e9e9e;
|
||||
font-size: 12px;
|
||||
color: #9e9e9e;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
footer ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
footer li {
|
||||
display: inline-block;
|
||||
padding: 6px 12px;
|
||||
display: inline-block;
|
||||
padding: 6px 12px;
|
||||
}
|
||||
|
||||
@@ -1,36 +1,40 @@
|
||||
import { component$, useStyles$ } from '@builder.io/qwik';
|
||||
import styles from './footer.css?inline';
|
||||
import { component$, useStyles$ } from '@builder.io/qwik'
|
||||
import styles from './footer.css?inline'
|
||||
|
||||
export default component$(() => {
|
||||
useStyles$(styles);
|
||||
useStyles$(styles)
|
||||
|
||||
return (
|
||||
<footer>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/docs">Docs</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/about-us">About Us</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://qwik.builder.io/">Qwik</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://twitter.com/QwikDev">Twitter</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/BuilderIO/qwik">GitHub</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://qwik.builder.io/chat">Chat</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div>
|
||||
<a href="https://www.builder.io/" target="_blank" class="builder">
|
||||
Made with ♡ by Builder.io
|
||||
</a>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
});
|
||||
return (
|
||||
<footer>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/docs">Docs</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/about-us">About Us</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://qwik.builder.io/">Qwik</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://twitter.com/QwikDev">Twitter</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/BuilderIO/qwik">GitHub</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://qwik.builder.io/chat">Chat</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div>
|
||||
<a
|
||||
href="https://www.builder.io/"
|
||||
target="_blank"
|
||||
class="builder"
|
||||
>
|
||||
Made with ♡ by Builder.io
|
||||
</a>
|
||||
</div>
|
||||
</footer>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -1,34 +1,34 @@
|
||||
header {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 11;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(130px, auto) 1fr;
|
||||
gap: 30px;
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
background-color: white;
|
||||
overflow: hidden;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 11;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(130px, auto) 1fr;
|
||||
gap: 30px;
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
background-color: white;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
header a.logo {
|
||||
display: block;
|
||||
display: block;
|
||||
}
|
||||
|
||||
header a {
|
||||
text-decoration: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
header nav {
|
||||
text-align: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
header nav a {
|
||||
display: inline-block;
|
||||
padding: 5px 15px;
|
||||
display: inline-block;
|
||||
padding: 5px 15px;
|
||||
}
|
||||
|
||||
header nav a:hover {
|
||||
text-decoration: underline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@@ -1,26 +1,32 @@
|
||||
import { component$, useStyles$ } from '@builder.io/qwik';
|
||||
import { useLocation } from '@builder.io/qwik-city';
|
||||
import { QwikLogo } from '../icons/qwik';
|
||||
import styles from './header.css?inline';
|
||||
import { component$, useStyles$ } from '@builder.io/qwik'
|
||||
import { useLocation } from '@builder.io/qwik-city'
|
||||
import { QwikLogo } from '../icons/qwik'
|
||||
import styles from './header.css?inline'
|
||||
|
||||
export default component$(() => {
|
||||
useStyles$(styles);
|
||||
useStyles$(styles)
|
||||
|
||||
const { pathname } = useLocation();
|
||||
const { pathname } = useLocation()
|
||||
|
||||
return (
|
||||
<header>
|
||||
<a class="logo" href="/">
|
||||
<QwikLogo />
|
||||
</a>
|
||||
<nav>
|
||||
<a href="/docs" class={{ active: pathname.startsWith('/docs') }}>
|
||||
Docs
|
||||
</a>
|
||||
<a href="/about-us" class={{ active: pathname.startsWith('/about-us') }}>
|
||||
About Us
|
||||
</a>
|
||||
</nav>
|
||||
</header>
|
||||
);
|
||||
});
|
||||
return (
|
||||
<header>
|
||||
<a class="logo" href="/">
|
||||
<QwikLogo />
|
||||
</a>
|
||||
<nav>
|
||||
<a
|
||||
href="/docs"
|
||||
class={{ active: pathname.startsWith('/docs') }}
|
||||
>
|
||||
Docs
|
||||
</a>
|
||||
<a
|
||||
href="/about-us"
|
||||
class={{ active: pathname.startsWith('/about-us') }}
|
||||
>
|
||||
About Us
|
||||
</a>
|
||||
</nav>
|
||||
</header>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -1,20 +1,20 @@
|
||||
export const QwikLogo = () => (
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 167 53">
|
||||
<path
|
||||
fill="#000"
|
||||
d="M81.95 46.59h-6.4V35.4a12.25 12.25 0 0 1-7.06 2.17c-3.47 0-6.06-.94-7.67-2.92-1.6-1.96-2.42-5.45-2.42-10.43 0-5.1.95-8.62 2.87-10.67 1.96-2.08 5.1-3.09 9.43-3.09 4.1 0 7.82.57 11.25 1.67V46.6Zm-6.4-30.31a16.6 16.6 0 0 0-4.85-.66c-2.17 0-3.73.56-4.6 1.7-.85 1.17-1.32 3.38-1.32 6.65 0 3.08.41 5.14 1.26 6.26.86 1.1 2.33 1.67 4.5 1.67 2.84 0 5.01-1.17 5.01-2.62v-13Zm15.58-5.14c2.27 6.3 4.2 12.6 5.86 18.95 2.22-6.5 4.1-12.8 5.55-18.95h5.61a187.5 187.5 0 0 1 5.3 18.95c2.52-6.9 4.5-13.21 5.95-18.95h6.31a285.68 285.68 0 0 1-8.92 25.76h-7.53c-.86-4.6-2.22-10.14-4.04-16.75a151.51 151.51 0 0 1-4.89 16.75H92.8a287.88 287.88 0 0 0-8.17-25.76h6.5Zm41.7-3.58c-2.83 0-3.63-.7-3.63-3.59 0-2.57.82-3.18 3.63-3.18 2.83 0 3.63.6 3.63 3.18 0 2.89-.8 3.59-3.63 3.59Zm-3.18 3.58h6.4V36.9h-6.4V11.14Zm36.65 0c-4.54 6.46-7.72 10.39-9.49 11.8 1.46.95 5.36 5.95 10.2 13.98h-7.38c-6.02-9.13-8.89-13.07-10.3-13.67v13.67h-6.4V0h6.4v23.23c1.45-1.06 4.63-5.1 9.54-12.09h7.43Z"
|
||||
/>
|
||||
<path
|
||||
fill="#18B6F6"
|
||||
d="M40.97 52.54 32.1 43.7l-.14.02v-.1l-18.9-18.66 4.66-4.5-2.74-15.7L2 20.87a7.14 7.14 0 0 0-1.03 8.52l8.11 13.45a6.81 6.81 0 0 0 5.92 3.3l4.02-.05 21.96 6.46Z"
|
||||
/>
|
||||
<path
|
||||
fill="#AC7EF4"
|
||||
d="m45.82 20.54-1.78-3.3-.93-1.68-.37-.66-.04.04-4.9-8.47a6.85 6.85 0 0 0-5.99-3.43l-4.28.12-12.8.04a6.85 6.85 0 0 0-5.85 3.37L1.1 21.99 15 4.73l18.24 20.04L30 28.04l1.94 15.68.02-.04v.04h-.04l.04.04 1.51 1.47 7.36 7.19c.3.29.81-.06.6-.43l-4.54-8.93 7.91-14.63.26-.3a6.73 6.73 0 0 0 .76-7.6Z"
|
||||
/>
|
||||
<path
|
||||
fill="#fff"
|
||||
d="M33.3 24.69 15.02 4.75l2.6 15.62-4.66 4.51L31.91 43.7l-1.7-15.62 3.1-3.4Z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 167 53">
|
||||
<path
|
||||
fill="#000"
|
||||
d="M81.95 46.59h-6.4V35.4a12.25 12.25 0 0 1-7.06 2.17c-3.47 0-6.06-.94-7.67-2.92-1.6-1.96-2.42-5.45-2.42-10.43 0-5.1.95-8.62 2.87-10.67 1.96-2.08 5.1-3.09 9.43-3.09 4.1 0 7.82.57 11.25 1.67V46.6Zm-6.4-30.31a16.6 16.6 0 0 0-4.85-.66c-2.17 0-3.73.56-4.6 1.7-.85 1.17-1.32 3.38-1.32 6.65 0 3.08.41 5.14 1.26 6.26.86 1.1 2.33 1.67 4.5 1.67 2.84 0 5.01-1.17 5.01-2.62v-13Zm15.58-5.14c2.27 6.3 4.2 12.6 5.86 18.95 2.22-6.5 4.1-12.8 5.55-18.95h5.61a187.5 187.5 0 0 1 5.3 18.95c2.52-6.9 4.5-13.21 5.95-18.95h6.31a285.68 285.68 0 0 1-8.92 25.76h-7.53c-.86-4.6-2.22-10.14-4.04-16.75a151.51 151.51 0 0 1-4.89 16.75H92.8a287.88 287.88 0 0 0-8.17-25.76h6.5Zm41.7-3.58c-2.83 0-3.63-.7-3.63-3.59 0-2.57.82-3.18 3.63-3.18 2.83 0 3.63.6 3.63 3.18 0 2.89-.8 3.59-3.63 3.59Zm-3.18 3.58h6.4V36.9h-6.4V11.14Zm36.65 0c-4.54 6.46-7.72 10.39-9.49 11.8 1.46.95 5.36 5.95 10.2 13.98h-7.38c-6.02-9.13-8.89-13.07-10.3-13.67v13.67h-6.4V0h6.4v23.23c1.45-1.06 4.63-5.1 9.54-12.09h7.43Z"
|
||||
/>
|
||||
<path
|
||||
fill="#18B6F6"
|
||||
d="M40.97 52.54 32.1 43.7l-.14.02v-.1l-18.9-18.66 4.66-4.5-2.74-15.7L2 20.87a7.14 7.14 0 0 0-1.03 8.52l8.11 13.45a6.81 6.81 0 0 0 5.92 3.3l4.02-.05 21.96 6.46Z"
|
||||
/>
|
||||
<path
|
||||
fill="#AC7EF4"
|
||||
d="m45.82 20.54-1.78-3.3-.93-1.68-.37-.66-.04.04-4.9-8.47a6.85 6.85 0 0 0-5.99-3.43l-4.28.12-12.8.04a6.85 6.85 0 0 0-5.85 3.37L1.1 21.99 15 4.73l18.24 20.04L30 28.04l1.94 15.68.02-.04v.04h-.04l.04.04 1.51 1.47 7.36 7.19c.3.29.81-.06.6-.43l-4.54-8.93 7.91-14.63.26-.3a6.73 6.73 0 0 0 .76-7.6Z"
|
||||
/>
|
||||
<path
|
||||
fill="#fff"
|
||||
d="M33.3 24.69 15.02 4.75l2.6 15.62-4.66 4.51L31.91 43.7l-1.7-15.62 3.1-3.4Z"
|
||||
/>
|
||||
</svg>
|
||||
)
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
.menu {
|
||||
background: #eee;
|
||||
padding: 20px 10px;
|
||||
background: #eee;
|
||||
padding: 20px 10px;
|
||||
}
|
||||
|
||||
.menu h5 {
|
||||
margin: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.menu ul {
|
||||
padding-left: 20px;
|
||||
margin: 5px 0 25px 0;
|
||||
padding-left: 20px;
|
||||
margin: 5px 0 25px 0;
|
||||
}
|
||||
|
||||
@@ -1,36 +1,37 @@
|
||||
import { component$, useStyles$ } from '@builder.io/qwik';
|
||||
import { useContent, Link, useLocation } from '@builder.io/qwik-city';
|
||||
import styles from './menu.css?inline';
|
||||
import { component$, useStyles$ } from '@builder.io/qwik'
|
||||
import { useContent, Link, useLocation } from '@builder.io/qwik-city'
|
||||
import styles from './menu.css?inline'
|
||||
|
||||
export default component$(() => {
|
||||
useStyles$(styles);
|
||||
useStyles$(styles)
|
||||
|
||||
const { menu } = useContent();
|
||||
const loc = useLocation();
|
||||
const { menu } = useContent()
|
||||
const loc = useLocation()
|
||||
|
||||
return (
|
||||
<aside class="menu">
|
||||
{menu
|
||||
? menu.items?.map((item) => (
|
||||
<>
|
||||
<h5>{item.text}</h5>
|
||||
<ul>
|
||||
{item.items?.map((item) => (
|
||||
<li>
|
||||
<Link
|
||||
href={item.href}
|
||||
class={{
|
||||
'is-active': loc.pathname === item.href,
|
||||
}}
|
||||
>
|
||||
{item.text}
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</>
|
||||
))
|
||||
: null}
|
||||
</aside>
|
||||
);
|
||||
});
|
||||
return (
|
||||
<aside class="menu">
|
||||
{menu
|
||||
? menu.items?.map((item) => (
|
||||
<>
|
||||
<h5>{item.text}</h5>
|
||||
<ul>
|
||||
{item.items?.map((item) => (
|
||||
<li>
|
||||
<Link
|
||||
href={item.href}
|
||||
class={{
|
||||
'is-active':
|
||||
loc.pathname === item.href,
|
||||
}}
|
||||
>
|
||||
{item.text}
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</>
|
||||
))
|
||||
: null}
|
||||
</aside>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -1,33 +1,33 @@
|
||||
.on-this-page {
|
||||
padding-bottom: 20px;
|
||||
font-size: 0.9em;
|
||||
padding-bottom: 20px;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.on-this-page h6 {
|
||||
margin: 10px 0;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
margin: 10px 0;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.on-this-page ul {
|
||||
margin: 0;
|
||||
padding: 0 0 20px 0;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0 0 20px 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.on-this-page a {
|
||||
position: relative;
|
||||
display: block;
|
||||
border: 0 solid #ddd;
|
||||
border-left-width: 2px;
|
||||
padding: 4px 2px 4px 8px;
|
||||
text-decoration: none;
|
||||
position: relative;
|
||||
display: block;
|
||||
border: 0 solid #ddd;
|
||||
border-left-width: 2px;
|
||||
padding: 4px 2px 4px 8px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.on-this-page a.indent {
|
||||
padding-left: 30px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
.on-this-page a:hover {
|
||||
border-color: var(--theme-accent);
|
||||
border-color: var(--theme-accent);
|
||||
}
|
||||
|
||||
@@ -1,62 +1,63 @@
|
||||
import { useContent, useLocation } from '@builder.io/qwik-city';
|
||||
import { component$, useStyles$ } from '@builder.io/qwik';
|
||||
import styles from './on-this-page.css?inline';
|
||||
import { useContent, useLocation } from '@builder.io/qwik-city'
|
||||
import { component$, useStyles$ } from '@builder.io/qwik'
|
||||
import styles from './on-this-page.css?inline'
|
||||
|
||||
export default component$(() => {
|
||||
useStyles$(styles);
|
||||
useStyles$(styles)
|
||||
|
||||
const { headings } = useContent();
|
||||
const contentHeadings = headings?.filter((h) => h.level === 2 || h.level === 3) || [];
|
||||
const { headings } = useContent()
|
||||
const contentHeadings =
|
||||
headings?.filter((h) => h.level === 2 || h.level === 3) || []
|
||||
|
||||
const { pathname } = useLocation();
|
||||
const editUrl = `#update-your-edit-url-for-${pathname}`;
|
||||
const { pathname } = useLocation()
|
||||
const editUrl = `#update-your-edit-url-for-${pathname}`
|
||||
|
||||
return (
|
||||
<aside class="on-this-page">
|
||||
{contentHeadings.length > 0 ? (
|
||||
<>
|
||||
<h6>On This Page</h6>
|
||||
<ul>
|
||||
{contentHeadings.map((h) => (
|
||||
<li>
|
||||
<a
|
||||
href={`#${h.id}`}
|
||||
class={{
|
||||
block: true,
|
||||
indent: h.level > 2,
|
||||
}}
|
||||
>
|
||||
{h.text}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</>
|
||||
) : null}
|
||||
return (
|
||||
<aside class="on-this-page">
|
||||
{contentHeadings.length > 0 ? (
|
||||
<>
|
||||
<h6>On This Page</h6>
|
||||
<ul>
|
||||
{contentHeadings.map((h) => (
|
||||
<li>
|
||||
<a
|
||||
href={`#${h.id}`}
|
||||
class={{
|
||||
block: true,
|
||||
indent: h.level > 2,
|
||||
}}
|
||||
>
|
||||
{h.text}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</>
|
||||
) : null}
|
||||
|
||||
<h6>More</h6>
|
||||
<ul>
|
||||
<li>
|
||||
<a href={editUrl} target="_blank">
|
||||
Edit this page
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://qwik.builder.io/chat" target="_blank">
|
||||
Join our community
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/BuilderIO/qwik" target="_blank">
|
||||
GitHub
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://twitter.com/QwikDev" target="_blank">
|
||||
@QwikDev
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
);
|
||||
});
|
||||
<h6>More</h6>
|
||||
<ul>
|
||||
<li>
|
||||
<a href={editUrl} target="_blank">
|
||||
Edit this page
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://qwik.builder.io/chat" target="_blank">
|
||||
Join our community
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/BuilderIO/qwik" target="_blank">
|
||||
GitHub
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://twitter.com/QwikDev" target="_blank">
|
||||
@QwikDev
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -1,32 +1,35 @@
|
||||
import { component$ } from '@builder.io/qwik';
|
||||
import { useDocumentHead, useLocation } from '@builder.io/qwik-city';
|
||||
import { component$ } from '@builder.io/qwik'
|
||||
import { useDocumentHead, useLocation } from '@builder.io/qwik-city'
|
||||
|
||||
/**
|
||||
* The RouterHead component is placed inside of the document `<head>` element.
|
||||
*/
|
||||
export const RouterHead = component$(() => {
|
||||
const head = useDocumentHead();
|
||||
const loc = useLocation();
|
||||
const head = useDocumentHead()
|
||||
const loc = useLocation()
|
||||
|
||||
return (
|
||||
<>
|
||||
<title>{head.title}</title>
|
||||
return (
|
||||
<>
|
||||
<title>{head.title}</title>
|
||||
|
||||
<link rel="canonical" href={loc.href} />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<link rel="canonical" href={loc.href} />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
/>
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
|
||||
{head.meta.map((m) => (
|
||||
<meta {...m} />
|
||||
))}
|
||||
{head.meta.map((m) => (
|
||||
<meta {...m} />
|
||||
))}
|
||||
|
||||
{head.links.map((l) => (
|
||||
<link {...l} />
|
||||
))}
|
||||
{head.links.map((l) => (
|
||||
<link {...l} />
|
||||
))}
|
||||
|
||||
{head.styles.map((s) => (
|
||||
<style {...s.props} dangerouslySetInnerHTML={s.style} />
|
||||
))}
|
||||
</>
|
||||
);
|
||||
});
|
||||
{head.styles.map((s) => (
|
||||
<style {...s.props} dangerouslySetInnerHTML={s.style} />
|
||||
))}
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user