mirror of
https://github.com/ether/etherpad-lite.git
synced 2025-04-22 00:16:15 -04:00
Merge pull request #2298 from ether/reflow-toolbar-properly
Reflow toolbar properly
This commit is contained in:
commit
8d2fa35b3f
3 changed files with 50 additions and 15 deletions
|
@ -59,7 +59,7 @@ a img {
|
||||||
height: 32px;
|
height: 32px;
|
||||||
}
|
}
|
||||||
.toolbar ul {
|
.toolbar ul {
|
||||||
position: relative;
|
position: absolute;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
padding-right: 3px;
|
padding-right: 3px;
|
||||||
padding-left: 1px;
|
padding-left: 1px;
|
||||||
|
@ -67,9 +67,6 @@ a img {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
float: left
|
float: left
|
||||||
}
|
}
|
||||||
.toolbar ul.menu_right {
|
|
||||||
float: right
|
|
||||||
}
|
|
||||||
.toolbar ul li {
|
.toolbar ul li {
|
||||||
float: left;
|
float: left;
|
||||||
margin-left: 2px;
|
margin-left: 2px;
|
||||||
|
@ -84,6 +81,7 @@ a img {
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
width: 0px;
|
width: 0px;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
height:20px;
|
||||||
}
|
}
|
||||||
.toolbar ul li a:hover {
|
.toolbar ul li a:hover {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
@ -164,6 +162,15 @@ a img {
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
|
.toolbar ul.menu_left {
|
||||||
|
left:0px;
|
||||||
|
right:250px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar ul.menu_right {
|
||||||
|
right:0px;
|
||||||
|
}
|
||||||
|
|
||||||
li[data-key=showusers] > a {
|
li[data-key=showusers] > a {
|
||||||
min-width: 30px;
|
min-width: 30px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
@ -175,6 +182,9 @@ li[data-key=showusers] > a #online_count {
|
||||||
top: 2px;
|
top: 2px;
|
||||||
padding-left: 2px;
|
padding-left: 2px;
|
||||||
}
|
}
|
||||||
|
#editbar{
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
#editorcontainer {
|
#editorcontainer {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 37px; /* + 1px border */
|
top: 37px; /* + 1px border */
|
||||||
|
@ -843,12 +853,16 @@ input[type=checkbox] {
|
||||||
width: 185px !important;
|
width: 185px !important;
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 600px) {
|
@media screen and (max-width: 600px) {
|
||||||
.toolbar ul li.separator {
|
.toolbar ul li.separator {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.toolbar ul li a {
|
.toolbar ul li a {
|
||||||
padding: 4px 1px
|
padding: 4px 1px
|
||||||
}
|
}
|
||||||
|
.toolbar ul.menu_left {
|
||||||
|
left:0px;
|
||||||
|
right:150px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@media all and (max-width: 400px){
|
@media all and (max-width: 400px){
|
||||||
#gritter-notice-wrapper{
|
#gritter-notice-wrapper{
|
||||||
|
@ -894,9 +908,13 @@ input[type=checkbox] {
|
||||||
#editbar {
|
#editbar {
|
||||||
height: 62px;
|
height: 62px;
|
||||||
}
|
}
|
||||||
|
.toolbar ul.menu_left {
|
||||||
|
left:0px;
|
||||||
|
right:100px;
|
||||||
|
}
|
||||||
|
|
||||||
.toolbar ul.menu_right {
|
.toolbar ul.menu_right {
|
||||||
float: left;
|
right:0px;
|
||||||
margin-top:2px;
|
|
||||||
}
|
}
|
||||||
.popup {
|
.popup {
|
||||||
width:100%;
|
width:100%;
|
||||||
|
@ -917,6 +935,9 @@ input[type=checkbox] {
|
||||||
#editorcontainer {
|
#editorcontainer {
|
||||||
margin-bottom: 33px
|
margin-bottom: 33px
|
||||||
}
|
}
|
||||||
|
.toolbar ul.menu_left {
|
||||||
|
right:0px;
|
||||||
|
}
|
||||||
.toolbar ul.menu_right {
|
.toolbar ul.menu_right {
|
||||||
background: #f7f7f7;
|
background: #f7f7f7;
|
||||||
background: -webkit-linear-gradient(#f7f7f7, #f1f1f1 80%);
|
background: -webkit-linear-gradient(#f7f7f7, #f1f1f1 80%);
|
||||||
|
|
|
@ -937,4 +937,3 @@ exports.handshake = handshake;
|
||||||
exports.pad = pad;
|
exports.pad = pad;
|
||||||
exports.init = init;
|
exports.init = init;
|
||||||
exports.alertBar = alertBar;
|
exports.alertBar = alertBar;
|
||||||
|
|
||||||
|
|
|
@ -140,6 +140,11 @@ var padeditbar = (function()
|
||||||
init: function() {
|
init: function() {
|
||||||
var self = this;
|
var self = this;
|
||||||
self.dropdowns = [];
|
self.dropdowns = [];
|
||||||
|
// Listen for resize events (sucks but needed as iFrame ace_inner has to be position absolute
|
||||||
|
// A CSS fix for this would be nice but I'm not sure how we'd do it.
|
||||||
|
$(window).resize(function(){
|
||||||
|
self.redrawHeight();
|
||||||
|
});
|
||||||
|
|
||||||
$("#editbar .editbarbutton").attr("unselectable", "on"); // for IE
|
$("#editbar .editbarbutton").attr("unselectable", "on"); // for IE
|
||||||
$("#editbar").removeClass("disabledtoolbar").addClass("enabledtoolbar");
|
$("#editbar").removeClass("disabledtoolbar").addClass("enabledtoolbar");
|
||||||
|
@ -149,6 +154,10 @@ var padeditbar = (function()
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$('#editbar').show();
|
||||||
|
|
||||||
|
this.redrawHeight();
|
||||||
|
|
||||||
registerDefaultCommands(self);
|
registerDefaultCommands(self);
|
||||||
|
|
||||||
hooks.callAll("postToolbarInit", {
|
hooks.callAll("postToolbarInit", {
|
||||||
|
@ -170,6 +179,12 @@ var padeditbar = (function()
|
||||||
this.commands[cmd] = callback;
|
this.commands[cmd] = callback;
|
||||||
return this;
|
return this;
|
||||||
},
|
},
|
||||||
|
redrawHeight: function(){
|
||||||
|
var editbarHeight = $('.menu_left').height() + 2 + "px";
|
||||||
|
var containerTop = $('.menu_left').height() + 5 + "px";
|
||||||
|
$('#editbar').css("height", editbarHeight);
|
||||||
|
$('#editorcontainer').css("top", containerTop);
|
||||||
|
},
|
||||||
registerDropdownCommand: function (cmd, dropdown) {
|
registerDropdownCommand: function (cmd, dropdown) {
|
||||||
dropdown = dropdown || cmd;
|
dropdown = dropdown || cmd;
|
||||||
self.dropdowns.push(dropdown)
|
self.dropdowns.push(dropdown)
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue