Merge pull request #923 from lorenzhs/mobile-tab-tweak

Use CSS to show/hide tab-complete button instead of ng-hide
This commit is contained in:
Lorenz Hübschle-Schneider 2017-04-05 14:35:27 +02:00 committed by GitHub
commit 804e2ff39a
5 changed files with 30 additions and 29 deletions

View file

@ -342,13 +342,6 @@ input[type=text]:-moz-placeholder, input[type=password]:-moz-placeholder { /* Fi
color: var(--base01); color: var(--base01);
} }
.is-mobile-ui .btn-complete-nick:hover,
.is-mobile-ui .btn-send:hover,
.is-mobile-ui .btn-send-image:hover {
background: var(--base01);
color: var(--base05);
}
#connection-infos { #connection-infos {
color: var(--base04); color: var(--base04);
} }
@ -1448,4 +1441,12 @@ button.close:hover {
.footer { .footer {
background: var(--base00); background: var(--base00);
} }
.btn-complete-nick:hover,
.btn-send:hover,
.btn-send-image:hover {
background: var(--base01);
color: var(--base05);
}
} }

View file

@ -100,13 +100,6 @@ input[type=text], input[type=password], #sendMessage, .badge, .btn-send, .btn-se
color: white; color: white;
} }
.is-mobile-ui .btn-complete-nick:hover,
.is-mobile-ui .btn-send:hover,
.is-mobile-ui .btn-send-image:hover {
background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3);
color: #ccc;
}
.nav-pills li:nth-child(2n) { .nav-pills li:nth-child(2n) {
background: #283244; background: #283244;
} }
@ -184,4 +177,12 @@ input[type=text], input[type=password], #sendMessage, .badge, .btn-send, .btn-se
.footer { .footer {
padding-left: 5px !important; padding-left: 5px !important;
} }
.btn-complete-nick:hover,
.btn-send:hover,
.btn-send-image:hover {
background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3);
color: #ccc;
}
} }

View file

@ -94,13 +94,6 @@ input[type=text], input[type=password], #sendMessage, .badge, .btn-send, .btn-se
color: white; color: white;
} }
.is-mobile-ui .btn-complete-nick:hover,
.is-mobile-ui .btn-send:hover,
.is-mobile-ui .btn-send-image:hover {
background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3);
color: #ccc;
}
#connection-infos { #connection-infos {
color: #aaa; color: #aaa;
} }
@ -2141,6 +2134,12 @@ button.close:hover {
background: rgb(24,24,24); background: rgb(24,24,24);
} }
.btn-complete-nick:hover,
.btn-send:hover,
.btn-send-image:hover {
background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3);
color: #ccc;
}
} }

View file

@ -34,12 +34,6 @@ html {
color: #428BCA; color: #428BCA;
} }
.is-mobile-ui .btn-complete-nick:hover,
.is-mobile-ui .btn-send:hover,
.is-mobile-ui .btn-send-image:hover {
color: #428BCA;
}
tr.bufferline:hover { tr.bufferline:hover {
background-color: #efefef; background-color: #efefef;
} }
@ -2111,4 +2105,10 @@ select.form-control, select option, input[type=text], input[type=password], #sen
background: rgb(230,230,230); background: rgb(230,230,230);
} }
.btn-complete-nick:hover,
.btn-send:hover,
.btn-send-image:hover {
color: #428BCA;
}
} }

View file

@ -1,9 +1,9 @@
<form class="form form-horizontal" ng-class="{'is-mobile-ui': utils.isMobileUi()}" id="inputform" ng-submit="sendMessage()" imgur-drop> <form class="form form-horizontal" id="inputform" ng-submit="sendMessage()" imgur-drop>
<div class="input-group"> <div class="input-group">
<textarea id="{{inputId}}" class="form-control favorite-font" ng-trim="false" rows="1" ng-change="inputChanged()" autocomplete="on" ng-model="command" ng-focus="hideSidebar()"> <textarea id="{{inputId}}" class="form-control favorite-font" ng-trim="false" rows="1" ng-change="inputChanged()" autocomplete="on" ng-model="command" ng-focus="hideSidebar()">
</textarea> </textarea>
<span class="input-group-btn"> <span class="input-group-btn">
<button class="btn btn-complete-nick unselectable" title="Complete nick" ng-hide="!utils.isMobileUi()" ng-click="handleCompleteNickButton($event)"><i class="glyphicon glyphicon-bullhorn"></i></button> <button class="btn btn-complete-nick unselectable mobile" title="Complete nick" ng-click="handleCompleteNickButton($event)"><i class="glyphicon glyphicon-bullhorn"></i></button>
<label class="btn btn-send-image unselectable" for="imgur-upload" title="Send image"> <label class="btn btn-send-image unselectable" for="imgur-upload" title="Send image">
<i class="glyphicon glyphicon-picture"></i> <i class="glyphicon glyphicon-picture"></i>
<input type="file" accept="image/*" multiple title="Send image" id="imgur-upload" class="imgur-upload" file-change="uploadImage($event, files)"> <input type="file" accept="image/*" multiple title="Send image" id="imgur-upload" class="imgur-upload" file-change="uploadImage($event, files)">