Move code to src and flatten wiki for publish workflow #2

Merged
Tirsvad merged 1 commits from fix/wiki-layout-and-src into main 2026-10-28 06:35:41 +01:00
8 changed files with 30 additions and 25 deletions
Showing only changes of commit 67062dffbc - Show all commits
+9 -9
View File
@@ -17,15 +17,15 @@ project of the HTML/CSS section (6.4) of the Udemy course *100 Days of Code*.
## Run it
No build step. Open `index.html` in a browser (the font is loaded from Google
No build step. Open `src/index.html` in a browser (the font is loaded from Google
Fonts, so an internet connection is needed to see it).
## Project layout
```text
index.html the page
style.css the styles
assets/images/ the poster image
src/index.html the page
src/style.css the styles
src/assets/images/ the poster image
screenshots/ screenshots used in this README
docs/wiki/ documentation in English, Dansk and Bahasa Malaysia
```
@@ -34,14 +34,14 @@ docs/wiki/ documentation in English, Dansk and Bahasa Malaysia
| Language | Start page |
| --- | --- |
| English | [docs/wiki/en/Home.md](docs/wiki/en/Home.md) |
| Dansk | [docs/wiki/da/Home.md](docs/wiki/da/Home.md) |
| Bahasa Malaysia | [docs/wiki/ms/Home.md](docs/wiki/ms/Home.md) |
| English | [docs/wiki/Home.md](docs/wiki/Home.md) |
| Dansk | [docs/wiki/Home-da.md](docs/wiki/Home-da.md) |
| Bahasa Malaysia | [docs/wiki/Home-ms.md](docs/wiki/Home-ms.md) |
## Make your own poster
Change the image in `assets/images/`, then edit the `h1` and `p` text in
`index.html`.
Change the image in `src/assets/images/`, then edit the `h1` and `p` text in
`src/index.html`.
## License
@@ -1,10 +1,10 @@
# Motivationsplakat
**Sprog:** [English](../en/Home.md) · Dansk · [Bahasa Malaysia](../ms/Home.md)
[English](Home) · **Dansk** · [Bahasa Malaysia](Home-ms)
En motivationsplakat som webside, lavet kun med HTML og CSS.
![Motivationsplakat](../../../screenshots/desktop.png)
![Motivationsplakat](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/044-web-motivational-poster/raw/branch/main/screenshots/desktop.png)
## Krav
@@ -42,16 +42,16 @@ placering og farve for dem alle.
| `.motivation-img { width: 100%; border: 5px solid white; }` | Billedet fylder hele `div`'en og får en hvid ramme. |
| `h1 { text-transform: uppercase; }` | Store bogstaver uden at skrive titlen om. |
Google-skrifttypen hentes med et `<link>` i `<head>` i `index.html`.
Google-skrifttypen hentes med et `<link>` i `<head>` i `src/index.html`.
## Lav din egen
1. Læg dit billede i `assets/images/`.
1. Læg dit billede i `src/assets/images/`.
2. Ret `src` og `alt` på `img`.
3. Ret teksten i `h1` og `p`.
4. Eksperimenter: skrifttyper, farver, kantbredde, afstande.
## Kør den
Åbn `index.html` i en browser. Du skal have internetforbindelse for at hente
Åbn `src/index.html` i en browser. Du skal have internetforbindelse for at hente
skrifttypen.
@@ -1,10 +1,10 @@
# Poster Motivasi
**Bahasa:** [English](../en/Home.md) · [Dansk](../da/Home.md) · Bahasa Malaysia
[English](Home) · [Dansk](Home-da) · **Bahasa Malaysia**
Laman web poster motivasi yang dibina dengan HTML dan CSS sahaja.
![Poster motivasi](../../../screenshots/desktop.png)
![Poster motivasi](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/044-web-motivational-poster/raw/branch/main/screenshots/desktop.png)
## Keperluan
@@ -42,16 +42,16 @@ menetapkan saiz, kedudukan dan warna untuk kesemuanya.
| `.motivation-img { width: 100%; border: 5px solid white; }` | Imej memenuhi `div` dan mendapat bingkai putih. |
| `h1 { text-transform: uppercase; }` | Huruf besar tanpa menaip semula tajuk. |
Fon Google dimuatkan dengan `<link>` dalam `<head>` fail `index.html`.
Fon Google dimuatkan dengan `<link>` dalam `<head>` fail `src/index.html`.
## Buat poster anda sendiri
1. Letakkan imej anda dalam `assets/images/`.
1. Letakkan imej anda dalam `src/assets/images/`.
2. Kemas kini `src` dan `alt` pada `img`.
3. Tukar teks `h1` dan `p`.
4. Cuba-cuba: fon, warna, lebar sempadan, jarak.
## Jalankan
Buka `index.html` dalam pelayar. Sambungan internet diperlukan untuk memuatkan
Buka `src/index.html` dalam pelayar. Sambungan internet diperlukan untuk memuatkan
fon.
+5 -5
View File
@@ -1,10 +1,10 @@
# Motivational Poster
**Languages:** English · [Dansk](../da/Home.md) · [Bahasa Malaysia](../ms/Home.md)
**English** · [Dansk](Home-da) · [Bahasa Malaysia](Home-ms)
A motivational poster web page made with HTML and CSS only.
![Motivational poster](../../../screenshots/desktop.png)
![Motivational poster](https://git.tirsystem.com/Tirsvad-Udemy-100-days-of-code/044-web-motivational-poster/raw/branch/main/screenshots/desktop.png)
## Requirements
@@ -42,16 +42,16 @@ and colour all of them.
| `.motivation-img { width: 100%; border: 5px solid white; }` | The image fills the `div` and gets a white frame. |
| `h1 { text-transform: uppercase; }` | Uppercase title without retyping it. |
The Google Font is loaded with a `<link>` in the `<head>` of `index.html`.
The Google Font is loaded with a `<link>` in the `<head>` of `src/index.html`.
## Make your own
1. Put your image in `assets/images/`.
1. Put your image in `src/assets/images/`.
2. Update `src` and `alt` on the `img`.
3. Change the text of the `h1` and `p`.
4. Experiment: fonts, colours, border width, spacing.
## Run it
Open `index.html` in a browser. An internet connection is needed to load the
Open `src/index.html` in a browser. An internet connection is needed to load the
font.
+5
View File
@@ -0,0 +1,5 @@
**Motivational Poster**
- [English](Home)
- [Dansk](Home-da)
- [Bahasa Malaysia](Home-ms)

Before

Width:  |  Height:  |  Size: 198 KiB

After

Width:  |  Height:  |  Size: 198 KiB

View File
View File