@brillout/docpress 0.7.6 → 0.7.8

package/Layout.css

@@ -22,10 +22,10 @@
 .landing-page .page-wrapper {
   --main-view-max-width: 1010px;
 }
-.page-wrapper {
+.page-layout:not(.noSideNavigation) .page-wrapper {
   max-width: calc(var(--main-view-max-width) + 80px);
 }
-.page-content {
+.page-layout:not(.noSideNavigation) .page-content {
   box-sizing: content-box;
   max-width: var(--main-view-max-width);
   padding: 20px var(--main-view-padding);

package/Layout.tsx

@@ -31,8 +31,8 @@ function Layout({ children }: { children: React.ReactNode }) {
             alignItems: 'center',
             justifyContent: noSideNavigation === 'no-logo' ? 'center' : 'space-between',
             textDecoration: 'none',
-            maxWidth: 1024,
-            margin: 'auto',
+            marginBottom: 'var(--block-margin)',
+            backgroundColor: 'var(--bg-color)',
             ...topNavigationStyle,
           }}
         >

package/components/Contributors.tsx

@@ -2,7 +2,7 @@ export { Contributors, Maintainer }
 
 import React from 'react'
 import { usePageContext } from '../renderer/usePageContext'
-import { Supporter, SupporterSection, SectionDescription, Individuals, SupporterImg } from './Supporters'
+import { Supporter, SupporterSection, Individuals, SupporterImg } from './Supporters'
 import { maintainers } from '../data/maintainersList'
 import { contributors } from 'vike-contributors' // sorted by number of contributions
 
@@ -11,9 +11,15 @@ function Contributors() {
   const { projectInfo } = pageContext.config
   return (
     <SupporterSection>
-      <SectionDescription>
+      <p
+        style={{
+          maxWidth: 400,
+          display: 'inline-block',
+          fontSize: '1.2em',
+        }}
+      >
         {projectInfo.projectName} is built and maintained by passionate contributors.
-      </SectionDescription>
+      </p>
       <div style={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'space-evenly', alignItems: 'end' }}>
         {maintainers.map((maintainer, i) => (
           <Maintainer maintainer={maintainer} key={i} />

package/components/Sponsors/label.svg

@@ -1,5 +1,5 @@
 <svg width="59.641mm" height="13.076mm" version="1.1" viewBox="0 0 59.641 13.076" xmlns="http://www.w3.org/2000/svg">
  <g transform="translate(-91.006 -265.33)">
-  <path d="m103.72 265.33s-2.2571 0.0965-2.6687 0.40101c-0.9913 0.76735-1.5833 2.111-1.5833 2.111l-3.6393 7.2347c-0.28736 0.57132-1.024 2.1272-1.3956 2.4918-0.55117 0.83221-2.8381 0.81625-3.4273 0.83715h59.641c-0.5892-0.0209-2.8761-5e-3 -3.4273-0.83715-0.37156-0.36462-1.1082-1.9205-1.3956-2.4918l-3.6393-7.2347s-0.59202-1.3436-1.5833-2.111c-0.41164-0.30452-2.6683-0.40101-2.6683-0.40101h-28.632z" fill="#f0f0f0"/>
+  <path d="m103.72 265.33s-2.2571 0.0965-2.6687 0.40101c-0.9913 0.76735-1.5833 2.111-1.5833 2.111l-3.6393 7.2347c-0.28736 0.57132-1.024 2.1272-1.3956 2.4918-0.55117 0.83221-2.8381 0.81625-3.4273 0.83715h59.641c-0.5892-0.0209-2.8761-5e-3 -3.4273-0.83715-0.37156-0.36462-1.1082-1.9205-1.3956-2.4918l-3.6393-7.2347s-0.59202-1.3436-1.5833-2.111c-0.41164-0.30452-2.6683-0.40101-2.6683-0.40101h-28.632z" fill="#ebebeb"/>
  </g>
 </svg>

package/components/Sponsors.tsx

@@ -84,7 +84,7 @@ function CompanyDiv({ sponsor }: { sponsor: Sponsor }) {
       <Label sponsor={sponsor} />
       <div
         style={{
-          backgroundColor: '#f0f0f0',
+          backgroundColor: '#ebebeb',
           borderRadius: 7,
           overflow: 'hidden',
           width,
@@ -127,7 +127,7 @@ function Label({ sponsor }: { sponsor: Sponsor }) {
 
 function getLabelBg(sponsor: SponsorCompany) {
   const height = sponsor.plan === 'platinum' ? 32 : 24
-  return <img src={labelBgImg} style={{ height, position: 'absolute', bottom: 0, zIndex: -1 }} />
+  return <img src={labelBgImg} style={{ height, position: 'absolute', bottom: 0 }} />
 }
 
 function getLabelText(sponsor: SponsorCompany) {
@@ -166,9 +166,9 @@ function getLabelText(sponsor: SponsorCompany) {
 function getLabelIcon(sponsor: SponsorCompany) {
   let medalSrc: string
   if (sponsor.plan === 'platinum') {
-    return <Emoji name="trophy" style={{ fontSize: '1.3em' }} />
+    return <Emoji name="trophy" style={{ fontSize: '1.3em', position: 'relative' }} />
   } else if (sponsor.plan === 'indie') {
-    return <Emoji name="ribbon" style={{ fontSize: '0.9em' /*, position: 'relative', top: -1*/ }} />
+    return <Emoji name="ribbon" style={{ fontSize: '0.9em', position: 'relative', top: 1 }} />
   } else if (sponsor.plan === 'gold') {
     medalSrc = medalGold
   } else if (sponsor.plan === 'silver') {

package/components/Supporters.tsx

@@ -11,7 +11,6 @@ function SupporterSection({ children }: { children?: Children }) {
     <div
       style={{
         textAlign: 'center',
-        marginTop: 19,
       }}
     >
       {children}

package/css/block-design.css

@@ -0,0 +1,4 @@
+html {
+  --bg-color: #f5f5f7;
+  --block-margin: 5px;
+}

package/css/index.css

@@ -1,4 +1,5 @@
 @import './reset.css';
+@import './block-design.css';
 @import './colorize-on-hover.css';
 @import './heading.css';
 @import './button.css';

package/dist/components/Contributors.js

@@ -1,14 +1,18 @@
 export { Contributors, Maintainer };
 import React from 'react';
 import { usePageContext } from '../renderer/usePageContext';
-import { Supporter, SupporterSection, SectionDescription, Individuals, SupporterImg } from './Supporters';
+import { Supporter, SupporterSection, Individuals, SupporterImg } from './Supporters';
 import { maintainers } from '../data/maintainersList';
 import { contributors } from 'vike-contributors'; // sorted by number of contributions
 function Contributors() {
     var pageContext = usePageContext();
     var projectInfo = pageContext.config.projectInfo;
     return (React.createElement(SupporterSection, null,
-        React.createElement(SectionDescription, null,
+        React.createElement("p", { style: {
+                maxWidth: 400,
+                display: 'inline-block',
+                fontSize: '1.2em',
+            } },
             projectInfo.projectName,
             " is built and maintained by passionate contributors."),
         React.createElement("div", { style: { display: 'flex', flexWrap: 'wrap', justifyContent: 'space-evenly', alignItems: 'end' } }, maintainers.map(function (maintainer, i) { return (React.createElement(Maintainer, { maintainer: maintainer, key: i })); })),

package/dist/components/Sponsors.js

@@ -44,7 +44,7 @@ function CompanyDiv(_a) {
         } },
         React.createElement(Label, { sponsor: sponsor }),
         React.createElement("div", { style: {
-                backgroundColor: '#f0f0f0',
+                backgroundColor: '#ebebeb',
                 borderRadius: 7,
                 overflow: 'hidden',
                 width: width,
@@ -77,7 +77,7 @@ function Label(_a) {
 }
 function getLabelBg(sponsor) {
     var height = sponsor.plan === 'platinum' ? 32 : 24;
-    return React.createElement("img", { src: labelBgImg, style: { height: height, position: 'absolute', bottom: 0, zIndex: -1 } });
+    return React.createElement("img", { src: labelBgImg, style: { height: height, position: 'absolute', bottom: 0 } });
 }
 function getLabelText(sponsor) {
     if (sponsor.plan === 'platinum') {
@@ -107,10 +107,10 @@ function getLabelText(sponsor) {
 function getLabelIcon(sponsor) {
     var medalSrc;
     if (sponsor.plan === 'platinum') {
-        return React.createElement(Emoji, { name: "trophy", style: { fontSize: '1.3em' } });
+        return React.createElement(Emoji, { name: "trophy", style: { fontSize: '1.3em', position: 'relative' } });
     }
     else if (sponsor.plan === 'indie') {
-        return React.createElement(Emoji, { name: "ribbon", style: { fontSize: '0.9em' /*, position: 'relative', top: -1*/ } });
+        return React.createElement(Emoji, { name: "ribbon", style: { fontSize: '0.9em', position: 'relative', top: 1 } });
     }
     else if (sponsor.plan === 'gold') {
         medalSrc = medalGold;

package/dist/components/Supporters.js

@@ -5,7 +5,6 @@ function SupporterSection(_a) {
     var children = _a.children;
     return (React.createElement("div", { style: {
             textAlign: 'center',
-            marginTop: 19,
         } }, children));
 }
 function SectionDescription(_a) {

package/dist/config/resolvePageContext.d.ts

@@ -39,6 +39,6 @@ declare function resolvePageContext(pageContext: PageContextOriginal): {
             indexName: string;
         } | null;
     };
-    topNavigationStyle: import("react").CSSProperties;
+    topNavigationStyle: import("react").CSSProperties | undefined;
     config: import("../types/Config").Config;
 };

package/dist/types/Config.d.ts

@@ -18,7 +18,7 @@ type Config = {
     };
     headings: HeadingDefinition[];
     headingsDetached: HeadingDetachedDefinition[];
-    topNavigationStyle: React.CSSProperties;
+    topNavigationStyle?: React.CSSProperties;
     /** Sets `<meta name="description" content="${tagline}" />` */
     tagline: string;
     websiteUrl: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brillout/docpress",
-  "version": "0.7.6",
+  "version": "0.7.8",
   "type": "module",
   "dependencies": {
     "@brillout/picocolors": "^1.0.10",

package/types/Config.ts

@@ -20,7 +20,7 @@ type Config = {
   }
   headings: HeadingDefinition[]
   headingsDetached: HeadingDetachedDefinition[]
-  topNavigationStyle: React.CSSProperties
+  topNavigationStyle?: React.CSSProperties
 
   /** Sets `<meta name="description" content="${tagline}" />` */
   tagline: string