maronato/cal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ui bug: alert looking funky (#766) 

* tweak alert text to be growing
* fix alert looking funky
* get rid of `typeof window` dirt
This commit is contained in:
Alex Johansson 2021-09-24 13:52:00 +01:00 committed by GitHub
parent bb1da8150f
commit f709972f86
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 8 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/ui/Alert.tsx
View File

@ -32,7 +32,7 @@ export function Alert(props: AlertProps) {
<CheckCircleIcon className={classNames("h-5 w-5 text-gray-400")} aria-hidden="true" />
)}
</div>
<div className="ml-3">
<div className="ml-3 flex-grow">
<h3 className="text-sm font-medium">{props.title}</h3>
<div className="text-sm">{props.message}</div>
</div>

4
lib/core/browser/browser.utils.ts
View File

@ -1,5 +1,3 @@
export const isBrowser = () => typeof window !== "undefined";
type BrowserInfo = {
url: string;
path: string;
@ -9,7 +7,7 @@ type BrowserInfo = {
};
export const getBrowserInfo = (): Partial<BrowserInfo> => {
if (!isBrowser()) {
if (!process.browser) {
return {};
}
return {

2
lib/core/browser/useDarkMode.tsx
View File

@ -12,7 +12,7 @@ interface UseDarkModeOutput {
function useDarkMode(defaultValue?: boolean): UseDarkModeOutput {
const getPrefersScheme = (): boolean => {
// Prevents SSR issues
if (typeof window !== "undefined") {
if (process.browser) {
return window.matchMedia(COLOR_SCHEME_QUERY).matches;
}

10
pages/event-types/index.tsx
View File

@ -113,8 +113,8 @@ const EventTypesPage = (props: PageProps) => {
</Link>
</span>
)}
{typeof window !== "undefined" && profile?.slug && (
<Link href={profile.slug}>
{profile?.slug && (
<Link href={`/${profile.slug}`}>
<a className="block text-xs text-neutral-500">{`cal.com/${profile.slug}`}</a>
</Link>
)}
@ -293,15 +293,15 @@ const EventTypesPage = (props: PageProps) => {
<CreateNewEventDialog canAddEvents={props.canAddEvents} profiles={props.profiles} />
)
}>
{props.user.plan === "FREE" && !props.canAddEvents && typeof window !== "undefined" && (
{props.user.plan === "FREE" && !props.canAddEvents && (
<Alert
severity="warning"
title={<>You need to upgrade your plan to have more than one active event type.</>}
message={
<>
To upgrade go to{" "}
<a href={process.env.UPGRADE_URL || "https://cal.com/upgrade"} className="underline">
{process.env.UPGRADE_URL || "https://cal.com/upgrade"}
<a href={"https://cal.com/upgrade"} className="underline">
{"https://cal.com/upgrade"}
</a>
</>
}