Skip to content

Commit

Permalink
update packages, format css
Browse files Browse the repository at this point in the history
  • Loading branch information
vincerubinetti committed Jul 21, 2023
1 parent 5d7453d commit b0f60f1
Show file tree
Hide file tree
Showing 18 changed files with 1,018 additions and 540 deletions.
1 change: 1 addition & 0 deletions .prettierrc
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
{
"plugins": ["prettier-plugin-jsdoc", "@ianvs/prettier-plugin-sort-imports"],
"importOrder": ["^react", "^[a-zA-Z]", "^@[a-zA-Z]", "^@/", "^./"],
"order": "smacss",
"jsdocCapitalizeDescription": false,
"overrides": [
{
Expand Down
34 changes: 18 additions & 16 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -13,32 +13,34 @@
"@fortawesome/free-brands-svg-icons": "^6.4.0",
"@fortawesome/free-solid-svg-icons": "^6.4.0",
"@fortawesome/react-fontawesome": "^0.2.0",
"@zip.js/zip.js": "^2.7.17",
"jotai": "^2.2.1",
"@zip.js/zip.js": "^2.7.20",
"jotai": "^2.2.2",
"lodash": "^4.17.21",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"tippy.js": "^6.3.7"
},
"devDependencies": {
"@ianvs/prettier-plugin-sort-imports": "^4.0.0-alpha.7",
"@ianvs/prettier-plugin-sort-imports": "^4.1.0",
"@types/lodash": "^4.14.195",
"@types/node": "^20.2.5",
"@types/react": "^18.0.28",
"@types/react-dom": "^18.0.11",
"@typescript-eslint/eslint-plugin": "^5.57.1",
"@typescript-eslint/parser": "^5.57.1",
"@vitejs/plugin-react": "^4.0.0",
"eslint": "^8.38.0",
"@types/node": "^20.4.2",
"@types/react-dom": "^18.2.7",
"@types/react": "^18.2.15",
"@typescript-eslint/eslint-plugin": "^6.1.0",
"@typescript-eslint/parser": "^6.1.0",
"@vitejs/plugin-react": "^4.0.3",
"eslint-config-prettier": "^8.8.0",
"eslint-plugin-import": "^2.27.5",
"eslint-plugin-jsx-a11y": "^6.7.1",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-prettier": "^5.0.0",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.3.4",
"prettier": "^2.8.8",
"prettier-plugin-jsdoc": "^0.4.2",
"typescript": "^5.0.2",
"vite": "^4.3.2"
"eslint-plugin-react-refresh": "^0.4.3",
"eslint": "^8.45.0",
"postcss": "^8.4.26",
"prettier-plugin-css-order": "^1.3.1",
"prettier-plugin-jsdoc": "^1.0.1",
"prettier": "^3.0.0",
"typescript": "^5.1.6",
"vite": "^4.4.5"
}
}
34 changes: 17 additions & 17 deletions src/App.css
Original file line number Diff line number Diff line change
Expand Up @@ -34,22 +34,22 @@ body {
}

main {
flex-grow: 1;
display: flex;
flex-grow: 1;
flex-direction: column;
}

header,
footer {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
gap: 10px 40px;
align-items: center;
justify-content: center;
padding: 40px;
text-align: center;
gap: 10px 40px;
background: var(--primary);
color: var(--white);
text-align: center;
}

header a,
Expand All @@ -66,39 +66,39 @@ section {
display: flex;
flex-direction: column;
align-items: center;
gap: 40px;
width: 100%;
padding: 40px max(40px, (100% - 1200px) / 2);
gap: 40px;
}

h1 {
display: inline-flex;
justify-content: center;
align-items: center;
gap: 20px;
justify-content: center;
margin: 0;
gap: 20px;
font: inherit;
font-size: 1.5rem;
}

h2 {
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
justify-content: center;
width: 100%;
margin: 0;
text-align: center;
gap: 20px;
font: inherit;
font-size: 1.2rem;
text-align: center;
}

h2:before,
h2:after {
content: "";
flex-grow: 1;
height: 1px;
background: var(--mid-gray);
content: "";
}

a {
Expand All @@ -122,8 +122,8 @@ button,
select,
input,
textarea {
font: inherit;
color: inherit;
font: inherit;
}

button,
Expand Down Expand Up @@ -173,20 +173,20 @@ svg + span {
padding: 10px 15px;
border-radius: var(--rounded);
background: var(--dark-gray);
font-size: 1rem;
box-shadow: var(--shadow);
font-size: 1rem;
}

.tippy-content {
display: flex;
flex-direction: column;
gap: 10px;
padding: 0;
gap: 10px;
}

.tippy-arrow {
color: var(--dark-gray);
z-index: 99;
color: var(--dark-gray);
}

.tippy-content > * {
Expand All @@ -202,8 +202,8 @@ svg + span {
}

.tippy-content td:first-child {
padding-left: 0;
padding-right: 1em;
padding-left: 0;
text-align: left;
}

Expand Down
8 changes: 5 additions & 3 deletions src/components/Button.module.css
Original file line number Diff line number Diff line change
@@ -1,14 +1,16 @@
.button {
display: inline-flex;
justify-content: center;
align-items: center;
gap: 0.5em;
justify-content: center;
min-height: 40px;
padding: 10px 20px;
gap: 0.5em;
border: none;
border-radius: var(--rounded);
background: var(--light-gray);
transition: background var(--fast), color var(--fast);
transition:
background var(--fast),
color var(--fast);
}

.button:hover {
Expand Down
4 changes: 2 additions & 2 deletions src/components/Checkbox.module.css
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
.input {
margin: 0;
width: 20px;
height: 20px;
margin: 0;
border-radius: var(--rounded);
accent-color: var(--primary);
border-color: var(--gray);
accent-color: var(--primary);
}
2 changes: 1 addition & 1 deletion src/components/Select.module.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
}

.select {
appearance: none;
min-width: 0;
min-height: 40px;
padding: 5px 30px 5px 10px;
Expand All @@ -11,7 +12,6 @@
border-radius: var(--rounded);
background: var(--off-white);
transition: box-shadow var(--fast);
appearance: none;
}

.select:hover {
Expand Down
2 changes: 1 addition & 1 deletion src/components/Textbox.module.css
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@
width: 150px;
min-width: 100px;
max-width: 300px;
resize: horizontal;
overflow: hidden;
resize: horizontal;
}

.input {
Expand Down
2 changes: 1 addition & 1 deletion src/main.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,5 +5,5 @@ import App from "@/App";
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
<React.StrictMode>
<App />
</React.StrictMode>
</React.StrictMode>,
);
2 changes: 1 addition & 1 deletion src/sections/Canvas.module.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@
max-height: calc(100vh - 80px);
overflow-x: auto;
overflow-y: auto;
outline: solid 1px var(--gray);
background-image: url("/checkers-light.svg");
background-size: 3vmin;
background-attachment: fixed;
outline: solid 1px var(--gray);
}

.container[data-dark="true"] {
Expand Down
24 changes: 12 additions & 12 deletions src/sections/Input.module.css
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
.overlay {
position: fixed;
inset: 0;
display: flex;
justify-content: center;
z-index: 99;
position: fixed;
align-items: center;
color: var(--white);
justify-content: center;
inset: 0;
background: #000c;
opacity: 0;
color: var(--white);
font-size: 1.2rem;
opacity: 0;
pointer-events: none;
z-index: 99;
transition: opacity var(--fast);
}

Expand All @@ -20,29 +20,29 @@

.buttons {
display: flex;
justify-content: center;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
}

.grid {
display: flex;
flex-wrap: wrap;
gap: 40px;
width: 100%;
gap: 40px;
}

.cell {
display: flex;
flex-direction: column;
gap: 10px;
width: calc(100% / 2 - 40px / 2);
height: 150px;
max-width: 100%;
min-width: 200px;
max-width: 100%;
height: 150px;
min-height: 100px;
resize: both;
overflow: hidden;
gap: 10px;
resize: both;
}

.cell:only-child {
Expand Down
2 changes: 1 addition & 1 deletion src/sections/Input.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ const Input = () => {
Array.from(files).map(async (file) => ({
filename: file.name,
source: await file.text(),
}))
})),
);

/** add files to list */
Expand Down
6 changes: 3 additions & 3 deletions src/sections/Options.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@ const Options = () => {
}
tooltip={`Default from SVG: ${toFixed(
image.inferred.width || 0,
2
2,
)}`}
aria-label="Width, in pixels"
/>
Expand All @@ -137,7 +137,7 @@ const Options = () => {
}
tooltip={`Default from SVG: ${toFixed(
image.inferred.height || 0,
2
2,
)}`}
aria-label="Height, in pixels"
/>
Expand All @@ -150,7 +150,7 @@ const Options = () => {
setImage(
getAll ? -1 : index,
"aspectLock",
image.aspectLock ? 0 : Infinity
image.aspectLock ? 0 : Infinity,
)
}
data-tooltip={
Expand Down
10 changes: 5 additions & 5 deletions src/sections/Output.module.css
Original file line number Diff line number Diff line change
@@ -1,29 +1,29 @@
.grid {
display: flex;
justify-content: center;
align-items: flex-end;
flex-wrap: wrap;
align-items: flex-end;
justify-content: center;
gap: 40px;
}

.cell {
display: flex;
align-items: center;
flex-direction: column;
align-items: center;
gap: 10px;
text-align: center;
}

.actions {
display: flex;
justify-content: center;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
}

.buttons {
display: flex;
justify-content: center;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
}
2 changes: 1 addition & 1 deletion src/sections/Output.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ const Output = () => {
setImage(
getAll ? -1 : index,
"darkCheckers",
!image.darkCheckers
!image.darkCheckers,
)
}
data-tooltip={`Show ${
Expand Down
Loading

0 comments on commit b0f60f1

Please sign in to comment.