From 7567fddf59bb45aa357fdb435b9ded5b342e9d6b Mon Sep 17 00:00:00 2001 From: andreasrys <andrerys@stud.ntnu.no> Date: Mon, 4 Oct 2021 21:38:57 +0200 Subject: [PATCH] improve styling --- package.json | 1 + src/pages/overviewPage/Overview.tsx | 1 - src/pages/overviewPage/overview.module.css | 19 ++++++++++--------- yarn.lock | 12 ++++++++++++ 4 files changed, 23 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index 3ac552c..2ce010b 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "dotenv": "^10.0.0", "react": "^17.0.2", "react-datepicker": "^4.2.1", + "react-device-detect": "^2.0.1", "react-dom": "^17.0.2", "react-dotenv": "^0.1.3", "react-loader-spinner": "^4.0.0", diff --git a/src/pages/overviewPage/Overview.tsx b/src/pages/overviewPage/Overview.tsx index b30e08e..55dec75 100644 --- a/src/pages/overviewPage/Overview.tsx +++ b/src/pages/overviewPage/Overview.tsx @@ -12,7 +12,6 @@ const OverviewPage = () => { const history = useHistory(); const {data, isLoading, error} = useGitlabApi(queryTypes.Languages); - return ( <div className={style.wrapper}> <div className={style.stats}> diff --git a/src/pages/overviewPage/overview.module.css b/src/pages/overviewPage/overview.module.css index 121c042..e9c52ca 100644 --- a/src/pages/overviewPage/overview.module.css +++ b/src/pages/overviewPage/overview.module.css @@ -4,9 +4,10 @@ grid-template-columns: 1fr 4fr; grid-column-gap: 1em; grid-row-gap: 1em; + } -.stats{ +.stats { background-color: lightgrey; border-radius: 10px; padding: 20px; @@ -15,21 +16,21 @@ } -.buttons{ +.buttons { background-color: lightcoral; border-radius: 10px; padding: 20px; } -.buttonWrapper{ - display: flex; - flex-direction: row; - justify-content: center; - width: 100%; - height: 100%; +.buttonWrapper { + display: flex; + flex-direction: row; + justify-content: center; + width: 100%; + height: 100%; } -.button{ +.button { background: #8ECAE6; cursor: pointer; width: 250px; diff --git a/yarn.lock b/yarn.lock index 90e8a46..8312d75 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9727,6 +9727,13 @@ react-dev-utils@^11.0.3: strip-ansi "6.0.0" text-table "0.2.0" +react-device-detect@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/react-device-detect/-/react-device-detect-2.0.1.tgz#663530bafe1dad333b67eae4252556244f45c2fc" + integrity sha512-DrDKiKky/L/DSEJUw5CL2I38s/18zCLIoKP4pE4CyO1FyL6XhQZMIjHmv0pbYQBlfdKB+ZUXP53tWeLkt0eqJw== + dependencies: + ua-parser-js "^0.7.28" + react-dom@^17.0.2: version "17.0.2" resolved "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz" @@ -11573,6 +11580,11 @@ typescript@^4.1.2: resolved "https://registry.npmjs.org/typescript/-/typescript-4.4.3.tgz" integrity sha512-4xfscpisVgqqDfPaJo5vkd+Qd/ItkoagnHpufr+i2QCHBsNYp+G7UAoyFl8aPtx879u38wPV65rZ8qbGZijalA== +ua-parser-js@^0.7.28: + version "0.7.28" + resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.28.tgz#8ba04e653f35ce210239c64661685bf9121dec31" + integrity sha512-6Gurc1n//gjp9eQNXjD9O3M/sMwVtN5S8Lv9bvOYBfKfDNiIIhqiyi01vMBO45u4zkDE420w/e0se7Vs+sIg+g== + unicode-canonical-property-names-ecmascript@^1.0.4: version "1.0.4" resolved "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz" -- GitLab