[WEB-808] style: workspace settings mobile responsiveness (#4047)

* [WEB-808] style: workspace settings mobile responsiveness

* fix: scroll on mobile-view

* responsiveness fixes

---------

Co-authored-by: LAKHAN BAHETI <lakhanbaheti9@gmail.com>
This commit is contained in:
Ramesh Kumar Chandra 2024-04-29 12:59:04 +05:30 committed by GitHub
parent 0c880bbbc8
commit 9c8b4afc20
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
16 changed files with 140 additions and 128 deletions

View file

@ -111,7 +111,7 @@ export const CreateApiTokenModal: React.FC<Props> = (props) => {
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
>
<Dialog.Panel className="relative transform rounded-lg bg-custom-background-100 p-5 px-4 text-left shadow-custom-shadow-md transition-all sm:w-full sm:max-w-2xl">
<Dialog.Panel className="relative transform rounded-lg bg-custom-background-100 p-5 px-4 text-left shadow-custom-shadow-md transition-all w-full sm:max-w-2xl">
{generatedToken ? (
<GeneratedTokenDetails handleClose={handleClose} tokenDetails={generatedToken} />
) : (

View file

@ -28,8 +28,8 @@ export const GeneratedTokenDetails: React.FC<Props> = (props) => {
};
return (
<div>
<div className="space-y-3">
<div className="w-full">
<div className="w-full space-y-3 text-wrap">
<h3 className="text-lg font-medium leading-6 text-custom-text-100">Key created</h3>
<p className="text-sm text-custom-text-400">
Copy and save this secret key in Plane Pages. You can{"'"}t see this key after you hit Close. A CSV file
@ -39,11 +39,11 @@ export const GeneratedTokenDetails: React.FC<Props> = (props) => {
<button
type="button"
onClick={() => copyApiToken(tokenDetails.token ?? "")}
className="mt-4 flex w-full items-center justify-between rounded-md border-[0.5px] border-custom-border-200 px-3 py-2 text-sm font-medium outline-none"
className="mt-4 flex truncate w-full items-center justify-between rounded-md border-[0.5px] border-custom-border-200 px-3 py-2 text-sm font-medium outline-none"
>
{tokenDetails.token}
<span className="truncate pr-2">{tokenDetails.token}</span>
<Tooltip tooltipContent="Copy secret key" isMobile={isMobile}>
<Copy className="h-4 w-4 text-custom-text-400" />
<Copy className="h-4 w-4 text-custom-text-400 flex-shrink-0" />
</Tooltip>
</button>
<div className="mt-6 flex items-center justify-between">