CSS tweaks and polishing

FossilOrigin-Name: 9d32ddd347cb36062c661df3775a4d7a775e82f9dde7eab9405782f38b876fbb
This commit is contained in:
nekobit 2022-10-13 17:55:59 +00:00
parent bb8dedb37e
commit 4eb1389418
3 changed files with 92 additions and 9 deletions

79
dist/treebird.css vendored
View File

@ -13,6 +13,18 @@
--account-overlay-gradient-bottom: #dadada;
}
*
{
transition: .1s box-shadow;
}
*:focus
{
outline: 1px solid #aa0000;
box-shadow: 0px 0px 6px #aa00006f;
}
*
{
margin: 0;
@ -119,7 +131,7 @@ table.ui-table td
#navbar
{
background: linear-gradient(#fbfbfb 40%, #efefef 50%, #e4e4e9);
background: linear-gradient(#fbfbfb 40%, #f5f5f5 50%, #efefef);
width: 1000px;
border-bottom: 2px solid #bfbfc4;
z-index: 999;
@ -159,6 +171,26 @@ table.ui-table td
margin: 6px 0px 6px 18px;
}
#navbar a,
#navbar a:focus
{
box-shadow: 0px 0px 0px #00000000 !important;
outline: 0 !important;
}
#navbar a img
{
transition: .4s transform, .4s filter;
}
#navbar a:focus img
{
box-shadow: 0px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0 !important;
transform: rotateZ(360deg);
filter: drop-shadow(0px 0px 3px #aa00006f);
}
#navbar span.info
{
vertical-align: middle;
@ -273,7 +305,20 @@ table.ui-table td
#searchbox
{
padding-top: unset;
padding-bottom: unset;
height: 26px;
border-right: unset;
padding-left: 27px;
transition: width .1s ease;
width: 180px;
}
#searchbox:focus
{
box-shadow: 0;
outline: 0;
width: 300px;
}
.results-header
@ -338,6 +383,14 @@ table.ui-table td
font-weight: bold;
}
input[type=text],
input[type=url],
input[type=email],
input[type=password]
{
padding: 2px;
border: 1px solid #d3d3d3;
}
.menu.menu-compact .btn-menu,
.status-compact .menu-container .menu .btn-menu
@ -1352,6 +1405,22 @@ input[type=checkbox].hidden:not(:checked) + .sidebar-submenu
border-bottom-right-radius: 5px;
}
.text-gap-hairline
{
display: inline-block;
width: 64px;
text-align: center;
height: 1px;
background-color: #d3d3d3;
margin: 2px;
}
.text-gap-hairline + h6
{
display: inline;
font-variant: small-caps;
}
/*************************
* Config *
************************/
@ -1986,6 +2055,14 @@ input[type=radio].hidden:not(:checked) + .emoji-picker-emojos
display: block;
}
.form-group label
{
display: inline-block;
min-width: 70px;
font-size: 0.9rem;
text-align: middle;
}
/* Simple page layout */
.simple-page
{

View File

@ -6,6 +6,7 @@ use Exporter 'import';
our @EXPORT = qw( content_login );
use l10n 'lang';
use template_helpers 'to_template';
sub content_login
@ -14,6 +15,7 @@ sub content_login
my %vars = (
error => $error,
lang => \&lang,
);
to_template(\%vars, \$data->{'login.tt'});

View File

@ -1,29 +1,33 @@
<div class="simple-page">
<h1>{{%s:login_header}}</h1>
{{%s:error}}
<h1>[% lang('LOGIN') %]</h1>
[% IF error %]
<span class="e-error error-pad">
$error
</span>
[% END %]
<form action="/login" method="post">
<div class="form-group">
<label for="login-username">{{%s:username}}: </label>
<label for="login-username">[% lang('LOGIN') %]: </label>
<input type="text" id="login-username" name="username">
</div>
<div class="form-group">
<label for="login-password">{{%s:password}}: </label>
<label for="login-password">[% lang('PASSWORD') %]: </label>
<input type="password" id="login-password" name="password"><br>
</div>
<div class="form-group">
<input class="btn" type="submit" value="{{%s:login_submit}}">
<input class="btn" type="submit" value="[% lang('LOGIN_BTN') %]">
</div>
</form>
<h6>{{%s:instance_text}}</h6>
<div class="text-gap-hairline"></div><h6> OR </h6><div class="text-gap-hairline"></div>
<form action="/login/oauth" method="post">
<div class="form-group">
<label for="instance-url">{{%s:instance_url}}: </label>
<input type="url" id="instance-url" name="instance">
<input class="btn" type="submit" value="{{%s:instance_submit}}">
<input class="btn btn-single" type="submit" value="{{%s:instance_submit}}">
</div>
</form>
</div>