Skip to content

Commit e8fbe22

Browse files
CodeDeadCodeDead
committed
* Added images to software page
1 parent cb45ab0 commit e8fbe22

5 files changed

Lines changed: 136 additions & 8 deletions

File tree

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
"react-helmet": "^6.1.0"
3535
},
3636
"devDependencies": {
37-
"eslint": "^7.21.0",
37+
"eslint": "^7.22.0",
3838
"eslint-config-airbnb": "^18.2.1",
3939
"eslint-plugin-import": "^2.22.1",
4040
"eslint-plugin-jsx-a11y": "^6.4.1",

‎src/components/Application/index.jsx‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,13 @@ import { navigate } from 'gatsby';
44
import CardContent from '@material-ui/core/CardContent';
55
import Typography from '@material-ui/core/Typography';
66
import Card from '@material-ui/core/Card';
7-
import { CardHeader } from '@material-ui/core';
7+
import { CardMedia } from '@material-ui/core';
8+
import { GatsbyImage } from 'gatsby-plugin-image';
9+
import CardHeader from '@material-ui/core/CardHeader';
810

9-
const Application = ({ name, description, url }) => {
11+
const Application = ({
12+
name, description, url, image,
13+
}) => {
1014
/**
1115
* Go to the designated URL
1216
*/
@@ -20,6 +24,11 @@ const Application = ({ name, description, url }) => {
2024
onClick={goToUrl}
2125
style={{ height: '100%' }}
2226
>
27+
<CardMedia
28+
title={name}
29+
>
30+
<GatsbyImage alt={name} image={image} style={{ width: '100%' }} />
31+
</CardMedia>
2332
<CardHeader
2433
title={name}
2534
/>

‎src/pages/software/index.jsx‎

Lines changed: 64 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import CardContent from '@material-ui/core/CardContent';
88
import SecurityIcon from '@material-ui/icons/Security';
99
import ComputerIcon from '@material-ui/icons/Computer';
1010
import AppsIcon from '@material-ui/icons/Apps';
11+
import { graphql, useStaticQuery } from 'gatsby';
1112
import PageHeader from '../../components/PageHeader';
1213
import Layout from '../../components/Layout';
1314
import { MainContext } from '../../contexts/MainContextProvider';
@@ -18,46 +19,98 @@ const Software = () => {
1819
const [, dispatch] = useContext(MainContext);
1920
const [searchValue, setSearchValue] = useState('');
2021

22+
const imageData = useStaticQuery(graphql`
23+
query {
24+
advancedpassgen: file(relativePath: { eq: "Advanced PassGen/ap.png" }) {
25+
childImageSharp {
26+
gatsbyImageData(layout: CONSTRAINED, height: 160)
27+
}
28+
},
29+
advancedportchecker: file(relativePath: { eq: "Advanced PortChecker/ap.png" }) {
30+
childImageSharp {
31+
gatsbyImageData(layout: CONSTRAINED, height: 160)
32+
}
33+
},
34+
aniview: file(relativePath: { eq: "AniView/aniview.png" }) {
35+
childImageSharp {
36+
gatsbyImageData(layout: CONSTRAINED, height: 160)
37+
}
38+
},
39+
deadhash: file(relativePath: { eq: "DeadHash/DeadHash.png" }) {
40+
childImageSharp {
41+
gatsbyImageData(layout: CONSTRAINED, height: 160)
42+
}
43+
},
44+
deadlock: file(relativePath: { eq: "DeadLock/deadlock.png" }) {
45+
childImageSharp {
46+
gatsbyImageData(layout: CONSTRAINED, height: 160)
47+
}
48+
},
49+
deadpix: file(relativePath: { eq: "DeadPix/deadpix.png" }) {
50+
childImageSharp {
51+
gatsbyImageData(layout: CONSTRAINED, height: 160)
52+
}
53+
},
54+
memplus: file(relativePath: { eq: "MemPlus/memplus.png" }) {
55+
childImageSharp {
56+
gatsbyImageData(layout: CONSTRAINED, height: 160)
57+
}
58+
},
59+
pkfinder: file(relativePath: { eq: "PK Finder/pkfinder.png" }) {
60+
childImageSharp {
61+
gatsbyImageData(layout: CONSTRAINED, height: 160)
62+
}
63+
}
64+
}`);
65+
2166
const applications = [{
2267
name: 'DeadHash',
2368
url: '/software/deadhash',
24-
description: 'Calculate file hashes on any platform with ease thanks to an easy to use GUI, drag and drop functionality and help documentation that are all included!',
69+
description: 'Calculate file hashes on any platform with ease thanks to an easy to use GUI, drag and drop functionality and help documentation!',
2570
tags: ['DeadHash', 'hashing', 'file'],
71+
image: imageData.deadhash.childImageSharp.gatsbyImageData,
2672
}, {
2773
name: 'Advanced PassGen',
2874
url: '/software/advanced-passgen',
2975
description: 'Easily generate thousands of passwords using Advanced PassGen. You can even go so far as to define your own character set!',
3076
tags: ['Advanced PassGen', 'password', 'generator'],
77+
image: imageData.advancedpassgen.childImageSharp.gatsbyImageData,
3178
}, {
3279
name: 'MemPlus',
3380
url: '/software/memplus',
3481
description: 'MemPlus can be used to reduce the amount of RAM that is being used by applications on your system. In essence, freeing up memory so that more memory is available to you!',
3582
tags: ['MemPlus', 'RAM', 'Random access memory'],
83+
image: imageData.memplus.childImageSharp.gatsbyImageData,
3684
}, {
3785
name: 'PK Finder',
3886
url: '/software/pk-finder',
3987
description: 'Easily recover your Windows Product Key with PK Finder. As soon as you open PK Finder, you’ll be able to view your product key.',
4088
tags: ['PK Finder', 'Product key', 'serial', 'license'],
89+
image: imageData.pkfinder.childImageSharp.gatsbyImageData,
4190
}, {
4291
name: 'Advanced PortChecker',
4392
url: '/software/advanced-portchecker',
4493
description: 'Scanning TCP and UDP ports has never been this easy. Watch how Advanced PortChecker updates you with real-time information while it’s scanning!',
4594
tags: ['Advanced PortChecker', 'scanner'],
95+
image: imageData.advancedportchecker.childImageSharp.gatsbyImageData,
4696
}, {
4797
name: 'DeadLock',
4898
url: '/software/deadlock',
4999
description: 'Unlock files and folders, take full ownership over them and remove, move or copy them, free of charge! Windows Explorer integration is also possible.',
50100
tags: ['DeadLock', 'file', 'folder'],
101+
image: imageData.deadlock.childImageSharp.gatsbyImageData,
51102
}, {
52103
name: 'DeadPix',
53104
url: '/software/deadpix',
54-
description: 'Fix dead or stuck pixels on your screen with just a couple of mouse clicks, free of charge! DeadPix can fix stuck or dead pixels by rapidly cycling the color value of the pixel. Please note that this tool does not provide a 100% success rate.',
105+
description: 'Fix dead or stuck pixels on your screen with just a couple of mouse clicks, free of charge! DeadPix can fix stuck or dead pixels by rapidly cycling the color value of the pixel.',
55106
tags: ['DeadPix', 'Pixel', 'Screen', 'LCD'],
107+
image: imageData.deadpix.childImageSharp.gatsbyImageData,
56108
}, {
57109
name: 'AniView',
58110
url: '/software/aniview',
59111
description: 'AniView is a free and open source GIF image viewer. You can watch GIF images your way, thanks to all the options that are available in AniView.',
60112
tags: ['AniView', 'images', 'GIF', 'viewer'],
113+
image: imageData.aniview.childImageSharp.gatsbyImageData,
61114
}];
62115

63116
useEffect(() => {
@@ -80,6 +133,7 @@ const Software = () => {
80133
name={application.name}
81134
description={application.description}
82135
url={application.url}
136+
image={application.image}
83137
/>
84138
</Grid>
85139
));
@@ -151,13 +205,15 @@ const Software = () => {
151205
name={applications.filter((item) => item.name === 'DeadHash')[0].name}
152206
description={applications.filter((item) => item.name === 'DeadHash')[0].description}
153207
url={applications.filter((item) => item.name === 'DeadHash')[0].url}
208+
image={applications.filter((item) => item.name === 'DeadHash')[0].image}
154209
/>
155210
</Grid>
156211
<Grid item xs={12} md={3} lg={4}>
157212
<Application
158213
name={applications.filter((item) => item.name === 'Advanced PassGen')[0].name}
159214
description={applications.filter((item) => item.name === 'Advanced PassGen')[0].description}
160215
url={applications.filter((item) => item.name === 'Advanced PassGen')[0].url}
216+
image={applications.filter((item) => item.name === 'Advanced PassGen')[0].image}
161217
/>
162218
</Grid>
163219
</Grid>
@@ -191,13 +247,15 @@ const Software = () => {
191247
name={applications.filter((item) => item.name === 'MemPlus')[0].name}
192248
description={applications.filter((item) => item.name === 'MemPlus')[0].description}
193249
url={applications.filter((item) => item.name === 'MemPlus')[0].url}
250+
image={applications.filter((item) => item.name === 'MemPlus')[0].image}
194251
/>
195252
</Grid>
196253
<Grid item xs={12} md={3} lg={4}>
197254
<Application
198255
name={applications.filter((item) => item.name === 'PK Finder')[0].name}
199256
description={applications.filter((item) => item.name === 'PK Finder')[0].description}
200257
url={applications.filter((item) => item.name === 'PK Finder')[0].url}
258+
image={applications.filter((item) => item.name === 'PK Finder')[0].image}
201259
/>
202260
</Grid>
203261
</Grid>
@@ -227,27 +285,31 @@ const Software = () => {
227285
name={applications.filter((item) => item.name === 'Advanced PortChecker')[0].name}
228286
description={applications.filter((item) => item.name === 'Advanced PortChecker')[0].description}
229287
url={applications.filter((item) => item.name === 'Advanced PortChecker')[0].url}
288+
image={applications.filter((item) => item.name === 'Advanced PortChecker')[0].image}
230289
/>
231290
</Grid>
232291
<Grid item xs={12} md={3} lg={4}>
233292
<Application
234293
name={applications.filter((item) => item.name === 'DeadLock')[0].name}
235294
description={applications.filter((item) => item.name === 'DeadLock')[0].description}
236295
url={applications.filter((item) => item.name === 'DeadLock')[0].url}
296+
image={applications.filter((item) => item.name === 'DeadLock')[0].image}
237297
/>
238298
</Grid>
239299
<Grid item xs={12} md={3} lg={4}>
240300
<Application
241301
name={applications.filter((item) => item.name === 'DeadPix')[0].name}
242302
description={applications.filter((item) => item.name === 'DeadPix')[0].description}
243303
url={applications.filter((item) => item.name === 'DeadPix')[0].url}
304+
image={applications.filter((item) => item.name === 'DeadPix')[0].image}
244305
/>
245306
</Grid>
246307
<Grid item xs={12} md={3} lg={4}>
247308
<Application
248309
name={applications.filter((item) => item.name === 'AniView')[0].name}
249310
description={applications.filter((item) => item.name === 'AniView')[0].description}
250311
url={applications.filter((item) => item.name === 'AniView')[0].url}
312+
image={applications.filter((item) => item.name === 'AniView')[0].image}
251313
/>
252314
</Grid>
253315
</Grid>

‎src/templates/BlogTemplate/index.jsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ const BlogTemplate = ({ data }) => {
4646
{frontmatter.categories}
4747
</Typography>
4848
<Divider />
49+
{/* eslint-disable-next-line react/no-danger */}
4950
<div dangerouslySetInnerHTML={{ __html: html }} />
5051
</Container>
5152
</Layout>

‎yarn.lock‎

Lines changed: 59 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4946,7 +4946,7 @@ __metadata:
49464946
"@material-ui/core": ^4.11.3
49474947
"@material-ui/icons": ^4.11.2
49484948
"@material-ui/lab": ^4.0.0-alpha.57
4949-
eslint: ^7.21.0
4949+
eslint: ^7.22.0
49504950
eslint-config-airbnb: ^18.2.1
49514951
eslint-plugin-import: ^2.22.1
49524952
eslint-plugin-jsx-a11y: ^6.4.1
@@ -6997,7 +6997,7 @@ __metadata:
69976997
languageName: node
69986998
linkType: hard
69996999

7000-
"eslint@npm:^7.20.0, eslint@npm:^7.21.0":
7000+
"eslint@npm:^7.20.0":
70017001
version: 7.21.0
70027002
resolution: "eslint@npm:7.21.0"
70037003
dependencies:
@@ -7044,6 +7044,53 @@ __metadata:
70447044
languageName: node
70457045
linkType: hard
70467046

7047+
"eslint@npm:^7.22.0":
7048+
version: 7.22.0
7049+
resolution: "eslint@npm:7.22.0"
7050+
dependencies:
7051+
"@babel/code-frame": 7.12.11
7052+
"@eslint/eslintrc": ^0.4.0
7053+
ajv: ^6.10.0
7054+
chalk: ^4.0.0
7055+
cross-spawn: ^7.0.2
7056+
debug: ^4.0.1
7057+
doctrine: ^3.0.0
7058+
enquirer: ^2.3.5
7059+
eslint-scope: ^5.1.1
7060+
eslint-utils: ^2.1.0
7061+
eslint-visitor-keys: ^2.0.0
7062+
espree: ^7.3.1
7063+
esquery: ^1.4.0
7064+
esutils: ^2.0.2
7065+
file-entry-cache: ^6.0.1
7066+
functional-red-black-tree: ^1.0.1
7067+
glob-parent: ^5.0.0
7068+
globals: ^13.6.0
7069+
ignore: ^4.0.6
7070+
import-fresh: ^3.0.0
7071+
imurmurhash: ^0.1.4
7072+
is-glob: ^4.0.0
7073+
js-yaml: ^3.13.1
7074+
json-stable-stringify-without-jsonify: ^1.0.1
7075+
levn: ^0.4.1
7076+
lodash: ^4.17.21
7077+
minimatch: ^3.0.4
7078+
natural-compare: ^1.4.0
7079+
optionator: ^0.9.1
7080+
progress: ^2.0.0
7081+
regexpp: ^3.1.0
7082+
semver: ^7.2.1
7083+
strip-ansi: ^6.0.0
7084+
strip-json-comments: ^3.1.0
7085+
table: ^6.0.4
7086+
text-table: ^0.2.0
7087+
v8-compile-cache: ^2.0.3
7088+
bin:
7089+
eslint: bin/eslint.js
7090+
checksum: 9be0a215b6b1e2941318b3e0c11ada8ba9a4adacf5960ab916d07f1d619828af40cba00e8ed7d151b8c715ba8ea81f4c2a56e46a2558d9795788b4f410a95ec4
7091+
languageName: node
7092+
linkType: hard
7093+
70477094
"espree@npm:^7.3.0, espree@npm:^7.3.1":
70487095
version: 7.3.1
70497096
resolution: "espree@npm:7.3.1"
@@ -8978,6 +9025,15 @@ fsevents@~2.3.1:
89789025
languageName: node
89799026
linkType: hard
89809027

9028+
"globals@npm:^13.6.0":
9029+
version: 13.6.0
9030+
resolution: "globals@npm:13.6.0"
9031+
dependencies:
9032+
type-fest: ^0.20.2
9033+
checksum: 0322d9c1b210be233060aa79592bc65c45572237be8dbedabf830dbd70120ac21f8721309a396782463e60c4cc0b92a6476a348b4b13e481f35e361195328b8e
9034+
languageName: node
9035+
linkType: hard
9036+
89819037
"globby@npm:11.0.1":
89829038
version: 11.0.1
89839039
resolution: "globby@npm:11.0.1"
@@ -11578,7 +11634,7 @@ fsevents@~2.3.1:
1157811634
languageName: node
1157911635
linkType: hard
1158011636

11581-
"lodash@npm:^4.17.10, lodash@npm:^4.17.11, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20, lodash@npm:^4.17.4":
11637+
"lodash@npm:^4.17.10, lodash@npm:^4.17.11, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.4":
1158211638
version: 4.17.21
1158311639
resolution: "lodash@npm:4.17.21"
1158411640
checksum: 4983720b9abca930a4a46f18db163d7dad8dd00dbed6db0cc7b499b33b717cce69f80928b27bbb1ff2cbd3b19d251ee90669a8b5ea466072ca81c2ebe91e7468

0 commit comments

Comments
 (0)