Watermark

EuJinnLucaShow · Jun 30, 2023 · dceda43 · dceda43
1 parent 9913e04
commit dceda43
Showing 1 changed file with 13 additions and 9 deletions.
diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx
@@ -1,4 +1,5 @@
 import { BiSolidEditAlt } from 'react-icons/bi';
+import { Watermark } from 'antd';
 import {
   FcBusinessContact,
   FcCellPhone,
@@ -8,6 +9,7 @@ import {
 const styles = {
   container: {
     minHeight: 'calc(50vh - 50px)',
+    minWidth: 'calc(50vw - 50px)',
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',
@@ -21,15 +23,17 @@ const styles = {
 };
 
 const Home = () => (
-  <div style={styles.container}>
-    <h1 style={styles.title}>Home page of the Phonebook</h1>
-    <p>
-      <BiSolidEditAlt size="75" fill="#2b35c2" />
-      <FcCellPhone size="75" />
-      <FcConferenceCall size="75" />
-      <FcBusinessContact size="75" />
-    </p>
-  </div>
+  <Watermark gap={[50, 50]} content="Phonebook">
+    <div style={styles.container}>
+      <h1 style={styles.title}>Home page of the Phonebook</h1>
+      <p>
+        <BiSolidEditAlt size="75" fill="#2b35c2" />
+        <FcCellPhone size="75" />
+        <FcConferenceCall size="75" />
+        <FcBusinessContact size="75" />
+      </p>
+    </div>
+  </Watermark>
 );
 
 export default Home;