This is an automated email from the ASF dual-hosted git repository.
klesh pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-devlake.git
The following commit(s) were added to refs/heads/main by this push:
new 3ac470f65 feat: support logo horizontal mode in onboard (#7330)
3ac470f65 is described below
commit 3ac470f65ef68e77cdd19e5757a40863f7a7e99e
Author: 青湛 <[email protected]>
AuthorDate: Tue Apr 16 12:06:24 2024 +0800
feat: support logo horizontal mode in onboard (#7330)
---
config-ui/src/components/logo/index.tsx | 6 ++++--
config-ui/src/images/logo-horizontal.svg | 32 ++++++++++++++++++++++++++++++++
config-ui/src/routes/onboard/step-0.tsx | 2 +-
3 files changed, 37 insertions(+), 3 deletions(-)
diff --git a/config-ui/src/components/logo/index.tsx
b/config-ui/src/components/logo/index.tsx
index bc68a8e65..1de4ab241 100644
--- a/config-ui/src/components/logo/index.tsx
+++ b/config-ui/src/components/logo/index.tsx
@@ -19,6 +19,7 @@
import styled from 'styled-components';
import LogoImg from '@/images/logo.svg';
+import LogoHorizontalImg from '@/images/logo-horizontal.svg';
const Wrapper = styled.div`
display: flex;
@@ -27,12 +28,13 @@ const Wrapper = styled.div`
interface Props {
style?: React.CSSProperties;
+ direction?: 'vertical' | 'horizontal';
}
-export const Logo = ({ style }: Props) => {
+export const Logo = ({ style, direction = 'vertical' }: Props) => {
return (
<Wrapper style={style}>
- <img src={LogoImg} alt="Logo" />
+ <img src={direction === 'horizontal' ? LogoHorizontalImg : LogoImg}
alt="Logo" />
</Wrapper>
);
};
diff --git a/config-ui/src/images/logo-horizontal.svg
b/config-ui/src/images/logo-horizontal.svg
new file mode 100644
index 000000000..9f1faf1a3
--- /dev/null
+++ b/config-ui/src/images/logo-horizontal.svg
@@ -0,0 +1,32 @@
+<!--
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements. See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+<svg width="187" height="36" viewBox="0 0 187 36" fill="none"
xmlns="http://www.w3.org/2000/svg";>
+ <circle cx="18" cy="18" r="18" fill="#7497F7" />
+ <path
+ d="M27.2666 21.181C26.1398 21.2072 25.1051 21.1333 24.1477 20.9814C25.2268
20.0089 25.8614 18.6709 25.7828 17.2248C25.7085 15.859 25.0105 14.6518 23.9395
13.7958C25.3751 13.1847 27.0381 12.2308 27.8974 10.87C28.8945 9.29095 28.2836
7.9597 27.7952 7.2734C27.6 6.99904 27.1407 6.97372 26.8572 7.22317L20.8358
12.5224C20.5172 12.484 20.1906 12.4688 19.8585 12.4773C20.8683 11.2836 21.8612
9.71261 22.1299 7.94704C22.4797 5.6488 21.2764 4.53028 20.4771 4.05164C20.1577
3.86044 19.6731 4.09132 [...]
+ fill="white" />
+ <path
+ d="M17.5752 16.2335C17.5752 16.9933 18.1916 17.6087 18.9517
17.6087C19.7122 17.6087 20.3282 16.9933 20.3282 16.2335C20.3282 15.4738 19.7122
14.8584 18.9517 14.8584C18.1912 14.8584 17.5752 15.4738 17.5752 16.2335Z"
+ fill="#FF8B8B" />
+ <path fill-rule="evenodd" clip-rule="evenodd"
+ d="M4.87944 30.3233C3.55275 28.9114 2.4514 27.2852 1.63281 25.5023C4.26934
24.7055 7.85283 23.9614 11.7492 23.9614C14.6874 23.9614 16.9138 24.5121 18.9732
25.0214L18.9821 25.0236L19.0035 25.0289C21.0338 25.531 22.9621 26.0079 25.6729
26.1284C29.0401 26.278 32.1903 25.4279 34.7304 24.6526C33.6961 27.2516 32.0737
29.5527 30.0276 31.3917C28.5696 31.5943 27.0189 31.6997 25.4285 31.629C22.1695
31.4842 19.8012 30.8983 17.757 30.3926L17.6601 30.3686C15.6174 29.8634 13.9607
29.4675 11.7492 2 [...]
+ fill="white" />
+ <path fill-rule="evenodd" clip-rule="evenodd"
+ d="M43.7135 26.2439H41L44.298 14.2072C44.6551 12.9037 45.8398 12 47.1914
12H50.7464C51.898 12 52.8117 12.9702 52.7428 14.1198L52.0155
26.2439H49.3829L49.7814 21.3181H45.0469L43.7135 26.2439ZM50.3003
14.9061L49.9692 18.9988H45.6746L46.7581 14.9964C46.8761 14.5604 47.2717 14.2577
47.7233 14.2577H49.7023C50.0527 14.2577 50.3286 14.5568 50.3003
14.9061ZM96.3583 17.5699L94.9742 26.4657H92.6015L93.8669 18.3513C93.946 17.7702
93.8274 17.7502 93.3331 17.7502H89.5367L88.1922 26.4657H85.8195L8 [...]
+ fill="#7497F7" />
+</svg>
+
\ No newline at end of file
diff --git a/config-ui/src/routes/onboard/step-0.tsx
b/config-ui/src/routes/onboard/step-0.tsx
index e880c3857..4a793d502 100644
--- a/config-ui/src/routes/onboard/step-0.tsx
+++ b/config-ui/src/routes/onboard/step-0.tsx
@@ -59,7 +59,7 @@ interface Props {
title?: React.ReactNode;
}
-export const Step0 = ({ logo = <Logo />, title = 'DevLake' }: Props) => {
+export const Step0 = ({ logo = <Logo direction="horizontal" />, title =
'DevLake' }: Props) => {
const [operating, setOperating] = useState(false);
const { step, records, done, projectName, plugin, setStep } =
useContext(Context);
