diff --git a/website/i18n/en/code.json b/website/i18n/en/code.json index 8c25f6120..f6796a9e2 100644 --- a/website/i18n/en/code.json +++ b/website/i18n/en/code.json @@ -23,6 +23,9 @@ "homepage.ButtonText": { "message": "Get Started" }, + "homepage.LearnMoreButtonText": { + "message": "Learn More" + }, "theme.ErrorPageContent.title": { "message": "This page crashed.", "description": "The title of the fallback page when the page crashed" diff --git a/website/i18n/zh-Hans/code.json b/website/i18n/zh-Hans/code.json index 6fb3e85c2..07f6ab827 100644 --- a/website/i18n/zh-Hans/code.json +++ b/website/i18n/zh-Hans/code.json @@ -23,6 +23,9 @@ "homepage.ButtonText": { "message": "快速入门" }, + "homepage.LearnMoreButtonText": { + "message": "学到更多" + }, "theme.ErrorPageContent.title": { "message": "页面已崩溃。", "description": "The title of the fallback page when the page crashed" diff --git a/website/src/css/carousel.css b/website/src/css/carousel.css index c1b3fffc0..f57a752fc 100644 --- a/website/src/css/carousel.css +++ b/website/src/css/carousel.css @@ -18,7 +18,7 @@ filter: alpha(opacity=40); position: absolute; z-index: 2; - top: 20px; + top: 0px; background: none; border: 0; font-size: 32px; @@ -303,9 +303,9 @@ @media (min-width: 960px) { .carousel-root { - padding: 15px; + padding-bottom: 5px; } .carousel .slider-wrapper { - width: 50%; + width: 75%; } } diff --git a/website/src/css/custom.css b/website/src/css/custom.css index 619d79f5c..03fed79f9 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -4,19 +4,6 @@ * work well for content-centric websites. */ -/* You can override the default Infima variables here. */ -:root { - --ifm-color-primary: #25c2a0; - --ifm-color-primary-dark: rgb(33, 175, 144); - --ifm-color-primary-darker: rgb(31, 165, 136); - --ifm-color-primary-darkest: rgb(26, 136, 112); - --ifm-color-primary-light: rgb(70, 203, 174); - --ifm-color-primary-lighter: rgb(102, 212, 189); - --ifm-color-primary-lightest: rgb(146, 224, 208); - --ifm-code-font-size: 95%; - --ifm-container-width-xl: 90%; -} - .docusaurus-highlight-code-line { background-color: rgba(0, 0, 0, 0.1); display: block; @@ -39,7 +26,8 @@ html[data-theme="dark"] .docusaurus-highlight-code-line { --ifm-color-primary-lightest: rgb(146, 224, 208); --ifm-code-font-size: 95%; --ifm-button-color: white; - --ifm-container-width-xl: 100%; + --ifm-container-width-xl: 50%; + --ifm-font-color-base-inverse: #df0000; } .docusaurus-highlight-code-line { @@ -55,6 +43,23 @@ html[data-theme="dark"] .docusaurus-highlight-code-line { .container { padding-left: 2%; + max-width: 1400px; + width: 85%; +} + +@media screen and (max-width: 576px) { + .container { + padding-left: 2%; + width: 100%; + } +} + + +@media screen and (max-width: 966px) { + .container { + padding-left: 2%; + width: 90%; + } } .prism-code.language-js .token-line::before, diff --git a/website/src/pages/index.js b/website/src/pages/index.js index 2407ecc5a..b5ac0e4df 100644 --- a/website/src/pages/index.js +++ b/website/src/pages/index.js @@ -5,17 +5,17 @@ import Link from "@docusaurus/Link"; import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; import styles from "./index.module.css"; import HomepageFeatures from "../components/HomepageFeatures"; -import { translate } from "@docusaurus/Translate"; // i18n component +import {translate} from "@docusaurus/Translate"; // i18n component import useBaseUrl from "@docusaurus/useBaseUrl"; var Carousel = require("react-responsive-carousel").Carousel; function HomepageHeader() { - const { siteConfig } = useDocusaurusContext(); + const {siteConfig} = useDocusaurusContext(); return ( -
-
- +
+ - {/**/} -

- {translate({ id: "homepage.Tagline" })} + {translate({id: "homepage.Tagline"})}

-
- - {translate({ id: "homepage.ButtonText" })} - -
+
+ + {translate({id: "homepage.LearnMoreButtonText"})} + + + {translate({id: "homepage.ButtonText"})} + +
); diff --git a/website/src/pages/index.module.css b/website/src/pages/index.module.css index 862429109..3533f2e02 100644 --- a/website/src/pages/index.module.css +++ b/website/src/pages/index.module.css @@ -8,6 +8,7 @@ text-align: center; position: relative; overflow: hidden; + padding-bottom: 35px; } @media screen and (max-width: 966px) { @@ -17,6 +18,7 @@ } .buttons { + column-gap: 2rem; display: flex; align-items: center; justify-content: center; diff --git a/website/versioned_docs/version-v2.0.0-beta.37/introduction.mdx b/website/versioned_docs/version-v2.0.0-beta.37/introduction.mdx index 846b21e1d..b2206c841 100644 --- a/website/versioned_docs/version-v2.0.0-beta.37/introduction.mdx +++ b/website/versioned_docs/version-v2.0.0-beta.37/introduction.mdx @@ -11,14 +11,14 @@ Wails is a project that enables you to write desktop apps using Go and web techn Consider it a lightweight and fast Electron alternative for Go. You can easily build applications with the flexibility and power of Go, combined with a rich, modern frontend. -Wails doesn't hold back with the eye candy either! This is [xbar](https://xbarapp.com) - a desktop application for MacOS -written using Wails. It has menus, supports light and dark desktop themes, and the main window uses translucency that -gives it that 'frosty' effect of a native app. +Wails doesn't hold back with the eye candy either! This is [varly](https://varlyapp.com) - a desktop application for +MacOS & Windows written using Wails. Not only does it look great, it uses native menus and translucency - everything +you'd expect from a modern native app.

- - - + + +

## Quick Start Templates diff --git a/website/versioned_docs/version-v2.0.0-beta.38/introduction.mdx b/website/versioned_docs/version-v2.0.0-beta.38/introduction.mdx index 82df8ed4d..b2206c841 100644 --- a/website/versioned_docs/version-v2.0.0-beta.38/introduction.mdx +++ b/website/versioned_docs/version-v2.0.0-beta.38/introduction.mdx @@ -11,13 +11,13 @@ Wails is a project that enables you to write desktop apps using Go and web techn Consider it a lightweight and fast Electron alternative for Go. You can easily build applications with the flexibility and power of Go, combined with a rich, modern frontend. -Wails doesn't hold back with the eye candy either! This is [xbar](https://xbarapp.com) - a desktop application for MacOS -written using Wails. It has menus, supports light and dark desktop themes, and the main window uses translucency that -gives it that 'frosty' effect of a native app. +Wails doesn't hold back with the eye candy either! This is [varly](https://varlyapp.com) - a desktop application for +MacOS & Windows written using Wails. Not only does it look great, it uses native menus and translucency - everything +you'd expect from a modern native app.

- - + +