From 0c66780fdaf883c8c3ccb9cd9b4ffbfe764dc847 Mon Sep 17 00:00:00 2001
From: JimmFly <yangjinfei001@gmail.com>
Date: Tue, 11 Jul 2023 14:44:06 +0800
Subject: [PATCH] style: modify the style of community item (#3143)

(cherry picked from commit b2fed03f30a0cb2271bd769ba5c1018c84babb1c)
---
 .../new-workspace-setting-detail/publish.tsx  | 35 +++++++------------
 .../new-workspace-setting-detail/style.css.ts | 16 +++++++--
 .../general-setting/about/style.css.ts        |  5 ++-
 packages/i18n/src/resources/en.json           |  4 ++-
 4 files changed, 30 insertions(+), 30 deletions(-)

diff --git a/apps/web/src/components/affine/new-workspace-setting-detail/publish.tsx b/apps/web/src/components/affine/new-workspace-setting-detail/publish.tsx
index f97a29707f..cf002e6eb6 100644
--- a/apps/web/src/components/affine/new-workspace-setting-detail/publish.tsx
+++ b/apps/web/src/components/affine/new-workspace-setting-detail/publish.tsx
@@ -1,4 +1,4 @@
-import { Button, FlexWrapper, Switch } from '@affine/component';
+import { Button, FlexWrapper, Switch, Tooltip } from '@affine/component';
 import { SettingRow } from '@affine/component/setting-components';
 import { Unreachable } from '@affine/env/constant';
 import type {
@@ -92,30 +92,19 @@ const PublishPanelAffine: FC<PublishPanelAffineProps> = props => {
 
 const FakePublishPanelAffine: FC<{
   workspace: AffineOfficialWorkspace;
-}> = ({ workspace }) => {
+}> = () => {
   const t = useAFFiNEI18N();
-  const [origin, setOrigin] = useState('');
-  const shareUrl = origin + '/public-workspace/' + workspace.id;
-
-  useEffect(() => {
-    setOrigin(
-      typeof window !== 'undefined' && window.location.origin
-        ? window.location.origin
-        : ''
-    );
-  }, []);
   return (
-    <div className={style.fakeWrapper}>
-      <SettingRow name={t['Publish']()} desc={t['Unpublished hint']()}>
-        <Switch checked={false} />
-      </SettingRow>
-      <FlexWrapper justifyContent="space-between">
-        <Button className={style.urlButton} size="middle" title={shareUrl}>
-          {shareUrl}
-        </Button>
-        <Button size="middle">{t['Copy']()}</Button>
-      </FlexWrapper>
-    </div>
+    <Tooltip
+      content={t['com.affine.settings.workspace.publish.local-tooltip']()}
+      placement="top"
+    >
+      <div className={style.fakeWrapper}>
+        <SettingRow name={t['Publish']()} desc={t['Unpublished hint']()}>
+          <Switch checked={false} />
+        </SettingRow>
+      </div>
+    </Tooltip>
   );
 };
 const PublishPanelLocal: FC<PublishPanelLocalProps> = ({
diff --git a/apps/web/src/components/affine/new-workspace-setting-detail/style.css.ts b/apps/web/src/components/affine/new-workspace-setting-detail/style.css.ts
index e7e62dd66f..b7ee826852 100644
--- a/apps/web/src/components/affine/new-workspace-setting-detail/style.css.ts
+++ b/apps/web/src/components/affine/new-workspace-setting-detail/style.css.ts
@@ -57,7 +57,17 @@ globalStyle(`${urlButton} span`, {
 
 export const fakeWrapper = style({
   position: 'relative',
-  borderRadius: '8px',
-  background: 'var(--affine-white-60)',
-  padding: '10px',
+  opacity: 0.4,
+  marginTop: '24px',
+  selectors: {
+    '&::after': {
+      content: '""',
+      width: '100%',
+      height: '100%',
+      position: 'absolute',
+      left: 0,
+      top: 0,
+      cursor: 'not-allowed',
+    },
+  },
 });
diff --git a/apps/web/src/components/affine/setting-modal/general-setting/about/style.css.ts b/apps/web/src/components/affine/setting-modal/general-setting/about/style.css.ts
index fa1da6478b..a40a830192 100644
--- a/apps/web/src/components/affine/setting-modal/general-setting/about/style.css.ts
+++ b/apps/web/src/components/affine/setting-modal/general-setting/about/style.css.ts
@@ -23,9 +23,8 @@ globalStyle(`${link} .icon`, {
 
 export const communityWrapper = style({
   display: 'grid',
-  justifyContent: 'space-between',
-  gridTemplateColumns: 'repeat(auto-fill, 70px)',
-  gridGap: '6px',
+  gridTemplateColumns: '15% 15% 15% 15% 15% 15%',
+  gap: '2%',
 });
 export const communityItem = style({
   borderRadius: '8px',
diff --git a/packages/i18n/src/resources/en.json b/packages/i18n/src/resources/en.json
index b3db8c6e7b..ad1cc3f0b8 100644
--- a/packages/i18n/src/resources/en.json
+++ b/packages/i18n/src/resources/en.json
@@ -407,5 +407,7 @@
   "You can customize your workspace here.": "You can customise your workspace here.",
   "Font Style": "Font Style",
   "Choose your font style": "Choose your font style",
-  "Switch": "Switch"
+  "Switch": "Switch",
+  "com.affine.settings.workspace.publish.local-tooltip": "Enable AFFiNE Cloud to publish this Workspace",
+  "com.affine.settings.workspace.member.local-tooltip": "Enable AFFiNE Cloud to collaborate with others"
 }