This commit is contained in:
syui 2024-10-26 08:46:32 +09:00
parent 5b5abc578d
commit b5eea5fbee
Signed by: syui
GPG Key ID: 5417CFEBAD92DF56
4 changed files with 63 additions and 53 deletions

View File

@ -1,14 +1,16 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="referrer" content="origin-when-cross-origin"> <meta name="referrer" content="origin-when-cross-origin">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.classless.blue.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.classless.blue.min.css">
<title>o.syui.ai | oauth service atproto</title> <link rel="stylesheet" href="https://syui.ai/bower_components/font-awesome/css/all.min.css" />
</head> <link rel="icon" href="https://live.syui.ai/favicon.ico">
<body> <title>o.syui.ai</title>
<header> </head>
<body>
<header>
<hgroup> <hgroup>
{% if g.user %} {% if g.user %}
{% endif %} {% endif %}
@ -16,7 +18,7 @@
<nav> <nav>
<ul> <ul>
<li><a href="/"><button class="secondary">o</button></a></li> <li><a href="/"><button class="secondary">o</button></a></li>
<li>live/video</li> <li>.syui.ai</li>
</ul> </ul>
<ul> <ul>
{% if g.user %} {% if g.user %}
@ -24,38 +26,38 @@
<li><a href="{{ url_for('oauth_refresh') }}">refresh</a> <li><a href="{{ url_for('oauth_refresh') }}">refresh</a>
<li><a href="{{ url_for('oauth_logout') }}"><button class="secondary">logout</button></a> <li><a href="{{ url_for('oauth_logout') }}"><button class="secondary">logout</button></a>
{% else %} {% else %}
<li><a href="/about">about</a></li> <li><a href="/about"><i class="fa-solid fa-circle-question"></i></a></li>
<!--
<button><a href="{{ url_for('oauth_login') }}">@</a>
-->
{% endif %} {% endif %}
<!-- <!--
<li><a href="https://github.com/bluesky-social/cookbook">Code</a> <li><a href="https://github.com/bluesky-social/cookbook">Code</a>
--> -->
</ul> </ul>
</nav> </nav>
</header> </header>
<main class="container"> <main class="container">
<section class="content"> <section class="content">
{% for message in get_flashed_messages() %} {% for message in get_flashed_messages() %}
<article>{{ message }}</article> <article>{{ message }}</article>
{% endfor %} {% endfor %}
{% block content %}{% endblock %} {% block content %}{% endblock %}
</section> </section>
</main> </main>
<style> <style>
body {
background-color: #f1f1f1;
}
button a { button a {
color: #fff; color: #fff;
} }
iframe#livechat { iframe#livechat {
width: 100%; width: 100%;
height: 700px; min-height: 500px;
} }
iframe#livestream { iframe#livestream {
width: 100%; width: 100%;
height: 700px; min-height: 500px;
} }
button.oauth-login { button.oauth-login {
width: 100%; width: 100%;
@ -67,13 +69,15 @@
.container-1 { .container-1 {
display: flex; display: flex;
.right-container { .right-container {
background-color: #fff;
position: sticky; position: sticky;
top: 0; top: 0;
align-self: flex-start; align-self: flex-start;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: flex-end; justify-content: flex-end;
padding-left:30px; padding:10px;
margin-left:30px;
.content:first-of-type { .content:first-of-type {
position: sticky; position: sticky;
bottom: 0; bottom: 0;
@ -82,8 +86,9 @@
} }
.left-container { .left-container {
padding:10px;
background-color: #fff;
width: 80%; width: 80%;
padding-bottom: 10px;
} }
@media screen and (max-width: 959px) { @media screen and (max-width: 959px) {
@ -98,12 +103,12 @@
.container-1 { .container-1 {
display: block; display: block;
.right-container { .right-container {
padding-left:0px; margin-left:0px;
} }
} }
} }
</style> </style>
<footer>©syui</footer> <footer>©syui</footer>
</body> </body>
</html> </html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

View File

@ -0,0 +1 @@
<?xml version="1.0" ?><svg height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><title/><path d="M413.48,284.46c58.87,47.24,91.61,89,80.31,108.55-17.85,30.85-138.78-5.48-270.1-81.15S.37,149.84,18.21,119c11.16-19.28,62.58-12.32,131.64,14.09" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px"/><circle cx="256" cy="256" r="160" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px"/></svg>

After

Width:  |  Height:  |  Size: 450 B

View File

@ -18,8 +18,12 @@
<a href="{{ url_for('oauth_login') }}"><button class="oauth-login">@</button></a> <a href="{{ url_for('oauth_login') }}"><button class="oauth-login">@</button></a>
<iframe id="livechat" title="bskychat" src="https://bbs.syui.ai"> </iframe> <iframe id="livechat" title="bskychat" src="https://bbs.syui.ai"> </iframe>
</div> </div>
<div class="right-container">
<p>write comment using oauth atproto.</p>
</div>
{% endif %} {% endif %}
</div> </div>
</div> </div>
{% endblock %} {% endblock %}