Set meta tag theme color to project's theme color #71

AllanRegush · 2022-07-21T13:45:07Z

AllanRegush commented

2022-07-21 13:45:07 +00:00

This commit sets the discord/link embed theme to match handmade brand

closes #66

This commit sets the discord/link embed theme to match handmade brand closes #66

AllanRegush added 1 commit 2022-07-21 13:45:08 +00:00

82336e6cb6 Add Meta data theme color

This commit sets the discord/link embed theme to match handmade brand

bvisness commented

2022-07-23 01:05:28 +00:00

Thank you for your contribution! While this works for the 2022 jam page specifically, it's actually not quite what we want in general, because the blue color in this PR is specific to the 2022 jam and not broadly a brand color for us.

I wasn't clear enough in #66, so I apologize for that - the <meta> tag I gave as an example was just intended as a specific example. In actuality the color situation on Handmade Network is a little more complicated - each project has its own color stored in the database, and we dynamically insert this color into the CSS where necessary. For example, https://handmade.network, https://hero.handmade.network, and https://4coder.handmade.network all have different base colors, and we'd like the <meta> tag with the color to reflect that.

To give you an idea of what this looks like, most of the project color stuff is done in project.css: https://git.handmade.network/hmn/hmn/src/branch/master/src/templates/src/project.css

I think all we need to do here is put the current project's color into that meta tag instead of it being hardcoded: https://git.handmade.network/hmn/hmn/src/branch/master/src/templates/types.go#L119

Thank you for your contribution! While this works for the 2022 jam page specifically, it's actually not quite what we want in general, because the blue color in this PR is specific to the 2022 jam and not broadly a brand color for us. I wasn't clear enough in #66, so I apologize for that - the `<meta>` tag I gave as an example was just intended as a specific example. In actuality the color situation on Handmade Network is a little more complicated - each project has its own color stored in the database, and we dynamically insert this color into the CSS where necessary. For example, https://handmade.network, https://hero.handmade.network, and https://4coder.handmade.network all have different base colors, and we'd like the `<meta>` tag with the color to reflect that. To give you an idea of what this looks like, most of the project color stuff is done in project.css: https://git.handmade.network/hmn/hmn/src/branch/master/src/templates/src/project.css I think all we need to do here is put the current project's color into that meta tag instead of it being hardcoded: https://git.handmade.network/hmn/hmn/src/branch/master/src/templates/types.go#L119

AllanRegush commented

2022-07-24 17:41:18 +00:00

Thank you for the clarification. I'll make that change.

AllanRegush force-pushed issue-66-ar from 82336e6cb6 to 35ccb67d6c

2022-07-25 01:28:05 +00:00

Compare

AllanRegush changed title from ~~Add Meta data theme color~~ to Set meta tag theme color to project's theme color

2022-07-25 01:29:07 +00:00

bvisness reviewed 2022-07-25 16:37:44 +00:00

src/templates/src/layouts/base.html

													
				@ -54,0 +54,4 @@

				        <meta name="theme-color" content="#{{ .Project.Color1 }}">

				    {{ else }}

				        <meta name="theme-color" content="#ffffff">

				    {{ end }}

bvisness commented

2022-07-25 16:37:44 +00:00

Do we need the if statement here? I can't imagine a situation in which we wouldn't have .Project (since we have a dummy "project" for the main parts of the site).

Do we need the if statement here? I can't imagine a situation in which we wouldn't have `.Project` (since we have a dummy "project" for the main parts of the site).

AllanRegush commented

2022-07-25 19:32:26 +00:00

I can remove the if statment. No problem. I added it there because on my dev instance - when browsing to a personal project, the project.color1 is an empty string.

bvisness commented

2022-07-25 20:14:58 +00:00

Oh! Personal projects, right. I'm not sure what the best way is to handle that. Keep what you have for now, and I can figure something else out later if it's a problem.

bvisness marked this conversation as resolved

bvisness merged commit 4b3e38ee02 into master

2022-07-25 20:16:05 +00:00

bvisness referenced this issue from a commit

2022-07-25 20:16:05 +00:00

Set meta tag theme color to project's theme color (#71)

Sign in to join this conversation.

No reviewers