css: adjust spacing around header on mobile.

This commit is contained in:
evazion
2022-05-21 14:57:49 -05:00
parent 80ced3e418
commit e7c507b7fc
4 changed files with 8 additions and 7 deletions

View File

@@ -1,7 +1,7 @@
div#page { div#page {
overflow: visible; overflow: visible;
margin: 0 20px; margin-left: 30px;
padding: 0 10px; margin-right: 30px;
aside#sidebar > section { aside#sidebar > section {
margin-bottom: 1em; margin-bottom: 1em;
@@ -14,7 +14,6 @@ div#page {
footer#page-footer { footer#page-footer {
width: 100%; width: 100%;
margin-top: 1em;
text-align: center; text-align: center;
padding: 1em 0 1em; padding: 1em 0 1em;
border-top: 1px solid var(--footer-border-color); border-top: 1px solid var(--footer-border-color);

View File

@@ -5,7 +5,8 @@
header#top { header#top {
#app-name-header { #app-name-header {
font-size: var(--text-xxl); font-size: var(--text-xxl);
margin: 0 30px; margin-left: 30px;
margin-right: 30px;
#app-logo img { #app-logo img {
width: 1.25em; width: 1.25em;

View File

@@ -1,12 +1,13 @@
@media screen and (max-width: 660px) { @media screen and (max-width: 660px) {
div#page { div#page {
margin: 0 0.5rem; margin: 0.5rem 0.5rem 0;
padding: 0; padding: 0;
} }
header#top { header#top {
position: relative; position: relative;
text-align: center; text-align: center;
margin-top: 0.25rem;
#maintoggle { #maintoggle {
display: block; display: block;

View File

@@ -70,7 +70,7 @@
</div> </div>
<% end %> <% end %>
<header id="top" class="mb-4"> <header id="top">
<div id="app-name-header" class="font-bold font-header leading-normal inline-flex items-center gap-1"> <div id="app-name-header" class="font-bold font-header leading-normal inline-flex items-center gap-1">
<%= link_to image_pack_tag("static/danbooru-logo-128x128.png"), root_path, id: "app-logo" %> <%= link_to image_pack_tag("static/danbooru-logo-128x128.png"), root_path, id: "app-logo" %>
<%= link_to Danbooru.config.app_name, root_path, id: "app-name" %> <%= link_to Danbooru.config.app_name, root_path, id: "app-name" %>
@@ -114,7 +114,7 @@
</nav> </nav>
</header> </header>
<div id="page" class="flex-1"> <div id="page" class="flex-1 mt-4">
<% if CurrentUser.user.is_restricted? && (params[:controller] == "users" || cookies[:hide_verify_account_notice].blank?) %> <% if CurrentUser.user.is_restricted? && (params[:controller] == "users" || cookies[:hide_verify_account_notice].blank?) %>
<div class="notice notice-info notice-large" id="verify-account-notice"> <div class="notice notice-info notice-large" id="verify-account-notice">
<h2>Your account is restricted.</h2> <h2>Your account is restricted.</h2>