Keep password change on main management
This commit is contained in:
@@ -4,7 +4,7 @@
|
||||
|
||||
```html
|
||||
<meta charset="UTF-8">
|
||||
<link href="/custom/launcher/css/style.css" rel="stylesheet" />
|
||||
<link href="/custom/common/css/launcher.css" rel="stylesheet" />
|
||||
<div id="findMyShortcut" class="find-container"></div>
|
||||
<script src="/custom/launcher/js/main.js"></script>
|
||||
```
|
||||
@@ -22,13 +22,14 @@
|
||||
|
||||
- `api.php`: 로그인, 로그아웃, 암호 변경, 콕 찌르기 카운트/웹훅 처리
|
||||
- `js/main.js`: 4개 아이콘 렌더링, 인증 흐름, 암호 변경 UI
|
||||
- `css/style.css`: iOS 테마 배너 스타일
|
||||
- `img/`: 런처 아이콘 이미지
|
||||
|
||||
## 공통 모듈 연동
|
||||
|
||||
인증, 암호 hash 저장, Home Assistant 호출은 `/custom/common` 모듈을 사용합니다. 런처는 더 이상 Home Assistant 토큰이나 웹훅을 브라우저로 직접 노출하지 않습니다.
|
||||
|
||||
런처 CSS는 `/custom/common/css/launcher.css`를 사용합니다. 서비스 폴더에는 런처 전용 PHP, JS, 이미지 파일만 둡니다.
|
||||
|
||||
## 운영 메모
|
||||
|
||||
메인 버튼은 기존 4개를 유지합니다. 암호 변경은 배너 우하단의 작은 `관리` 링크에서 처리합니다.
|
||||
메인 버튼은 기존 4개를 유지합니다. 암호 변경은 배너 우하단의 작은 `관리` 링크에서 처리하며, 기능 버튼 진입을 위한 비밀번호 입력 화면에는 암호 변경 링크를 노출하지 않습니다.
|
||||
|
||||
-175
@@ -1,175 +0,0 @@
|
||||
.find-container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
background: #f2f2f7;
|
||||
border-radius: 16px;
|
||||
padding: 12px;
|
||||
user-select: none;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.password-container {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
width: fit-content;
|
||||
height: auto;
|
||||
background: #f2f2f7;
|
||||
border-radius: 16px;
|
||||
padding: 12px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#findMyShortcut input[type="password"] {
|
||||
padding: 8px 12px;
|
||||
font-size: 16px;
|
||||
border-radius: 16px;
|
||||
border: 1px solid #ccc;
|
||||
width: 200px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
background-color: #fff;
|
||||
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
|
||||
appearance: none;
|
||||
outline: none;
|
||||
-webkit-appearance: none;
|
||||
margin: 3px 0;
|
||||
}
|
||||
|
||||
#findMyShortcut input[type="password"]:focus {
|
||||
border-color: #999;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#findMyShortcut button {
|
||||
padding: 10px 12px;
|
||||
font-size: 15px;
|
||||
border-radius: 16px;
|
||||
background-color: #007aff;
|
||||
color: white;
|
||||
border: none;
|
||||
margin-left: 8px;
|
||||
font-weight: 500;
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
|
||||
#findMyShortcut button:active {
|
||||
background-color: #0051c7;
|
||||
}
|
||||
|
||||
.iconContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
width: 90px;
|
||||
margin: 0 12px;
|
||||
border-radius: 16px;
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
|
||||
.iconContainer img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
|
||||
background: #fff;
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.iconContainer:active img {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.iconLabel {
|
||||
margin-top: 8px;
|
||||
font-size: 13px;
|
||||
color: #000;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
text-align: center;
|
||||
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1; /* 1줄만 표시하고 자름 (2줄 자르려면 2로 변경) */
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
#failMsg {
|
||||
font-size: 13px;
|
||||
color: red;
|
||||
min-height: 18px;
|
||||
margin-top: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.launcher-manage {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
bottom: 6px;
|
||||
padding: 4px 7px !important;
|
||||
margin: 0 !important;
|
||||
border-radius: 999px !important;
|
||||
background: rgba(255, 255, 255, 0.68) !important;
|
||||
color: #8e8e93 !important;
|
||||
font-size: 11px !important;
|
||||
line-height: 1 !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.launcher-form-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.launcher-form-header {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
min-width: 280px;
|
||||
margin-bottom: 6px;
|
||||
padding: 8px 0;
|
||||
font-size: 16px;
|
||||
color: #000;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||||
}
|
||||
|
||||
.launcher-back {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 1px;
|
||||
font-size: 16px;
|
||||
color: #007aff;
|
||||
text-decoration: none;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.launcher-back .backArrow {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
margin-right: 1px;
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
.launcher-input-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#findMyShortcut .launcher-text-button {
|
||||
margin: 2px 0 0 0;
|
||||
padding: 4px 8px;
|
||||
background: transparent;
|
||||
color: #007aff;
|
||||
font-size: 13px;
|
||||
box-shadow: none;
|
||||
}
|
||||
-11
@@ -81,7 +81,6 @@ function showPasswordForm(onSuccess) {
|
||||
const title = createFormHeader('비밀번호', renderIcons);
|
||||
const input = createPasswordInput('blog_secret', '비밀번호');
|
||||
const button = createButton('확인');
|
||||
const changeButton = createTextButton('암호 변경', () => showPasswordChangeForm());
|
||||
const msg = document.createElement('div');
|
||||
msg.id = 'failMsg';
|
||||
|
||||
@@ -94,7 +93,6 @@ function showPasswordForm(onSuccess) {
|
||||
column.className = 'launcher-form-column';
|
||||
column.appendChild(title);
|
||||
column.appendChild(inputRow);
|
||||
column.appendChild(changeButton);
|
||||
shortcut.appendChild(column);
|
||||
|
||||
const submit = async () => {
|
||||
@@ -350,15 +348,6 @@ function createButton(text) {
|
||||
return button;
|
||||
}
|
||||
|
||||
function createTextButton(text, onClick) {
|
||||
const button = document.createElement('button');
|
||||
button.type = 'button';
|
||||
button.className = 'launcher-text-button';
|
||||
button.textContent = text;
|
||||
button.addEventListener('click', onClick);
|
||||
return button;
|
||||
}
|
||||
|
||||
function launcherAlert(name) {
|
||||
if (typeof showAlert === 'function') {
|
||||
showAlert(name);
|
||||
|
||||
Reference in New Issue
Block a user