From 2e8adbe777c6af8ec7eb39aa0fb2afd0ec5fb425 Mon Sep 17 00:00:00 2001 From: "carlos.moura" Date: Thu, 11 Jun 2020 22:12:13 -0300 Subject: [PATCH 1/6] adding login page complete --- src/components/Linker.js | 75 ++++++++++++++++++----------------- src/components/LinkerAdmin.js | 75 ++++++++++++++++++----------------- src/components/Login.js | 36 ++++++++--------- src/css/global.css | 1 - src/css/linkcentral.css | 20 ---------- src/css/linker.css | 29 ++++++++++++++ src/css/login.css | 64 ++++++++++++++++++++++++++++++ 7 files changed, 187 insertions(+), 113 deletions(-) delete mode 100644 src/css/linkcentral.css diff --git a/src/components/Linker.js b/src/components/Linker.js index d251016..bba697b 100644 --- a/src/components/Linker.js +++ b/src/components/Linker.js @@ -4,7 +4,6 @@ import React, { useState, useEffect } from 'react'; import '../css/global.css'; import '../css/linker.css'; import '../css/profile.css'; -import '../css/linkcentral.css'; import '../css/description.css'; function Linker() { @@ -14,42 +13,44 @@ function Linker() { const [link, setLink] = useState('BEZPIX'); return ( -
- -
- Logo -

{name}

-
- - -
- -
-

SITE

-
- - -
-

PROJETOS

-
- - -
-

BLOG

-
- - -
-

CONTATO

-
- -
- - -
-

@bezpix_

-
- +
+
+ +
+ Logo +

{name}

+
+ + + + + +
+

@bezpix_

+
+ +
); diff --git a/src/components/LinkerAdmin.js b/src/components/LinkerAdmin.js index b5ec68c..cba0ccb 100644 --- a/src/components/LinkerAdmin.js +++ b/src/components/LinkerAdmin.js @@ -4,7 +4,6 @@ import React, { useState, useEffect } from 'react'; import '../css/global.css'; import '../css/linker.css'; import '../css/profile.css'; -import '../css/linkcentral.css'; import '../css/description.css'; function LinkerAdmin() { @@ -14,42 +13,44 @@ function LinkerAdmin() { const [link, setLink] = useState('BEZPIX'); return ( -
- -
- Logo -

{name}

-
- - -
- -
-

SITE

-
- - -
-

PROJETOS

-
- - -
-

BLOG

-
- - -
-

CONTATO

-
- -
- - -
-

@bezpix_

-
- +
+
+ +
+ Logo +

{name}

+
+ + + + + +
+

@bezpix_

+
+ +
); diff --git a/src/components/Login.js b/src/components/Login.js index 7c08db8..9e2e1f5 100644 --- a/src/components/Login.js +++ b/src/components/Login.js @@ -8,25 +8,25 @@ function LoginAdmin() { const [image, setImage] = useState(""); return( -
+
-
- Logo -

Access your mylinker account

-
- -
-
- - -
-
- - -
- -
-
+

MyLinker.me

+

Log in to access MyLinker admin

+ +
+
+
+ + +
+
+ + +
+ +
+
+
); } diff --git a/src/css/global.css b/src/css/global.css index 03fd761..dca0f76 100644 --- a/src/css/global.css +++ b/src/css/global.css @@ -12,7 +12,6 @@ html, body, #root { } body { - background: #7d40e7; background-position: center; background-size: cover; -webkit-font-smoothing: antialiased; diff --git a/src/css/linkcentral.css b/src/css/linkcentral.css deleted file mode 100644 index 6d38c8d..0000000 --- a/src/css/linkcentral.css +++ /dev/null @@ -1,20 +0,0 @@ -.linkcentral{ - margin-top: 40px; -} - -.linkcentral a { - text-decoration: none; -} - -.link { - margin-top: 20px; - padding: 15px 0px; - background-color: #222425; - border-radius: 20px; - text-align: center; -} - - .link h3 { - font-size: 14px; - color:white; -} diff --git a/src/css/linker.css b/src/css/linker.css index bed5243..4187dfe 100644 --- a/src/css/linker.css +++ b/src/css/linker.css @@ -1,5 +1,34 @@ +#conteiner-linker { + background: #7d40e7; + width: 100%; + height: 100%; +} + #linker { + width: 100%; + height: 100%; margin: 0 auto; max-width: 500px; padding: 60px; } + +.linkcentral{ + margin-top: 40px; +} + +.linkcentral a { + text-decoration: none; +} + +.link { + margin-top: 20px; + padding: 15px 0px; + background-color: #222425; + border-radius: 20px; + text-align: center; +} + + .link h3 { + font-size: 14px; + color:white; +} \ No newline at end of file diff --git a/src/css/login.css b/src/css/login.css index b2d09d2..019f4a0 100644 --- a/src/css/login.css +++ b/src/css/login.css @@ -1,3 +1,67 @@ +#conteiner-login { + background-color: #f5f6f8; + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + align-items: center; +} + +logo { + margin-top: 60px; + display: flex; + flex-direction: column; + align-items: center; +} + +logo h1 { + color: #36454f; +} + +logo h3 { + margin-top: 50px; + font-size: 20px; + color: #36454f; + text-align: center; +} + +form .input-block + .input-block { + margin-top: 20px; +} + +form .input-block label { + color: #acacac; + font-size: 16px; + display: block; +} + +form .input-block input { + width: 100%; + height: 32px; + font-size: 16px; + color: #666; + border: 0; + border-bottom: 1px solid #eee; +} + #login-admin { + width: 400px; + margin-top: 50px; background: white; + box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.02); + border-radius: 10px; + padding: 30px 20px; } + +form button[type=submit] { + width: 100%; + border: 0; + margin-top: 30px; + background: #36454f; + border-radius: 2px; + padding: 15px 15px; + font-size: 18px; + font-weight: bold; + color: #fff; + cursor: pointer; +} \ No newline at end of file From f9bfd64e3d758cdb44d9d8d3f1d15396f4a571f8 Mon Sep 17 00:00:00 2001 From: "carlos.moura" Date: Thu, 11 Jun 2020 23:25:16 -0300 Subject: [PATCH 2/6] v1 login page --- src/components/Login.js | 16 +++++++--- src/css/login.css | 69 ++++++++++++++++++++++++++++++++++------- 2 files changed, 70 insertions(+), 15 deletions(-) diff --git a/src/components/Login.js b/src/components/Login.js index 9e2e1f5..a049bcc 100644 --- a/src/components/Login.js +++ b/src/components/Login.js @@ -10,9 +10,9 @@ function LoginAdmin() { return(
-

MyLinker.me

-

Log in to access MyLinker admin

- +

MyLinker.me

+

Log in to access MyLinker admin

+
@@ -23,9 +23,17 @@ function LoginAdmin() {
- +
+ +

Remember me

+
+ +
Forgot your password? Click here
+
); diff --git a/src/css/login.css b/src/css/login.css index 019f4a0..e32ff18 100644 --- a/src/css/login.css +++ b/src/css/login.css @@ -2,13 +2,38 @@ background-color: #f5f6f8; width: 100%; height: 100%; + margin: 0 auto; + padding: 30px; display: flex; flex-direction: column; align-items: center; } +#create { + margin: 30px 0px; +} + +#create a { + text-decoration: none; + color: #36454f; + cursor: pointer; +} + +#create a:hover { + text-decoration: underline; +} + +#login-admin { + width: 100%; + max-width: 400px; + margin-top: 50px; + background: white; + box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.02); + border-radius: 10px; + padding: 30px 20px; +} + logo { - margin-top: 60px; display: flex; flex-direction: column; align-items: center; @@ -44,15 +69,6 @@ form .input-block input { border-bottom: 1px solid #eee; } -#login-admin { - width: 400px; - margin-top: 50px; - background: white; - box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.02); - border-radius: 10px; - padding: 30px 20px; -} - form button[type=submit] { width: 100%; border: 0; @@ -64,4 +80,35 @@ form button[type=submit] { font-weight: bold; color: #fff; cursor: pointer; -} \ No newline at end of file +} + +form h5 { + font-weight: lighter; + color: #36454f; + text-align: center; + margin-top: 20px; +} + +form h5 a { + text-decoration: none; + color: #36454f; + cursor: pointer; +} + +form h5 a:hover { + text-decoration: underline; +} + +#remember { + margin-top: 25px; + display: flex; + flex-direction: row; + align-items: baseline; +} + +#remember h4 { + margin-left: 5px; + font-weight: lighter; + color: #acacac; +} + From 052995c57c5c44d95780480ef882b6c09fed044f Mon Sep 17 00:00:00 2001 From: "carlos.moura" Date: Fri, 12 Jun 2020 00:32:15 -0300 Subject: [PATCH 3/6] clear css and starting admin menu --- src/components/LinkerAdmin.js | 44 +++++++++++++++++++++++++++++-- src/css/adminmenu.css | 49 +++++++++++++++++++++++++++++++++++ src/css/description.css | 11 -------- src/css/linker.css | 35 +++++++++++++++++++++++-- src/css/profile.css | 18 ------------- 5 files changed, 124 insertions(+), 33 deletions(-) create mode 100644 src/css/adminmenu.css delete mode 100644 src/css/description.css delete mode 100644 src/css/profile.css diff --git a/src/components/LinkerAdmin.js b/src/components/LinkerAdmin.js index cba0ccb..dbedf6a 100644 --- a/src/components/LinkerAdmin.js +++ b/src/components/LinkerAdmin.js @@ -3,22 +3,62 @@ import React, { useState, useEffect } from 'react'; //Styles imports import '../css/global.css'; import '../css/linker.css'; +import '../css/adminmenu.css'; import '../css/profile.css'; import '../css/description.css'; function LinkerAdmin() { const [image, setImage] = useState("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxAPDw8PDxIVFRUVFRUVFRUVFRUVFQ8VFRUXFxUVFRUYHSggGBolHRUVITEhJSkrLi4uFx8zRDMtNygvLisBCgoKDg0OGxAQGyslICU3MjY3LTc1LDItNzEtNzUyNTctNzUwLzAvMzAwNS0yLTcwLS0tNzU4LS0tNS0tNTg1Lf/AABEIAOAA4AMBIgACEQEDEQH/xAAcAAEBAAMAAwEAAAAAAAAAAAAAAQUGBwIECAP/xAA5EAACAQMCBAQFAQUIAwAAAAABAgADBBESIQUGEzEHQVFhFCJxgZGhIzJCUmIVJDVDgoSitFNysf/EABoBAQACAwEAAAAAAAAAAAAAAAACBAEDBgX/xAArEQEAAgEDAgQEBwAAAAAAAAAAAQIDBBESITEFE0FRIiNxkRQyobHR4fD/2gAMAwEAAhEDEQA/AO2xEQEREBERAREQEREBEksBJLEBERAREQEREBERAREQEREBJLEBERASSxAkSyQLJLEBJLECRLECRLEBJLECSxEBJLEBJEsCSxECRLJARLJAsREBERAREQEREBERAREQEkRAsREBEksCSxEBERASSyQEsRASRECxEQEREBEksBERAREQERECSxEBERAksRAREQEREBERAREQEksQERJAsk9PinFaFqnUuKgRewzuWPoqjcn6TC2nPvD6jhOoyZ2BdCqn/V5ffE20wZb15VrMx9EopaY3iGzRAOdxMfxnjVCzQVLh9IOyjuzn0VR3kK1m07VjeWIiZ6QyMk1G18RLF3Ct1aYP8TqNI+pViR9cTbUcMAykEEAgg5BB7EHzEnlw5MX56zDNqzXvCyzH8Z4zb2aCpcPpB2UblnPoqjczB2fiFYVH0E1Kedg1RAF+5UnH1OJmmny3ryrWZgilpjeIbZEisCARuDuD5GWaUSSWSBZJZICWIgJJZIFiIgIiSAiJYCIkgWSWIHGfES9erxCsjH5aWlEHkBpDE/Ukn8D0mtTpXP8AyhVrVTd2q6mIAqUxgMSowHXPfYAEe00u05Zvqr6FtqgOdy6lFX3LNgTrdHqcPkV2tEbR1ejjvXhDovhffPVsSjnPSqGmpP8ALpVgPtqI+mJo/iFdvU4jXVjtT0og/lGkMfyWJnT+W+EJw+0FIsNsvUfsCx3Y+wAAH0E5PxCnX4jd3Ne3o1HD1CQVUkBRsuT2BwBtKOhtS2qyZY6V9/r/AD1acUxOSbejCzrHhZdvUsnRjkU6pVfZSqtj7Fj+ZotpybxCo4X4dk9WfCqvuT3P2BnWOWuDLY2yUFOo7s7Yxrdu5x5DsB7ASfi2oxWxcImJndnUXrNdnKuf7x6vEa4Y7UyKaDyVQATj6kk/ea9Omc+8nVa9U3dqAzEAVKeQCxUYDrnYnAAI9pp1pyjf1XCC3dfVqg0KvuSe/wBsy3o9Vg8ivxRG0NmO9eMdXQPC+8erYlHJPSqNTU/06VYD7aiPpibhMXy1wZbG2SgpyRlnbtrdu5x6dgPYCZOczqb1vmtavaZUskxNpmCJNY9R+ZQc9poQWJJNY9R+RA8onjrHqPzKWA7mBYnjrHqPyJQwPYiBYn4NeUgSDUQEdwXUEfUZn6o4YZUgj1ByPyIFiR3CjLEAepIHft3hqgBAJAJ2AJwSfQesDyiSRagJIBGR3Gd1z2yPKB5SSxAREkD0OM8ZoWdPqXD6QdlAGWc+iqO//wAE1dvE203xRr+21MZ/57TUvEa6epxGsrE4phEQeQBQMT9yx/SazOh0nhWK2KL5N5meq5jwVmu8uk8P4pW45WaiV6VqgDVVUkvW3+VGfbAOCcDyB9pt3EeJWvDqK9QrTQfKiKNzjyRBNW8I1/u90cf5qjPrhBt+p/M1TxCu3q8Rrqx2p6UQeg0hj+SxP4mj8LXNqpwR0pX+v1R4cr8fSG82niLY1HCt1aYJxqdBp++liR+JtqOGAZSCCAQQcgg9iD5z52nWPCy7epZOjHIpVSqeylVbH2JP5mPEPDqYcfmY/sxmwxWN4bHxnjNCzQVLh9IOyjcs59FUbmYC08RbF30t1aYJxqdBp++liR9xNH8Qrt6nEa6sdqelEHko0hj+SxP4mtyxpvCcVsUWvM7z1Tpp6zXeX0SjhgGUggjIIOQQexB8xPKaZ4WXb1LJ0Y5FKqVX2UqrafsWP5m5zw8+KcWSaT6Kt68bTD5n5htOtxa6pDANS9qICRsC9cqCfbee/wAz8pXXBWo1DWX9oWCvRZ0ZSuCQdgR3G4npcwI7cWulpHFQ3tQIQcEOa5CEHyOcbz3ebuA8WoqlfiXUdQdAdqwrBCd9P7xK5x6Y2mpF17w/4vWveE061c6qmKqFu3U0FlDHHngDPuDOB8vcFe9r0bWiED1AdOvZflQsckAnsp8p3fw74zQu+GaaFLo9ANSamCWCnTq1BjuwbOcnfOe/ecJ4Bb3NWtRp2evrEHRofpvshLYfIx8obzgb7wXwpv6F1a1nNtpp1qVRsO5OlHVjgdPvgTavFDky54o9o1uaX7Jaobqsy/vmmRpwp/kP6TEcg8F43R4hSqX3xHRC1NXUuRUXJQhcp1DnfHlOj8c4tSsrerc1jhKYz7seyovuSQB9YHztzRynV4Y1NLhqBdwWC02Ziqg41NlBgE5A9cH0nR/A/gtSlSubxhpSvoSmMYLimX1P9Mtgf+pml8Gsbjj/ABRmqkgMepWYZxRpDYIh8tsKPufIz6AtrdKSJTpqFRFCqo2CqowAPtA0/lngdpcVOKPcW1Cq3x9ddVSkjsAFpkDLAnG5/M/Pmzgtvwy3fiPD6a21SgyOy0R06dzTLqr0qlNflbIJwcZBxPHl+5v0q8UFrbUKqfH1yWq3L0WDaaeRpWi+RjG+fPttMjccIvr801vzQpUFdajUKDPVa4ZGDItSs6rhAQCVC747wPLxI/w//c2X/bozJc0cH+Mt2RG0VUYVaFT/AMNemc02+mdj6hiJjfEj/D/9zZf9ujNoMDXKXNSHhxvXQiouab0P4xdBun8OP6jUwo9iD2nt8r8Ja1oftSGr1WNa4cfx1n/eA/pUYRf6VE1Cs6f2r8fpPwXxK0GOfkN6qGit2V7aQW6Gf5gD5ZnR4CIkgWSWIGk898nvdsLm2x1AAroTgVQOxB7Bh237jHpNKtuSuIVHCdAp6s7KFX3JBJP2BnW+M8ZoWdPqXD6QdlA3Zz6Ko7zVz4m2m+KNf22pjP8Az2nsaPU6yMXHHXeI7Ss475OO0Q2Hl7hFPh9qKWobZeo52DNj5m9gAAPoJyTiFOvxG7uK9vRqOHqEgqpICjZdR7A4A7zcbDilbjlZqBXpWqANVVWJetk/KjPtgHBOB5A+02ziXErXh1FeoVpoPlRFG7Y8kQSOPLk0uSd45ZLentv1+5FppPvMuT2nJ3EKjhPh2X1Z8Kq+5Pn9gZ1bl7hNPh9qtLUPly9RzsGY7s3sABj6ATXj4m2m+KNf22p7/wDPaerYcVrccrNQK9K1QBqqqxL1sn5abPtgHB2HkDv2mzVTqs9fmxxpHWf9+zN+do+LpDUOI06/Ebu4r29GpUDVCQVUkBRsuT2B0gd552nJ3EKjBRbsvqz4VV9yfP7AzrPEeJWvDqK9Qimg+VEUbnHkiiYG28SLJ30stZB/OyqQPqFYkfibaa/U2p8nH8MdPWeyUZbzHw16M9yzwVbG2Sgp1Hdnbtrc9zj07AewEys8KNVXVXQhlYAqQchgexB8xPOeFe1rWm1u8qkzMzvL5w5go3FPil1Wp0ahKXlSop6blSVrFlOw3GwmR47zDxjiyLbVKDFdQbRRt6g1MOxYnOwz6gTv2YzIsNK8N+WavDrCsLjAq1iXZQQemAmlUJGxbuTj1xvicW4E95Z1qVzQpVBUQHSTRZgNSlTkEejGfT0ZgcS4fz9xp61FHX5WqIrf3bHys4Db422J3nu+NVzc1LmhaIjmilMVflRiGqMzr8xA/hVdh/UZ2DMZgfOvLvHuJcOR0taRUO2pi1uWZiBgZYjsPIe59Z0rwx5kv76rdLfDARKZT9l08liwbfG/YToGYzA1vkxCG4pkEZ4hXIyCMgpS3HqNpskRA1nxEps1hhQSfiLM4AJOBd0iTgeQAJnt82XtZKSW9rnr3L9KmwBIoAjNSu3oETJGe7aR5zNxAxi8CtxZf2fozQ6XS0k7lcYJJ/m88987z0+UbusadS0usmvat0mcggXCYzSrg9jqXGfRgwmfiAklkgWSWIHGvEa6epxGsrdqYREHoCgY/ksf0mszqvPnJ73bC5tsdQKFdCcCqB+6QTsGHbfuMem+lW3JXEXcL0CnqzsoVfckEk/YGdXotXg8iscojaOy/jyV4x1bd4Rj+73Rx/mqM/RBt+p/M1bxFunqcRrKx2phEQegKKx/JY/pOocs8FWxtloKdRyWdsY1ue5x5DYAewE17nzk97txc22OpgK6E46oHYqTsGHbfuMem/m6fV4vxtsk9p7S00yV82ZcrnTvCNf2F0cb9VRn1wg2/U/majbclcRdwvw5T1Z2UKvuSCSfsDOq8s8FSxtloKdRyWdsY1ucZOPIbAD2AlrxXVYpw8K2iZn2bM968dolzHxHunqcRqqx2phEQegKK5P3LH9JrE6rz3ye92wubbHVC6XQnAqgfukHsGHbfuMdsTSrbkviLuF+HK+rOyBV9yQTn7AyxotXg8iscojaOyePJXhHVunhRdO1rWpscrTqfJ7BlyVH3yf9U3eYjljgi2NstFTqOSztjGtz3P0wAB7CZec5qslcma1q9plSyTE2mYYd6oBrMWbrL1CiE1NJUA6CtMEBxpwTjO+R3G351LysQ/SqBgq1WV+nkVSi0yq7bEZZwdOO2NiCZnIldBh69/Uo9QO2QoqaW0H53CUnRQB3OXqAAbnT7GW5r1gHbOQWdAoUjSBTZg2oHJOVx6bjz3OXzEDDVeIMEYlzrL6SoVR0P3sA6vXTjO+SRgbjH5niJam5qMVbSh6SgKyB9GKmWIOMk75wACO6mZ3M8BSUMXx8xABOT2BJAx5dzAwtpe1MUwSQcqArKSawNVld9R32UBtu3c7ET2nu6nxIp7BdsA4+dSuWYeZIO23oc9xjJxAw92ppPXqU9ZISkRl3KrrqOKjBSdOy7/YSUb6odOtwPlJTAB651OANXbIVUJ0+bZ7bTMxmBhmuaqaVqVAAVRmqaNkLB8oB2Ayg3Oe+O5Bn5i8qgFmPT1fMSUZsP0aBWmFO+5L7dzpIG8zsQMCt/VaoQTgBlBTbf9rTHyEfM2kFg2ds+onucHvWq9QnOBpK5ABGoHK/LkbY+o7Ge1Ss6asXUHJyf3mIBY5bSpOFydzgDM9iBIliAiIgIiSBZIiBYiICIiAiIgJJZIFiIgIklgIklgIiICIkgWIiAiJIFiJIFiIgIiICIiAkliAiIgSJZIFiJICWIgJJYgIiIEiWICIkgWSWICIiAiIgSWJIFiIgIiIEliIEiWICIiBJZJYCSWICIiBJYiBIliAiIgIiICSWICIiAiIgIiICJIgWSWSBYiSBYklgSWIgIklgIiICJJYCSIgWSWICIiBJYiAiIgIiIElklgSIlgJJYgSWIgIiICIiBJYiBIliBIlkgf/Z"); - const [name, setName] = useState('OPA'); + const [title, setTitle] = useState('OPA'); const [link, setLink] = useState('BEZPIX'); return (
+
Logo -

{name}

+

{title}

 diff --git a/src/css/adminmenu.css b/src/css/adminmenu.css new file mode 100644 index 0000000..15ba4a9 --- /dev/null +++ b/src/css/adminmenu.css @@ -0,0 +1,49 @@ +#menu nav { + width: 100%; + position: absolute; + top: 60px; + padding: 0px 20px; +} + +#menu nav div + div { + margin-top: 30px; +} + +#menu nav h3 { + font-size: 20px; + color: white; +} + +#menu nav input { + width: 100%; +} + +#link { + display: flex; + flex-direction: column; + margin-left: 0px !important; +} + +#check { + display: none; +} + +#check:checked ~ #barra { + transform: translateX(300px); +} + +#icone { + cursor: pointer; + padding: 15px; + position: absolute; + z-index: 1; +} + +#barra { + background: #222425; + height: 100%; + width: 300px; + position: absolute; + transition: all .1s linear; + left: -300px; +} \ No newline at end of file diff --git a/src/css/description.css b/src/css/description.css deleted file mode 100644 index 672fb65..0000000 --- a/src/css/description.css +++ /dev/null @@ -1,11 +0,0 @@ -description #description { - margin-top: 20px; -} - -description { - text-align: center; -} - -description h3 { - color: white; -} diff --git a/src/css/linker.css b/src/css/linker.css index 4187dfe..4e826a0 100644 --- a/src/css/linker.css +++ b/src/css/linker.css @@ -20,6 +20,25 @@ text-decoration: none; } +profile #profile { + width: 100%; + display: flex; + flex-direction: column; + align-items: center; +} + +profile img { + border-radius: 50%; + width: 100px; + height: 100px; +} + +profile h3 { + margin-top: 10px; + font-size: 30px; + color: white; +} + .link { margin-top: 20px; padding: 15px 0px; @@ -28,7 +47,19 @@ text-align: center; } - .link h3 { +.link h3 { font-size: 14px; color:white; -} \ No newline at end of file +} + +description #description { + margin-top: 20px; +} + +description { + text-align: center; +} + +description h3 { + color: white; +} diff --git a/src/css/profile.css b/src/css/profile.css deleted file mode 100644 index 8cb5d2e..0000000 --- a/src/css/profile.css +++ /dev/null @@ -1,18 +0,0 @@ -profile #profile { - width: 100%; - display: flex; - flex-direction: column; - align-items: center; -} - -profile img { - border-radius: 50%; - width: 100px; - height: 100px; -} - -profile h3 { - margin-top: 10px; - font-size: 30px; - color: white; -} From 216ae603a0e8681753f700e3fca653d9c9bf9195 Mon Sep 17 00:00:00 2001 From: "carlos.moura" Date: Fri, 12 Jun 2020 00:33:54 -0300 Subject: [PATCH 4/6] clear css imports --- src/components/Linker.js | 2 -- src/components/LinkerAdmin.js | 2 -- 2 files changed, 4 deletions(-) diff --git a/src/components/Linker.js b/src/components/Linker.js index bba697b..8390f0b 100644 --- a/src/components/Linker.js +++ b/src/components/Linker.js @@ -3,8 +3,6 @@ import React, { useState, useEffect } from 'react'; //Styles imported import '../css/global.css'; import '../css/linker.css'; -import '../css/profile.css'; -import '../css/description.css'; function Linker() { diff --git a/src/components/LinkerAdmin.js b/src/components/LinkerAdmin.js index dbedf6a..f19a323 100644 --- a/src/components/LinkerAdmin.js +++ b/src/components/LinkerAdmin.js @@ -4,8 +4,6 @@ import React, { useState, useEffect } from 'react'; import '../css/global.css'; import '../css/linker.css'; import '../css/adminmenu.css'; -import '../css/profile.css'; -import '../css/description.css'; function LinkerAdmin() { From 11b60a91c87d5628d351a03e837200f80690fffe Mon Sep 17 00:00:00 2001 From: "carlos.moura" Date: Fri, 12 Jun 2020 00:57:55 -0300 Subject: [PATCH 5/6] styling inputs in admin menu --- src/components/LinkerAdmin.js | 8 ++++---- src/components/Login.js | 1 + src/css/adminmenu.css | 17 ++++++++++++++++- 3 files changed, 21 insertions(+), 5 deletions(-) diff --git a/src/components/LinkerAdmin.js b/src/components/LinkerAdmin.js index f19a323..ec8a3e9 100644 --- a/src/components/LinkerAdmin.js +++ b/src/components/LinkerAdmin.js @@ -33,20 +33,20 @@ function LinkerAdmin() {

Title

- +

Description

- +
diff --git a/src/components/Login.js b/src/components/Login.js index a049bcc..3ee234f 100644 --- a/src/components/Login.js +++ b/src/components/Login.js @@ -1,6 +1,7 @@ import React, { useState } from 'react'; //Styles +import '../css/global.css'; import '../css/login.css'; function LoginAdmin() { diff --git a/src/css/adminmenu.css b/src/css/adminmenu.css index 15ba4a9..a2daffa 100644 --- a/src/css/adminmenu.css +++ b/src/css/adminmenu.css @@ -5,8 +5,23 @@ padding: 0px 20px; } +.conteiner-info { + margin-top: 20px; +} + +.input-menu { + padding: 10px; + border: none; + border-radius: 5px; + font-size: 16px; +} + +.input-menu + .input-menu { + margin-top: 10px; +} + #menu nav div + div { - margin-top: 30px; + margin-top: 40px; } #menu nav h3 { From 1f1c3e61b4b717b7ad60e7441a271002a2dae040 Mon Sep 17 00:00:00 2001 From: "carlos.moura" Date: Fri, 12 Jun 2020 04:05:17 -0300 Subject: [PATCH 6/6] continuing edit menu admin --- package.json | 2 ++ src/components/LinkerAdmin.js | 9 +++++-- src/css/adminmenu.css | 16 ++++++++----- src/css/linker.css | 1 + yarn.lock | 45 +++++++++++++++++++++++++++++++++-- 5 files changed, 63 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index a278d2a..f714c7b 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,9 @@ "@testing-library/react": "^9.3.2", "@testing-library/user-event": "^7.1.2", "react": "^16.13.1", + "react-color": "^2.18.1", "react-dom": "^16.13.1", + "react-icons": "^3.10.0", "react-router-dom": "^5.2.0", "react-scripts": "3.4.1" }, diff --git a/src/components/LinkerAdmin.js b/src/components/LinkerAdmin.js index ec8a3e9..27a0978 100644 --- a/src/components/LinkerAdmin.js +++ b/src/components/LinkerAdmin.js @@ -1,4 +1,6 @@ import React, { useState, useEffect } from 'react'; +import { SketchPicker } from 'react-color'; +import { FiMenu } from 'react-icons/fi'; //Styles imports import '../css/global.css'; @@ -11,17 +13,20 @@ function LinkerAdmin() { const [title, setTitle] = useState('OPA'); const [link, setLink] = useState('BEZPIX'); + const [color, setColor] = useState('#fff'); + const [showColorPicker, setColorPicker] = useState(false); + return (