diff --git a/hikka/inline.py b/hikka/inline.py index c25df92..2d360c2 100755 --- a/hikka/inline.py +++ b/hikka/inline.py @@ -52,7 +52,7 @@ logger = logging.getLogger(__name__) photo = io.BytesIO( requests.get( - "https://github.com/hikariatama/Hikka/raw/master/hikka/bot_avatar.png" + "https://github.com/hikariatama/Hikka/raw/master/assets/bot_pfp.png" ).content ) photo.name = "avatar.png" diff --git a/hikka/modules/hikka_info.py b/hikka/modules/hikka_info.py index 00d3748..b2d2473 100755 --- a/hikka/modules/hikka_info.py +++ b/hikka/modules/hikka_info.py @@ -22,10 +22,10 @@ logger = logging.getLogger(__name__) @loader.tds -class HikaiInfoMod(loader.Module): +class HikkaInfoMod(loader.Module): """Show userbot info""" - strings = {"name": "HikariInfo"} + strings = {"name": "HikkaInfo"} def get(self, *args) -> dict: return self._db.get(self.strings["name"], *args) @@ -100,7 +100,7 @@ class HikaiInfoMod(loader.Module): "HTML", disable_web_page_preview=True, ), - thumb_url="https://github.com/hikariatama/Hikka/raw/master/hikka/bot_avatar.png", + thumb_url="https://github.com/hikariatama/Hikka/raw/master/assets/hikka_pfp.png", thumb_width=128, thumb_height=128, reply_markup=self.markup, diff --git a/hikka/web/core.py b/hikka/web/core.py index 35bc192..52ba444 100755 --- a/hikka/web/core.py +++ b/hikka/web/core.py @@ -41,8 +41,11 @@ class Web(initial_setup.Web, root.Web): filters={"getdoc": inspect.getdoc, "ascii": ascii}, loader=jinja2.FileSystemLoader("web-resources"), ) + self.app["static_root_url"] = "/static" + super().__init__(**kwargs) self.app.router.add_get("/favicon.ico", self.favicon) + self.app.router.add_static("/static/", "web-resources/static") async def start_if_ready(self, total_count, port): if total_count <= len(self.client_data): diff --git a/web-resources/base.jinja2 b/web-resources/base.jinja2 index 31b39e0..c1607f8 100755 --- a/web-resources/base.jinja2 +++ b/web-resources/base.jinja2 @@ -27,153 +27,12 @@ Hikka - - - - - + {% block head %}{% endblock %} -
- -
-
- - - - -
{% block content %}

An internal error occured.

@@ -184,25 +43,5 @@ {% endblock %} - - diff --git a/web-resources/initial_root.jinja2 b/web-resources/initial_root.jinja2 index 554aa87..0668b73 100755 --- a/web-resources/initial_root.jinja2 +++ b/web-resources/initial_root.jinja2 @@ -12,282 +12,8 @@ - - - + {% endblock %} {% block content %} @@ -305,15 +31,15 @@
Get started
- + - + - + @@ -333,6 +59,7 @@ $(document).ready(function() { $('.bg').hide().delay(2000).fadeIn(500); }); + $("#get_started").click(() => { $("#get_started").fadeOut(500, () => { cnt_btn.setAttribute('current-step', 'api_id'); diff --git a/web-resources/root.jinja2 b/web-resources/root.jinja2 index 66e6707..531446e 100755 --- a/web-resources/root.jinja2 +++ b/web-resources/root.jinja2 @@ -12,245 +12,8 @@ - - - + {% endblock %} {% block content %} diff --git a/web-resources/static/base.css b/web-resources/static/base.css new file mode 100644 index 0000000..a0ee5ce --- /dev/null +++ b/web-resources/static/base.css @@ -0,0 +1,262 @@ +@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans&family=Open+Sans:wght@300&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Hubballi&display=swap'); + +body, +html { + width: 100%; + height: 100%; + margin: 0; + padding: 0; +} + +body { + background: #16181d; + font-family: Hubballi; +} + +#sky { + width: 100vw; + height: 100vh; + position: fixed; + overflow: hidden; + margin: 0; + padding: 0; +} + +#shootingstars { + margin: 0; + padding: 0; + width: 150vh; + height: 100vw; + position: fixed; + overflow: hidden; + transform: translatex(calc(50vw - 50%)) translatey(calc(50vh - 50%)) rotate(120deg); +} + +.wish { + height: 2px; + top: 300px; + width: 100px; + margin: 0; + opacity: 0; + padding: 0; + background-color: white; + position: absolute; + background: linear-gradient(-45deg, white, rgba(0, 0, 255, 0)); + filter: drop-shadow(0 0 6px white); + overflow: hidden; +} + +.title { + font-size: 50px; + font-family: Hubballi; + text-align: center; + color: #fff; + width: 100%; + z-index: 2; + position: relative; + height: 50px; + line-height: 50px; +} + +.description { + font-size: 24px; + color: #eee; + text-align: center; + width: 100%; + z-index: 2; + position: relative; + padding-top: 20px; + line-height: 1.3; + font-family: Hubballi; +} + +.wrapper { + width: 100%; + height: 100%; + position: absolute; + justify-content: center; + align-items: center; + display: flex; + flex-direction: column; +} + +#root { + position: absolute; + top: 0; + right: 0; + left: 0; + bottom: 0; + margin: auto; +} + +.darken { + position: absolute; + width: 100%; + height: 100%; + z-index: 1; + background: rgba(0, 0, 0, .1); + top: 0; + bottom: 0; + right: 0; + left: 0; + margin: auto; +} + +.main_content { + display: none; +} + +.center { + justify-content: center; + align-items: center; + display: flex; + position: relative; + z-index: 2; + margin-top: 20px; +} + +.blur { + padding: 4rem 8rem; + border-radius: 0.375rem; + background-color: rgba(22, 24, 29, .5); + border: 1px solid rgba(42, 46, 55, 1); + backdrop-filter: blur(6px); + position: relative; + z-index: 99; +} + +.bg { + background: url(https://github.com/hikariatama/assets/raw/master/bg.png); + background-repeat: no-repeat; + background-size: contain; + width: 80vw; + height: 60vh; + position: absolute; + z-index: 1; + background-position: center; + display: none; +} + +@media screen and (max-width: 736px) { + .blur { + width: 100%; + height: 100%; + padding: 1.5rem; + box-sizing: border-box; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + } + .bg { + width: 100vw; + top: 0; + height: 50vh; + } +} + +.invert { + animation: hue_rot 50s infinite ease, floating 5s infinite ease-in-out; +} + +@keyframes hue_rot { + from { + filter: hue-rotate(0deg); + } + 50% { + filter: hue-rotate(180deg) + } + 100% { + filter: hue-rotate(0deg); + } +} + +@keyframes floating { + from { + transform: translateY(-10px); + } + 50% { + transform: translateY(10px); + } + to { + transform: translateY(-10px); + } +} + + +.button { + border-radius: 5px; + padding: 10px 20px; + border: none; + color: #eee; + margin: 5px 0; + background: transparent; + border: 2px solid #aaa; + cursor: pointer; + transition: box-shadow .2s ease; + user-select: none; +} + +.button:hover { + box-shadow: inset 5px 5px 3px rgba(255, 255, 255, .1), inset -5px -5px 3px rgba(255, 255, 255, .1); +} + +input { + background: transparent; + border: 1px solid #eee; + outline: none; + padding: 10px 15px; + border-radius: 10px; + color: #fff; + text-align: center; +} + +label { + margin: 0 10px; + color: #eee; + user-select: none; +} + +#continue_btn { + padding: 10px 15px; + background: #0d47a1; + border-radius: 10px; + user-select: none; + color: #fff; + cursor: pointer; + text-align: center; + border: 1px solid #1a237e; + margin: 10px 0; + transition: all .3s ease; + margin-left: 5px; +} + +#continue_btn:hover { + background-color: #1a237e; +} + +#continue_btn:active { + background-color: #311b92; +} + +#continue_btn.error { + background-color: #c62828; + transition: all .3s ease; +} + +#continue_btn, +#block_api_id, +#block_api_hash, +#block_phone, +#block_2fa { + display: none; +} + +.red_state { + filter: hue-rotate(0deg); +} + +.blue_state { + filter: hue-rotate(203deg); +} \ No newline at end of file