Handle mobile breakpoints correctly

This commit is contained in:
Johan Stenehall 2015-03-25 01:04:00 +01:00
parent 5e83401782
commit 3ce93122a3
2 changed files with 14 additions and 2 deletions

View file

@ -7,6 +7,10 @@ body {
overflow: hidden; overflow: hidden;
} }
.mobile {
display: none;
}
a { a {
cursor: pointer; cursor: pointer;
} }
@ -599,6 +603,14 @@ img.emojione {
/* */ /* */
@media (max-width: 968px) { @media (max-width: 968px) {
.mobile {
display: inherit;
}
.desktop {
display: none;
}
#bufferlines table { #bufferlines table {
border-collapse: separate; border-collapse: separate;
border-spacing: 2px 3px; border-spacing: 2px 3px;

View file

@ -227,8 +227,8 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
</div> </div>
<div class="title" title="{{activeBuffer().rtitle}}"> <div class="title" title="{{activeBuffer().rtitle}}">
<span class="visible-lg" ng-repeat="part in activeBuffer().title" ng-class="::part.classes" ng-bind-html="::(part.text | linky:'_blank' | DOMfilter:'irclinky')"></span> <span class="desktop" ng-repeat="part in activeBuffer().title" ng-class="::part.classes" ng-bind-html="::(part.text | linky:'_blank' | DOMfilter:'irclinky')"></span>
<span class="hidden-lg" ng-click="showModal('topicModal')" ng-class="{'active': activeBuffer().active, 'indent': activeBuffer().indent, 'channel': activeBuffer().type === 'channel', 'channel_hash': activeBuffer().prefix === '#', 'channel_plus': activeBuffer().prefix === '+', 'channel_ampersand': activeBuffer().prefix === '&', 'private': activeBuffer().type === 'private'}">{{ activeBuffer().trimmedName || activeBuffer().fullName }}</span> <span class="mobile" ng-click="showModal('topicModal')" ng-class="{'active': activeBuffer().active, 'channel': activeBuffer().type === 'channel', 'channel_hash': activeBuffer().prefix === '#', 'channel_plus': activeBuffer().prefix === '+', 'channel_ampersand': activeBuffer().prefix === '&'}">{{ activeBuffer().trimmedName || activeBuffer().fullName }}</span>
</div> </div>
<div class="actions pull-right vertical-line-left"> <div class="actions pull-right vertical-line-left">