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:
Leifer Mendez
@@ -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} />
|
||||
))}
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -7,10 +7,10 @@
|
||||
* - https://qwik.builder.io/qwikcity/adaptors/cloudflare-pages/
|
||||
*
|
||||
*/
|
||||
import { createQwikCity } from '@builder.io/qwik-city/middleware/cloudflare-pages';
|
||||
import qwikCityPlan from '@qwik-city-plan';
|
||||
import render from './entry.ssr';
|
||||
import { createQwikCity } from '@builder.io/qwik-city/middleware/cloudflare-pages'
|
||||
import qwikCityPlan from '@qwik-city-plan'
|
||||
import render from './entry.ssr'
|
||||
|
||||
const onRequest = createQwikCity({ render, qwikCityPlan });
|
||||
const onRequest = createQwikCity({ render, qwikCityPlan })
|
||||
|
||||
export { onRequest };
|
||||
export { onRequest }
|
||||
|
||||
@@ -9,9 +9,9 @@
|
||||
* - More code is transferred to the browser than in SSR mode.
|
||||
* - Optimizer/Serialization/Deserialization code is not exercised!
|
||||
*/
|
||||
import { render, RenderOptions } from '@builder.io/qwik';
|
||||
import Root from './root';
|
||||
import { render, RenderOptions } from '@builder.io/qwik'
|
||||
import Root from './root'
|
||||
|
||||
export default function (opts: RenderOptions) {
|
||||
return render(document, <Root />, opts);
|
||||
return render(document, <Root />, opts)
|
||||
}
|
||||
|
||||
@@ -10,11 +10,11 @@
|
||||
* - https://vitejs.dev/config/preview-options.html#preview-options
|
||||
*
|
||||
*/
|
||||
import { createQwikCity } from '@builder.io/qwik-city/middleware/node';
|
||||
import render from './entry.ssr';
|
||||
import qwikCityPlan from '@qwik-city-plan';
|
||||
import { createQwikCity } from '@builder.io/qwik-city/middleware/node'
|
||||
import render from './entry.ssr'
|
||||
import qwikCityPlan from '@qwik-city-plan'
|
||||
|
||||
/**
|
||||
* The default export is the QwikCity adaptor used by Vite preview.
|
||||
*/
|
||||
export default createQwikCity({ render, qwikCityPlan });
|
||||
export default createQwikCity({ render, qwikCityPlan })
|
||||
|
||||
@@ -10,18 +10,18 @@
|
||||
* - npm run build
|
||||
*
|
||||
*/
|
||||
import { renderToStream, RenderToStreamOptions } from '@builder.io/qwik/server';
|
||||
import { manifest } from '@qwik-client-manifest';
|
||||
import Root from './root';
|
||||
import { renderToStream, RenderToStreamOptions } from '@builder.io/qwik/server'
|
||||
import { manifest } from '@qwik-client-manifest'
|
||||
import Root from './root'
|
||||
|
||||
export default function (opts: RenderToStreamOptions) {
|
||||
return renderToStream(<Root />, {
|
||||
manifest,
|
||||
...opts,
|
||||
// Use container attributes to set attributes on the html tag.
|
||||
containerAttributes: {
|
||||
lang: 'en-us',
|
||||
...opts.containerAttributes,
|
||||
},
|
||||
});
|
||||
return renderToStream(<Root />, {
|
||||
manifest,
|
||||
...opts,
|
||||
// Use container attributes to set attributes on the html tag.
|
||||
containerAttributes: {
|
||||
lang: 'en-us',
|
||||
...opts.containerAttributes,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
@@ -1,66 +1,67 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:root {
|
||||
--user-font-scale: 1rem - 16px;
|
||||
--max-width: calc(100% - 1rem);
|
||||
--user-font-scale: 1rem - 16px;
|
||||
--max-width: calc(100% - 1rem);
|
||||
|
||||
--font-body: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
|
||||
Apple Color Emoji, Segoe UI Emoji;
|
||||
--font-mono: 'IBM Plex Mono', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console',
|
||||
'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono',
|
||||
'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace;
|
||||
--font-body: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI,
|
||||
Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
|
||||
--font-mono: 'IBM Plex Mono', Consolas, 'Andale Mono WT', 'Andale Mono',
|
||||
'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono',
|
||||
'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco,
|
||||
'Courier New', Courier, monospace;
|
||||
|
||||
color-scheme: light;
|
||||
--theme-accent: #006ce9;
|
||||
--theme-text: #181818;
|
||||
color-scheme: light;
|
||||
--theme-accent: #006ce9;
|
||||
--theme-text: #181818;
|
||||
}
|
||||
|
||||
@media (min-width: 50em) {
|
||||
:root {
|
||||
--max-width: 46em;
|
||||
}
|
||||
:root {
|
||||
--max-width: 46em;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
font-family: var(--font-body);
|
||||
font-size: 1rem;
|
||||
font-size: clamp(0.9rem, 0.75rem + 0.375vw + var(--user-font-scale), 1rem);
|
||||
line-height: 1.5;
|
||||
max-width: 100vw;
|
||||
background: var(--theme-bg);
|
||||
color: var(--theme-text);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
font-family: var(--font-body);
|
||||
font-size: 1rem;
|
||||
font-size: clamp(0.9rem, 0.75rem + 0.375vw + var(--user-font-scale), 1rem);
|
||||
line-height: 1.5;
|
||||
max-width: 100vw;
|
||||
background: var(--theme-bg);
|
||||
color: var(--theme-text);
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 10px 20px;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
padding: 10px 20px;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--theme-accent);
|
||||
color: var(--theme-accent);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp,
|
||||
pre {
|
||||
font-family: var(--font-mono);
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
code {
|
||||
background-color: rgb(224, 224, 224);
|
||||
padding: 2px 4px;
|
||||
border-radius: 3px;
|
||||
font-size: 0.9em;
|
||||
border-bottom: 2px solid #bfbfbf;
|
||||
}
|
||||
background-color: rgb(224, 224, 224);
|
||||
padding: 2px 4px;
|
||||
border-radius: 3px;
|
||||
font-size: 0.9em;
|
||||
border-bottom: 2px solid #bfbfbf;
|
||||
}
|
||||
|
||||
@@ -1,26 +1,30 @@
|
||||
import { component$ } from '@builder.io/qwik';
|
||||
import { QwikCityProvider, RouterOutlet, ServiceWorkerRegister } from '@builder.io/qwik-city';
|
||||
import { RouterHead } from './components/router-head/router-head';
|
||||
import { component$ } from '@builder.io/qwik'
|
||||
import {
|
||||
QwikCityProvider,
|
||||
RouterOutlet,
|
||||
ServiceWorkerRegister,
|
||||
} from '@builder.io/qwik-city'
|
||||
import { RouterHead } from './components/router-head/router-head'
|
||||
|
||||
import './global.css';
|
||||
import './global.css'
|
||||
|
||||
export default component$(() => {
|
||||
/*
|
||||
* The root of a QwikCity site always start with the <QwikCityProvider> component,
|
||||
* immediately followed by the document's <head> and <body>.
|
||||
*
|
||||
* Dont remove the `<head>` and `<body>` elements.
|
||||
*/
|
||||
return (
|
||||
<QwikCityProvider>
|
||||
<head>
|
||||
<meta charSet="utf-8" />
|
||||
<RouterHead />
|
||||
</head>
|
||||
<body lang="en">
|
||||
<RouterOutlet />
|
||||
<ServiceWorkerRegister />
|
||||
</body>
|
||||
</QwikCityProvider>
|
||||
);
|
||||
});
|
||||
/*
|
||||
* The root of a QwikCity site always start with the <QwikCityProvider> component,
|
||||
* immediately followed by the document's <head> and <body>.
|
||||
*
|
||||
* Dont remove the `<head>` and `<body>` elements.
|
||||
*/
|
||||
return (
|
||||
<QwikCityProvider>
|
||||
<head>
|
||||
<meta charSet="utf-8" />
|
||||
<RouterHead />
|
||||
</head>
|
||||
<body lang="en">
|
||||
<RouterOutlet />
|
||||
<ServiceWorkerRegister />
|
||||
</body>
|
||||
</QwikCityProvider>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -1,22 +1,22 @@
|
||||
.docs {
|
||||
display: grid;
|
||||
grid-template-columns: 210px auto 190px;
|
||||
grid-template-areas: 'menu article on-this-page';
|
||||
gap: 40px;
|
||||
display: grid;
|
||||
grid-template-columns: 210px auto 190px;
|
||||
grid-template-areas: 'menu article on-this-page';
|
||||
gap: 40px;
|
||||
}
|
||||
|
||||
.docs h1 {
|
||||
margin-top: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.docs .menu {
|
||||
grid-area: menu;
|
||||
grid-area: menu;
|
||||
}
|
||||
|
||||
.docs article {
|
||||
grid-area: article;
|
||||
grid-area: article;
|
||||
}
|
||||
|
||||
.docs .on-this-page {
|
||||
grid-area: on-this-page;
|
||||
grid-area: on-this-page;
|
||||
}
|
||||
|
||||
@@ -1,25 +1,25 @@
|
||||
import { component$, Slot, useStyles$ } from '@builder.io/qwik';
|
||||
import type { DocumentHead } from '@builder.io/qwik-city';
|
||||
import Menu from '~/components/menu/menu';
|
||||
import OnThisPage from '~/components/on-this-page/on-this-page';
|
||||
import styles from './docs.css?inline';
|
||||
import { component$, Slot, useStyles$ } from '@builder.io/qwik'
|
||||
import type { DocumentHead } from '@builder.io/qwik-city'
|
||||
import Menu from '~/components/menu/menu'
|
||||
import OnThisPage from '~/components/on-this-page/on-this-page'
|
||||
import styles from './docs.css?inline'
|
||||
|
||||
export default component$(() => {
|
||||
useStyles$(styles);
|
||||
useStyles$(styles)
|
||||
|
||||
return (
|
||||
<div class="docs">
|
||||
<Menu />
|
||||
<article>
|
||||
<Slot />
|
||||
</article>
|
||||
<OnThisPage />
|
||||
</div>
|
||||
);
|
||||
});
|
||||
return (
|
||||
<div class="docs">
|
||||
<Menu />
|
||||
<article>
|
||||
<Slot />
|
||||
</article>
|
||||
<OnThisPage />
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
export const head: DocumentHead = ({ head }) => {
|
||||
return {
|
||||
title: `${head.title} - Documentation`,
|
||||
};
|
||||
};
|
||||
return {
|
||||
title: `${head.title} - Documentation`,
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,15 +1,15 @@
|
||||
import { component$, Slot } from '@builder.io/qwik';
|
||||
import Footer from '~/components/footer/footer';
|
||||
import Header from '~/components/header/header';
|
||||
import { component$, Slot } from '@builder.io/qwik'
|
||||
import Footer from '~/components/footer/footer'
|
||||
import Header from '~/components/header/header'
|
||||
|
||||
export default component$(() => {
|
||||
return (
|
||||
<>
|
||||
<Header />
|
||||
<main>
|
||||
<Slot />
|
||||
</main>
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
});
|
||||
return (
|
||||
<>
|
||||
<Header />
|
||||
<main>
|
||||
<Slot />
|
||||
</main>
|
||||
<Footer />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -7,12 +7,12 @@
|
||||
* Qwik uses a service worker to speed up your site and reduce latency, ie, not used in the traditional way of offline.
|
||||
* You can also use this file to add more functionality that runs in the service worker.
|
||||
*/
|
||||
import { setupServiceWorker } from '@builder.io/qwik-city/service-worker';
|
||||
import { setupServiceWorker } from '@builder.io/qwik-city/service-worker'
|
||||
|
||||
setupServiceWorker();
|
||||
setupServiceWorker()
|
||||
|
||||
addEventListener('install', () => self.skipWaiting());
|
||||
addEventListener('install', () => self.skipWaiting())
|
||||
|
||||
addEventListener('activate', () => self.clients.claim());
|
||||
addEventListener('activate', () => self.clients.claim())
|
||||
|
||||
declare const self: ServiceWorkerGlobalScope;
|
||||
declare const self: ServiceWorkerGlobalScope
|
||||
|
||||
Reference in New Issue
Block a user