better set i18n, decrease grid margins

primatejs · Jan 24, 2024 · f730550 · f730550
1 parent 71d5aae
commit f730550
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 10 deletions.
diff --git a/docs/examples/i18n.md b/docs/examples/i18n.md
@@ -1,7 +1,8 @@
 %%% React, Svelte, Solid
 
 ```jsx caption=components/Index.jsx
-import { default as t, locale } from "@primate/i18n/react";
+import t from "@primate/i18n/react";
+import { locale } from "@primate/i18n/react";
 
 export default function ({ username }) {
   return <>
@@ -12,15 +13,24 @@ export default function ({ username }) {
     {t("bye")}~
 
     <h3>{t("switch-language")}</h3>
-    <div><a onClick={() => locale.set("en-US")}>{t("English")}</a></div>
-    <div><a onClick={() => locale.set("de-DE")}>{t("German")}</a></div>
+    <div>
+      <a onClick={() => locale.set("en-US")}>
+        {t("English")}
+      </a>
+    </div>
+    <div>
+      <a onClick={() => locale.set("de-DE")}>
+        {t("German")}
+      </a>
+    </div>
   </>;
 }
 ```
 
 ```html caption=components/Index.svelte
 <script>
-  import { default as t, locale } from "@primate/i18n/svelte";
+  import t from "@primate/i18n/svelte";
+  import { locale } from "@primate/i18n/svelte";
 
   export let username;
 </script>
@@ -31,12 +41,21 @@ export default function ({ username }) {
 {$t("bye")}~
 
 <h3>{$t("switch-language")}</h3>
-<div><a on:click={() => locale.set("en-US")}>{$t("English")}</a></div>
-<div><a on:click={() => locale.set("de-DE")}>{$t("German")}</a></div>
+<div>
+  <a on:click={() => locale.set("en-US")}>
+    {$t("English")}
+  </a>
+</div>
+<div>
+  <a on:click={() => locale.set("de-DE")}>
+    {$t("German")}
+  </a>
+</div>
 ```
 
 ```jsx caption=components/Index.jsx
-import { default as t, locale } from "@primate/i18n/solid";
+import t from "@primate/i18n/solid";
+import { locale } from "@primate/i18n/solid";
 
 export default function ({ username }) {
   return <>
@@ -47,8 +66,16 @@ export default function ({ username }) {
     {t("bye")}~
 
     <h3>{t("switch-language")}</h3>
-    <div><a onClick={() => locale.set("en-US")}>{t("English")}</a></div>
-    <div><a onClick={() => locale.set("de-DE")}>{t("German")}</a></div>
+    <div>
+      <a onClick={() => locale.set("en-US")}>
+        {t("English")}
+      </a>
+    </div>
+    <div>
+      <a onClick={() => locale.set("de-DE")}>
+        {t("German")}
+      </a>
+    </div>
   </>;
 }
 ```

diff --git a/packages/website/static/master.css b/packages/website/static/master.css
@@ -571,7 +571,7 @@ main.hero {
 .hero .table {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
-  padding: 50px 75px;
+  padding: 50px 30px;
 }
 
 .hero .table > div {