Reorganized side panels and navbar

This commit is contained in:
benweet 2014-03-10 23:53:03 +00:00
parent 70efb55cfc
commit bcfc76e4db
3 changed files with 190 additions and 202 deletions

View File

@ -260,7 +260,7 @@ define([
// Hack to disable bracket highlighting
aceEditor.$highlightBrackets = function() {};
// Make bold titles...
// Hack to make bold titles
(function(self) {
function checkLine(currentLine) {
var line = self.lines[currentLine];
@ -340,8 +340,8 @@ define([
resizeWithWindow: false,
north__spacing_open: 1,
north__spacing_closed: 1,
spacing_open: 30,
spacing_closed: 30,
spacing_open: 32,
spacing_closed: 32,
togglerLength_open: 60,
togglerLength_closed: 60,
stateManagement__enabled: false,
@ -437,28 +437,28 @@ define([
var $navbarElt;
var $leftBtnElts;
var $rightBtnElts;
var $leftBtnDropdown;
var $rightBtnDropdown;
var marginWidth = 36 + 25 + 25;
var $btnDropdown;
var $titleContainer;
var marginWidth = 18 * 2 + 25 + 25;
var titleWidth = 18 + 348;
var leftButtonsWidth = 72 + 83 + 166 + 167 + 83;
var rightButtonsWidth = 36 + 84 + 83;
var rightButtonsDropdown = 42;
var leftButtonsWidth = 18 * 4 + 79 + 158 + 159 + 79;
var rightButtonsWidth = 18 + 79;
var buttonsDropdownWidth = 40;
function adjustWindow() {
if(!window.viewerMode) {
var maxWidth = $navbarElt.width() - 5;
var maxWidth = $navbarElt.width();
if(marginWidth + titleWidth + leftButtonsWidth + rightButtonsWidth > maxWidth) {
$rightBtnDropdown.show().find('.dropdown-menu').append($rightBtnElts);
if(marginWidth + titleWidth + leftButtonsWidth + rightButtonsDropdown > maxWidth) {
$leftBtnDropdown.show().find('.dropdown-menu').append($leftBtnElts);
$btnDropdown.show().find('.dropdown-menu').append($leftBtnElts);
if(marginWidth + titleWidth + rightButtonsWidth + buttonsDropdownWidth > maxWidth) {
$btnDropdown.find('.dropdown-menu').append($rightBtnElts);
}
else {
$leftBtnDropdown.hide().after($leftBtnElts);
$titleContainer.before($rightBtnElts);
}
}
else {
$leftBtnDropdown.hide().after($leftBtnElts);
$rightBtnDropdown.hide().after($rightBtnElts);
$btnDropdown.hide().after($leftBtnElts);
$titleContainer.before($rightBtnElts);
}
}
layout.resizeAll();
@ -681,8 +681,8 @@ define([
$navbarElt = $('.navbar');
$leftBtnElts = $navbarElt.find('.left-buttons');
$rightBtnElts = $navbarElt.find('.right-buttons');
$leftBtnDropdown = $navbarElt.find('.left-buttons-dropdown');
$rightBtnDropdown = $navbarElt.find('.right-buttons-dropdown');
$btnDropdown = $navbarElt.find('.buttons-dropdown');
$titleContainer = $navbarElt.find('.title-container');
$(window).bind("resize", adjustWindow);
// Initialize utils library

View File

@ -172,9 +172,11 @@ define([
var $fileTitleElt = $('.file-title-navbar');
var $fileTitleInputElt = $(".input-file-title");
$(".action-create-file").click(function() {
var fileDesc = fileMgr.createFile();
fileMgr.selectFile(fileDesc);
$fileTitleElt.click();
setTimeout(function() {
var fileDesc = fileMgr.createFile();
fileMgr.selectFile(fileDesc);
$fileTitleElt.click();
}, 400);
});
$('.action-remove-file-confirm').click(function() {
$('.modal-remove-file-confirm').modal('show');

View File

@ -2,7 +2,7 @@
<div class="navbar-inner">
<div class="nav left-space"></div>
<div class="nav right-space pull-right"></div>
<div class="left-buttons-dropdown dropdown">
<div class="buttons-dropdown dropdown">
<div class="nav">
<button class="btn btn-success" data-toggle="dropdown"
title="Show buttons">
@ -24,25 +24,6 @@
<ul class="nav left-buttons">
<li class="wmd-button-group4 btn-group"></li>
</ul>
<div class="right-buttons-dropdown dropdown">
<div class="nav pull-right">
<button class="btn btn-success" data-toggle="dropdown"
title="Show buttons">
<i class="icon-th-large"></i>
</button>
<div class="dropdown-menu">
</div>
</div>
</div>
<ul class="nav pull-right right-buttons">
<li class="btn-group"><button
class="btn btn-success action-create-file" title="New document">
<i class="icon-file"></i>
</button>
<button class="btn btn-success action-remove-file-confirm" title="Delete document">
<i class="icon-trash"></i>
</button></li>
</ul>
<ul class="nav pull-right right-buttons">
<li class="offline-status hide">
<div class="text-danger">
@ -51,12 +32,12 @@
</li>
<li class="extension-buttons"></li>
</ul>
<ul class="nav pull-right">
<ul class="nav pull-right title-container">
<li><div class="working-indicator"></div></li>
<li><a class="btn btn-success file-title-navbar" href="#"
title="Rename document"> </a></li>
<li><div class="input-file-title-container"><input type="text"
class="col-lg-4 form-control hide input-file-title"
class="col-sm-4 form-control hide input-file-title"
placeholder="Document title" /></div></li>
</ul>
</div>
@ -79,6 +60,66 @@
StackEdit Viewer</a>
</div>
<div class=dropdown-header>EXPORT</div>
<div class="list-group">
<a href="#" data-toggle="collapse" data-target=".collapse-save-as"
class="list-group-item"><i class="icon-hdd"></i> Save...</a>
<div class="sub-menu collapse collapse-save-as clearfix">
<ul class="nav">
<li><a class="action-download-md" href="#"><i
class="icon-download"></i> Save as Markdown</a></li>
<li><a class="action-download-html" href="#"><i
class="icon-download"></i> Save as HTML</a></li>
<li><a class="action-download-template" href="#"><i
class="icon-download"></i> Save using template</a></li>
<li><a class="action-download-pdf" href="#"><i
class="icon-download"></i> Save as PDF</a></li>
</ul>
</div>
<a href="#" data-toggle="collapse" data-target=".collapse-synchronize"
class="list-group-item"><i
class="icon-refresh"></i> Synchronize...</a>
<div class="sub-menu collapse collapse-synchronize clearfix">
<ul class="nav">
<li><a href="#" data-toggle="modal" data-target=".modal-manage-sync"
class="action-reset-input"><i
class="icon-refresh"></i> Manage synchronization</a></li>
</ul>
<ul class="nav">
<li><a href="#" class="action-sync-export-dialog-dropbox"><i
class="icon-provider-dropbox"></i> Export to Dropbox</a></li>
<li><a href="#" class="submenu-sync-gdrive action-sync-export-dialog-gdrive"><i
class="icon-provider-gdrive"></i> Export to Google Drive</a></li>
<li><a href="#" class="submenu-sync-gdrive action-autosync-dialog-gdrive"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync</a></li>
<li><a href="#" class="submenu-sync-gdrivesec action-sync-export-dialog-gdrivesec"><i
class="icon-provider-gdrive"></i> Export to Google Drive<br>(2nd account)</a></li>
<li><a href="#" class="submenu-sync-gdrivesec action-autosync-dialog-gdrivesec"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync<br>(2nd account)</a></li>
<li><a href="#" class="submenu-sync-gdriveter action-sync-export-dialog-gdriveter"><i
class="icon-provider-gdrive"></i> Export to Google Drive<br>(3rd account)</a></li>
<li><a href="#" class="submenu-sync-gdriveter action-autosync-dialog-gdriveter"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync<br>(3rd account)</a></li>
</ul>
</div>
<a href="#" data-toggle="collapse" data-target=".collapse-publish-on"
class="list-group-item"><i class="icon-share"></i> Publish...</a>
<div class="sub-menu collapse collapse-publish-on clearfix">
<ul class="nav">
<li><a href="#" class="action-update-publication"
data-toggle="collapse" data-target=".menu-panel"><i class="icon-share"></i>
Update publication</a></li>
<li><a href="#" data-toggle="modal" data-target=".modal-manage-publish"
class="action-reset-input"><i class="icon-share"></i>
Manage publishing</a></li>
</ul>
<ul class="nav publish-on-provider-list">
</ul>
</div>
<a href="#" data-toggle="modal" data-target=".modal-manage-sharing"
class="action-reset-input list-group-item"><i class="icon-provider-stackedit"></i>
Sharing...</a>
</div>
<div class=dropdown-header>IMPORT</div>
<div class="list-group">
<a data-toggle="modal"
@ -109,64 +150,6 @@
class="icon-provider-gdrive"></i> Import from
Google Drive<br>(3rd account)</a>
</div>
<div class=dropdown-header>EXPORT</div>
<div class="list-group">
<a href="#" data-toggle="collapse" data-target=".collapse-save-as"
class="list-group-item"><i class="icon-hdd"></i> Save...</a>
<div class="sub-menu collapse collapse-save-as clearfix">
<ul class="nav">
<li><a class="action-download-md" href="#"><i
class="icon-download"></i> Save as Markdown</a></li>
<li><a class="action-download-html" href="#"><i
class="icon-download"></i> Save as HTML</a></li>
<li><a class="action-download-template" href="#"><i
class="icon-download"></i> Save using template</a></li>
<li><a class="action-download-pdf" href="#"><i
class="icon-download"></i> Save as PDF</a></li>
</ul>
</div>
<a href="#" data-toggle="collapse" data-target=".collapse-synchronize"
class="list-group-item"><i
class="icon-refresh"></i> Synchronize...</a>
<div class="sub-menu collapse collapse-synchronize clearfix">
<ul class="nav">
<li><a href="#" data-toggle="modal" data-target=".modal-manage-sync"
class="action-reset-input"><i
class="icon-refresh"></i> Manage synchronization</a>
<li><a href="#" class="action-sync-export-dialog-dropbox"><i
class="icon-provider-dropbox"></i> Export to Dropbox</a></li>
<li><a href="#" class="submenu-sync-gdrive action-sync-export-dialog-gdrive"><i
class="icon-provider-gdrive"></i> Export to Google Drive</a></li>
<li><a href="#" class="submenu-sync-gdrive action-autosync-dialog-gdrive"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync</a></li>
<li><a href="#" class="submenu-sync-gdrivesec action-sync-export-dialog-gdrivesec"><i
class="icon-provider-gdrive"></i> Export to Google Drive<br>(2nd account)</a></li>
<li><a href="#" class="submenu-sync-gdrivesec action-autosync-dialog-gdrivesec"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync<br>(2nd account)</a></li>
<li><a href="#" class="submenu-sync-gdriveter action-sync-export-dialog-gdriveter"><i
class="icon-provider-gdrive"></i> Export to Google Drive<br>(3rd account)</a></li>
<li><a href="#" class="submenu-sync-gdriveter action-autosync-dialog-gdriveter"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync<br>(3rd account)</a></li>
</ul>
</div>
<a href="#" data-toggle="collapse" data-target=".collapse-publish-on"
class="list-group-item"><i class="icon-share"></i> Publish...</a>
<div class="sub-menu collapse collapse-publish-on clearfix">
<ul class="nav">
<li><a href="#" class="action-update-publication"
data-toggle="collapse" data-target=".menu-panel"><i class="icon-share"></i>
Update publication</a></li>
<li><a href="#" data-toggle="modal" data-target=".modal-manage-publish"
class="action-reset-input"><i class="icon-share"></i>
Manage publication</a></li>
</ul>
<ul class="nav publish-on-provider-list">
</ul>
</div>
<a href="#" data-toggle="modal" data-target=".modal-manage-sharing"
class="action-reset-input list-group-item"><i class="icon-provider-stackedit"></i>
Sharing...</a>
</div>
<ul class="nav">
<li><a href="#" data-toggle="modal"
data-target=".modal-settings" class="action-load-settings"><i
@ -185,14 +168,17 @@
<i class="icon-folder-open"></i>
</button>
<div class="search-bar clearfix">
<ul class="nav">
<li><a href="#" class="action-create-file" data-toggle="collapse" data-target=".document-panel"><i
class="icon-file"></i> New document</a></li>
<li><a href="#" class="action-remove-file-confirm"><i
class="icon-trash"></i> Delete document</a></li>
<li><a href="#" data-toggle="modal" data-target=".modal-document-manager"><i
class="icon-layers"></i> Manage documents</a></li>
</ul>
<div class="input-group">
<span class="input-group-addon"><i class="icon-search"></i></span><input
type="text" class="form-control"></input>
<div class="input-group-btn">
<a data-toggle="modal" data-target=".modal-document-manager"
class="btn btn-link" title="Manage documents"><i
class="icon-layers"></i></a>
</div>
type="text" class="form-control" placeholder="Find document"></input>
</div>
</div>
<div class="panel-content">
@ -271,7 +257,7 @@
<p>Please provide the link URL and an optional title:</p>
<div class="input-group">
<span class="input-group-addon"><i class="icon-globe"></i></span><input
id="input-insert-link" type="text" class="col-lg-5 form-control"
id="input-insert-link" type="text" class="col-sm-5 form-control"
placeholder='http://example.com/ "optional title"'></input>
</div>
</div>
@ -298,7 +284,7 @@
<p>Please provide the image URL and an optional title:</p>
<div class="input-group">
<span class="input-group-addon"><i class="icon-picture"></i></span><input
id="input-insert-image" type="text" class="col-lg-5 form-control"
id="input-insert-image" type="text" class="col-sm-5 form-control"
placeholder='http://example.com/image.jpg "optional title"'></input>
</div>
</div>
@ -326,24 +312,24 @@
<div class="modal-body">
<div class="form-horizontal">
<div class="form-group">
<div class="col-lg-7">
<div class="col-sm-7">
<img>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-import-image-title">Title (optional)</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-import-image-title"
placeholder="Image title" class="form-control">
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-import-image-size">Size limit (optional)</label>
<div class="col-lg-7 form-inline">
<div class="col-sm-7 form-inline">
<input type="text" id="input-import-image-size" placeholder="0"
class="col-lg-3 form-control"> px
class="col-sm-3 form-control"> px
</div>
</div>
</div>
@ -399,8 +385,8 @@
<p>Please provide a link to a Markdown document.</p>
<div class="form-horizontal">
<div class="form-group">
<label class="col-lg-3 control-label" for="input-import-url">URL</label>
<div class="col-lg-8">
<label class="col-sm-3 control-label" for="input-import-url">URL</label>
<div class="col-sm-8">
<input type="text" id="input-import-url"
placeholder="http://www.abc.com/xyz.md" class="form-control">
</div>
@ -509,9 +495,9 @@
</p>
<div class="form-horizontal">
<div class="form-group">
<label class="col-lg-3 control-label"
<label class="col-sm-3 control-label"
for="input-sync-export-dropbox-path">File path</label>
<div class="col-lg-8">
<div class="col-sm-8">
<input type="text" id="input-sync-export-dropbox-path"
placeholder="/path/to/My Document.md" class="form-control">
<span class="help-block"> File path is composed of both
@ -590,8 +576,8 @@
<div class="modal-body">
<div class="form-horizontal">
<div class="form-group modal-publish-ssh">
<label class="col-lg-4 control-label" for="input-publish-ssh-host">Host</label>
<div class="col-lg-7">
<label class="col-sm-4 control-label" for="input-publish-ssh-host">Host</label>
<div class="col-sm-7">
<input type="text" id="input-publish-ssh-host"
placeholder="host.name.or.ip" class="form-control"> <span
class="help-block"> Host must be accessible publicly,
@ -602,57 +588,57 @@
</div>
</div>
<div class="form-group modal-publish-ssh">
<label class="col-lg-4 control-label" for="input-publish-ssh-port">Port
<label class="col-sm-4 control-label" for="input-publish-ssh-port">Port
(optional)</label>
<div class="col-lg-2">
<div class="col-sm-2">
<input type="text" id="input-publish-ssh-port" placeholder="22"
class="form-control">
</div>
</div>
<div class="form-group modal-publish-ssh">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-ssh-username">Username</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-ssh-username"
placeholder="username" class="form-control">
</div>
</div>
<div class="form-group modal-publish-ssh">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-ssh-password">Password</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="password" id="input-publish-ssh-password"
placeholder="password" class="form-control">
</div>
</div>
<div class="form-group modal-publish-github">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-github-reponame">Repository</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-github-reponame"
placeholder="repository-name" class="form-control">
</div>
</div>
<div class="form-group modal-publish-github">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-github-username">Username (optional)</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-github-username"
placeholder="username" class="form-control">
</div>
</div>
<div class="form-group modal-publish-github">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-github-branch">Branch</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-github-branch"
placeholder="branch-name" class="form-control">
</div>
</div>
<div class="form-group modal-publish-ssh modal-publish-github">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-file-path">File path</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-file-path"
placeholder="path/to/file.md" class="form-control">
<span class="help-block"> File path is composed of both
@ -660,24 +646,24 @@
</div>
</div>
<div class="form-group modal-publish-gist">
<label class="col-lg-4 control-label" for="input-publish-filename">Filename</label>
<div class="col-lg-7">
<label class="col-sm-4 control-label" for="input-publish-filename">Filename</label>
<div class="col-sm-7">
<input type="text" id="input-publish-filename"
placeholder="filename" class="form-control">
</div>
</div>
<div class="form-group modal-publish-gist">
<label class="col-lg-4 control-label" for="input-publish-gist-id">Existing
<label class="col-sm-4 control-label" for="input-publish-gist-id">Existing
ID (optional)</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-gist-id"
placeholder="GistID" class="form-control">
</div>
</div>
<div class="form-group modal-publish-gist">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-gist-public">Public</label>
<div class="col-lg-7">
<div class="col-sm-7">
<div class="checkbox">
<input type="checkbox" id="input-publish-gist-public"
checked="checked" />
@ -685,25 +671,25 @@
</div>
</div>
<div class="form-group modal-publish-blogger modal-publish-bloggerpage">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-blogger-url">Blog URL</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-blogger-url"
placeholder="http://exemple.blogger.com/" class="form-control">
</div>
</div>
<div class="form-group modal-publish-tumblr">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-tumblr-hostname">Blog hostname</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-tumblr-hostname"
placeholder="exemple.tumblr.com" class="form-control">
</div>
</div>
<div class="form-group modal-publish-wordpress">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-tumblr-hostname">WordPress site</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-wordpress-site"
placeholder="exemple.wordpress.com" class="form-control">
<span class="help-block"> <a target="_blank"
@ -714,26 +700,26 @@
</div>
<div
class="form-group modal-publish-blogger modal-publish-tumblr modal-publish-wordpress">
<label class="col-lg-4 control-label" for="input-publish-postid">Update
<label class="col-sm-4 control-label" for="input-publish-postid">Update
existing post ID (optional)</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-postid" placeholder="PostID"
class="form-control">
</div>
</div>
<div
class="form-group modal-publish-bloggerpage">
<label class="col-lg-4 control-label" for="input-publish-pageid">Update
<label class="col-sm-4 control-label" for="input-publish-pageid">Update
existing page ID (optional)</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-pageid" placeholder="PageID"
class="form-control">
</div>
</div>
<div class="form-group modal-publish-dropbox">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-dropbox-path">File path</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-dropbox-path"
placeholder="/path/to/My Document.html" class="form-control">
<span class="help-block"> File path is composed of both
@ -741,9 +727,9 @@
</div>
</div>
<div class="form-group modal-publish-gdrive">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-gdrive-fileid">File ID (optional)</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-gdrive-fileid"
placeholder="FileID" class="form-control"> <span
class="help-block">If no file ID is supplied, a new file
@ -752,10 +738,10 @@
</div>
</div>
<div class="form-group modal-publish-gdrive">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-publish-gdrive-filename">Force filename
(optional)</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-publish-gdrive-filename"
placeholder="Filename" class="form-control"> <span
class="help-block">If no file name is supplied, the
@ -764,8 +750,8 @@
</div>
<div class="form-group">
<label class="col-lg-4 control-label">Format</label>
<div class="col-lg-7">
<label class="col-sm-4 control-label">Format</label>
<div class="col-sm-7">
<div class="radio">
<label> <input type="radio" name="radio-publish-format"
value="markdown"> Markdown
@ -785,8 +771,8 @@
</div>
<div class="collapse publish-custom-template-collapse">
<div class="form-group">
<div class="col-lg-4"></div>
<div class="col-lg-7">
<div class="col-sm-4"></div>
<div class="col-sm-7">
<div class="checkbox">
<label> <input type="checkbox"
id="checkbox-publish-custom-template"> Custom template
@ -795,8 +781,8 @@
</div>
</div>
<div class="form-group">
<div class="col-lg-4"></div>
<div class="col-lg-7">
<div class="col-sm-4"></div>
<div class="col-sm-7">
<textarea class="form-control"
id="textarea-publish-custom-template"></textarea>
</div>
@ -927,8 +913,8 @@
<div class="tab-pane active" id="tabpane-settings-basic">
<div class="form-horizontal">
<div class="form-group">
<label class="col-lg-4 control-label">Layout orientation</label>
<div class="col-lg-7">
<label class="col-sm-4 control-label">Layout orientation</label>
<div class="col-sm-7">
<div class="radio">
<label> <input type="radio"
name="radio-layout-orientation" value="horizontal">
@ -944,15 +930,15 @@
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label" for="input-settings-theme">Theme</label>
<div class="col-lg-7">
<label class="col-sm-4 control-label" for="input-settings-theme">Theme</label>
<div class="col-sm-7">
<select id="input-settings-theme" class="form-control">
</select>
</div>
</div>
<div class="form-group">
<div class="col-lg-4"></div>
<div class="col-lg-7">
<div class="col-sm-4"></div>
<div class="col-sm-7">
<div class="checkbox">
<label>
<input type="checkbox" id="input-settings-markdown-extra" />
@ -962,8 +948,8 @@
</div>
</div>
<div class="form-group">
<div class="col-lg-4"></div>
<div class="col-lg-7">
<div class="col-sm-4"></div>
<div class="col-sm-7">
<div class="checkbox">
<label>
<input type="checkbox" id="input-settings-mathjax" />
@ -973,10 +959,10 @@
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-settings-gdrive-multiaccount">Google Drive multi-accounts</a>
</label>
<div class="col-lg-7">
<div class="col-sm-7">
<select id="input-settings-gdrive-multiaccount" class="form-control">
<option value="1">1 account</option>
<option value="2">2 accounts</option>
@ -990,8 +976,8 @@
<div class="tab-pane" id="tabpane-settings-advanced">
<div class="form-horizontal">
<div class="form-group">
<label class="col-lg-4 control-label">Mode</label>
<div class="col-lg-7">
<label class="col-sm-4 control-label">Mode</label>
<div class="col-sm-7">
<div class="radio">
<label> <input type="radio"
name="radio-settings-mode" value="_ace_">
@ -1013,69 +999,69 @@
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-settings-lazy-rendering">Lazy rendering <a
href="#" class="tooltip-lazy-rendering">(?)</a>
</label>
<div class="col-lg-7">
<div class="col-sm-7">
<div class="checkbox">
<input type="checkbox" id="input-settings-lazy-rendering" />
</div>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-settings-editor-font-family">Editor font</label>
<div class="col-lg-8 form-inline">
<div class="col-sm-8 form-inline">
<input type="text" id="input-settings-editor-font-family"
class="form-control col-lg-7"> <input type="text"
class="form-control col-sm-7"> <input type="text"
id="input-settings-editor-font-size"
class="form-control col-lg-2"> px <span
class="form-control col-sm-2"> px <span
class="help-block"> Only monospaced fonts are
supported.</span>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-settings-max-width">Max width</label>
<div class="col-lg-8 form-inline">
<div class="col-sm-8 form-inline">
<input type="text" id="input-settings-max-width"
class="form-control col-lg-3"> px
class="form-control col-sm-3"> px
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="textarea-settings-default-content">Default content
<a href="#" class="tooltip-default-content">(?)</a>
</label>
<div class="col-lg-7">
<div class="col-sm-7">
<textarea id="textarea-settings-default-content"
class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="textarea-settings-publish-template">Default
template <a href="#" class="tooltip-template">(?)</a>
</label>
<div class="col-lg-7">
<div class="col-sm-7">
<textarea id="textarea-settings-publish-template"
class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="textarea-settings-pdf-template">PDF
template <a href="#" class="tooltip-template">(?)</a>
</label>
<div class="col-lg-7">
<div class="col-sm-7">
<textarea id="textarea-settings-pdf-template"
class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label" for="input-settings-pdf-page-size">PDF page size</label>
<div class="col-lg-7">
<label class="col-sm-4 control-label" for="input-settings-pdf-page-size">PDF page size</label>
<div class="col-sm-7">
<select id="input-settings-pdf-page-size" class="form-control">
<option value="A3">A3</option>
<option value="A4">A4</option>
@ -1085,8 +1071,8 @@
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label">Permissions</label>
<div class="col-lg-7">
<label class="col-sm-4 control-label">Permissions</label>
<div class="col-sm-7">
<div class="checkbox">
<label>
<input type="checkbox" id="input-settings-gdrive-full-access" />
@ -1098,8 +1084,8 @@
</div>
</div>
<div class="form-group">
<div class="col-lg-4"></div>
<div class="col-lg-7">
<div class="col-sm-4"></div>
<div class="col-sm-7">
<div class="checkbox">
<label>
<input type="checkbox" id="input-settings-dropbox-full-access" />
@ -1110,8 +1096,8 @@
</div>
</div>
<div class="form-group">
<div class="col-lg-4"></div>
<div class="col-lg-7">
<div class="col-sm-4"></div>
<div class="col-sm-7">
<div class="checkbox">
<label>
<input type="checkbox" id="input-settings-github-full-access" />
@ -1123,17 +1109,17 @@
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-settings-publish-commit-msg">GitHub commit message</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-settings-publish-commit-msg"
class="form-control">
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
<label class="col-sm-4 control-label"
for="input-settings-ssh-proxy">SSH proxy</label>
<div class="col-lg-7">
<div class="col-sm-7">
<input type="text" id="input-settings-ssh-proxy"
class="form-control">
</div>