Giters

epicweb-dev / epicshop

The workshop app for all workshops on EpicWeb.dev

Home Page:https://www.epicweb.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Add notice on deployed version

kentcdodds opened this issue · comments

commented

On at least the home page (but probably on every page), we should have a notice that explains the deployed version is limited. For two reasons:

  1. I don't want people getting the wrong impression about what it's like to go through a workshop with me.
  2. I want people to understand why they can't start apps like they can when it's local.
commented

I don't quite understand, what is the purpose of the deployed version.

who is going to use "deployed version" instead of cloning the workshop?

deployed

add this to root.tsx:

{ENV.KCDSHOP_DEPLOYED ? (
	<div>
		<h6 className="border-b border-border p-2 font-mono text-sm font-medium uppercase leading-tight">
			Limited deployed version
		</h6>
		<Outlet />
	</div>
) : (
	<Outlet />
)}

you can replace the <h6> with a link to a README page with more details. also add menu entry to that README to the sidebar below Workshop Feedback

I can make a PR if you provide the content of the README and where to save it

commented

People will use the deployed version as a quick and easy way to reference the material without having to run things locally. I do this all the time myself and I expect folks who have gone through it in the past will as well.

commented

The example you have there, will that force a scroll on the page or do things adjust to fit it? I think that looks ok.

commented

The example you have there, will that force a scroll on the page or do things adjust to fit it? I think that looks ok.

Yes. currently there is an extra scroll, since the Outlet page have h-full or h-screen, what will be the simplest way to fix it?

if we want to add this fixed header at the root then when need fit in the nested outlet that use h-full and h-screen to use calc with 100% - 2rem or 100vh - 2rem

where can i find a deployed versions of the workshops ?

commented

We'll want to avoid the scroll

commented

I found a solution for the scroll issue by adding custom classes to tailwind.config:

height: {
	'screen-custom': KCDSHOP_DEPLOYED ? 'calc(100vh - 2.5rem)' : '100vh',
	'full-custom': KCDSHOP_DEPLOYED ? 'calc(100% - 2.5rem)' : '100%',
},

and use h-screen-custom and h-full-custom in _app+ routes
i still need to fix narrow screen

do you want to add a doc file with a link in the side bar?

They're linked in the repo readme.

I did not find these link

commented

They're linked on this image in each of them

image

I'd rather a solution that doesn't require customizing the tailwind config

commented

🎉 This issue has been resolved in version 2.8.0 🎉

The release is available on:

Your semantic-release bot 📦🚀