diff --git a/DockerfileWithToken b/DockerfileWithToken new file mode 100644 index 00000000..2789eb98 --- /dev/null +++ b/DockerfileWithToken @@ -0,0 +1,18 @@ +# build stage +FROM node:lts-alpine AS build-stage +# Set environment variables for non-interactive npm installs +ENV NPM_CONFIG_LOGLEVEL warn +ENV CI true +ENV VITE_TOKEN "your_token" +WORKDIR /app +COPY package.json pnpm-lock.yaml ./ +RUN npm install -g pnpm && pnpm i --frozen-lockfile +COPY . . +RUN pnpm build + +# production stage +FROM nginx:stable-alpine AS production-stage +COPY --from=build-stage /app/dist /usr/share/nginx/html +COPY nginx.conf /etc/nginx/conf.d/default.conf +EXPOSE 80 +CMD ["nginx", "-g", "daemon off;"] diff --git a/README.md b/README.md index a13246e8..aefdb6d6 100644 --- a/README.md +++ b/README.md @@ -34,6 +34,15 @@ docker run -d --name it-tools --restart unless-stopped -p 8080:80 ghcr.io/corent - [Tipi](https://www.runtipi.io/docs/apps-available) - [Unraid](https://unraid.net/community/apps?q=it-tools) +## Public +If you want to add permission verification when users access the website, you can build and run the image using the following method. This approach will require users to enter a token before they can continue using the site. +```sh +cd it-tools +# vim DockerfileWithToken, change your_token to the token you want to use +docker build -f DockerfileWithToken -t it-tools:token . +docker run -d --name it-tools --restart unless-stopped -p 8080:80 it-tools:token +``` + ## Contribute ### Recommended IDE Setup diff --git a/src/pages/Login.vue b/src/pages/Login.vue index 2c271ee6..f896af54 100644 --- a/src/pages/Login.vue +++ b/src/pages/Login.vue @@ -42,7 +42,7 @@ async function handleLogin() { justify-content: center; align-items: center; min-height: 100vh; - background-color: #f5f5f5; /* 浅灰色背景,与截图一致 */ + background-color: #f5f5f5; padding: 20px; } @@ -91,12 +91,12 @@ async function handleLogin() { .form-input:focus { outline: none; - border-color: #4CAF50; /* 深绿色,与导航栏渐变一致 */ + border-color: #4CAF50; box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2); } .login-button { - background: linear-gradient(135deg, #4CAF50, #81C784); /* 与导航栏相似的渐变 */ + background: linear-gradient(135deg, #4CAF50, #81C784); color: white; border: none; border-radius: 6px;