| FROM node:18 | |
| # 克隆项目 | |
| RUN git clone https://github.com/ChatGPTNextWeb/ChatGPT-Next-Web.git | |
| WORKDIR "ChatGPT-Next-Web" | |
| # 创建新的样式文件 | |
| RUN echo '@import "./animation.scss";\n\ | |
| @import "./window.scss";\n\ | |
| \n\ | |
| @mixin light {\n\ | |
| --theme: light;\n\ | |
| --white: #fff;\n\ | |
| --black: #303030;\n\ | |
| --gray: #fafafa;\n\ | |
| --primary: #315ef8;\n\ | |
| --second: #f3f3f6;\n\ | |
| --hover-color: #f3f3f3;\n\ | |
| --bar-color: rgba(0,0,0,.1);\n\ | |
| --theme-color: var(--gray);\n\ | |
| --shadow: 50px 50px 100px 10px rgba(0,0,0,.1);\n\ | |
| --card-shadow: 0px 2px 4px 0px rgba(0,0,0,.05);\n\ | |
| --border-in-light: 1px solid #dedede;\n\ | |
| --sidebar-sub-title: rgba(38,47,156,.5);\n\ | |
| }\n\ | |
| \n\ | |
| @mixin dark {\n\ | |
| --theme: dark;\n\ | |
| --white: #1e1e1e;\n\ | |
| --black: #bbb;\n\ | |
| --gray: #151515;\n\ | |
| --primary: #315ef8;\n\ | |
| --second: #26262c;\n\ | |
| --hover-color: #323232;\n\ | |
| --bar-color: rgba(255, 255, 255, 0.1);\n\ | |
| --border-in-light: 1px solid rgba(255, 255, 255, 0.192);\n\ | |
| --theme-color: var(--gray);\n\ | |
| \n\ | |
| div:not(.no-dark) > svg {\n\ | |
| filter: invert(0.5);\n\ | |
| }\n\ | |
| }\n\ | |
| \n\ | |
| .light {\n\ | |
| @include light;\n\ | |
| }\n\ | |
| \n\ | |
| .dark {\n\ | |
| @include dark;\n\ | |
| }\n\ | |
| \n\ | |
| .mask {\n\ | |
| filter: invert(0.8);\n\ | |
| }\n\ | |
| \n\ | |
| :root {\n\ | |
| @include light;\n\ | |
| \n\ | |
| --window-width: 90vw;\n\ | |
| --window-height: 90vh;\n\ | |
| --sidebar-width: 300px;\n\ | |
| --window-content-width: calc(100% - var(--sidebar-width));\n\ | |
| --message-max-width: 80%;\n\ | |
| --full-height: 100%;\n\ | |
| }\n\ | |
| \n\ | |
| @media only screen and (max-width: 600px) {\n\ | |
| :root {\n\ | |
| --window-width: 100vw;\n\ | |
| --window-height: var(--full-height);\n\ | |
| --sidebar-width: 100vw;\n\ | |
| --window-content-width: var(--window-width);\n\ | |
| --message-max-width: 100%;\n\ | |
| }\n\ | |
| \n\ | |
| .no-mobile {\n\ | |
| display: none;\n\ | |
| }\n\ | |
| }\n\ | |
| \n\ | |
| @media (prefers-color-scheme: dark) {\n\ | |
| :root {\n\ | |
| @include dark;\n\ | |
| }\n\ | |
| }' > /tmp/new_globals.scss | |
| # 将剩余的原始样式内容附加到新文件中 | |
| RUN sed -n '/html {/,$p' app/styles/globals.scss >> /tmp/new_globals.scss | |
| # 备份原始文件并替换为新文件 | |
| RUN cp app/styles/globals.scss app/styles/globals.scss.backup && \ | |
| cp /tmp/new_globals.scss app/styles/globals.scss | |
| # 修改标题和副标题 | |
| RUN sed -i 's/NextChat/NieAI Chat/g' app/components/sidebar.tsx | |
| RUN sed -i 's/Build your own AI assistant./Quickly start your AI journey./g' app/components/sidebar.tsx | |
| # 替换 logo | |
| COPY chatgpt.svg app/icons/chatgpt.svg | |
| # 安装依赖并构建 | |
| RUN npm i | |
| RUN npm run build | |
| # 安装 cloudflared | |
| COPY --from=cloudflare/cloudflared:latest /usr/local/bin/cloudflared /usr/local/bin/cloudflared | |
| EXPOSE 3000 | |
| # 使用shell形式的ENTRYPOINT来运行多个命令 | |
| ENTRYPOINT cloudflared tunnel --no-autoupdate run --token $CF_TOKEN & \ | |
| npm run start |