photoprism/frontend/Makefile
Michael Mayer 7ba4dc1bf6 Frontend: Tune lightbox theme for face markers, retire ESLint-Prettier glue #4966
- Refactor `meta.css` face-marker palette to consume theme tokens (Path A):
  default rect → `on-surface`; named-marker stroke → `primary`; draft →
  `accent`; hover → `primary-darken-1`; handle → `primary-darken-1` fill +
  `primary` stroke; Confirm pill → `primary-darken-2`; Cancel pill →
  `highlight-lighten-1`; Remove pill → `remove`; Back button → `surface`.
- Retune the `lightbox` theme block to support the rebind: `primary
  #F2F3F3 → #9E8FC9` (muted purple), `accent #2D2E2E → #BDAFE4` (lavender),
  `surface #151515 → #181818`, `surface-bright → #1c1c1c`, `button →
  #242424`, `highlight #424041 → #3c3c3c`, `remove → #cd4645`. Effectively
  reverts the `surface-variant ↔ on-surface-variant` swap and re-introduces
  an explicit `.v-tooltip.v-theme--lightbox` override in `lightbox.css`.
- Bump `variations.darken` to 2 so `--v-theme-primary-darken-2` resolves.
- Swap the in-template button order in `markers.vue` to Cancel-left /
  Confirm-right for both the pending-add and remove-confirm popovers.
- Add inline comments to the `default.add` and updated `lightbox`
  entries so each color's purpose stays documented at the source.
- Drop `eslint-plugin-prettier` (its `prettier/prettier` rule was already
  `"off"`, making the plugin inert). Replace `plugin:prettier/recommended`
  with a direct `eslint-config-prettier` extend; keep ESLint's own
  `indent` / `quotes` / `brace-style` rules as the JS formatter.
- Tell ESLint to ignore `*.{css,scss,sass}` so Prettier owns CSS
  unambiguously; wire `npm run fmt-css` / `npm run lint-css` Prettier
  passes into `npm run fmt` / `npm run lint` so `make fmt-js` and
  `make lint-js` cover stylesheets too.
- Drop `eslint-plugin-prettier` from the dev-container global install
  list and the `frontend/tests/README.md` dependency table; regenerate
  `NOTICE` files.
2026-05-19 09:56:09 +00:00

91 lines
3.5 KiB
Makefile

# Copyright © 2018 - 2025 PhotoPrism UG. All rights reserved.
#
# Questions? Email us at hello@photoprism.app or visit our website to learn
# more about our team, products and services: https://www.photoprism.app/
UID := $(shell id -u)
GID := $(shell id -g)
PWD := $(dir $(abspath $(lastword $(MAKEFILE_LIST))))
REPO_ROOT := $(abspath $(PWD)/..)
NODE_IMAGE ?= node:lts
export NPM_CONFIG_IGNORE_SCRIPTS ?= true
ifneq (,$(wildcard $(REPO_ROOT)/.telemetry))
include $(REPO_ROOT)/.telemetry
export $(shell sed -n 's/^[[:space:]]*\([A-Z_][A-Z0-9_]*\)=.*/\1/p' $(REPO_ROOT)/.telemetry)
endif
define DOCKER_NPM
docker run --rm -it \
-v "$(REPO_ROOT)":/app \
-w /app \
--user "$(UID):$(GID)" \
--read-only --tmpfs /tmp \
-v ~/.cache/npm:/npm-cache \
--env-file "$(REPO_ROOT)/.telemetry" \
-e NPM_CONFIG_CACHE=/npm-cache \
-e NPM_CONFIG_IGNORE_SCRIPTS=true \
--cap-drop ALL --security-opt no-new-privileges --pids-limit 256 \
$(NODE_IMAGE) sh -lc
endef
# Declare "make" targets.
all: install build
dep: install-npm install-testcafe install
dep-list:
npx npm-check-updates
help: list
list:
@awk '/^[[:alnum:]]+[^[:space:]]+:/ {printf "%s",substr($$1,1,length($$1)-1); if (match($$0,/#/)) {desc=substr($$0,RSTART+1); sub(/^[[:space:]]+/,"",desc); printf " - %s\n",desc} else printf "\n" }' "$(firstword $(MAKEFILE_LIST))"
notice:
@echo "Creating license report for frontend dependencies..."
license-report --only=prod --config=.report.json > NOTICE
install-npm:
# Split global installs and disable package scripts for safety.
sudo npm install -g --ignore-scripts --no-fund --no-audit --no-update-notifier npm@latest
sudo npm install -g --ignore-scripts --no-fund --no-audit --no-update-notifier npm-check-updates@latest license-report@latest
install-testcafe:
npm install -g --ignore-scripts --no-fund --no-audit --no-update-notifier testcafe@latest
install-eslint:
npm install -g --ignore-scripts --no-fund --no-audit --no-update-notifier eslint globals @eslint/eslintrc @eslint/js eslint-config-prettier eslint-formatter-pretty eslint-plugin-html eslint-plugin-import eslint-plugin-node eslint-plugin-promise eslint-plugin-vue eslint-webpack-plugin vue-eslint-parser prettier
upgrade:
$(info Securely upgrading NPM dependencies...)
$(DOCKER_NPM) 'npx -y npm@latest update --save --package-lock --ignore-scripts --no-fund --no-audit --no-update-notifier && npx -y npm@latest install --ignore-scripts --no-audit --no-fund --no-update-notifier'
npm-install:
$(info Installing NPM dependencies...)
(cd .. && npm install --save --ignore-scripts --no-audit --no-fund --no-update-notifier)
install: npm-install
npm-update:
$(info Updating NPM dependencies in package-lock.json...)
(cd .. && npm update --save --package-lock --ignore-scripts --no-audit --no-fund --no-update-notifier)
update: npm-update npm-install
security-check: # Scan for missing --ignore-scripts and unsafe v-html
npm run -s security:scan
watch:
npm run watch
build:
npm run build
audit:
npm audit --ignore-scripts --no-fund --no-audit --no-update-notifier
lint:
npm run lint || true
fmt:
npm run fmt
test:
npm run test
test-coverage:
npm run test-coverage
test-component:
npm run test-component
testcafe:
npm run testcafe
acceptance-local:
npm run acceptance-local
gettext-extract:
# Script sets GETTEXT_MERGE=0 by default so vue-gettext skips msgmerge; scripts/gettext-merge.sh handles merging.
npm run gettext-extract
gettext-compile:
npm run gettext-compile
# Declare all targets as "PHONY", see https://www.gnu.org/software/make/manual/html_node/Phony-Targets.html.
MAKEFLAGS += --always-make