diff --git a/electron-builder.json b/electron-builder.json index 717597d..7a1d7f9 100644 --- a/electron-builder.json +++ b/electron-builder.json @@ -24,7 +24,7 @@ "!out", "!etc" ], - "buildNumber": "53", + "buildNumber": "67", "mac": { "category": "public.app-category-utilities", "electronLanguages": [ diff --git a/index.css b/index.css index 5a088fb..01d4730 100644 --- a/index.css +++ b/index.css @@ -2,6 +2,7 @@ margin-left: auto; margin-right: auto; } + body { text-align: center; font-family: BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Helvetica Neue', sans-serif; @@ -46,4 +47,51 @@ li { border-radius: 5px; display: none; padding: 3px 10px; +} + +.card { + display: grid; + grid-template-columns: auto auto 1fr auto; + height: 50px; + margin-top: 2%; + width: 95%; + margin-left: auto; + margin-right: auto; + border-radius: 7px; +} + +.card img { + height: 50px; +} + +.card > div:nth-child(2) { + margin-top: auto; + margin-bottom: auto; + margin-left: 10px; + text-align: left; + width: 100%; +} + +.card > div:nth-child(2) > div:nth-child(1) { + font-weight: 600; + font-size: large; +} + +.card > div:nth-child(2) > div:nth-child(2) { + font-weight: 300; + font-size: small; +} + +@media (prefers-color-scheme: light) { + .card { + background-color: #edebea; + border: 1px solid #e0dedd; + } +} + +@media (prefers-color-scheme: dark) { + .card { + border: 1px solid #545050; + background-color: #363232; + } } \ No newline at end of file diff --git a/src/renderer.ts b/src/renderer.ts index 931cc32..c6a8b0a 100644 --- a/src/renderer.ts +++ b/src/renderer.ts @@ -72,10 +72,10 @@ window.addEventListener('load', async () => { ipc.on('theme', (_event: any, isDark: boolean) => { if (isDark) { document.querySelector('body')!.style.backgroundColor = '#332f2f'; - document.querySelector('body')!.style.color = '#cccccc'; + document.querySelector('body')!.style.color = '#dfdfdf'; } else { - document.querySelector('body')!.style.backgroundColor = 'white'; - document.querySelector('body')!.style.color = '#2c3e50'; + document.querySelector('body')!.style.backgroundColor = '#f1efee'; + document.querySelector('body')!.style.color = '#242424'; } }); ipc.on('downloaded-oc', async (_event: any, ocver: string, kexts: Array, PID: number) => { @@ -166,15 +166,10 @@ window.addEventListener('load', async () => { const ocImg = document.createElement('img'); ocImg.src = 'opencore.svg'; ocImg.alt = 'OpenCore'; - ocImg.style.height = '50px'; card.appendChild(ocImg); const ocInfo = document.createElement('div'); - ocInfo.style.marginTop = 'auto'; - ocInfo.style.marginBottom = 'auto'; - ocInfo.style.marginLeft = '10px'; - ocInfo.style.textAlign = 'left'; - ocInfo.style.width = '100%'; const ocInfoTitle = document.createElement('div'); + ocInfoTitle.className = 'oc-info-title'; if (ocver) ocInfoTitle.innerHTML = `OpenCore ${ocver}`; else { ocInfoTitle.innerHTML = 'OpenCore'; @@ -193,15 +188,11 @@ window.addEventListener('load', async () => { ocInfoTitle.appendChild(ocVersionSelector); ocInfoTitle.appendChild(document.createElement('div')); } - ocInfoTitle.style.fontWeight = '600'; - ocInfoTitle.style.fontSize = 'large'; ocInfo.appendChild(ocInfoTitle); const ocInfoDesc = document.createElement('div'); ocInfoDesc.className = 'oc-info-desc'; if (!ocver) ocInfoDesc.innerHTML = isKorean ? '64비트 RELEASE 버전이 지원됨' : '64-bit RELEASE versions are supported'; else ocInfoDesc.innerHTML = ocverNum < 98 ? (isKorean ? '0.9.8로 업데이트하기' : 'Update to 0.9.8') : (isKorean ? '최신 버전' : 'Up to date'); - ocInfoDesc.style.fontWeight = '300'; - ocInfoDesc.style.fontSize = 'small'; ocInfo.appendChild(ocInfoDesc); card.appendChild(ocInfo); card.appendChild(document.createElement('div')); @@ -216,25 +207,16 @@ window.addEventListener('load', async () => { ocInfoUpdate.style.transform = 'translateY(-50%)'; ocInfoUpdate.style.height = '50%'; ocInfoUpdate.addEventListener('click', async () => { - console.log(`.card[data-pid="${pid}"] .update-btn`); (document.querySelector(`.card[data-pid="${pid}"] .update-btn`) as HTMLButtonElement).disabled = true; ocver = ocver || (document.querySelector(`.card[data-pid="${pid}"] .version-selector`) as HTMLSelectElement).value; + document.querySelector(`.card[data-pid="${pid}"] .oc-info-title`)!.innerHTML = `OpenCore ${ocver}`; + (document.querySelector(`.card[data-pid="${pid}"] .oc-info-title`) as HTMLElement).style.display = 'block'; document.querySelector(`.card[data-pid="${pid}"] .oc-info-desc`)!.innerHTML = isKorean ? `1/7. OpenCore 다운로드 중...` : `1/7. Downloading OpenCore...` await sleep(50); ipc.send('download-oc', ocver, kexts, pid); }); card.appendChild(ocInfoUpdate); } - card.style.display = 'grid'; - card.style.gridTemplateColumns = 'auto auto 1fr auto'; - card.style.height = '50px'; - card.style.marginTop = '2%'; - card.style.width = '95%'; - card.style.marginLeft = 'auto'; - card.style.marginRight = 'auto'; - card.style.border = '1px solid #545050'; - card.style.borderRadius = '7px'; - card.style.backgroundColor = '#363232'; document.querySelector('#update-list')!.appendChild(card); } });