css: add .mobile-only, .desktop-only classes.

This commit is contained in:
evazion
2019-09-30 00:58:34 -05:00
parent cf97235aa6
commit 5818c367fd
5 changed files with 13 additions and 24 deletions

View File

@@ -137,3 +137,12 @@ ul.list-inline {
display: inline; display: inline;
} }
} }
.mobile-only {
display: none;
@media (max-width: 660px) { display: initial; }
}
.desktop-only {
@media (max-width: 660px) { display: none; }
}

View File

@@ -1,26 +1,6 @@
@import "../base/000_vars.scss"; @import "../base/000_vars.scss";
#desktop-version-link {
display: none;
}
#searchbox-redirect-link {
display: none;
}
@media screen and (max-width: 660px) { @media screen and (max-width: 660px) {
#keyboard-shortcuts-link {
display: none;
}
#desktop-version-link {
display: inline;
}
#searchbox-redirect-link {
display: inline;
}
#saved-searches-nav { #saved-searches-nav {
display: none; display: none;
} }

View File

@@ -103,7 +103,7 @@
<header id="top"> <header id="top">
<h1 id="app-name-header"><%= link_to Danbooru.config.app_name, "/" %></h1> <h1 id="app-name-header"><%= link_to Danbooru.config.app_name, "/" %></h1>
<div id="maintoggle"> <div id="maintoggle" class="mobile-only">
<a href="#"><i id="maintoggle-on" class="fas fa-bars"></i></a> <a href="#"><i id="maintoggle-on" class="fas fa-bars"></i></a>
<a href="#"><i id="maintoggle-off" class="fas fa-times" style="display: none;"></i></a> <a href="#"><i id="maintoggle-off" class="fas fa-times" style="display: none;"></i></a>
</div> </div>

View File

@@ -36,7 +36,7 @@
<li><%= link_to "Wiki", new_wiki_page_path(wiki_page: { title: @post_set.tag_string }), id: "show-excerpt-link" %></li> <li><%= link_to "Wiki", new_wiki_page_path(wiki_page: { title: @post_set.tag_string }), id: "show-excerpt-link" %></li>
<% end %> <% end %>
<li id="searchbox-redirect-link"><a href="#search-box">Search &raquo;</a></li> <li id="searchbox-redirect-link" class="mobile-only"><a href="#search-box">Search &raquo;</a></li>
</menu> </menu>
<%= render "posts/partials/index/edit" %> <%= render "posts/partials/index/edit" %>

View File

@@ -6,12 +6,12 @@
&ndash; <%= link_to "Rules", terms_of_service_path %> &ndash; <%= link_to "Rules", terms_of_service_path %>
&ndash; <%= link_to "Contact", contact_path %> &ndash; <%= link_to "Contact", contact_path %>
<% if CurrentUser.user.enable_post_navigation %> <% if CurrentUser.user.enable_post_navigation %>
<span id="keyboard-shortcuts-link"> <span id="keyboard-shortcuts-link" class="desktop-only">
&ndash; <%= link_to "Keyboard shortcuts", keyboard_shortcuts_path %> &ndash; <%= link_to "Keyboard shortcuts", keyboard_shortcuts_path %>
</span> </span>
<% end %> <% end %>
<% if CurrentUser.is_member? %> <% if CurrentUser.is_member? %>
<span id="desktop-version-link"> <span id="desktop-version-link" class="mobile-only">
&ndash; &ndash;
<%= link_to "Disable responsive mode", edit_user_path(CurrentUser.id), :rel => "nofollow" %> <%= link_to "Disable responsive mode", edit_user_path(CurrentUser.id), :rel => "nofollow" %>
</span> </span>