From 4cd94e3689b256b6578da3c35ad52872bcea634f Mon Sep 17 00:00:00 2001 From: Kyle D Date: Fri, 18 Dec 2020 20:17:27 -0500 Subject: [PATCH] gitea png to logo (#13974) * gitea png to logo.svg * gitea safari svg to logo * minify svgs * Update english docs * Update missing section on customizing logo --- Makefile | 2 +- build/generate-images.js | 37 +++++++++++++----- .../doc/advanced/customizing-gitea.en-us.md | 4 ++ .../doc/developers/hacking-on-gitea.en-us.md | 4 +- public/img/gitea.svg | 1 + public/img/logo-192.png | Bin 0 -> 4756 bytes public/img/{gitea-512.png => logo-512.png} | Bin public/img/{gitea-lg.png => logo-lg.png} | Bin .../img/{gitea-safari.svg => logo-safari.svg} | 0 public/img/{gitea-sm.png => logo-sm.png} | Bin public/img/logo.svg | 1 + snap/snapcraft.yaml | 2 +- templates/admin/hook_new.tmpl | 2 +- templates/base/head.tmpl | 6 +-- templates/base/head_navbar.tmpl | 2 +- templates/home.tmpl | 2 +- templates/org/settings/hook_new.tmpl | 2 +- templates/pwa/manifest_json.tmpl | 8 ++-- templates/repo/settings/webhook/list.tmpl | 2 +- templates/repo/settings/webhook/new.tmpl | 2 +- 20 files changed, 52 insertions(+), 25 deletions(-) create mode 100644 public/img/gitea.svg create mode 100644 public/img/logo-192.png rename public/img/{gitea-512.png => logo-512.png} (100%) rename public/img/{gitea-lg.png => logo-lg.png} (100%) rename public/img/{gitea-safari.svg => logo-safari.svg} (100%) rename public/img/{gitea-sm.png => logo-sm.png} (100%) create mode 100644 public/img/logo.svg diff --git a/Makefile b/Makefile index bb2f181d290..e3057d99ee7 100644 --- a/Makefile +++ b/Makefile @@ -699,7 +699,7 @@ generate-gitignore: .PHONY: generate-images generate-images: npm install --no-save --no-package-lock fabric imagemin-zopfli - node build/generate-images.js + node build/generate-images.js $(TAGS) .PHONY: pr\#% pr\#%: clean-all diff --git a/build/generate-images.js b/build/generate-images.js index c7f58f61d07..9bd40641e43 100755 --- a/build/generate-images.js +++ b/build/generate-images.js @@ -7,6 +7,8 @@ const {readFile, writeFile} = require('fs').promises; const {resolve} = require('path'); const Svgo = require('svgo'); +const logoFile = resolve(__dirname, '../assets/logo.svg'); + function exit(err) { if (err) console.error(err); process.exit(err ? 1 : 0); @@ -39,6 +41,12 @@ async function generateSvgFavicon(svg, outputFile) { await writeFile(outputFile, data); } +async function generateSvg(svg, outputFile) { + const svgo = new Svgo(); + const {data} = await svgo.optimize(svg); + await writeFile(outputFile, data); +} + async function generate(svg, outputFile, {size, bg}) { const {objects, options} = await loadSvg(svg); const canvas = new fabric.Canvas(); @@ -69,15 +77,26 @@ async function generate(svg, outputFile, {size, bg}) { } async function main() { - const svg = await readFile(resolve(__dirname, '../assets/logo.svg'), 'utf8'); - await generateSvgFavicon(svg, resolve(__dirname, '../public/img/favicon.svg')); - await generate(svg, resolve(__dirname, '../public/img/gitea-lg.png'), {size: 880}); - await generate(svg, resolve(__dirname, '../public/img/gitea-512.png'), {size: 512}); - await generate(svg, resolve(__dirname, '../public/img/gitea-192.png'), {size: 192}); - await generate(svg, resolve(__dirname, '../public/img/gitea-sm.png'), {size: 120}); - await generate(svg, resolve(__dirname, '../public/img/avatar_default.png'), {size: 200}); - await generate(svg, resolve(__dirname, '../public/img/favicon.png'), {size: 180}); - await generate(svg, resolve(__dirname, '../public/img/apple-touch-icon.png'), {size: 180, bg: true}); + const gitea = process.argv.slice(2).includes('gitea'); + + const svg = await readFile(logoFile, 'utf8'); + await Promise.all([ + generateSvgFavicon(svg, resolve(__dirname, '../public/img/favicon.svg')), + generateSvg(svg, resolve(__dirname, '../public/img/logo.svg')), + generate(svg, resolve(__dirname, '../public/img/logo-lg.png'), {size: 880}), + generate(svg, resolve(__dirname, '../public/img/logo-512.png'), {size: 512}), + generate(svg, resolve(__dirname, '../public/img/logo-192.png'), {size: 192}), + generate(svg, resolve(__dirname, '../public/img/logo-sm.png'), {size: 120}), + generate(svg, resolve(__dirname, '../public/img/avatar_default.png'), {size: 200}), + generate(svg, resolve(__dirname, '../public/img/favicon.png'), {size: 180}), + generate(svg, resolve(__dirname, '../public/img/apple-touch-icon.png'), {size: 180, bg: true}), + ]); + if (gitea) { + await Promise.all([ + generateSvg(svg, resolve(__dirname, '../public/img/gitea.svg')), + generate(svg, resolve(__dirname, '../public/img/gitea-192.png'), {size: 192}), + ]); + } } main().then(exit).catch(exit); diff --git a/docs/content/doc/advanced/customizing-gitea.en-us.md b/docs/content/doc/advanced/customizing-gitea.en-us.md index 118d5f2e683..be6512a4504 100644 --- a/docs/content/doc/advanced/customizing-gitea.en-us.md +++ b/docs/content/doc/advanced/customizing-gitea.en-us.md @@ -57,6 +57,10 @@ To make Gitea serve custom public files (like pages and images), use the folder For example, a file `image.png` stored in `custom/public/`, can be accessed with the url `http://gitea.domain.tld/image.png`. +## Changing the default logo + +To automatically update custom logo png and svg files replace `assets/logo.svg` and run `make generate-images`. This will update the user-designated logo files served in `public/img`. Alternatively, you can manually update each `logo-X.png` and `logo.svg` file in `public/img`. + ## Changing the default avatar Place the png image at the following path: `custom/public/img/avatar_default.png` diff --git a/docs/content/doc/developers/hacking-on-gitea.en-us.md b/docs/content/doc/developers/hacking-on-gitea.en-us.md index 875a4818e1b..516a33d2add 100644 --- a/docs/content/doc/developers/hacking-on-gitea.en-us.md +++ b/docs/content/doc/developers/hacking-on-gitea.en-us.md @@ -185,7 +185,9 @@ SVG icons are built using the `make svg` target which compiles the icon sources ### Building the Logo -The PNG versions of the logo are built from a single SVG source file `assets/logo.svg` using the `make generate-images` target. To run it, Node.js and npm must be available. The same process can also be used to generate a custom logo PNGs from a SVG source file. It's possible to remove parts of the SVG logo for the favicon build by adding a `detail-remove` class to the SVG nodes to be removed. +The PNG and SVG versions of the gitea logo are built from a single SVG source file `assets/logo.svg` using the `TAGS="gitea" make generate-images` target. To run it, Node.js and npm must be available. + +The same process can also be used to generate custom logo PNGs from a SVG source file by updating `assets/logo.svg` and running `make generate-images`. Omitting the `gitea` tag will update only the user-designated logo files. ### Updating the API diff --git a/public/img/gitea.svg b/public/img/gitea.svg new file mode 100644 index 00000000000..38ab3c31ae5 --- /dev/null +++ b/public/img/gitea.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/img/logo-192.png b/public/img/logo-192.png new file mode 100644 index 0000000000000000000000000000000000000000..08baff19e1906a5bd3d58e8cd3298aa6bf3e0193 GIT binary patch literal 4756 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 bunIe1=&IF@I%pxf8l=$E)z4*}Q$iB}^rSn- literal 0 HcmV?d00001 diff --git a/public/img/gitea-512.png b/public/img/logo-512.png similarity index 100% rename from public/img/gitea-512.png rename to public/img/logo-512.png diff --git a/public/img/gitea-lg.png b/public/img/logo-lg.png similarity index 100% rename from public/img/gitea-lg.png rename to public/img/logo-lg.png diff --git a/public/img/gitea-safari.svg b/public/img/logo-safari.svg similarity index 100% rename from public/img/gitea-safari.svg rename to public/img/logo-safari.svg diff --git a/public/img/gitea-sm.png b/public/img/logo-sm.png similarity index 100% rename from public/img/gitea-sm.png rename to public/img/logo-sm.png diff --git a/public/img/logo.svg b/public/img/logo.svg new file mode 100644 index 00000000000..38ab3c31ae5 --- /dev/null +++ b/public/img/logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/snap/snapcraft.yaml b/snap/snapcraft.yaml index 55bd03b097f..223fdde8dd8 100644 --- a/snap/snapcraft.yaml +++ b/snap/snapcraft.yaml @@ -6,7 +6,7 @@ description: | an independent binary distribution across ALL platforms that Go supports, including Linux, Mac OS X, Windows and ARM. -icon: public/img/gitea-lg.png +icon: public/img/logo-lg.png confinement: strict base: core18 adopt-info: gitea diff --git a/templates/admin/hook_new.tmpl b/templates/admin/hook_new.tmpl index dabd568f93f..c6f02ee20eb 100644 --- a/templates/admin/hook_new.tmpl +++ b/templates/admin/hook_new.tmpl @@ -11,7 +11,7 @@ {{end}}
{{if eq .HookType "gitea"}} - + {{else if eq .HookType "gogs"}} {{else if eq .HookType "slack"}} diff --git a/templates/base/head.tmpl b/templates/base/head.tmpl index 95365450412..7d35664c7ba 100644 --- a/templates/base/head.tmpl +++ b/templates/base/head.tmpl @@ -60,8 +60,8 @@ - - + + {{if .RequireSimpleMDE}} {{end}} @@ -104,7 +104,7 @@ {{else}} - + {{end}} diff --git a/templates/base/head_navbar.tmpl b/templates/base/head_navbar.tmpl index 979e4d54887..5ce07ff8c51 100644 --- a/templates/base/head_navbar.tmpl +++ b/templates/base/head_navbar.tmpl @@ -1,7 +1,7 @@