Skip to content

Commit 1d19c9c

Browse files
committed
Initial commit of the new FOSSi Foundation website
0 parents  commit 1d19c9c

File tree

364 files changed

+18222
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

364 files changed

+18222
-0
lines changed

.devcontainer/devcontainer.json

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
// For format details, see https://aka.ms/devcontainer.json. For config options, see the
2+
// README at: https://github.com/devcontainers/templates/tree/main/src/typescript-node
3+
{
4+
"name": "Nuxt",
5+
6+
// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
7+
"image": "mcr.microsoft.com/devcontainers/typescript-node:0-18",
8+
9+
// Features to add to the dev container. More info: https://containers.dev/features.
10+
// "features": {},
11+
12+
// Use 'forwardPorts' to make a list of ports inside the container available locally.
13+
"forwardPorts": [3000],
14+
15+
// Use 'postCreateCommand' to run commands after the container is created.
16+
"postCreateCommand": "yarn install",
17+
18+
// Configure tool-specific properties.
19+
"customizations": {
20+
"vscode": {
21+
"extensions": [
22+
"vue.volar",
23+
"cpreston321.nuxt-vscode",
24+
"vue.vscode-typescript-vue-plugin",
25+
"nuxt.mdc",
26+
"bradlc.vscode-tailwindcss"
27+
]
28+
}
29+
}
30+
31+
// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
32+
// "remoteUser": "root"
33+
}

.gitignore

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
node_modules
2+
*.log*
3+
.nuxt
4+
.nitro
5+
.cache
6+
.output
7+
.env
8+
dist

.npmrc

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
shamefully-hoist=true
2+
strict-peer-dependencies=false

.vscode/launch.json

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
{
2+
"version": "0.2.0",
3+
"configurations": [
4+
{
5+
"type": "chrome",
6+
"request": "launch",
7+
"name": "client: chrome",
8+
"url": "http://localhost:3000",
9+
"webRoot": "${workspaceFolder}"
10+
},
11+
{
12+
"type": "node",
13+
"request": "launch",
14+
"name": "server: nuxt",
15+
"args": ["dev"],
16+
"osx": {
17+
"program": "${workspaceFolder}/node_modules/.bin/nuxt"
18+
},
19+
"linux": {
20+
"program": "${workspaceFolder}/node_modules/.bin/nuxt"
21+
},
22+
"windows": {
23+
"program": "${workspaceFolder}/node_modules/nuxt/bin/nuxt.js"
24+
}
25+
}
26+
],
27+
"compounds": [
28+
{
29+
"name": "fullstack: nuxt",
30+
"configurations": ["server: nuxt", "client: chrome"]
31+
}
32+
]
33+
}

README.md

+58
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
# www.fossi-foundation.org website sources
2+
3+
This repository contains the source code for the fossi-foundation.org website.
4+
The site is built using [Nuxt](https://nuxt.com/) and deployed to Netlify.
5+
6+
## Build requirements
7+
8+
Make sure that you have installed the following tools on your local machine.
9+
10+
* Node.js 18 (LTS)
11+
* Yarn
12+
13+
## Development quickstart
14+
15+
```bash
16+
yarn install
17+
18+
# Start the development server on http://localhost:3000
19+
# (Setting HOST is not strictly required, but helps if the HOST environment
20+
# variable has a strange value.)
21+
HOST=localhost yarn dev
22+
23+
# Build the application for production:
24+
yarn run build
25+
26+
# Locally preview production build:
27+
yarn run preview
28+
```
29+
30+
## Development quicker start
31+
32+
- Open with Visual Studio Code with "Dev Containers" extension installed.
33+
- After opening the repo, it will ask you if you want to reopen in container, which you want.
34+
- Run above commands or run debug target "server: nuxt"
35+
36+
## Icons
37+
38+
We use icons from [Font Awesome Brands](https://fontawesome.com/) and
39+
[Phosphor Icons](https://phosphoricons.com/). To keep the bundle size low all
40+
icons have to be explicitly imported in a template.
41+
42+
Here's an `example.vue` component:
43+
44+
```html
45+
<script setup>
46+
import IconFabLinkedinIn from '~icons/fa6-brands/linkedin-in'
47+
</script>
48+
49+
<template>
50+
<div>
51+
<IconFabLinkedinIn/>
52+
</div>
53+
</template>
54+
```
55+
56+
You can use https://icones.js.org/collection/ph and
57+
https://icones.js.org/collection/fa6-brands to efficiently search for suitable
58+
icons.

app.vue

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
<template>
2+
<div>
3+
<NuxtPage />
4+
</div>
5+
</template>

assets/css/tailwind.css

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
5+
@layer base {
6+
html {
7+
/* Use warm black as default text color. */
8+
@apply text-warm-black;
9+
}
10+
}

assets/images/banner-orconf.jpg

243 KB
Loading
8.46 KB
Loading
Loading

assets/images/ecl-logo-fossi.svg

+1
Loading

assets/images/fossi-logo-full.svg

+128
Loading

assets/images/hero-bg.jpg

338 KB
Loading

assets/images/pattern-community.png

91 KB
Loading
39.9 KB
Loading

assets/images/pattern-innovation.png

91.3 KB
Loading

assets/images/pattern-resources.png

66.1 KB
Loading

components/DocumentDrivenEmpty.vue

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!--
2+
This component will be shown when there is no content for the current page, but
3+
the page exists.
4+
5+
This component is used by Nuxt Content in document-driven mode.
6+
7+
TODO:
8+
* Add styling.
9+
-->
10+
<template>
11+
<h1>This page is empty</h1>
12+
</template>

components/DocumentDrivenNotFound.vue

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!--
2+
404 (Not Found) error page.
3+
4+
This component is used by Nuxt Content in document-driven mode.
5+
6+
TODO:
7+
* Add styling.
8+
-->
9+
<template>
10+
<h1>Page not found</h1>
11+
</template>

components/FfBlogPostCard.vue

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<!--
2+
Signpost Card summarizing a single post
3+
-->
4+
<template>
5+
<FfCardSignpost :key="post._path" :headline="post.title" :linkTo="post._path" :img="post.coverImage">
6+
<ContentRendererMarkdown :value="post" :excerpt="true" />
7+
</FfCardSignpost>
8+
</template>
9+
10+
<script setup lang="ts">
11+
export interface Post {
12+
title: string
13+
_path: string
14+
coverImage?: string
15+
}
16+
17+
defineProps<{
18+
post: Post
19+
}>()
20+
</script>

components/FfBtnCta.vue

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!--
2+
Call-to-action button
3+
4+
TODO:
5+
- Font scaling is implemented, but not specified in the style guide.
6+
-->
7+
8+
<template>
9+
<NuxtLink class="inline-block w-full tablet:w-auto text-center font-black text-phone-20 tablet:text-24 px-20 py-10 rounded-tr-xl shadow-mid" :class="{'bg-ultraviolet': !inverted, 'bg-white': inverted, 'text-white': !inverted, 'text-ultraviolet': inverted}" :to="linkTo" :title="linkTitle" :target="linkTarget"><slot></slot></NuxtLink>
10+
</template>
11+
12+
<script setup lang="ts">
13+
export interface Props {
14+
// Invert the color scheme.
15+
inverted?: boolean
16+
17+
linkTo: string,
18+
linkTitle?: string
19+
linkTarget?: string
20+
}
21+
22+
withDefaults(defineProps<Props>(), {
23+
inverted: false
24+
})
25+
</script>

components/FfCalloutNewsletter.vue

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!--
2+
Newsletter callout
3+
4+
Style guide reference: Web components/Alerts and Callouts/Callout
5+
-->
6+
<template>
7+
<div class="bg-ultraviolet">
8+
<FfContainer class="py-32">
9+
<div class="flex flex-col desktop:flex-row items-center">
10+
<img src="~assets/images/ecl-logo-fossi.svg" class="w-96 h-96 my-auto" />
11+
<FfH3 class="grow text-white mx-32 my-32">
12+
El Correo Libre! Explore the free and open source silicon landscape
13+
through monthly news and hot topics.
14+
</FfH3>
15+
<FfBtnCta class="whitespace-nowrap" inverted linkTo="/news">Read the latest</FfBtnCta>
16+
</div>
17+
</FfContainer>
18+
</div>
19+
</template>

components/FfCardInformation.vue

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
<!--
2+
Information card
3+
4+
Use to present chunks of short information such as a member profile or project
5+
summary
6+
7+
The card image has to passed as HTML in a named slot due to Vite/Nuxt
8+
limitations, which effectively prevent passing an image name as prop.
9+
See https://github.com/nuxt/nuxt/issues/14766 for a discussion.
10+
11+
Style guide reference: Web components/Cards/Information card
12+
-->
13+
<template>
14+
<div class="max-w-[250px] mx-auto">
15+
<div class="relative mx-auto h-[155px] w-[155px]">
16+
<img :src="img" class="h-[155px] w-[155px] grayscale object-cover" />
17+
<div class="absolute z-10 top-0 left-0 w-full h-full bg-opacity-20 bg-ultraviolet"></div>
18+
</div>
19+
<div class="text-center">
20+
<FfH3 class="text-ultraviolet font-black">{{ headline }}</FfH3>
21+
<FfParaExcerpt v-if="subheading" class="mt-10 text-ultraviolet">
22+
{{ subheading }}
23+
</FfParaExcerpt>
24+
<FfParaExcerpt class="text-warm-black mt-10">
25+
<slot></slot>
26+
</FfParaExcerpt>
27+
</div>
28+
</div>
29+
</template>
30+
31+
32+
<script setup lang="ts">
33+
export interface Props {
34+
// Image
35+
img?: string
36+
37+
headline: string
38+
subheading?: string
39+
40+
// Link-related properties. No link is set if linkTo is undefined.
41+
linkTo?: string
42+
linkTitle?: string
43+
linkTarget?: string
44+
}
45+
46+
defineProps<Props>()
47+
</script>

components/FfCardSignpost.vue

+51
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<!--
2+
Signpost card
3+
4+
Use as a signpost to another page or post
5+
6+
Style guide reference: Web components/Cards/Signpost card
7+
-->
8+
<template>
9+
<div class="shadow-mid hover:shadow-low bg-white">
10+
<NuxtLink :to="linkTo" :title="linkTitle" :target="linkTarget">
11+
<div >
12+
<img v-if="img" :src="img" class="h-[192px] w-full" :class="{ 'object-cover': imgObjectCover, 'object-contain p-10': !imgObjectCover }"/>
13+
<img v-else class="h-[192px] w-full object-cover" src="~/assets/images/pattern-guardianship.png" alt="Pattern: guardianship" />
14+
</div>
15+
</NuxtLink>
16+
<div class="p-24">
17+
<FfH3 class="border-b-4 border-ultraviolet">
18+
<NuxtLink :to="linkTo" :title="linkTitle" :target="linkTarget" class="text-ultraviolet font-black">{{ headline }}</NuxtLink>
19+
</FfH3>
20+
<FfParaExcerpt v-if="subheading" class="mt-10">
21+
{{ subheading }}
22+
</FfParaExcerpt>
23+
<FfParaExcerpt class="text-warm-black mt-10">
24+
<NuxtLink :to="linkTo" :title="linkTitle" :target="linkTarget">
25+
<slot></slot>
26+
</NuxtLink>
27+
</FfParaExcerpt>
28+
</div>
29+
</div>
30+
</template>
31+
32+
<script setup lang="ts">
33+
export interface Props {
34+
// Image
35+
img?: string
36+
// Make the header image cover the whole image area (unproportional scaling).
37+
imgObjectCover?: boolean
38+
39+
headline: string
40+
subheading?: string
41+
42+
// Link-related properties. No link is set if linkTo is undefined.
43+
linkTo?: string
44+
linkTitle?: string
45+
linkTarget?: string
46+
}
47+
48+
withDefaults(defineProps<Props>(), {
49+
imgObjectCover: true
50+
})
51+
</script>

0 commit comments

Comments
 (0)