十年匠心定制 · 商业建站与技术教学双线并行 咨询热线:400-886-1026 service@lmnt.cn
ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

Stretchly休息提醒HTML定制:改3个文件换掉默认提醒弹窗

Stretchly休息提醒HTML定制:改3个文件换掉默认提醒弹窗 Stretchly休息提醒HTML定制改3个文件换掉默认提醒弹窗【免费下载链接】stretchlyThe break time reminder app项目地址: https://gitcode.com/gh_mirrors/st/stretchly默认的休息提醒弹窗只有一行提示文案和倒计时。如果你想换提示语、字体或配色只需要改动 Stretchly 源码里的几个 HTML 与 CSS 文件本文按三处讲清楚该改哪里。图迷你休息界面含休息提示文字与倒计时进度条找到要改的那几个文件Stretchly 的休息界面是基于标准 HTML 页面实现的不是写死的原生窗口。三个界面对应的文件迷你休息app/microbreak.html长休息app/break.html设置页app/preferences.html迷你休息只有提示文案microbreak-idea 元素长休息多一行正文break-text 元素改哪个界面就打开对应文件。HTML 里决定提醒内容的地方break.html 的核心三行div classbreak-idea dirauto/div div classbreak-text dirauto/div progress idprogress max10000 aria-hiddentrue/progress前两个 div 的文本由脚本在运行时填入标题和按钮上的 />图偏好设置界面使用同一套样式体系渲染改动公共样式前先确认影响范围改完验证JS 驱动的部分不需要你动进度条的填充、倒计时数字更新、深色/浅色切换都由 JS 层处理break-renderer.js 等文件。你只要不改动 HTML 里的 id 和 class重启应用后脚本逻辑照常工作你改的 CSS 会直接生效无需修改任何 JS。图长休息界面提示文字与由脚本填充的进度条常见坑与建议修改文件后需重启应用只刷新界面不会生效保留 contenteditable="false">【免费下载链接】stretchlyThe break time reminder app项目地址: https://gitcode.com/gh_mirrors/st/stretchly创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表