diff --git a/.gitignore b/.gitignore index f87adba..42f91a1 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ +Emu/* Nwjs/* !Nwjs/.gitkeep Settings.json \ No newline at end of file diff --git a/App/css/style.css b/App/css/style.css index ea2dde1..b30fee2 100644 --- a/App/css/style.css +++ b/App/css/style.css @@ -7,776 +7,4 @@ ****************************************************************************** */ -html, body { - color: #fff; - overflow: hidden; - user-select: none; - filter: grayscale(1); - font-family: monospace; - scroll-behavior: smooth; - background-color: #0f1e3e; - text-shadow: 2px 2px 4px #000; -} -code { - padding: 6px; - color: #6bd5f5; - font-style: normal; - border-radius: 6px; - background-color: #000; -} -select, input[type='button'], input[type='checkbox'] { - outline: none; - cursor: pointer; -} -input[type='range'] { - outline: none; - margin-left: 6px; - cursor: col-resize; -} -input[disabled='disabled'], input[disabled] { - cursor: no-drop; -} -input[type='checkbox'] { - margin-right: 8px; - vertical-align: middle; -} -img { - -webkit-user-drag: none; -} - -/* - ScrollBar -*/ -::-webkit-scrollbar { - width: 8px; - height: 8px; - border-radius: 4px; -} -::-webkit-scrollbar-track { - border-radius: 4px; - margin: 6px 0px 6px 0px; -} -::-webkit-scrollbar-thumb { - border-radius: 4px; - background: #e7e7e7; -} -::-webkit-scrollbar-thumb:hover { - border-radius: 4px; - background: #f0f0f0; -} -::-webkit-scrollbar-thumb:active { - background: #fff; - border-radius: 4px; -} - -/* - Separator -*/ -.SEPARATOR_00 { - height: 2px; - margin-top: 10px; - padding-left: 2px; - padding-right: 2px; - border-radius: 6px; - margin-bottom: 10px; - width: calc(100% - 4px); - background-color: #0000; - background-image: linear-gradient(45deg, #fff, #6661, #0000); -} - -/* - Divs -*/ -.DIV_LIST { - top: 38px; - left: 0px; - z-index: 20; - width: 100%; - transition: 0.2s; - overflow: hidden; - position: absolute; - background-color: #162a50; - height: calc(100% - 202px); - background-image: linear-gradient(146deg, #090f1b, #162a50); -} -.DIV_LOG { - left: 0px; - bottom: 0px; - width: 100%; - height: 164px; - transition: 0.2s; - position: absolute; - background-color: #000; - background-size: auto 50%; - background-position: center; - background-repeat: no-repeat; - background-image: url('../img/logo.png'); -} -.DIV_ACTIONS { - top: 0px; - left: 0px; - width: 100%; - height: 22px; - padding: 8px; - display: flex; - flex-wrap: nowrap; - position: absolute; - align-items: center; - align-content: center; - justify-content: center; - background-image: linear-gradient(45deg, #28467f, #1c325f); -} -.DIV_OPTIONS { - top: 38px; - right: 0px; - padding: 6px; - width: 268px; - display: none; - transition: 0.1s; - position: absolute; - height: calc(100% - 150px); - background-image: linear-gradient(0deg, #162a50, #2a4a86); -} -.DIV_GAME_OPTIONS { - width: 268px; - bottom: 68px; - font-size: 14px; - overflow: auto; - position: absolute; - text-align: center; - height: calc(100% - 128px); -} -.DIV_HACK_LIST { - text-align: left; - margin-bottom: 10px; -} -.DIV_TITLE { - z-index: 10; - font-size: 28px; - margin-top: 10px; - font-weight: bold; - text-align: center; - margin-bottom: 10px; -} -.DIV_LIST_INTERNAL { - top: 0px; - left: 0px; - width: 100%; - z-index: 10; - height: 100%; - overflow: auto; - transition: 0.1s; - position: absolute; - background-color: #0000; -} -.DIV_LIST_GRID { - z-index: 10; - display: flex; - flex-wrap: wrap; - text-align: center; - align-items: center; - flex-direction: row; - align-content: stretch; - justify-content: center; -} -.DIV_GAMELIST_BG { - top: -6px; - left: -6px; - z-index: 1; - position: absolute; - background-size: cover; - background-color: #0006; - width: calc(100% + 12px); - height: calc(100% + 12px); - background-position: center; - background-repeat: no-repeat; - background-blend-mode: screen; - filter: blur(2px) opacity(0.7); -} -.GAME_ENTRY { - margin: 6px; - height: 78px; - display: flex; - cursor: pointer; - overflow: hidden; - max-height: 78px; - flex-wrap: nowrap; - padding-left: 0px; - border-radius: 6px; - align-items: center; - align-content: center; - width: calc(100% - 12px); - box-shadow: 0px 0px 4px #000; - backdrop-filter: blur(4px) invert(0.1); - background-image: linear-gradient(90deg, #3a4b6b82, #0000); -} -.GAME_ENTRY:hover { - box-shadow: 0px 0px 10px #0006; - background-image: linear-gradient(45deg, #3a4b6b, #3a4b6b82); -} -.GAME_ENTRY:active { - backdrop-filter: sepia(0.5) blur(6px); - background-image: linear-gradient(180deg, #97a7ff85, #6464a578); -} -.GAME_ENTRY_COMPACT { - display: flex; - flex-wrap: nowrap; - align-items: center; - flex-direction: row; - align-content: center; - max-height: 24px !important; - padding-left: 10px !important; - width: calc(100% - 22px) !important; -} -.GAME_ENTRY_GRID { - z-index: 12; - padding: 0px; - display: table; - box-shadow: none; - border-radius: 8px; - min-width: 92.93px; - min-height: 92.93px; - height: max-content; - max-width: max-content; - max-height: max-content; - background-color: #0000; - text-align: -webkit-right; -} -.GAME_ENTRY_GRID:hover { - animation-duration: 4s; - animation-name: gridGameFocus; - animation-iteration-count: infinite; -} -.GAME_ENTRY_BG { - top: 0px; - left: 0px; - z-index: 0; - width: 100%; - height: 100%; - filter: blur(4px); - position: absolute; - background-size: cover; - background-position: center; - background-repeat: no-repeat; - -webkit-mask-image: linear-gradient(45deg, #0006, #0000, #0000); -} -.GAME_ENTRY:hover .GAME_ENTRY_BG { - filter: blur(3px); - -webkit-mask-image: linear-gradient(45deg, #000c, #0002, #0000); -} -.GAME_ENTRY:focus .GAME_ENTRY_BG { - filter: blur(3px); - -webkit-mask-image: linear-gradient(45deg, #000c, #0002, #0000); -} -.GAME_ENTRY:active .GAME_ENTRY_BG { - -webkit-mask-image: linear-gradient(45deg, #000, #0006, #0000); -} -.GAME_DETAILS { - z-index: 1; - cursor: pointer; - width: calc(100% - 88px); -} -.GAME_DETAILS_COMPACT { - width: calc(100% - 10px); -} -.GAME_DETAILS_GRID { - right: 0px; - bottom: 0px; - position: absolute; - background-color: #000a; - padding: 2px 6px 2px 6px; - backdrop-filter: blur(4px); - text-shadow: 0px 0px 4px #000; - border-radius: 6px 0px 0px 0px; -} -.DIV_RUN_BTN { - bottom: 8px; - position: absolute; - text-align: center; - width: calc(100% - 12px); -} -.DIV_GAME_DETAILS { - z-index: 100; - height: 256px; - padding: 12px; - display: none; - transition: 1s; - overflow: hidden; - flex-wrap: nowrap; - position: absolute; - border-radius: 6px; - align-items: center; - top: calc(50% - 140px); - left: calc(10% - 24px); - width: calc(80% - 24px); - justify-content: center; - max-width: calc(80% - 24px); -} -.DIV_GAME_DETAILS_LABELS { - margin-left: 24px; -} -.DIV_SETTINGS { - top: 10%; - left: 5%; - width: 90%; - z-index: 10; - height: 80%; - display: block; - overflow: hidden; - position: absolute; - text-align: center; - border-radius: 10px; - box-shadow: 0px 0px 30px #000a; - background-image: linear-gradient(180deg, #2f405f, #131f38); -} -.DIV_SETTINGS_BG { - top: 0px; - left: 0px; - z-index: 0; - width: 100%; - height: 100%; - position: absolute; - background-size: auto 50%; - background-position: center; - background-repeat: no-repeat; - box-shadow: 0px 0px 10px #0002 inset; - background-image: url('../img/logo.png'); -} -.DIV_SETTINGS_HOLDER { - top: 0px; - left: 0px; - width: 100%; - height: 100%; - z-index: 100; - display: none; - position: absolute; - background-color: #0004; - backdrop-filter: blur(4px) grayscale(0.4); -} -.DIV_SETTINGS_LIST { - z-index: 10; - padding: 8px; - overflow: auto; - font-size: 14px; - text-align: left; - margin-left: 8px; - margin-bottom: 8px; - border-radius: 4px; - font-family: sans-serif; - background-color: #111d; - width: calc(100% - 32px); - height: calc(100% - 146px); - backdrop-filter: blur(4px); - box-shadow: 0px 0px 10px #0006; - background-image: linear-gradient(180deg, #000e2cab, #0000); -} -.DIV_settingsEntry { - padding: 2px; - overflow: hidden; - font-style: italic; -} -.DIV_settingsEntryFlex { - display: flex; - align-items: center; - flex-direction: row; - align-content: center; -} -.DIV_settingsH2 { - font-size: 20px; - font-weight: 600; - font-family: system-ui; - margin: 0px 0px 8px 2px; -} -.DIV_settingsSave { - width: 100%; - z-index: 10; - position: absolute; - text-align: center; -} -.DIV_labelSelectedGame { - display: flex; - flex-wrap: wrap; - text-align: center; - align-items: center; - margin-bottom: 4px; - align-content: center; - justify-content: center; -} -.DIV_selectedGameStatus { - width: 114px; - cursor: help; - display: flex; - overflow: hidden; - max-width: 114px; - max-height: 42px; - margin-left: 4px; - font-size: small; - flex-wrap: nowrap; - align-items: center; - flex-direction: row; - border-radius: 10px; - align-content: center; - background-color: #000; - justify-content: center; - padding: 4px 0px 4px 0px; - text-shadow: 1px 1px 2px #000; -} -.DIV_ICON_STATUS_OK { - background-image: linear-gradient(180deg, #0f0, #0b0); -} -.DIV_ICON_STATUS_WARN { - border-radius: 2px; - background-image: linear-gradient(180deg, #fbe800, #9f8d0c); -} -.DIV_ICON_STATUS_HB { - border-radius: 3px 8px 3px 8px; - background-image: linear-gradient(180deg, #63fdf6, #28b1ab); -} -.DIV_noGameFound { - top: 0px; - left: 0px; - width: 100%; - height: 100%; - display: flex; - flex-wrap: wrap; - position: absolute; - font-size: x-large; - font-style: italic; - align-items: center; - align-content: center; - justify-content: center; - text-shadow: 0px 0px 10px #f00; - background-image: linear-gradient(45deg, #f002, #0000); -} -.DIV_launcherOptions { - margin: 8px 0px 8px 0px; -} -.DIV_launcherOptionsPatchVersionMetadata { - text-align: left; - padding: 0px 6px 0px 6px; -} -.DIV_launcherOptionsTitle { - font-size: 16px; - text-align: center; - margin-bottom: 2px; - font-family: system-ui; -} -.DIV_FPPS4_UPDATER { - top: 0px; - left: 0px; - width: 100%; - height: 100%; - z-index: 110; - cursor: wait; - display: none; - transition: 0.4s; - flex-wrap: nowrap; - position: absolute; - align-items: center; - flex-direction: row; - align-content: center; - font-family: system-ui; - justify-content: center; - backdrop-filter: blur(4px); - background-color: #03033144; -} -.DIV_PROGRESSBAR { - width: 72%; - height: 10px; - cursor: wait; - overflow: hidden; - margin-top: 44px; - border-width: 1px; - position: absolute; - border-style: solid; - background-color: #c5c5c5ad; -} -.DIV_PROGRESSBAR_INTERNAL { - top: 0px; - left: 0px; - width: 0%; - height: 100%; - transition: 0.4s; - position: absolute; - background-image: linear-gradient(90deg, #ccc, #fff); -} -.DIV_DESIGN_LINES { - left: 0px; - width: 100%; - height: 1px; - position: absolute; - background-color: #fffb; -} -.LINE_TOP { - top: 12%; -} -.LINE_BOTTOM { - bottom: 12%; -} - -/* - Images -*/ -.IMG_GAME_ICON { - z-index: 1; - width: 66px; - cursor: pointer; - border-radius: 6px; - margin: 6px 10px 6px 6px; - box-shadow: 0px 0px 10px #0006; -} -.IMG_APP_ICON { - width: 256px; - border-radius: 6px; - box-shadow: 0px 0px 10px #000; -} -.IMG_GRID { - width: 116px; - height: auto; - padding: 0px; - max-width: 512px; - min-width: 92.93px; - border-radius: 0px; - margin: 0px 0px -3px 0px; -} - -/* - Input -*/ -.BTN_launcherOptions { - width: 96%; - padding-top: 4px; - padding-bottom: 4px; - margin: 2px 0px 2px 0px; -} -.BTN_actions { - height: 28px; - max-height: 28px; - margin-left: 2px; - margin-right: 2px; -} -.BTN_displayMode { - width: 32px; - height: 32px; - min-width: 32px; - border: initial; - min-height: 32px; - margin-left: 2px; - margin-right: 2px; - border-radius: 4px; - background-size: 65%; - background-position: center; - background-repeat: no-repeat; -} -.BTN_displayMode_normal { - margin-left: 8px; - background-image: url('../img/svg/list-filled-svgrepo-com.svg'); -} -.BTN_displayMode_compact { - background-image: url('../img/svg/view-list-svgrepo-com.svg'); -} -.BTN_displayMode_grid { - margin-right: 8px; - background-image: url('../img/svg/app-menu-svgrepo-com.svg'); -} -.INPUT_gameListSearch { - width: 195px; - margin: -8px; - border: none; - outline: none; - color: #fffb8e; - text-align: center; - font-family: monospace; - background-image: none; - background-color: #0000; - margin: 0px 16px 0px 16px; - padding: 12px 0px 12px 6px; -} -.INPUT_gameListSearch:focus { - background-image: linear-gradient(90deg, #0000, #36185eb0, #0000); -} -.APP_LOG { - color: #0f0; - resize: none; - border: none; - cursor: text; - outline: none; - padding: 6px; - width: calc(100% - 12px); - height: calc(100% - 12px); - backdrop-filter: blur(1.4px); - background-repeat: no-repeat; - text-shadow: 2px 2px 2px #000; - background-image: linear-gradient(180deg, #05050ee8, #010114c7); -} -.BTN_RUN { - height: 50px; - border: none; - font-size: 18px; - border-radius: 6px; - width: calc(100% - 6px); - background-image: linear-gradient(180deg, #fff, #ccc); -} -.BTN_RUN:active { - background-image: linear-gradient(0deg, #fff, #ccc); -} -.BTN_STOP { - margin: 0px 4px 0px 4px; - padding: 5px 30px 5px 30px; -} -.BTN_SAVE { - border: none; - font-size: 18px; - min-width: 300px; - min-height: 60px; - border-radius: 6px; - background-image: linear-gradient(180deg, #fff, #ccc); -} -.BTN_SAVE:active { - background-image: linear-gradient(0deg, #fff, #ccc); -} -.BTN_selectPath { - float: right; - min-width: 120px; - font-style: italic; - border-radius: 4px; - padding: 4px 14px 4px 14px; - background-image: linear-gradient(180deg, #fff, #bbb); -} -.BTN_selectPath:active { - background-image: linear-gradient(0deg, #fff, #bbb); -} -.SELECT_settings { - margin-left: 4px; - margin-bottom: 4px; - font-style: italic; - border-radius: 4px; - padding: 4px 10px 4px 10px; - background-image: linear-gradient(180deg, #fff, #bbb); -} -.SETTINGS_TEXT { - color: #0f0; - border: none; - outline: none; - min-width: 160px; - margin-left: 4px; - border-radius: 4px; - background-color: #000; - font-family: monospace; - padding: 6px 0px 6px 6px; -} - -/* - Labels -*/ -.LABEL_gameTitleOptions { - width: 100%; - font-size: 18px; - text-align: center; - font-family: system-ui; -} -.LABEL_detailsGameName { - font-size: 28px; - margin-top: 10px; - font-weight: bold; - margin-bottom: 10px; -} -.LABEL_checkbox { - cursor: pointer; - font-size: 14px; - font-style: italic; -} -.LABEL_emuColor { - color: #fffb8e; -} -.LABEL_gameTitle { - font-size: 20px; - cursor: pointer; -} -.LABEL_gameTitleCompact { - font-size: 16px; - cursor: pointer; -} -.LABEL_settingsPath { - cursor: text; - position: sticky; - font-style: initial; - font-family: monospace; - user-select: all !important; -} -.LABEL_settingsExperimental { - padding: 6px; - cursor: pointer; - font-family: monospace; - background-color: #000; - text-shadow: 0px 0px 10px #f00; -} -.LABEL_FLEX_MARGIN { - margin: 4px; -} -.LABEL_monospace { - font-family: monospace; -} - -/* - Animations -*/ - -/* Hint game focus after fpPS4 closes */ -@keyframes hintGameFocus { - - 0% { - box-shadow: 0px 0px 0px #0000; - } - 25% { - box-shadow: 0px 0px 10px #fff6; - } - 50% { - box-shadow: 0px 0px 0px #0000; - } - 75% { - box-shadow: 0px 0px 14px #fffa; - } - 100% { - box-shadow: 0px 0px 0px #0000; - } - -} - -/* Grid Mode: Select App / Game */ -@keyframes gridGameFocus { - - 0% { - box-shadow: 0px 0px 6px #6ca7ffd1; - } - 25% { - box-shadow: 0px 0px 10px #b6c0e5aa; - } - 50% { - box-shadow: 0px 0px 10px #6ca7ffd1; - } - 75% { - box-shadow: 0px 0px 14px #b6c0e5aa; - } - 100% { - box-shadow: 0px 0px 6px #6ca7ffd1; - } - -} - -/* - Misc -*/ -.float-right { - float: right; -} -.align-center { - text-align: center; -} -.user-can-select { - cursor: text; - user-select: all !important; -} -.none { - display: none; -} \ No newline at end of file +img,svg{filter:grayscale(1)}body,html{color:#fff;overflow:hidden;user-select:none;font-family:monospace;scroll-behavior:smooth;background-color:#505050;text-shadow:2px 2px 4px #000}code{padding:6px;color:#fff;font-style:normal;border-radius:6px;background-color:#000}input[type=button],input[type=checkbox],select{outline:0;cursor:pointer}input[type=range]{outline:0;margin-left:6px;cursor:col-resize}input[disabled=disabled],input[disabled]{cursor:no-drop}input[type=checkbox]{margin-right:8px;vertical-align:middle}img{-webkit-user-drag:none}::-webkit-scrollbar{width:8px;height:8px;border-radius:4px}::-webkit-scrollbar-track{border-radius:4px;margin:6px 0}.DIV_TITLE,.SEPARATOR_00{margin-top:10px;margin-bottom:10px}::-webkit-scrollbar-thumb{border-radius:4px;background:#e7e7e7}::-webkit-scrollbar-thumb:hover{border-radius:4px;background:#f0f0f0}::-webkit-scrollbar-thumb:active{background:#fff;border-radius:4px}.SEPARATOR_00{height:2px;padding-left:2px;padding-right:2px;border-radius:6px;width:calc(100% - 4px);background-color:#0000;background-image:linear-gradient(45deg,#fff,#6661,#0000)}.DIV_LIST,.DIV_LOG{transition:.2s;position:absolute;background-color:#000;width:100%;filter:grayscale(1);left:0}.DIV_LIST{top:38px;z-index:20;overflow:hidden;height:calc(100% - 202px);background-image:linear-gradient(146deg,#090f1b,#162a50)}.DIV_LOG{bottom:0;height:164px;background-size:auto 50%;background-position:center;background-repeat:no-repeat;background-image:url('../img/logo.png')}.DIV_GAMELIST_BG,.GAME_ENTRY_BG{background-size:cover;position:absolute;background-position:center;background-repeat:no-repeat}.DIV_ACTIONS{top:0;left:0;width:100%;height:22px;padding:8px;filter:grayscale(1);display:flex;flex-wrap:nowrap;position:absolute;align-items:center;align-content:center;justify-content:center;background-image:linear-gradient(45deg,#28467f,#1c325f)}.DIV_OPTIONS{top:38px;right:0;padding:6px;width:268px;display:none;transition:.1s;filter:grayscale(1);position:absolute;height:calc(100% - 150px);background-image:linear-gradient(0deg,#162a50,#2a4a86)}.DIV_GAME_OPTIONS{width:268px;bottom:68px;font-size:14px;overflow:auto;position:absolute;text-align:center;height:calc(100% - 128px)}.DIV_HACK_LIST{text-align:left;margin-bottom:10px}.DIV_LIST_GRID,.DIV_TITLE{z-index:10;text-align:center}.DIV_TITLE{font-size:28px;font-weight:700}.DIV_LIST_INTERNAL{top:0;left:0;width:100%;z-index:10;height:100%;overflow:auto;transition:.1s;position:absolute;background-color:#0000}.DIV_LIST_GRID{display:flex;flex-wrap:wrap;align-items:center;flex-direction:row;align-content:stretch;justify-content:center}.GAME_ENTRY,.GAME_ENTRY_COMPACT{display:flex;flex-wrap:nowrap;align-content:center}.DIV_GAMELIST_BG{top:-6px;left:-6px;z-index:1;background-color:#0006;width:calc(100% + 12px);height:calc(100% + 12px);background-blend-mode:screen;filter:blur(2px) opacity(.7) grayscale(1)}.GAME_ENTRY{margin:6px;height:78px;cursor:pointer;overflow:hidden;max-height:78px;padding-left:0;border-radius:6px;align-items:center;filter:grayscale(1);width:calc(100% - 12px);box-shadow:0 0 4px #000;backdrop-filter:blur(4px) invert(0.1);background-image:linear-gradient(90deg,#3a4b6b82,#0000)}.GAME_ENTRY:hover{box-shadow:0 0 10px #0006;background-image:linear-gradient(45deg,#3a4b6b,#3a4b6b82)}.GAME_ENTRY:active{backdrop-filter:sepia(0.5) blur(6px);background-image:linear-gradient(180deg,#97a7ff85,#6464a578)}.GAME_ENTRY_COMPACT{align-items:center;flex-direction:row;max-height:24px!important;padding-left:10px!important;width:calc(100% - 22px)!important}.GAME_ENTRY_GRID{z-index:12;padding:0;display:table;box-shadow:none;border-radius:8px;min-width:92.93px;min-height:92.93px;height:max-content;max-width:max-content;max-height:max-content;background-color:#0000;text-align:-webkit-right}.GAME_ENTRY_GRID:hover{animation-duration:4s;animation-name:gridGameFocus;animation-iteration-count:infinite}.GAME_ENTRY_BG{top:0;left:0;z-index:0;width:100%;height:100%;filter:blur(4px);-webkit-mask-image:linear-gradient(45deg,#0006,#0000,#0000)}.GAME_ENTRY:focus .GAME_ENTRY_BG,.GAME_ENTRY:hover .GAME_ENTRY_BG{filter:blur(3px);-webkit-mask-image:linear-gradient(45deg,#000c,#0002,#0000)}.GAME_ENTRY:active .GAME_ENTRY_BG{-webkit-mask-image:linear-gradient(45deg,#000,#0006,#0000)}.GAME_DETAILS{z-index:1;cursor:pointer;width:calc(100% - 88px)}.GAME_DETAILS_COMPACT{width:calc(100% - 10px)}.GAME_DETAILS_GRID{right:0;bottom:0;position:absolute;background-color:#000a;padding:2px 6px;backdrop-filter:blur(4px);text-shadow:0 0 4px #000;border-radius:6px 0 0}.DIV_RUN_BTN{bottom:8px;position:absolute;text-align:center;width:calc(100% - 12px)}.DIV_GAME_DETAILS{z-index:100;height:256px;padding:12px;display:none;transition:1s;overflow:hidden;flex-wrap:nowrap;position:absolute;border-radius:6px;align-items:center;top:calc(50% - 140px);left:calc(10% - 24px);width:calc(80% - 24px);justify-content:center;max-width:calc(80% - 24px)}.DIV_GAME_DETAILS_LABELS{margin-left:24px}.DIV_SETTINGS{top:10%;left:5%;width:90%;z-index:10;height:80%;display:block;overflow:hidden;position:absolute;text-align:center;border-radius:10px;filter:grayscale(1);box-shadow:0 0 30px #000a;background-image:linear-gradient(180deg,#2f405f,#131f38)}.DIV_SETTINGS_BG,.DIV_SETTINGS_HOLDER{top:0;left:0;width:100%;height:100%;position:absolute}.DIV_SETTINGS_BG{z-index:0;background-size:auto 50%;background-position:center;background-repeat:no-repeat;box-shadow:0 0 10px #0002 inset;background-image:url('../img/logo.png')}.DIV_SETTINGS_HOLDER{z-index:100;display:none;background-color:#0004;backdrop-filter:blur(4px) grayscale(0.4)}.DIV_SETTINGS_LIST{z-index:10;padding:8px;overflow:auto;font-size:14px;text-align:left;margin-left:8px;margin-bottom:8px;border-radius:4px;font-family:sans-serif;background-color:#111d;width:calc(100% - 32px);height:calc(100% - 146px);backdrop-filter:blur(4px);box-shadow:0 0 10px #0006;background-image:linear-gradient(180deg,#000e2cab,#0000)}.DIV_settingsEntry{padding:2px;overflow:hidden;font-style:italic}.DIV_settingsEntryFlex{display:flex;align-items:center;flex-direction:row;align-content:center}.DIV_settingsH2{font-size:20px;font-weight:600;font-family:system-ui;margin:0 0 8px 2px}.DIV_settingsSave{width:100%;z-index:10;position:absolute;text-align:center}.DIV_labelSelectedGame{display:flex;flex-wrap:wrap;text-align:center;margin-bottom:4px;align-items:center;align-content:center;justify-content:center}.DIV_selectedGameStatus{width:114px;cursor:help;display:flex;overflow:hidden;max-width:114px;max-height:42px;margin-left:4px;font-size:small;flex-wrap:nowrap;align-items:center;flex-direction:row;border-radius:10px;align-content:center;background-color:#000;justify-content:center;padding:4px 0;text-shadow:1px 1px 2px #000}.DIV_FPPS4_UPDATER,.DIV_noGameFound{width:100%;height:100%;align-content:center;top:0;left:0}.DIV_FPPS4_UPDATER,.DIV_PROGRESSBAR{cursor:wait;position:absolute;filter:grayscale(1)}.DIV_ICON_STATUS_OK{background-image:linear-gradient(180deg,#0f0,#0b0)}.DIV_ICON_STATUS_WARN{border-radius:2px;background-image:linear-gradient(180deg,#fbe800,#9f8d0c)}.DIV_ICON_STATUS_HB{border-radius:3px 8px;background-image:linear-gradient(180deg,#63fdf6,#28b1ab)}.DIV_noGameFound{display:flex;flex-wrap:wrap;position:absolute;font-size:x-large;font-style:italic;align-items:center;justify-content:center;text-shadow:0 0 10px red;background-image:linear-gradient(45deg,#f002,#0000)}.DIV_launcherOptions{margin:8px 0}.DIV_launcherOptionsPatchVersionMetadata{text-align:left;padding:0 6px}.DIV_launcherOptionsTitle{font-size:16px;text-align:center;margin-bottom:2px;font-family:system-ui}.DIV_FPPS4_UPDATER{z-index:110;display:none;transition:.4s;flex-wrap:nowrap;align-items:center;flex-direction:row;font-family:system-ui;justify-content:center;backdrop-filter:blur(4px);background-color:#03033144}.DIV_PROGRESSBAR{width:72%;height:10px;overflow:hidden;margin-top:44px;border-width:1px;border-style:solid;background-color:#c5c5c5ad}.DIV_PROGRESSBAR_INTERNAL{top:0;left:0;width:0%;height:100%;transition:.4s;position:absolute;background-image:linear-gradient(90deg,#ccc,#fff)}.DIV_DESIGN_LINES{left:0;width:100%;height:1px;position:absolute;background-color:#fffb}.LINE_TOP{top:12%}.LINE_BOTTOM{bottom:12%}.IMG_GAME_ICON{z-index:1;width:66px;cursor:pointer;border-radius:6px;filter:grayscale(1);margin:6px 10px 6px 6px;box-shadow:0 0 10px #0006}.IMG_APP_ICON{width:256px;border-radius:6px;box-shadow:0 0 10px #000}.IMG_GRID{width:116px;height:auto;padding:0;max-width:512px;min-width:92.93px;border-radius:0;margin:0 0 -3px}.BTN_launcherOptions{width:96%;padding-top:4px;padding-bottom:4px;margin:2px 0}.BTN_actions,.BTN_displayMode{margin-left:2px;margin-right:2px}.BTN_actions{height:28px;max-height:28px}.BTN_displayMode{width:32px;height:32px;border:initial;min-width:32px;min-height:32px;border-radius:4px;background-size:65%;background-position:center;background-repeat:no-repeat}.BTN_displayMode_normal{margin-left:8px;background-image:url('../img/svg/list-filled-svgrepo-com.svg')}.BTN_displayMode_compact{background-image:url('../img/svg/view-list-svgrepo-com.svg')}.BTN_displayMode_grid{margin-right:8px;background-image:url('../img/svg/app-menu-svgrepo-com.svg')}.INPUT_gameListSearch{width:195px;margin:0 16px;border:none;outline:0;color:#fffb8e;text-align:center;font-family:monospace;background-image:none;background-color:#0000;padding:12px 0 12px 6px}.INPUT_gameListSearch:focus{background-image:linear-gradient(90deg,#0000,#36185eb0,#0000)}.APP_LOG{color:#fff;resize:none;border:none;cursor:text;outline:0;padding:6px;width:calc(100% - 12px);height:calc(100% - 12px);backdrop-filter:blur(1.4px);background-repeat:no-repeat;text-shadow:2px 2px 2px #000;background-image:linear-gradient(180deg,#05050ee8,#010114c7)}.BTN_RUN,.BTN_SAVE{background-image:linear-gradient(180deg,#fff,#ccc);font-size:18px}.BTN_RUN{height:50px;border:none;border-radius:6px;width:calc(100% - 6px)}.BTN_RUN:active,.BTN_SAVE:active{background-image:linear-gradient(0deg,#fff,#ccc)}.BTN_STOP{margin:0 4px;padding:5px 30px}.BTN_SAVE{border:none;min-width:300px;min-height:60px;border-radius:6px}.BTN_selectPath,.SELECT_settings{border-radius:4px;background-image:linear-gradient(180deg,#fff,#bbb);font-style:italic}.BTN_selectPath{float:right;min-width:120px;padding:4px 14px}.BTN_selectPath:active{background-image:linear-gradient(0deg,#fff,#bbb)}.SELECT_settings{margin-left:4px;margin-bottom:4px;padding:4px 10px}.SETTINGS_TEXT{color:#0f0;border:none;outline:0;min-width:160px;margin-left:4px;border-radius:4px;background-color:#000;font-family:monospace;padding:6px 0 6px 6px}.LABEL_gameTitleOptions{width:100%;font-size:18px;text-align:center;font-family:system-ui}.LABEL_monospace,.LABEL_settingsPath{font-family:monospace}.LABEL_detailsGameName{font-size:28px;margin-top:10px;font-weight:700;margin-bottom:10px}.LABEL_checkbox{cursor:pointer;font-size:14px;font-style:italic}.LABEL_emuColor{color:#fffb8e}.LABEL_gameTitle{font-size:20px;cursor:pointer}.LABEL_gameTitleCompact{font-size:16px;cursor:pointer}.LABEL_settingsPath{cursor:text;position:sticky;font-style:initial;user-select:all!important}.LABEL_settingsExperimental{padding:6px;cursor:pointer;font-family:monospace;background-color:#000;text-shadow:0 0 10px red}.LABEL_FLEX_MARGIN{margin:4px}@keyframes hintGameFocus{0%,100%,50%{box-shadow:0 0 0 #0000}25%{box-shadow:0 0 10px #fff6}75%{box-shadow:0 0 14px #fffa}}@keyframes gridGameFocus{0%,100%{box-shadow:0 0 6px #000}25%,50%{box-shadow:0 0 10px #000}75%{box-shadow:0 0 14px #000}}.float-right{float:right}.align-center{text-align:center}.user-can-select{cursor:text;user-select:all!important}.none{display:none} \ No newline at end of file diff --git a/App/index.htm b/App/index.htm index d86e9f3..fc70a88 100644 --- a/App/index.htm +++ b/App/index.htm @@ -4,8 +4,8 @@