window.open(ContestURL, '_blank')}
diff --git a/opensaas-sh/app_diff/src/landing-page/components/Hero.tsx.diff b/opensaas-sh/app_diff/src/landing-page/components/Hero.tsx.diff
index 8d65bc2..2669952 100644
--- a/opensaas-sh/app_diff/src/landing-page/components/Hero.tsx.diff
+++ b/opensaas-sh/app_diff/src/landing-page/components/Hero.tsx.diff
@@ -1,7 +1,7 @@
--- template/app/src/landing-page/components/Hero.tsx
+++ opensaas-sh/app/src/landing-page/components/Hero.tsx
@@ -1,7 +1,25 @@
--import openSaasBanner from '../../client/static/open-saas-banner.png';
+-import openSaasBannerWebp from '../../client/static/open-saas-banner.webp';
-import { DocsUrl } from '../../shared/common';
+import { useState, useEffect } from 'react';
+import { AiFillGithub } from 'react-icons/ai';
@@ -26,9 +26,9 @@
+ }, []);
+
return (
-
-
+
@@ -69,15 +69,17 @@
+
--
+-
+-
- 
++
+
+ ",
"",
"",
- "",
+ "",
//...
],
//...
diff --git a/opensaas-sh/blog/src/content/docs/start/guided-tour.md b/opensaas-sh/blog/src/content/docs/start/guided-tour.md
index 59288b2..008b19b 100644
--- a/opensaas-sh/blog/src/content/docs/start/guided-tour.md
+++ b/opensaas-sh/blog/src/content/docs/start/guided-tour.md
@@ -60,7 +60,7 @@ If you are using an older version of the OpenSaaS template with Wasp `v0.13.x` o
.
├── main.wasp # Wasp Config file. You define your app structure here.
├── .wasp/ # Output dir for Wasp. DON'T MODIFY THESE FILES!
-├── public/ # Public assets dir, e.g. www.yourdomain.com/banner.png
+├── public/ # Public assets dir, e.g. www.yourdomain.com/public-banner.webp
├── src/ # Your code goes here.
│ ├── admin/ # Admin dashboard related pages and components.
│ ├── analytics/ # Logic and background jobs for processing analytics.
@@ -320,11 +320,11 @@ But before you start setting up the main features, let's walk through the custom
#### Customizing the Look / Style of the App
- [ ] Update your favicon at `public/favicon.ico`.
-- [ ] Update the banner image used when posting links to your site at `public/public-banner.png`.
+- [ ] Update the banner image used when posting links to your site at `public/public-banner.webp`.
- [ ] Update the URL for this banner at `og:image` and `twitter:image` in `app.head` of the `main.wasp` file.
- [ ] Make changes to your landing page, `landingPage.tsx`.
- [ ] Customize the `navBar`, `features`, `testimonials`, and `faqs` in the `contentSections.ts` file.
- - [ ] Change/rename the `logo.png` and main banner (`open-saas-banner.png`) in the `static` folder.
+ - [ ] Change/rename the `logo.webp` and main hero banner (`open-saas-banner.webp`) in the `static` folder.
- [ ] If you want to make changes to the global styles of the app, you can do so in `tailwind.config.cjs`. **Be aware that the current custom global styles defined already are mostly used in the app's Admin Dashboard!**
#### Customizing the Analytics & Admin Dashboard
diff --git a/template/app/main.wasp b/template/app/main.wasp
index d7669b6..aeb4037 100644
--- a/template/app/main.wasp
+++ b/template/app/main.wasp
@@ -6,21 +6,27 @@ app OpenSaaS {
title: "My Open SaaS App",
head: [
- "",
- "",
- "",
- "",
- "",
- "",
- "",
- "",
- "",
- // TODO: You can put your Plausible analytics scripts below (https://docs.opensaas.sh/guides/analytics/):
- // NOTE: Plausible does not use Cookies, so you can simply add the scripts here.
- // Google, on the other hand, does, so you must instead add the script dynamically
- // via the Cookie Consent component after the user clicks the "Accept" cookies button.
- "", // for production
- "", // for development
+ "",
+ "",
+ "",
+ "",
+
+ "",
+ "",
+ "",
+ "",
+ "",
+ "",
+ "",
+ "",
+ "",
+ "",
+ // TODO: You can put your Plausible analytics scripts below (https://docs.opensaas.sh/guides/analytics/):
+ // NOTE: Plausible does not use Cookies, so you can simply add the scripts here.
+ // Google, on the other hand, does, so you must instead add the script dynamically
+ // via the Cookie Consent component after the user clicks the "Accept" cookies button.
+ "", // for production
+ "", // for development
],
// 🔐 Auth out of the box! https://wasp-lang.dev/docs/auth/overview
diff --git a/template/app/public/banner.png b/template/app/public/banner.png
deleted file mode 100644
index c2363cc..0000000
Binary files a/template/app/public/banner.png and /dev/null differ
diff --git a/template/app/public/public-banner.png b/template/app/public/public-banner.png
deleted file mode 100644
index c7a44ff..0000000
Binary files a/template/app/public/public-banner.png and /dev/null differ
diff --git a/template/app/public/public-banner.webp b/template/app/public/public-banner.webp
new file mode 100644
index 0000000..ad96e10
Binary files /dev/null and b/template/app/public/public-banner.webp differ
diff --git a/template/app/src/admin/layout/Sidebar.tsx b/template/app/src/admin/layout/Sidebar.tsx
index d97fe35..5a0c53f 100644
--- a/template/app/src/admin/layout/Sidebar.tsx
+++ b/template/app/src/admin/layout/Sidebar.tsx
@@ -1,6 +1,6 @@
import React, { useEffect, useRef, useState } from 'react';
import { NavLink, useLocation } from 'react-router-dom';
-import Logo from '../../client/static/logo.png';
+import Logo from '../../client/static/logo.webp';
import SidebarLinkGroup from './SidebarLinkGroup';
import { cn } from '../../client/cn';
diff --git a/template/app/src/client/App.tsx b/template/app/src/client/App.tsx
index 933decd..eaca0c0 100644
--- a/template/app/src/client/App.tsx
+++ b/template/app/src/client/App.tsx
@@ -3,7 +3,7 @@ import { updateCurrentUser } from 'wasp/client/operations';
import './Main.css';
import AppNavBar from './components/AppNavBar';
import CookieConsentBanner from './components/cookie-consent/Banner';
-import { useMemo, useEffect, ReactNode } from 'react';
+import { useMemo, useEffect } from 'react';
import { Outlet, useLocation } from 'react-router-dom';
/**
diff --git a/template/app/src/client/Main.css b/template/app/src/client/Main.css
index 9a1979d..3bfed05 100644
--- a/template/app/src/client/Main.css
+++ b/template/app/src/client/Main.css
@@ -31,6 +31,7 @@
src: url('/fonts/Satoshi-Regular.woff2') format('woff2');
font-weight: normal;
font-style: normal;
+ font-display: swap;
}
/* third-party libraries CSS */
diff --git a/template/app/src/client/components/AppNavBar.tsx b/template/app/src/client/components/AppNavBar.tsx
index cdf5d35..301df8d 100644
--- a/template/app/src/client/components/AppNavBar.tsx
+++ b/template/app/src/client/components/AppNavBar.tsx
@@ -5,7 +5,7 @@ import { Dialog } from '@headlessui/react';
import { BiLogIn } from 'react-icons/bi';
import { AiFillCloseCircle } from 'react-icons/ai';
import { HiBars3 } from 'react-icons/hi2';
-import logo from '../static/logo.png';
+import logo from '../static/logo.webp';
import DropdownUser from '../../user/DropdownUser';
import { UserMenuItems } from '../../user/UserMenuItems';
import { DocsUrl, BlogUrl } from '../../shared/common';
diff --git a/template/app/src/client/static/avatar-placeholder.png b/template/app/src/client/static/avatar-placeholder.png
deleted file mode 100644
index 7acc886..0000000
Binary files a/template/app/src/client/static/avatar-placeholder.png and /dev/null differ
diff --git a/template/app/src/client/static/avatar-placeholder.webp b/template/app/src/client/static/avatar-placeholder.webp
new file mode 100644
index 0000000..e985d27
Binary files /dev/null and b/template/app/src/client/static/avatar-placeholder.webp differ
diff --git a/template/app/src/client/static/da-boi.png b/template/app/src/client/static/da-boi.png
deleted file mode 100644
index 0f9227e..0000000
Binary files a/template/app/src/client/static/da-boi.png and /dev/null differ
diff --git a/template/app/src/client/static/da-boi.webp b/template/app/src/client/static/da-boi.webp
new file mode 100644
index 0000000..96280c7
Binary files /dev/null and b/template/app/src/client/static/da-boi.webp differ
diff --git a/template/app/src/client/static/logo.png b/template/app/src/client/static/logo.png
deleted file mode 100644
index d39a944..0000000
Binary files a/template/app/src/client/static/logo.png and /dev/null differ
diff --git a/template/app/src/client/static/logo.webp b/template/app/src/client/static/logo.webp
new file mode 100644
index 0000000..0e73a39
Binary files /dev/null and b/template/app/src/client/static/logo.webp differ
diff --git a/template/app/src/client/static/open-saas-banner.png b/template/app/src/client/static/open-saas-banner.png
deleted file mode 100644
index c2363cc..0000000
Binary files a/template/app/src/client/static/open-saas-banner.png and /dev/null differ
diff --git a/template/app/src/client/static/open-saas-banner.webp b/template/app/src/client/static/open-saas-banner.webp
new file mode 100644
index 0000000..ad96e10
Binary files /dev/null and b/template/app/src/client/static/open-saas-banner.webp differ
diff --git a/template/app/src/landing-page/LandingPage.tsx b/template/app/src/landing-page/LandingPage.tsx
index a5d3d83..a79852c 100644
--- a/template/app/src/landing-page/LandingPage.tsx
+++ b/template/app/src/landing-page/LandingPage.tsx
@@ -1,10 +1,4 @@
-import {
- features,
- navigation,
- faqs,
- footerNavigation,
- testimonials
-} from './contentSections';
+import { features, navigation, faqs, footerNavigation, testimonials } from './contentSections';
import Header from './components/Header';
import Hero from './components/Hero';
import Clients from './components/Clients';
diff --git a/template/app/src/landing-page/components/Header.tsx b/template/app/src/landing-page/components/Header.tsx
index b4d1e74..dc7b1d0 100644
--- a/template/app/src/landing-page/components/Header.tsx
+++ b/template/app/src/landing-page/components/Header.tsx
@@ -5,7 +5,7 @@ import { AiFillCloseCircle } from 'react-icons/ai';
import { Dialog } from '@headlessui/react';
import { Link } from 'wasp/client/router';
import { useAuth } from 'wasp/client/auth';
-import logo from '../../client/static/logo.png';
+import logo from '../../client/static/logo.webp';
import DarkModeSwitcher from '../../client/components/DarkModeSwitcher';
import DropdownUser from '../../user/DropdownUser';
import { UserMenuItems } from '../../user/UserMenuItems';
diff --git a/template/app/src/landing-page/components/Hero.tsx b/template/app/src/landing-page/components/Hero.tsx
index 49fcaec..c776d1e 100644
--- a/template/app/src/landing-page/components/Hero.tsx
+++ b/template/app/src/landing-page/components/Hero.tsx
@@ -1,31 +1,11 @@
-import openSaasBanner from '../../client/static/open-saas-banner.png';
+import openSaasBannerWebp from '../../client/static/open-saas-banner.webp';
import { DocsUrl } from '../../shared/common';
export default function Hero() {
return (
-
-
-
+
+
@@ -44,13 +24,14 @@ export default function Hero() {
-
+
- 
+
+
@@ -60,3 +41,35 @@ export default function Hero() {
);
}
+
+function TopGradient() {
+ return (
+
+ );
+}
+
+function BottomGradient() {
+ return (
+
+ );
+}
\ No newline at end of file
diff --git a/template/app/src/landing-page/components/Testimonials.tsx b/template/app/src/landing-page/components/Testimonials.tsx
index cd915b4..457e669 100644
--- a/template/app/src/landing-page/components/Testimonials.tsx
+++ b/template/app/src/landing-page/components/Testimonials.tsx
@@ -22,7 +22,7 @@ export default function Testimonials({ testimonials }: { testimonials: Testimoni
{testimonial.name}
{testimonial.role}
diff --git a/template/app/src/landing-page/contentSections.ts b/template/app/src/landing-page/contentSections.ts
index 992c189..f7395ce 100644
--- a/template/app/src/landing-page/contentSections.ts
+++ b/template/app/src/landing-page/contentSections.ts
@@ -1,6 +1,6 @@
import { DocsUrl, BlogUrl } from '../shared/common';
-import daBoiAvatar from '../client/static/da-boi.png';
-import avatarPlaceholder from '../client/static/avatar-placeholder.png';
+import daBoiAvatar from '../client/static/da-boi.webp';
+import avatarPlaceholder from '../client/static/avatar-placeholder.webp';
import { routes } from 'wasp/client/router';
export const navigation = [
diff --git a/template/app/tailwind.config.cjs b/template/app/tailwind.config.cjs
index dbd06a0..96f1d25 100644
--- a/template/app/tailwind.config.cjs
+++ b/template/app/tailwind.config.cjs
@@ -8,7 +8,7 @@ module.exports = {
theme: {
extend: {
fontFamily: {
- satoshi: ['Satoshi', 'sans-serif'],
+ satoshi: ['Satoshi', 'system-ui', 'sans-serif'],
},
colors: {
current: 'currentColor',
diff --git a/template/blog/astro.config.mjs b/template/blog/astro.config.mjs
index d398389..7addc57 100644
--- a/template/blog/astro.config.mjs
+++ b/template/blog/astro.config.mjs
@@ -14,7 +14,7 @@ export default defineConfig({
customCss: ['./src/styles/tailwind.css'],
description: 'Documentation for your SaaS.',
logo: {
- src: '/src/assets/logo.png',
+ src: '/src/assets/logo.webp',
alt: 'Your SaaS',
},
head: [