Upgrade to Bootstrap 3

This commit is contained in:
benweet 2013-08-25 02:45:14 +02:00
parent 840896faf0
commit 1e8d77f909
3 changed files with 22 additions and 15 deletions

View File

@ -455,12 +455,17 @@ define([
$menuPanelElt = $('.menu-panel').collapse({ $menuPanelElt = $('.menu-panel').collapse({
toggle: false toggle: false
}); });
$menuPanelElt.click(function(e) {
console.log(e);
}).find('.panel-content').click(function(e) {
e.stopPropagation();
});
var menuPanelBackdropElt = undefined; var menuPanelBackdropElt = undefined;
$menuPanelElt.on('show.bs.collapse', function(e) { $menuPanelElt.on('show.bs.collapse', function(e) {
if(e.target === $menuPanelElt[0]) { if(e.target === $menuPanelElt[0]) {
isMenuPanelShown = true; isMenuPanelShown = true;
menuPanelBackdropElt = utils.createBackdrop('collapse', '.menu-panel'); menuPanelBackdropElt = utils.createBackdrop();
//$menuPanelElt.addClass('move-to-front'); $menuPanelElt.addClass('move-to-front');
} }
else { else {
// Close all open sub-menus when one submenu opens // Close all open sub-menus when one submenu opens
@ -470,7 +475,7 @@ define([
if(e.target === $menuPanelElt[0]) { if(e.target === $menuPanelElt[0]) {
isMenuPanelShown = false; isMenuPanelShown = false;
menuPanelBackdropElt.remove(); menuPanelBackdropElt.remove();
//$menuPanelElt.removeClass('move-to-front'); $menuPanelElt.removeClass('move-to-front');
} }
}).on('hidden.bs.collapse', function(e) { }).on('hidden.bs.collapse', function(e) {
if(e.target === $menuPanelElt[0]) { if(e.target === $menuPanelElt[0]) {
@ -487,7 +492,7 @@ define([
if(e.target === $documentPanelElt[0]) { if(e.target === $documentPanelElt[0]) {
isDocumentPanelShown = true; isDocumentPanelShown = true;
documentPanelBackdropElt = utils.createBackdrop('collapse', '.document-panel'); documentPanelBackdropElt = utils.createBackdrop('collapse', '.document-panel');
//$documentPanelElt.addClass('move-to-front'); $documentPanelElt.addClass('move-to-front');
} }
else { else {
// Close all open sub-menus when one submenu opens // Close all open sub-menus when one submenu opens
@ -497,7 +502,7 @@ define([
if(e.target === $documentPanelElt[0]) { if(e.target === $documentPanelElt[0]) {
isDocumentPanelShown = false; isDocumentPanelShown = false;
documentPanelBackdropElt.remove(); documentPanelBackdropElt.remove();
//$documentPanelElt.removeClass('move-to-front'); $documentPanelElt.removeClass('move-to-front');
} }
}).on('hidden.bs.collapse', function(e) { }).on('hidden.bs.collapse', function(e) {
if(e.target === $documentPanelElt[0]) { if(e.target === $documentPanelElt[0]) {

View File

@ -45,9 +45,9 @@
<div class="ui-layout-south preview-container"></div> <div class="ui-layout-south preview-container"></div>
<div id="wmd-button-bar" class="hide"></div> <div id="wmd-button-bar" class="hide"></div>
<div class="menu-panel collapse width"> <div class="menu-panel collapse width" data-toggle="collapse"
<button class="btn btn-success collapse-button" data-toggle="collapse" data-target=".menu-panel">
data-target=".menu-panel" title="Menu"> <button class="btn btn-success collapse-button" title="Menu">
<i class="icon-left-dir"></i> <img data-stackedit-src="stackedit-64.png" <i class="icon-left-dir"></i> <img data-stackedit-src="stackedit-64.png"
width="32" height="32" /> width="32" height="32" />
</button> </button>

View File

@ -317,14 +317,14 @@ body {
position: absolute; position: absolute;
top: 0; top: 0;
height: 100%; height: 100%;
z-index: 2000; z-index: 10;
overflow: initial; overflow: initial;
.box-shadow(0 6px 12px rgba(0,0,0,.175));
.collapse-button i { .collapse-button i {
color: @panel-button-color; color: @panel-button-color;
font-size: 19px; font-size: 19px;
} }
.panel-content { .panel-content {
.box-shadow(0 6px 12px rgba(0,0,0,.175));
overflow: auto; overflow: auto;
padding-bottom: 30px; padding-bottom: 30px;
height: 100%; height: 100%;
@ -336,9 +336,8 @@ body {
} }
.menu-panel { .menu-panel {
background-color: @panel-bg; width: 0 !important;
width: @menu-panel-width !important; margin-left: (-@menu-panel-width - 38);
margin-left: (-@menu-panel-width - 32);
-webkit-transition: margin-left 0.35s ease; -webkit-transition: margin-left 0.35s ease;
-moz-transition: margin-left 0.35s ease; -moz-transition: margin-left 0.35s ease;
-o-transition: margin-left 0.35s ease; -o-transition: margin-left 0.35s ease;
@ -347,19 +346,22 @@ body {
background-color: @list-group-bg; background-color: @list-group-bg;
} }
&.in { &.in {
width: 100% !important;
margin-left: 0; margin-left: 0;
.collapse-button { .collapse-button {
background-color: @panel-bg; background-color: @panel-bg;
} }
} }
.collapse-button { .collapse-button {
right: -80px; left: 260px;
position: absolute; position: absolute;
margin-top: 6px; margin-top: 6px;
padding: 2px 20px; padding: 2px 20px;
z-index: -1; z-index: -1;
} }
.panel-content { .panel-content {
background-color: @panel-bg;
width: @menu-panel-width;
padding-top: 6px; padding-top: 6px;
border-right: 5px solid @panel-border-color; border-right: 5px solid @panel-border-color;
} }