style: new buttons added (#470)

This commit is contained in:
Aaryan Khandelwal 2023-03-17 10:40:38 +05:30 committed by GitHub
parent 4de0abfc22
commit e7ef6275cd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
58 changed files with 392 additions and 633 deletions

View file

@ -18,7 +18,7 @@ import AppLayout from "layouts/app-layout";
// components
import { ImageUploadModal } from "components/core";
// ui
import { Button, Input, Spinner } from "components/ui";
import { DangerButton, Input, SecondaryButton, Spinner } from "components/ui";
import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
// icons
import {
@ -205,24 +205,17 @@ const Profile: NextPage = () => {
<br />
Supported file types are .jpg and .png.
</p>
<div className="flex items-center gap-2">
<Button
type="button"
className="mt-4"
onClick={() => setIsImageUploadModalOpen(true)}
>
<div className="mt-4 flex items-center gap-2">
<SecondaryButton onClick={() => setIsImageUploadModalOpen(true)}>
Upload new
</Button>
</SecondaryButton>
{myProfile.avatar && myProfile.avatar !== "" && (
<Button
type="button"
className="mt-4"
theme="danger"
<DangerButton
onClick={() => handleDelete(myProfile.avatar, true)}
disabled={isRemoving}
loading={isRemoving}
>
{isRemoving ? "Removing..." : "Remove"}
</Button>
</DangerButton>
)}
</div>
</div>
@ -269,9 +262,9 @@ const Profile: NextPage = () => {
</div>
{isEditing && (
<div>
<Button type="submit" disabled={isSubmitting}>
<SecondaryButton type="submit" loading={isSubmitting}>
{isSubmitting ? "Updating Profile..." : "Update Profile"}
</Button>
</SecondaryButton>
</div>
)}
</form>

View file

@ -16,7 +16,7 @@ import workspaceService from "services/workspace.service";
// hooks
import useToast from "hooks/use-toast";
// ui
import { Button, CustomSelect, Loader } from "components/ui";
import { CustomSelect, Loader, SecondaryButton } from "components/ui";
import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
// types
import { IProject, IWorkspace } from "types";
@ -239,9 +239,9 @@ const ControlSettings: NextPage<TControlSettingsProps> = (props) => {
</div>
</div>
<div className="sm:text-right">
<Button type="submit" disabled={isSubmitting}>
<SecondaryButton type="submit" loading={isSubmitting}>
{isSubmitting ? "Updating Project..." : "Update Project"}
</Button>
</SecondaryButton>
</div>
</div>
</form>

View file

@ -13,14 +13,15 @@ import AppLayout from "layouts/app-layout";
// hooks
import useToast from "hooks/use-toast";
// ui
import { Button } from "components/ui";
import { SecondaryButton } from "components/ui";
import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
// icons
import { ContrastIcon, PeopleGroupIcon, ViewListIcon } from "components/icons";
// types
import { IProject, UserAuth } from "types";
import type { NextPage, GetServerSidePropsContext } from "next";
// fetch-keys
import { PROJECTS_LIST, PROJECT_DETAILS } from "constants/fetch-keys";
import { ContrastIcon, PeopleGroupIcon, ViewListIcon } from "components/icons";
const FeaturesSettings: NextPage<UserAuth> = (props) => {
const router = useRouter();
@ -183,14 +184,10 @@ const FeaturesSettings: NextPage<UserAuth> = (props) => {
</div>
<div className="flex items-center gap-2">
<a href="https://plane.so/" target="_blank" rel="noreferrer">
<Button theme="secondary" size="rg" className="text-xs">
Plane is open-source, view Roadmap
</Button>
<SecondaryButton outline>Plane is open-source, view Roadmap</SecondaryButton>
</a>
<a href="https://github.com/makeplane/plane" target="_blank" rel="noreferrer">
<Button theme="secondary" size="rg" className="text-xs">
Star us on GitHub
</Button>
<SecondaryButton outline>Star us on GitHub</SecondaryButton>
</a>
</div>
</section>

View file

@ -20,7 +20,14 @@ import EmojiIconPicker from "components/emoji-icon-picker";
// hooks
import useToast from "hooks/use-toast";
// ui
import { Button, Input, TextArea, Loader, CustomSelect, OutlineButton } from "components/ui";
import {
Input,
TextArea,
Loader,
CustomSelect,
OutlineButton,
SecondaryButton,
} from "components/ui";
import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
// helpers
import { debounce } from "helpers/common.helper";
@ -30,7 +37,6 @@ import type { NextPage, GetServerSidePropsContext } from "next";
import { PROJECTS_LIST, PROJECT_DETAILS, WORKSPACE_DETAILS } from "constants/fetch-keys";
// constants
import { NETWORK_CHOICES } from "constants/project";
import SettingsNavbar from "layouts/settings-navbar";
const defaultValues: Partial<IProject> = {
name: "",
@ -288,9 +294,9 @@ const GeneralSettings: NextPage<UserAuth> = (props) => {
</div>
<div className="sm:text-right">
{projectDetails ? (
<Button type="submit" disabled={isSubmitting}>
<SecondaryButton type="submit" loading={isSubmitting}>
{isSubmitting ? "Updating Project..." : "Update Project"}
</Button>
</SecondaryButton>
) : (
<Loader className="mt-2 w-full">
<Loader.Item height="34px" width="100px" light />

View file

@ -19,7 +19,7 @@ import {
SingleLabelGroup,
} from "components/labels";
// ui
import { Loader } from "components/ui";
import { Loader, PrimaryButton } from "components/ui";
import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
// icons
import { PlusIcon } from "@heroicons/react/24/outline";
@ -28,7 +28,6 @@ import { IIssueLabels, UserAuth } from "types";
import type { GetServerSidePropsContext, NextPage } from "next";
// fetch-keys
import { PROJECT_DETAILS, PROJECT_ISSUE_LABELS } from "constants/fetch-keys";
import { PrimaryButton } from "components/ui/button/primary-button";
const LabelsSettings: NextPage<UserAuth> = (props) => {
const { isMember, isOwner, isViewer, isGuest } = props;

View file

@ -11,7 +11,7 @@ import workspaceService from "services/workspace.service";
// layouts
import AppLayout from "layouts/app-layout";
// ui
import { Button } from "components/ui";
import { SecondaryButton } from "components/ui";
import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
// types
import type { NextPage, GetServerSideProps } from "next";
@ -66,9 +66,7 @@ const BillingSettings: NextPage<TBillingSettingsProps> = (props) => {
<h4 className="text-md mb-1 leading-6 text-gray-900">Current plan</h4>
<p className="mb-3 text-sm text-gray-500">You are currently using the free plan</p>
<a href="https://plane.so/pricing" target="_blank" rel="noreferrer">
<Button theme="secondary" size="rg" className="text-xs">
View Plans and Upgrade
</Button>
<SecondaryButton outline>View Plans and Upgrade</SecondaryButton>
</a>
</div>
<div>

View file

@ -23,7 +23,7 @@ import AppLayout from "layouts/app-layout";
import { ImageUploadModal } from "components/core";
import { DeleteWorkspaceModal } from "components/workspace";
// ui
import { Spinner, Button, Input, CustomSelect, OutlineButton } from "components/ui";
import { Spinner, Input, CustomSelect, OutlineButton, SecondaryButton } from "components/ui";
import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
// helpers
import { copyTextToClipboard } from "helpers/string.helper";
@ -168,13 +168,13 @@ const WorkspaceSettings: NextPage<UserAuth> = (props) => {
)}
</button>
<div>
<Button
<SecondaryButton
onClick={() => {
setIsImageUploadModalOpen(true);
}}
>
{isImageUploading ? "Uploading..." : "Upload"}
</Button>
</SecondaryButton>
</div>
</div>
</div>
@ -195,9 +195,7 @@ const WorkspaceSettings: NextPage<UserAuth> = (props) => {
value={`app.plane.so/${activeWorkspace.slug}`}
disabled
/>
<Button
type="button"
theme="secondary"
<SecondaryButton
className="h-min"
onClick={() =>
copyTextToClipboard(`https://app.plane.so/${activeWorkspace.slug}`).then(() => {
@ -208,9 +206,10 @@ const WorkspaceSettings: NextPage<UserAuth> = (props) => {
});
})
}
outline
>
<LinkIcon className="h-[18px] w-[18px]" />
</Button>
</SecondaryButton>
</div>
</div>
<div className="grid grid-cols-12 gap-4 sm:gap-16">
@ -259,9 +258,9 @@ const WorkspaceSettings: NextPage<UserAuth> = (props) => {
</div>
</div>
<div className="sm:text-right">
<Button onClick={handleSubmit(onSubmit)} disabled={isSubmitting}>
<SecondaryButton onClick={handleSubmit(onSubmit)} loading={isSubmitting}>
{isSubmitting ? "Updating..." : "Update Workspace"}
</Button>
</SecondaryButton>
</div>
<div className="grid grid-cols-12 gap-4 sm:gap-16">
<div className="col-span-12 sm:col-span-6">