mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2025-01-30 19:48:18 +08:00
fixed navbar on sceens smaller than 1000px
This commit is contained in:
zmagod
parent
f9d956bbca
commit
5bf278298b
2 changed files with 105 additions and 64 deletions
43
app/assets/stylesheets/extend/bootstrap.scss
vendored
43
app/assets/stylesheets/extend/bootstrap.scss
vendored
|
|
@ -57,3 +57,46 @@
|
|||
.result-comment .col-xs-12 {
|
||||
float: none;
|
||||
}
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
.navbar-header {
|
||||
float: none;
|
||||
}
|
||||
.navbar-left,.navbar-right {
|
||||
float: none !important;
|
||||
}
|
||||
.navbar-toggle {
|
||||
display: block;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
.navbar-collapse {
|
||||
border-top: 1px solid transparent;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
|
||||
}
|
||||
.navbar-fixed-top {
|
||||
top: 0;
|
||||
border-width: 0 0 1px;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: none!important;
|
||||
}
|
||||
.navbar-nav {
|
||||
float: none!important;
|
||||
margin-top: 7.5px;
|
||||
}
|
||||
.navbar-nav>li {
|
||||
float: none;
|
||||
}
|
||||
.navbar-nav>li>a {
|
||||
padding-bottom: 10px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.collapse.in{
|
||||
display:block !important;
|
||||
}
|
||||
.container {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -28,95 +28,93 @@
|
|||
<li>
|
||||
<a href="<%= projects_path %>">
|
||||
<span class="glyphicon glyphicon-home"></span>
|
||||
<span class="visible-xs-inline"><%= t('nav.label.projects') %></span>
|
||||
<span class="visible-xs-inline visible-sm-inline"><%= t('nav.label.projects') %></span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="<%= protocols_path %>">
|
||||
<span class="glyphicon glyphicon-list-alt"></span>
|
||||
<span class="visible-xs-inline"><%= t('nav.label.protocols') %></span>
|
||||
<span class="visible-xs-inline visible-sm-inline"><%= t('nav.label.protocols') %></span>
|
||||
</a>
|
||||
</li>
|
||||
<% if false %>
|
||||
<li>
|
||||
<a href="#">
|
||||
<span class="glyphicon glyphicon-calendar"></span>
|
||||
<span class="visible-xs-inline"><%= t('nav.label.calendar') %></span>
|
||||
<span class="visible-xs-inline visible-sm-inline"><%= t('nav.label.calendar') %></span>
|
||||
</a>
|
||||
</li>
|
||||
<% end %>
|
||||
<li>
|
||||
<a class="btn-activity" href="<%= activities_path(format: :json) %>" role="button" data-remote="true">
|
||||
<span class="glyphicon glyphicon-equalizer"></span>
|
||||
<span class="visible-xs-inline"><%= t('nav.label.activities') %></span>
|
||||
<span class="visible-xs-inline visible-sm-inline"><%= t('nav.label.activities') %></span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div>
|
||||
<!-- profile info -->
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li class="dropdown">
|
||||
<a href="#"
|
||||
id="notifications-dropdown"
|
||||
class="dropdown-toggle"
|
||||
data-toggle="dropdown"
|
||||
role="button"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
data-href="<%= recent_notifications_url(current_user) %>">
|
||||
<%= fa_icon 'bell'%>
|
||||
<span id="count-notifications"
|
||||
data-href="<%= unseen_notification_url(current_user) %>"></span>
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-notifications">
|
||||
<li class="notifications-dropdown-header"><span><%= t('notifications.title') %></span><span class="pull-right"><%= t('nav.user.settings') %></span></li>
|
||||
<li class="notifications-dropdown-footer">link to method goes here</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
<a href="#" id="help-link" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
|
||||
<span class="glyphicon glyphicon-info-sign"></span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><%= link_to t('nav.help.tutorials'), TUTORIALS_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.faq'), FAQ_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.release_notes'), RELEASE_NOTES_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.support'), SUPPORT_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.plans'), PLANS_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.contact'), CONTACT_URL, target: "_blank" %></li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- profile info -->
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li class="dropdown">
|
||||
<a href="#"
|
||||
id="notifications-dropdown"
|
||||
class="dropdown-toggle"
|
||||
data-toggle="dropdown"
|
||||
role="button"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
data-href="<%= recent_notifications_url(current_user) %>">
|
||||
<%= fa_icon 'bell'%>
|
||||
<span id="count-notifications"
|
||||
data-href="<%= unseen_notification_url(current_user) %>"></span>
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-notifications">
|
||||
<li class="notifications-dropdown-header"><span><%= t('notifications.title') %></span><span class="pull-right"><%= t('nav.user.settings') %></span></li>
|
||||
<li class="notifications-dropdown-footer">link to method goes here</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
<a href="#" id="help-link" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
|
||||
<span class="glyphicon glyphicon-info-sign"></span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><%= link_to t('nav.help.tutorials'), TUTORIALS_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.faq'), FAQ_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.release_notes'), RELEASE_NOTES_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.support'), SUPPORT_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.plans'), PLANS_URL, target: "_blank" %></li>
|
||||
<li><%= link_to t('nav.help.contact'), CONTACT_URL, target: "_blank" %></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
|
||||
<span><%= t('nav.user_greeting', full_name: current_user.full_name) %></span>
|
||||
<%= image_tag avatar_path(current_user, :icon_small), class: "avatar" %>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><%= link_to t('nav.user.profile'), edit_user_registration_path %></li>
|
||||
<li><%= link_to t('nav.user.settings'), preferences_path %></li>
|
||||
<li role="separator" class="divider"></li>
|
||||
<li><%= link_to t('nav.user.logout'), destroy_user_session_path, :method => :delete %></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
|
||||
<span><%= t('nav.user_greeting', full_name: current_user.full_name) %></span>
|
||||
<%= image_tag avatar_path(current_user, :icon_small), class: "avatar" %>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><%= link_to t('nav.user.profile'), edit_user_registration_path %></li>
|
||||
<li><%= link_to t('nav.user.settings'), preferences_path %></li>
|
||||
<li role="separator" class="divider"></li>
|
||||
<li><%= link_to t('nav.user.logout'), destroy_user_session_path, :method => :delete %></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- search form -->
|
||||
<%= form_tag search_path, method: :get, id: 'search-bar', class: 'navbar-form navbar-right', role: 'search' do %>
|
||||
<div class="form-group">
|
||||
<div class="input-group">
|
||||
<input class="form-control" type="text" name="q" maxlength="50" placeholder="<%= t('nav.search') %>">
|
||||
<span class="input-group-btn">
|
||||
<button id="search-button" class="btn btn-default" type="submit">
|
||||
<span class="glyphicon glyphicon-search"></span>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<!-- search form -->
|
||||
<%= form_tag search_path, method: :get, id: 'search-bar', class: 'navbar-form navbar-right', role: 'search' do %>
|
||||
<div class="form-group">
|
||||
<div class="input-group">
|
||||
<input class="form-control" type="text" name="q" maxlength="50" placeholder="<%= t('nav.search') %>">
|
||||
<span class="input-group-btn">
|
||||
<button id="search-button" class="btn btn-default" type="submit">
|
||||
<span class="glyphicon glyphicon-search"></span>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue