Cal 262 refactor edit teams according to the design reference (#516)
* refactored settings/team landing page * changed team edit flow, WIP * merge conflict fix for teams.tsx * minor fixes to edit team, WIP * invite-member and disband team APIs attached inside edit-team page * added remove-member API in edit-team page, minor fixes * minor code fix, WIP * WIP * add logo, bio, branding to team schema * bio, logo, branding, slug patch API and minor code fix-- WIP * fn to Disband team directly from the dropdown menu in settings/teams page, removed debug remnants --WIP * Pull latest data after an action in settings/teams-edit page * added slug conflict check at Patch time * code clean-up * initial change request fixes --WIP * prop type fix and add warn button color theme --WIP * added warn Button to Dialog * remaining change request fixes * added noop from react-query * updated invited team-list design * prettier fix for api/teams/profile * removed noop import and added custom noop * minor Button fix * requested changes addressed
This commit is contained in:
@@ -5,7 +5,7 @@ import React from "react";
|
||||
type SVGComponent = React.FunctionComponent<React.SVGProps<SVGSVGElement>>;
|
||||
|
||||
export type ButtonProps = {
|
||||
color?: "primary" | "secondary" | "minimal";
|
||||
color?: "primary" | "secondary" | "minimal" | "warn";
|
||||
size?: "base" | "sm" | "lg" | "fab";
|
||||
loading?: boolean;
|
||||
disabled?: boolean;
|
||||
@@ -63,7 +63,10 @@ export const Button = function Button(props: ButtonProps) {
|
||||
(disabled
|
||||
? "text-gray-400 bg-transparent"
|
||||
: "text-gray-700 bg-transparent hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:bg-gray-100 focus:ring-neutral-500"),
|
||||
|
||||
color === "warn" &&
|
||||
(disabled
|
||||
? "text-gray-400 bg-transparent"
|
||||
: "text-red-700 bg-transparent hover:bg-red-100 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:bg-red-50 focus:ring-red-500"),
|
||||
// set not-allowed cursor if disabled
|
||||
disabled && "cursor-not-allowed",
|
||||
props.className
|
||||
|
||||
@@ -4,11 +4,11 @@ const UsernameInput = React.forwardRef((props, ref) => (
|
||||
// todo, check if username is already taken here?
|
||||
<div>
|
||||
<label htmlFor="username" className="block text-sm font-medium text-gray-700">
|
||||
Username
|
||||
{props.label ? props.label : "Username"}
|
||||
</label>
|
||||
<div className="mt-1 rounded-md shadow-sm flex">
|
||||
<span className="bg-gray-50 border border-r-0 border-gray-300 rounded-l-sm px-3 inline-flex items-center text-gray-500 sm:text-sm">
|
||||
{typeof window !== "undefined" && window.location.hostname}/
|
||||
<div className="flex mt-1 rounded-md shadow-sm">
|
||||
<span className="inline-flex items-center px-3 text-gray-500 border border-r-0 border-gray-300 rounded-l-sm bg-gray-50 sm:text-sm">
|
||||
{typeof window !== "undefined" && window.location.hostname}/{props.label && "team/"}
|
||||
</span>
|
||||
<input
|
||||
ref={ref}
|
||||
@@ -18,7 +18,7 @@ const UsernameInput = React.forwardRef((props, ref) => (
|
||||
autoComplete="username"
|
||||
required
|
||||
{...props}
|
||||
className="focus:ring-black focus:border-black flex-grow block w-full min-w-0 rounded-none rounded-r-sm sm:text-sm border-gray-300 lowercase"
|
||||
className="flex-grow block w-full min-w-0 lowercase border-gray-300 rounded-none rounded-r-sm focus:ring-black focus:border-black sm:text-sm"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user