Fixes button styles on /event-types and /availability (#4281)

Co-authored-by: Peer Richelsen <peeroke@gmail.com>
This commit is contained in:
Alex van Andel 2022-09-08 15:21:46 +01:00 committed by GitHub
parent 3c8cc4e624
commit a8c1851c04
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 15 additions and 12 deletions

View File

@ -2,6 +2,7 @@
* @deprecated modifications to this file should be v2 only
* Use `/apps/web/pages/v2/availability/index.tsx` instead
*/
import { ScheduleListItem } from "@calcom/features/schedules/components/ScheduleListItem";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import showToast from "@calcom/lib/notification";
import { inferQueryOutput, trpc } from "@calcom/trpc/react";
@ -13,7 +14,6 @@ import { withQuery } from "@lib/QueryCell";
import { HttpError } from "@lib/core/http/error";
import { NewScheduleButton } from "@components/availability/NewScheduleButton";
import { ScheduleListItem } from "@components/availability/ScheduleListItem";
import SkeletonLoader from "@components/availability/SkeletonLoader";
/**

View File

@ -305,10 +305,13 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
</Tooltip>
</div>
<Dropdown>
<DropdownMenuTrigger
className="focus:ring-brand-900 flex h-[36px] w-[36px] justify-center rounded-md border border-transparent bg-transparent text-gray-700 hover:border-gray-300 hover:bg-gray-100 focus:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-offset-1"
data-testid={"event-type-options-" + type.id}>
<Icon.FiMoreHorizontal className="h-5 w-5 group-hover:text-gray-800" />
<DropdownMenuTrigger asChild data-testid={"event-type-options-" + type.id}>
<Button
type="button"
size="icon"
color="minimalSecondary"
StartIcon={Icon.FiMoreHorizontal}
/>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem>

View File

@ -37,7 +37,7 @@ test.describe("Change username on settings", () => {
await usernameInput.fill("demousernamex");
// Click on save button
await page.click("[data-testid=update-username-btn]");
await page.click("[data-testid=update-username-btn-desktop]");
await Promise.all([
page.waitForResponse("**/viewer.updateProfile*"),
@ -84,7 +84,7 @@ test.describe("Change username on settings", () => {
await usernameInput.fill(`xx${testInfo.workerIndex}`);
// Click on save button
await page.click("[data-testid=update-username-btn]");
await page.click("[data-testid=update-username-btn-desktop]");
// Validate modal text fields
const currentUsernameText = page.locator("[data-testid=current-username]").innerText();
@ -130,7 +130,7 @@ test.describe("Change username on settings", () => {
await usernameInput.fill(`xx${testInfo.workerIndex}`);
// Click on save button
await page.click("[data-testid=update-username-btn]");
await page.click("[data-testid=update-username-btn-desktop]");
// Validate modal text fields
const currentUsernameText = page.locator("[data-testid=current-username]").innerText();

View File

@ -5,10 +5,10 @@ import { availabilityAsString } from "@calcom/lib/availability";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import { Availability } from "@calcom/prisma/client";
import { inferQueryOutput } from "@calcom/trpc/react";
import { Button } from "@calcom/ui";
import Dropdown, { DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@calcom/ui/Dropdown";
import { Icon } from "@calcom/ui/Icon";
import Badge from "@calcom/ui/v2/core/Badge";
import Button from "@calcom/ui/v2/core/Button";
export function ScheduleListItem({
schedule,
@ -61,8 +61,8 @@ export function ScheduleListItem({
</Link>
</div>
<Dropdown>
<DropdownMenuTrigger className="group mr-5 h-10 w-10 border border-transparent p-0 text-neutral-500 hover:border-gray-200">
<Icon.FiMoreHorizontal className="h-5 w-5 group-hover:text-gray-800" />
<DropdownMenuTrigger asChild className="mr-5">
<Button type="button" size="icon" color="minimalSecondary" StartIcon={Icon.FiMoreHorizontal} />
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem>
@ -74,7 +74,7 @@ export function ScheduleListItem({
});
}}
type="button"
color="warn"
color="destructive"
className="w-full font-normal"
StartIcon={isDeleting ? undefined : Icon.FiTrash}
loading={isDeleting}>