diff options
| -rw-r--r-- | data.go | 16 | ||||
| -rw-r--r-- | example.json | 19 | ||||
| -rw-r--r-- | scss/main.scss | 7 | ||||
| -rw-r--r-- | templates/page/index.gohtml | 6 |
4 files changed, 37 insertions, 11 deletions
@@ -2,7 +2,6 @@ package main import ( "html/template" - "log/slog" "strconv" ) @@ -11,6 +10,7 @@ type Data struct { Description string `json:"description"` Person *Person `json:"person"` BackgroundColor *BackgroundColor `json:"background_color"` + Links []*Link `json:"links"` } type Person struct { @@ -28,18 +28,24 @@ type BackgroundColor struct { } `json:"colors"` } +type Link struct { + Link string `json:"link"` + Content string `json:"content"` + Color string `json:"color"` +} + func (d *Data) GetBackground() template.CSS { bg := d.BackgroundColor css := "background: " + bg.Type + "-gradient(" - slog.Info(css) if bg.Type == "linear" { css += strconv.Itoa(int(bg.Angle)) + "deg," } - slog.Info(css) for _, c := range bg.Colors { css += c.Color + " " + strconv.Itoa(int(c.Position)) + "%," - slog.Info(css) } - slog.Info(css[:len(css)-1] + ");") return template.CSS(css[:len(css)-1] + ");") } + +func (l *Link) GetBackground() template.CSS { + return template.CSS("background: " + l.Color) +} diff --git a/example.json b/example.json index af5a26f..2897b7b 100644 --- a/example.json +++ b/example.json @@ -23,5 +23,22 @@ "position": 100 } ] - } + }, + "links": [ + { + "link": "https://discord.gg/minecraft", + "content": "Minecraft's Discord", + "color": "#800080FF" + }, + { + "link": "https://github.com/anhgelus", + "content": "GitHub", + "color": "#800080FF" + }, + { + "link": "https://youtube.com/@anhgelus", + "content": "YouTube", + "color": "#800080FF" + } + ] }
\ No newline at end of file diff --git a/scss/main.scss b/scss/main.scss index 0e00810..575828c 100644 --- a/scss/main.scss +++ b/scss/main.scss @@ -70,10 +70,11 @@ h2 { width: 100%; gap: 1rem; & .link { - display: block; + display: flex; + align-items: center; + justify-content: center; background: purple; width: 33%; - padding: 1em; border-radius: 16px; } & a { @@ -81,5 +82,7 @@ h2 { color: black; text-decoration: none; text-align: center; + padding: 1em; + width: 100%; } } diff --git a/templates/page/index.gohtml b/templates/page/index.gohtml index 6aaa742..e39c8f4 100644 --- a/templates/page/index.gohtml +++ b/templates/page/index.gohtml @@ -11,9 +11,9 @@ </div> <p class="description">{{ .Description }}</p> <div class="links"> - <div class="link"><a href="">Link 1</a></div> - <div class="link"><a href="">Link 2</a></div> - <div class="link"><a href="">Link 3</a></div> + {{ range $link := .Links }} + <div class="link" style="{{ $link.GetBackground }}"><a href="{{ $link.Link }}">{{ $link.Content }}</a></div> + {{end}} </div> </main> {{end}}
\ No newline at end of file |