Skip to content

Commit 52f880a

Browse files
skymenskymen
committed
First commit of the website
1 parent 48d3b2c commit 52f880a

15 files changed

Lines changed: 200 additions & 337 deletions

‎src/App.vue‎

Lines changed: 30 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,38 @@
11
<template>
2-
<v-app>
2+
<v-app dark>
33
<v-main>
4-
<HelloWorld />
4+
<v-toolbar app>
5+
<v-toolbar-title>Construct Fund</v-toolbar-title>
6+
<v-spacer></v-spacer>
7+
<v-btn text @click="reportIssue()">
8+
<v-icon right>mdi-open-in-new</v-icon>
9+
Report issue
10+
</v-btn>
11+
</v-toolbar>
12+
<div class="parent">
13+
<Card v-for="(item, i) in content" key="i" :content="item" />
14+
</div>
515
</v-main>
616
</v-app>
717
</template>
818

919
<script setup>
10-
import HelloWorld from '@/components/HelloWorld.vue'
20+
import Card from "@/components/Card.vue";
21+
import content from "@/assets/content.json";
22+
23+
function reportIssue() {
24+
window.open("https://github.com/ConstructFund/color-addon-generator/issues/");
25+
}
1126
</script>
27+
28+
<style scoped>
29+
.parent {
30+
width: 100%;
31+
height: calc(100% - 64px);
32+
overflow: auto;
33+
padding-left: 30%;
34+
padding-right: 30%;
35+
padding-top: 50px;
36+
padding-bottom: 50px;
37+
}
38+
</style>

‎src/assets/base.css‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -65,9 +65,11 @@ body {
6565
background: var(--color-background);
6666
transition: color 0.5s, background-color 0.5s;
6767
line-height: 1.6;
68-
font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
69-
Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
70-
font-size: 15px;
68+
font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
69+
Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue",
70+
sans-serif;
71+
font-size: 20px;
72+
font-weight: normal;
7173
text-rendering: optimizeLegibility;
7274
-webkit-font-smoothing: antialiased;
7375
-moz-osx-font-smoothing: grayscale;

‎src/assets/content.json‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
[
2+
{
3+
"name": "C3 Effects Concat",
4+
"repo": "https://github.com/ConstructFund/c3-effects-concat",
5+
"hasWebsite": true,
6+
"url": "https://constructfund.github.io/c3-effects-concat/",
7+
"description": "A web tool that concatenates effects in a given order",
8+
"status": "Maintenance"
9+
},
10+
{
11+
"name": "Made With Construct",
12+
"repo": "https://github.com/ConstructFund/madewithconstructwebsite",
13+
"hasWebsite": true,
14+
"url": "https://www.madewithconstruct.com/",
15+
"description": "A Construct 3 template that implements the basics for making web games, including the biggest web platform SDKs",
16+
"status": "Maintenance"
17+
},
18+
{
19+
"name": "Color addon generator",
20+
"repo": "https://github.com/ConstructFund/color-addon-generator",
21+
"hasWebsite": true,
22+
"url": "https://constructfund.github.io/color-addon-generator",
23+
"description": "A tool that generates replace color shaders and color variable behaviors",
24+
"status": "Maintenance"
25+
},
26+
{
27+
"name": "C3IDE 2",
28+
"repo": "https://github.com/ConstructFund/c3ide2",
29+
"hasWebsite": false,
30+
"description": "A spiritual successor to c3ide",
31+
"status": "In Development"
32+
},
33+
{
34+
"name": "Web Game Template",
35+
"repo": "https://github.com/ConstructFund/web-game-template",
36+
"hasWebsite": false,
37+
"description": "A Construct 3 template that implements the basics for making web games, including the biggest web platform SDKs",
38+
"status": "Maintenance"
39+
}
40+
]

‎src/assets/main.css‎

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,35 @@
1-
@import './base.css';
1+
@import "./base.css";
22

3-
#app {
4-
max-width: 1280px;
5-
margin: 0 auto;
6-
padding: 2rem;
3+
html {
4+
height: 100%;
5+
overflow: hidden !important;
6+
}
7+
8+
body {
9+
height: 100%;
10+
overflow: hidden !important;
11+
}
712

8-
font-weight: normal;
13+
#app {
14+
height: 100%;
15+
overflow: hidden !important;
916
}
1017

11-
a,
12-
.green {
13-
text-decoration: none;
14-
color: hsla(160, 100%, 37%, 1);
15-
transition: 0.4s;
18+
.v-application {
19+
height: 100%;
20+
overflow: hidden !important;
1621
}
1722

18-
@media (hover: hover) {
19-
a:hover {
20-
background-color: hsla(160, 100%, 37%, 0.2);
21-
}
23+
.v-application__wrap {
24+
height: 100%;
25+
overflow: hidden !important;
2226
}
2327

24-
@media (min-width: 1024px) {
25-
body {
26-
display: flex;
27-
place-items: center;
28-
}
28+
.v-main {
29+
height: 100%;
30+
overflow: hidden !important;
31+
}
2932

30-
#app {
31-
display: grid;
32-
grid-template-columns: 1fr 1fr;
33-
padding: 0 2rem;
34-
}
33+
.v-card-actions {
34+
justify-content: space-between;
3535
}

‎src/components/Card.vue‎

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
<template>
2+
<v-card class="child">
3+
<v-toolbar
4+
style="padding-left: 15px; padding-right: 15px"
5+
:color="content.hasWebsite ? 'primary' : ''"
6+
>
7+
<h2>{{ content.name }}</h2>
8+
<v-spacer></v-spacer>
9+
<v-btn @click="openWebsite" text v-if="content.hasWebsite">
10+
Open Website
11+
</v-btn>
12+
<v-icon right>mdi-open-in-new</v-icon>
13+
</v-toolbar>
14+
<v-card-text>
15+
{{ content.description }}
16+
</v-card-text>
17+
<v-card-actions>
18+
<div>
19+
<v-chip :color="chipColor">
20+
<div class="prechip">Status:</div>
21+
{{ content.status }}
22+
</v-chip>
23+
</div>
24+
<div>
25+
<v-btn @click="openRepo">Open Repo</v-btn>
26+
<v-icon>mdi-github</v-icon>
27+
</div>
28+
</v-card-actions>
29+
</v-card>
30+
</template>
31+
32+
<script setup>
33+
import { computed } from "vue";
34+
35+
// define prop for content object
36+
const props = defineProps({
37+
content: Object,
38+
});
39+
40+
const chipColor = computed(() => {
41+
return {
42+
"In Development": "success",
43+
Maintenance: "warning",
44+
"On Hiatus": "warning",
45+
Abandonned: "error",
46+
Shipped: "info",
47+
}[props.content.status];
48+
});
49+
50+
function openWebsite() {
51+
window.open(props.content.url);
52+
}
53+
54+
function openRepo() {
55+
window.open(props.content.repo);
56+
}
57+
</script>
58+
59+
<style scoped>
60+
.child {
61+
margin-top: 20px;
62+
margin-bottom: 20px;
63+
width: 100%;
64+
}
65+
66+
.prechip {
67+
background-color: rgb(var(--v-theme-primary)) !important;
68+
height: 100%;
69+
margin-left: -12px;
70+
text-align: center;
71+
padding-left: 12px;
72+
padding-right: 4px;
73+
margin-right: 6px;
74+
border-top-left-radius: 100px;
75+
border-bottom-left-radius: 100px;
76+
align-items: center;
77+
display: flex;
78+
color: white;
79+
}
80+
</style>

‎src/components/HelloWorld.vue‎

Lines changed: 0 additions & 75 deletions
This file was deleted.

0 commit comments

Comments
 (0)