wkc/lcm-potty-chart
Archived
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Styling. Dynalically genrated the days of the month using date fns.

Browse Source
This commit is contained in:
Lucid Kobold
2021-11-16 01:57:09 -06:00
parent 565f582b88
commit ff53c7b9c1
3 changed files with 93 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
component/calender/index.tsx
View File

@@ -1,16 +1,24 @@
import React from "react";
import { Box, SimpleGrid } from "@chakra-ui/react";
import { endOfMonth, getDate } from 'date-fns';
const Calender = (): JSX.Element => {
const today = new Date;
const endOfCurrMonth = endOfMonth(today);
const lastDay = getDate(endOfCurrMonth);
console.info(`This month has ${lastDay} days.`);
const daysArr = [];
for (let i = daysArr.length; i < 31; i++) {
for (let i = daysArr.length; i < lastDay; i++) {
daysArr.push(daysArr.length + 1);
}
return (
<SimpleGrid
px={10}
spacing="5px"
bg="brand.main"
px={6}
spacing={2}
// bg="brand.main"
w="100%"
h="100vh"
columns={7}
@@ -18,7 +26,8 @@ const Calender = (): JSX.Element => {
{daysArr.map((day) => {
return (
<Box
bg="brand.primary"
bg="transparent"
border="2px solid #0068ff"
w="100%"
h="100%"
key={day}

3
package.json
View File

@@ -21,8 +21,9 @@
"@emotion/styled": "^11.6.0",
"@iconify/react": "^3.1.0",
"@types/react": "^17.0.34",
"date-fns": "^2.25.0",
"framer-motion": "^5.3.0",
"next": "12.0.3",
"next": "12.0.4",
"react": "17.0.2",
"react-dom": "17.0.2",
"sharp": "^0.29.3"

146
yarn.lock
View File

@@ -1201,10 +1201,10 @@ __metadata:
languageName: node
linkType: hard
"@next/env@npm:12.0.3":
version: 12.0.3
resolution: "@next/env@npm:12.0.3"
checksum: 45fde5f6695b9c227ae7e8bfcccbf0c6cb1985cbd41a7298614050542dd8b5cd4c417879d94586deaed2a213cea31b02111d6c1491cc52ce33f5a9ffcc758031
"@next/env@npm:12.0.4":
version: 12.0.4
resolution: "@next/env@npm:12.0.4"
checksum: a7bb0bdff4a061e00b559582268f787f6f636003560f83f3624f035a9220356f50fc6ce5d1db620df5b183a40182bf5647a7bc33b15a1fb008ea7ca8e2b78d54
languageName: node
linkType: hard
@@ -1217,16 +1217,16 @@ __metadata:
languageName: node
linkType: hard
"@next/polyfill-module@npm:12.0.3":
version: 12.0.3
resolution: "@next/polyfill-module@npm:12.0.3"
checksum: 828e0323a32faaa30545971a1339819a2389956a740915b6e32d911f86e9389b86d36b80da288a2077836bae68eb2ca0765f9aaead0a6ecd8a53b6281372833c
"@next/polyfill-module@npm:12.0.4":
version: 12.0.4
resolution: "@next/polyfill-module@npm:12.0.4"
checksum: 701f563ef8fbd0fb21d321713061e04e26b6ac7fd304ff0456f39495a2fd10f50539fcd5fcd22aee078993a7f7539f34e7532df4f9fa7add31aed5614daa2304
languageName: node
linkType: hard
"@next/react-dev-overlay@npm:12.0.3":
version: 12.0.3
resolution: "@next/react-dev-overlay@npm:12.0.3"
"@next/react-dev-overlay@npm:12.0.4":
version: 12.0.4
resolution: "@next/react-dev-overlay@npm:12.0.4"
dependencies:
"@babel/code-frame": 7.12.11
anser: 1.4.9
@@ -1246,96 +1246,96 @@ __metadata:
peerDependenciesMeta:
webpack:
optional: true
checksum: c5433992c190027a614a364f565469194c9a5e8c2587054a1ce169bb47e22e2c8f3e6f54c8b435898ceb29fd003c0a8eb383160e6424ead63a404300d331d706
checksum: ac54baf04117cf815f4872aba701b583312969cbf1ff882a471b8dc12c3bc5a5e2c59f530e6d97447afdf7bddc1edbf9d961b5c34b54691d13d4d0cf85a26f12
languageName: node
linkType: hard
"@next/react-refresh-utils@npm:12.0.3":
version: 12.0.3
resolution: "@next/react-refresh-utils@npm:12.0.3"
"@next/react-refresh-utils@npm:12.0.4":
version: 12.0.4
resolution: "@next/react-refresh-utils@npm:12.0.4"
peerDependencies:
react-refresh: 0.8.3
webpack: ^4 || ^5
peerDependenciesMeta:
webpack:
optional: true
checksum: 7e9c6ea48011cb97adf9e789adee580be1171c6db35835780e576ad11104afa5ed78caef9f479179ab769c77fbe96926bc3806bfa52ebc75ee188c89aa178386
checksum: 7c1c9c32848abda86f898950f9710121200b376fd58f248403e8205c12c8934ed11f230a2adf1f3d8f8ca692a7aa6abdc536bcbf02c99a9cb93f9c2ad3d2c6cf
languageName: node
linkType: hard
"@next/swc-android-arm64@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-android-arm64@npm:12.0.3"
"@next/swc-android-arm64@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-android-arm64@npm:12.0.4"
conditions: os=android & cpu=arm64
languageName: node
linkType: hard
"@next/swc-darwin-arm64@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-darwin-arm64@npm:12.0.3"
"@next/swc-darwin-arm64@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-darwin-arm64@npm:12.0.4"
conditions: os=darwin & cpu=arm64
languageName: node
linkType: hard
"@next/swc-darwin-x64@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-darwin-x64@npm:12.0.3"
"@next/swc-darwin-x64@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-darwin-x64@npm:12.0.4"
conditions: os=darwin & cpu=x64
languageName: node
linkType: hard
"@next/swc-linux-arm-gnueabihf@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-linux-arm-gnueabihf@npm:12.0.3"
"@next/swc-linux-arm-gnueabihf@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-linux-arm-gnueabihf@npm:12.0.4"
conditions: os=linux & cpu=arm
languageName: node
linkType: hard
"@next/swc-linux-arm64-gnu@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-linux-arm64-gnu@npm:12.0.3"
"@next/swc-linux-arm64-gnu@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-linux-arm64-gnu@npm:12.0.4"
conditions: os=linux & cpu=arm64
languageName: node
linkType: hard
"@next/swc-linux-arm64-musl@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-linux-arm64-musl@npm:12.0.3"
"@next/swc-linux-arm64-musl@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-linux-arm64-musl@npm:12.0.4"
conditions: os=linux & cpu=arm64
languageName: node
linkType: hard
"@next/swc-linux-x64-gnu@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-linux-x64-gnu@npm:12.0.3"
"@next/swc-linux-x64-gnu@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-linux-x64-gnu@npm:12.0.4"
conditions: os=linux & cpu=x64
languageName: node
linkType: hard
"@next/swc-linux-x64-musl@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-linux-x64-musl@npm:12.0.3"
"@next/swc-linux-x64-musl@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-linux-x64-musl@npm:12.0.4"
conditions: os=linux & cpu=x64
languageName: node
linkType: hard
"@next/swc-win32-arm64-msvc@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-win32-arm64-msvc@npm:12.0.3"
"@next/swc-win32-arm64-msvc@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-win32-arm64-msvc@npm:12.0.4"
conditions: os=win32 & cpu=arm64
languageName: node
linkType: hard
"@next/swc-win32-ia32-msvc@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-win32-ia32-msvc@npm:12.0.3"
"@next/swc-win32-ia32-msvc@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-win32-ia32-msvc@npm:12.0.4"
conditions: os=win32 & cpu=ia32
languageName: node
linkType: hard
"@next/swc-win32-x64-msvc@npm:12.0.3":
version: 12.0.3
resolution: "@next/swc-win32-x64-msvc@npm:12.0.3"
"@next/swc-win32-x64-msvc@npm:12.0.4":
version: 12.0.4
resolution: "@next/swc-win32-x64-msvc@npm:12.0.4"
conditions: os=win32 & cpu=x64
languageName: node
linkType: hard
@@ -2611,6 +2611,13 @@ __metadata:
languageName: node
linkType: hard
"date-fns@npm:^2.25.0":
version: 2.25.0
resolution: "date-fns@npm:2.25.0"
checksum: 8896dc1dde0ee5ef77616942423bfa11fa2017a5ac19457293b7aaedc8822ff94f0a14eaf93da573b09b601dc0149eb430988a046cc9f79a2eb15f8c66c9c50c
languageName: node
linkType: hard
"debug@npm:2, debug@npm:^2.6.9":
version: 2.6.9
resolution: "debug@npm:2.6.9"
@@ -4348,6 +4355,7 @@ __metadata:
"@iconify/react": ^3.1.0
"@types/react": ^17.0.34
"@typescript-eslint/eslint-plugin": ^5.3.1
date-fns: ^2.25.0
eslint: <8.0.0
eslint-config-next: 12.0.3
eslint-config-prettier: ^8.3.0
@@ -4355,7 +4363,7 @@ __metadata:
eslint-plugin-react: ^7.26.1
eslint-plugin-react-hooks: ^4.2.0
framer-motion: ^5.3.0
next: 12.0.3
next: 12.0.4
prettier: ^2.4.1
react: 17.0.2
react-dom: 17.0.2
@@ -4618,28 +4626,28 @@ __metadata:
languageName: node
linkType: hard
"next@npm:12.0.3":
version: 12.0.3
resolution: "next@npm:12.0.3"
"next@npm:12.0.4":
version: 12.0.4
resolution: "next@npm:12.0.4"
dependencies:
"@babel/runtime": 7.15.4
"@hapi/accept": 5.0.2
"@napi-rs/triples": 1.0.3
"@next/env": 12.0.3
"@next/polyfill-module": 12.0.3
"@next/react-dev-overlay": 12.0.3
"@next/react-refresh-utils": 12.0.3
"@next/swc-android-arm64": 12.0.3
"@next/swc-darwin-arm64": 12.0.3
"@next/swc-darwin-x64": 12.0.3
"@next/swc-linux-arm-gnueabihf": 12.0.3
"@next/swc-linux-arm64-gnu": 12.0.3
"@next/swc-linux-arm64-musl": 12.0.3
"@next/swc-linux-x64-gnu": 12.0.3
"@next/swc-linux-x64-musl": 12.0.3
"@next/swc-win32-arm64-msvc": 12.0.3
"@next/swc-win32-ia32-msvc": 12.0.3
"@next/swc-win32-x64-msvc": 12.0.3
"@next/env": 12.0.4
"@next/polyfill-module": 12.0.4
"@next/react-dev-overlay": 12.0.4
"@next/react-refresh-utils": 12.0.4
"@next/swc-android-arm64": 12.0.4
"@next/swc-darwin-arm64": 12.0.4
"@next/swc-darwin-x64": 12.0.4
"@next/swc-linux-arm-gnueabihf": 12.0.4
"@next/swc-linux-arm64-gnu": 12.0.4
"@next/swc-linux-arm64-musl": 12.0.4
"@next/swc-linux-x64-gnu": 12.0.4
"@next/swc-linux-x64-musl": 12.0.4
"@next/swc-win32-arm64-msvc": 12.0.4
"@next/swc-win32-ia32-msvc": 12.0.4
"@next/swc-win32-x64-msvc": 12.0.4
acorn: 8.5.0
assert: 2.0.0
browserify-zlib: 0.2.0
@@ -4720,7 +4728,7 @@ __metadata:
optional: true
bin:
next: dist/bin/next
checksum: 68be20fdc9a681ad3d705666b500bbac9fdec9700272810e1eb3733cb77fe4ac01879aca15859ed217c123629cec3798bec3245e5e07b9011bc8b0ab8a6853a6
checksum: b9711e7d4242daaaffce72bfc4dce1d0107e0f48f03fd43190f2d81b8bb08f0c34d6ef0cf1f69885dc73a786a61cf0a7d06c2296c389dbb2dba5ddd66c38127b
languageName: node
linkType: hard