Merge branch 'master' into master

oblador · Sep 14, 2023 · 7ef46c2 · 7ef46c2
2 parents cc7374c + 02c143c
commit 7ef46c2
Show file tree

Hide file tree

Showing 3 changed files with 155 additions and 63 deletions.
diff --git a/docs/configuration.md b/docs/configuration.md
@@ -38,7 +38,7 @@ Example `package.json`:
 }
 ```
 
-You may also use a file named `.lokirc`, `.lokirc.json` or `loki.config.js` (see the react example) if you don't want to pollute your `package.json`.
+You may also use a file named `.lokirc`, `.lokirc.json` or `loki.config.js` ([see the react example](https://github.com/oblador/loki/tree/master/examples/react)) if you don't want to pollute your `package.json`.
 
 ## `chromeSelector`
 

diff --git a/website/core/Footer.js b/website/core/Footer.js
@@ -13,70 +13,78 @@ function Footer(props) {
  const pageUrl = (doc) => baseUrl + (language ? `${language}/` : '') + doc;
 
  return (
- <footer className="nav-footer" id="footer">
- <section className="sitemap">
- <a href={baseUrl} className="nav-home">
- {config.footerIcon && (
- <img
- src={baseUrl + config.footerIcon}
- alt={config.title}
- width="52"
- height="52"
- />
- )}
- </a>
- <div>
- <h5>Docs</h5>
- <a href={docUrl('getting-started.html')}>Getting Started</a>
- <a href={docUrl('configuration.html')}>API Reference</a>
- <a href={docUrl('continuous-integration.html')}>Guides</a>
- </div>
- <div>
- <h5>Community</h5>
- <a href={pageUrl('users.html')}>User Showcase</a>
- </div>
- <div>
- <h5>More</h5>
- <a href="https://github.com/oblador/loki">GitHub</a>
- <a
- className="github-button"
- href={config.repoUrl}
- data-icon="octicon-star"
- data-count-href="/oblador/loki/stargazers"
- data-show-count="true"
- data-count-aria-label="# stargazers on GitHub"
- aria-label="Star this project on GitHub"
- >
- Star
- </a>
- {config.twitterUsername && (
- <div className="social">
- <a
- href={`https://twitter.com/${config.twitterUsername}`}
- className="twitter-follow-button"
- >
- Follow @{config.twitterUsername}
- </a>
- </div>
- )}
- {config.facebookAppId && (
- <div className="social">
- <div
- className="fb-like"
- data-href={config.url}
- data-colorscheme="dark"
- data-layout="standard"
- data-share="true"
- data-width="225"
- data-show-faces="false"
+ <>
+ <script
+ async
+ type="text/javascript"
+ src="//cdn.carbonads.com/carbon.js?serve=CEAIV2JN&placement=lokijsorg"
+ id="_carbonads_js"
+ ></script>
+ <footer className="nav-footer" id="footer">
+ <section className="sitemap">
+ <a href={baseUrl} className="nav-home">
+ {config.footerIcon && (
+ <img
+ src={baseUrl + config.footerIcon}
+ alt={config.title}
+ width="52"
+ height="52"
  />
- </div>
- )}
- </div>
- </section>
+ )}
+ </a>
+ <div>
+ <h5>Docs</h5>
+ <a href={docUrl('getting-started.html')}>Getting Started</a>
+ <a href={docUrl('configuration.html')}>API Reference</a>
+ <a href={docUrl('continuous-integration.html')}>Guides</a>
+ </div>
+ <div>
+ <h5>Community</h5>
+ <a href={pageUrl('users.html')}>User Showcase</a>
+ </div>
+ <div>
+ <h5>More</h5>
+ <a href="https://github.com/oblador/loki">GitHub</a>
+ <a
+ className="github-button"
+ href={config.repoUrl}
+ data-icon="octicon-star"
+ data-count-href="/oblador/loki/stargazers"
+ data-show-count="true"
+ data-count-aria-label="# stargazers on GitHub"
+ aria-label="Star this project on GitHub"
+ >
+ Star
+ </a>
+ {config.twitterUsername && (
+ <div className="social">
+ <a
+ href={`https://twitter.com/${config.twitterUsername}`}
+ className="twitter-follow-button"
+ >
+ Follow @{config.twitterUsername}
+ </a>
+ </div>
+ )}
+ {config.facebookAppId && (
+ <div className="social">
+ <div
+ className="fb-like"
+ data-href={config.url}
+ data-colorscheme="dark"
+ data-layout="standard"
+ data-share="true"
+ data-width="225"
+ data-show-faces="false"
+ />
+ </div>
+ )}
+ </div>
+ </section>
 
- <section className="copyright">{config.copyright}</section>
- </footer>
+ <section className="copyright">{config.copyright}</section>
+ </footer>
+ </>
  );
 }
 

diff --git a/website/static/css/custom.css b/website/static/css/custom.css
@@ -147,3 +147,87 @@ body
  display: none;
  }
 }
+
+#carbonads * {
+ margin: initial;
+ padding: initial;
+ line-height: initial;
+}
+
+#carbonads {
+ --carbon-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+ Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Helvetica, Arial,
+ sans-serif;
+ --carbon-font-size: 14px;
+ --carbon-padding: 1.5ch;
+ --carbon-max-char: 20ch;
+ --carbon-bg-primary: hsl(0, 0%, 98%);
+ --carbon-bg-secondary: hsl(0, 0%, 92%);
+ --carbon-text-color: hsl(0, 0%, 20%);
+ z-index: 10;
+ font-size: var(--carbon-font-size);
+ font-family: var(--carbon-font-family);
+}
+
+#carbonads > span {
+ display: flex;
+ flex-direction: column;
+ margin: 0 auto 2rem auto;
+ min-inline-size: 130px;
+ max-inline-size: calc(130px + var(--carbon-max-char) + 8ch);
+ padding: var(--carbon-padding);
+ gap: var(--carbon-padding);
+ background-color: var(--carbon-bg-primary);
+ box-shadow: 0 0 1px hsl(0deg 0% 0% / 0.085), 0 0 2px hsl(0deg 0% 0% / 0.085),
+ 0 0 4px hsl(0deg 0% 0% / 0.085), 0 0 8px hsl(0deg 0% 0% / 0.085);
+}
+
+#carbonads a {
+ color: var(--carbon-text-color);
+ text-decoration: none;
+}
+
+#carbonads a:hover {
+ color: var(--carbon-text-color);
+}
+
+#carbonads .carbon-wrap {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 1.5ex;
+}
+
+#carbonads .carbon-img {
+ flex: 0 0 130px;
+}
+
+#carbonads .carbon-img img {
+ display: block;
+}
+
+#carbonads .carbon-text {
+ flex-grow: 1;
+ flex-basis: var(--carbon-max-char);
+ line-height: 1.4;
+ text-align: left;
+}
+
+#carbonads .carbon-poweredby {
+ padding: 6px 8px;
+ background: var(--carbon-bg-secondary);
+ color: var(--carbon-text-color);
+ font-weight: 600;
+ font-size: 0.6em;
+ line-height: 1.4;
+ letter-spacing: 0.2ch;
+ text-align: center;
+ text-transform: uppercase;
+}
+
+@media (prefers-color-scheme: dark) {
+ #carbonads {
+ --carbon-bg-primary: hsl(0, 0%, 12%);
+ --carbon-bg-secondary: hsl(0, 0%, 15%);
+ --carbon-text-color: hsl(0, 0%, 90%);
+ }
+}