diff --git a/module/build.gradle.kts b/module/build.gradle.kts index 6d23929..89fe450 100644 --- a/module/build.gradle.kts +++ b/module/build.gradle.kts @@ -201,6 +201,7 @@ androidComponents.onVariants { variant -> set.add(Pair(root.file("webroot/js/modal/errorHistory.js").asFile, null)) set.add(Pair(root.file("webroot/css/index.css").asFile, null)) + set.add(Pair(root.file("webroot/css/icons.css").asFile, null)) set.add(Pair(root.file("webroot/css/fonts.css").asFile, null)) set.add(Pair(root.file("webroot/fonts/ProductSans-Italic.ttf").asFile, null)) @@ -218,6 +219,11 @@ androidComponents.onVariants { variant -> set.add(Pair(root.file("webroot/assets/action.svg").asFile, null)) set.add(Pair(root.file("webroot/assets/home.svg").asFile, null)) set.add(Pair(root.file("webroot/assets/delete.svg").asFile, null)) + + set.add(Pair(root.file("webroot/assets_light/action.svg").asFile, null)) + set.add(Pair(root.file("webroot/assets_light/home.svg").asFile, null)) + set.add(Pair(root.file("webroot/assets_light/settings.svg").asFile, null)) + set.add(Pair(root.file("webroot/assets_light/module.svg").asFile, null)) sig.initSign(privKey) set.forEach { it.first.sha(it.second) } val signFile = root.file(name).asFile diff --git a/module/src/customize.sh b/module/src/customize.sh index 748901d..7946eef 100644 --- a/module/src/customize.sh +++ b/module/src/customize.sh @@ -148,6 +148,7 @@ extract "$ZIPFILE" 'webroot/js/switcher/fontChanger.js' "$MODPATH/webroot/js/swi extract "$ZIPFILE" 'webroot/css/index.css' "$MODPATH/webroot/css" true extract "$ZIPFILE" 'webroot/css/fonts.css' "$MODPATH/webroot/css" true +extract "$ZIPFILE" 'webroot/css/icons.css' "$MODPATH/webroot/css" true extract "$ZIPFILE" 'webroot/fonts/ProductSans-Italic.ttf' "$MODPATH/webroot/fonts" true extract "$ZIPFILE" 'webroot/fonts/ProductSans-Regular.ttf' "$MODPATH/webroot/fonts" true @@ -156,6 +157,10 @@ for svg in mark tick warn module expand settings close content error action home extract "$ZIPFILE" "webroot/assets/${svg}.svg" "$MODPATH/webroot/assets" true done +for svg in module settings action home; do + extract "$ZIPFILE" "webroot/assets_light/${svg}.svg" "$MODPATH/webroot/assets_light" true +done + if [ "$ARCH" = "x86" ] || [ "$ARCH" = "x64" ]; then ui_print "- Extracting x86 libraries" extract "$ZIPFILE" 'bin/x86/zygiskd' "$MODPATH/bin" true diff --git a/webroot/assets_light/action.svg b/webroot/assets_light/action.svg new file mode 100644 index 0000000..ec50cb8 --- /dev/null +++ b/webroot/assets_light/action.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/webroot/assets_light/home.svg b/webroot/assets_light/home.svg new file mode 100644 index 0000000..8978b3d --- /dev/null +++ b/webroot/assets_light/home.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/webroot/assets_light/module.svg b/webroot/assets_light/module.svg new file mode 100644 index 0000000..b98a507 --- /dev/null +++ b/webroot/assets_light/module.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/webroot/assets_light/settings.svg b/webroot/assets_light/settings.svg new file mode 100644 index 0000000..4ae7045 --- /dev/null +++ b/webroot/assets_light/settings.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/webroot/css/icons.css b/webroot/css/icons.css new file mode 100644 index 0000000..4cf9f04 --- /dev/null +++ b/webroot/css/icons.css @@ -0,0 +1,57 @@ +/* Dark */ +#ni_home { + background: url(../assets/home.svg); + width: 24px; + height: 24px; + z-index: 10; +} + +#ni_modules { + background: url(../assets/module.svg); + width: 24px; + height: 24px; + z-index: 10; +} + +#ni_actions { + background: url(../assets/action.svg); + width: 24px; + height: 24px; + z-index: 10; +} + +#ni_settings { + background: url(../assets/settings.svg); + width: 24px; + height: 24px; + z-index: 10; +} + +/* Light */ +#ni_home.light { + background: url(../assets_light/home.svg); + width: 24px; + height: 24px; + z-index: 10; +} + +#ni_modules.light { + background: url(../assets_light/module.svg); + width: 24px; + height: 24px; + z-index: 10; +} + +#ni_actions.light { + background: url(../assets_light/action.svg); + width: 24px; + height: 24px; + z-index: 10; +} + +#ni_settings.light { + background: url(../assets_light/settings.svg); + width: 24px; + height: 24px; + z-index: 10; +} diff --git a/webroot/css/index.css b/webroot/css/index.css index ab51fe8..7ff48ea 100644 --- a/webroot/css/index.css +++ b/webroot/css/index.css @@ -16,16 +16,6 @@ --font-family: 'ProductSans Regular', 'ProductSans Italic', sans-serif; } -.radios input[type=radio] { - display: none; -} - -.radio input[type=radio] { - display: flex; - align-items: center; - justify-content: center; -} - * { background-color: var(--background); color: var(--font); @@ -40,6 +30,17 @@ a { text-decoration: none !important; } +/* Components */ +.radios input[type=radio] { + display: none; +} + +.radio input[type=radio] { + display: flex; + align-items: center; + justify-content: center; +} + .load_screen { position: fixed; width: 100%; @@ -73,12 +74,6 @@ a { animation: spin 0.8s linear infinite; } -@keyframes spin { - 0% { transform: rotate(0deg); } - 100% { transform: rotate(360deg); } -} - -/* Components */ .header { display: flex; position: fixed; @@ -92,7 +87,8 @@ a { } .panel { - margin-bottom: 7em; + display: none; + animation: fade-out 0.2s; } .navbar { @@ -122,22 +118,14 @@ a { } .navicon { - background-color: var(--small-card); + background: var(--small-card); display: flex; - width: 65px; - height: 30px; - align-items: center; - justify-content: center; - border-radius: 50px; -} - -.navicon_disable { - display: flex; - width: 65px; + width: 0; height: 30px; align-items: center; justify-content: center; border-radius: 50px; + animation: closeNav 0.15s; } .card { @@ -355,3 +343,63 @@ input:checked + .slider:before { background-color: var(--button); } } + +/* Show set */ +.panel.show { + margin-bottom: 7em; + display: block; + animation: fade-in 0.2s; +} + +.navicon.show { + width: 65px; + animation: openNav 0.15s; +} + +/* Animation KeyFrames */ +@keyframes fade-in { + from { + opacity: 0; + } + to { + opacity: 1; + } +} + +@keyframes fade-out { + from { + opacity: 1; + } + to { + opacity: 0; + } +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + +@keyframes closeNav { + 0% { + width: 65px; + } + 75% { + opacity: 0; + } + 100% { + width: 0px; + } +} + +@keyframes openNav { + 0% { + width: 0px; + } + 75% { + opacity: 1; + } + 100% { + width: 65px; + } +} \ No newline at end of file diff --git a/webroot/index.html b/webroot/index.html index 12c6f53..81b29dd 100644 --- a/webroot/index.html +++ b/webroot/index.html @@ -17,6 +17,7 @@ + @@ -67,7 +68,7 @@ - -