Skip to content

Commit

Permalink
improved typography / bootstrap fix / menu changes
Browse files Browse the repository at this point in the history
  • Loading branch information
apollonian committed Mar 5, 2017
1 parent be65afc commit 4b4f515
Show file tree
Hide file tree
Showing 5 changed files with 34 additions and 50 deletions.
6 changes: 3 additions & 3 deletions cm/lib/codemirror.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@
height: 320px;
color: black;
font-size: 14px;
line-height: 20px;
font-family: 'Source Code Pro';
font-weight: 600;
line-height: 24px;
font-family: 'Source Code Pro', 'Roboto Mono', 'Courier New', 'Courier', monospace;
font-weight: 400;
}


Expand Down
4 changes: 2 additions & 2 deletions cm/theme/base16-ocean-dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
.cm-s-base16-ocean-dark div.CodeMirror-selected {background: #343d46 !important;}
.cm-s-base16-ocean-dark .CodeMirror-gutters {background: #2b303b; border-right: 0px;}
.cm-s-base16-ocean-dark .CodeMirror-linenumber {color: #65737e;}
.cm-s-base16-ocean-dark .CodeMirror-cursor {border-left: 1px solid #a7adba !important;}
.cm-s-base16-ocean-dark .CodeMirror-cursor {border-left: 2px solid #a7adba !important;}

.cm-s-base16-ocean-dark span.cm-comment {color: #ab7967;}
.cm-s-base16-ocean-dark span.cm-atom {color: #b48ead;}
Expand All @@ -15,7 +15,7 @@
.cm-s-base16-ocean-dark span.cm-variable {color: #a3be8c;}
.cm-s-base16-ocean-dark span.cm-variable-2 {color: #8fa1b3;}
.cm-s-base16-ocean-dark span.cm-def {color: #d08770;}
.cm-s-base16-ocean-dark span.cm-error {background: #bf616a; color: #a7adba;}
.cm-s-base16-ocean-dark span.cm-error {background: rgba(191, 97, 106, 0.3); color: #a7adba;}
.cm-s-base16-ocean-dark span.cm-bracket {color: #dfe1e8;}
.cm-s-base16-ocean-dark span.cm-tag {color: #bf616a;}
.cm-s-base16-ocean-dark span.cm-link {color: #b48ead;}
Expand Down
6 changes: 0 additions & 6 deletions css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -253,12 +253,6 @@ li.dropdown {
z-index: 1;
}

.result-viewport body {
margin: 0;
border: 0;
padding: 0;
}


/* output: iframe element*/

Expand Down
42 changes: 14 additions & 28 deletions editor.js
Original file line number Diff line number Diff line change
Expand Up @@ -131,7 +131,9 @@ onload = function () {
lineNumbers: true,
lineWrapping: true,
autofocus: true,
indentWithTabs: true,
indentWithTabs: false,
indentUnit: 2,
smartIndent: true,
scrollbarStyle: 'overlay',
theme: 'base16-ocean-dark'
})
Expand All @@ -143,9 +145,9 @@ onload = function () {
},
lineNumbers: true,
lineWrapping: true,
indentWithTabs: true,
// Having issues with smartIndent. Therfore, turned off.
smartIndent: false,
indentWithTabs: false,
indentUnit: 2,
smartIndent: true,
scrollbarStyle: 'overlay',
theme: 'base16-ocean-dark'
})
Expand All @@ -158,7 +160,9 @@ onload = function () {
},
lineNumbers: true,
lineWrapping: true,
indentWithTabs: true,
indentWithTabs: false,
indentUnit: 2,
smartIndent: true,
scrollbarStyle: 'overlay',
theme: 'base16-ocean-dark'
})
Expand Down Expand Up @@ -214,7 +218,7 @@ onresize = function () {
}

function paint () {
output.srcdoc = '<html>' + '<head>' + getSty() + '<style>' + css.getValue() + '</style>' + '</head>' + '<body>' + html.getValue() + getScr() + '<script>' + js.getValue() + '</script>' + '</body>' + '</html>'
output.srcdoc = '<html>' + '<head>' + getSty() + '<style>' + 'body{margin:0;border:0;padding:0}' + css.getValue() + '</style>' + '</head>' + '<body>' + html.getValue() + getScr() + '<script>' + js.getValue() + '</script>' + '</body>' + '</html>'
console.log(output.srcdoc)
}

Expand All @@ -230,7 +234,7 @@ function addScript () {
var jsMenu = document.getElementById('js-menu')
var jsButtons = jsMenu.getElementsByTagName('a')
let jsSpan = jsMenu.querySelectorAll('span')
var ScrFlags = [0, 0, 0, 0, 0]
var ScrFlags = [0, 0, 0, 0]
jsButtons[0].addEventListener('click', function (e) {
toggleStatus(0, jsSpan)
if (ScrFlags[0] === 0) {
Expand All @@ -249,7 +253,7 @@ function addScript () {
ScrFlags[2] = 1
console.log('jQuery added!')
}
if (ScrFlags[1] === 1) {
if (ScrFlags[2] === 1) {
var bootjsStr = "</script><script src='lib/bootstrap.min.js'></script>"
scripts += bootjsStr
ScrFlags[1] = 1
Expand All @@ -268,18 +272,9 @@ function addScript () {
jsButtons[3].addEventListener('click', function (e) {
toggleStatus(3, jsSpan)
if (ScrFlags[3] === 0) {
var js3Str = "<script src='lib/materialize.js'></script>"
scripts += js3Str
ScrFlags[3] = 1
console.log('Materialize.js added!')
}
})
jsButtons[4].addEventListener('click', function (e) {
toggleStatus(4, jsSpan)
if (ScrFlags[4] === 0) {
var js3Str = "<script src='lib/three.min.js'></script>"
scripts += js3Str
ScrFlags[4] = 1
ScrFlags[3] = 1
console.log('Three.js added!')
}
})
Expand All @@ -289,7 +284,7 @@ function addStyle () {
var cssMenu = document.getElementById('css-menu')
var cssButtons = cssMenu.getElementsByTagName('a')
let cssSpan = cssMenu.querySelectorAll('span')
var StyFlags = [0, 0, 0, 0]
var StyFlags = [0, 0, 0]
cssButtons[0].addEventListener('click', function (e) {
toggleStatus(0, cssSpan)
if (StyFlags[0] === 0) {
Expand Down Expand Up @@ -317,13 +312,4 @@ function addStyle () {
console.log('Font Awesome added!')
}
})
cssButtons[3].addEventListener('click', function (e) {
toggleStatus(3, cssSpan)
if (StyFlags[3] === 0) {
var matStr = "<link href='lib/materialize.min.css'>"
styles += matStr
StyFlags[3] = 1
console.log('Materialize added!')
}
})
};
26 changes: 15 additions & 11 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -27,19 +27,25 @@
<ul class="dropdown-content">
<li><a href="#" id="new" class="submenu-item" title="Open a new window">New Window<span class="shortcut">Ctrl+N</span></a></li>
<li><a href="#" id="save" class="submenu-item disabled" title="Save this snippet - Coming Soon">Save<span class="shortcut">Ctrl+S</span></a></li>
<li><a href="#" id="run" class="submenu-item disabled" title="Run in default browser - Coming Soon">Run in Browser<span class="shortcut">F5</span></a></li>
<li><a href="#" id="prefs" class="submenu-item disabled" title="Editor settings and themes - Coming Soon">Preferences<span class="shortcut">Ctrl+P</span></a></li>
<li><a href="#" id="close-window" class="submenu-item" title="Close this window">Close Window<span class="shortcut">Ctrl+W</span></a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="menu-item">Edit</a>
<ul class="dropdown-content">
<li><a href="#" id="undo" class="submenu-item">Undo<span class="shortcut">Ctrl+Z</span></a></li>
<li><a href="#" id="redo" class="submenu-item">Redo<span class="shortcut">Ctrl+Y</span></a></li>
<li><a href="#" id="cut" class="submenu-item">Cut<span class="shortcut">Ctrl+X</span></a></li>
<li><a href="#" id="copy" class="submenu-item">Copy<span class="shortcut">Ctrl+C</span></a></li>
<li><a href="#" id="paste" class="submenu-item">Paste<span class="shortcut">Ctrl+V</span></a></li>
<li><a href="#" id="undo" class="submenu-item disabled">Undo<span class="shortcut">Ctrl+Z</span></a></li>
<li><a href="#" id="redo" class="submenu-item disabled">Redo<span class="shortcut">Ctrl+Y</span></a></li>
<li><a href="#" id="cut" class="submenu-item disabled">Cut<span class="shortcut">Ctrl+X</span></a></li>
<li><a href="#" id="copy" class="submenu-item disabled">Copy<span class="shortcut">Ctrl+C</span></a></li>
<li><a href="#" id="paste" class="submenu-item disabled">Paste<span class="shortcut">Ctrl+V</span></a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="menu-item">View</a>
<ul class="dropdown-content">
<li><a href="#" id="run" class="submenu-item disabled" title="Run in default browser - Coming Soon">Run in Browser<span class="shortcut">F5</span></a></li>
<li><a href="#" id="full" class="submenu-item disabled" title="View output in fullscreen - Coming Soon">Full Screen Output<span class="shortcut">F9</span></a></li>
</ul>
</li>
<li class="dropdown">
Expand All @@ -54,20 +60,18 @@
<li class="dropdown">
<a href="#" class="menu-item" style="color: #F2672E;">+CSS</a>
<ul id="css-menu" class="dropdown-content">
<li><a href="#" class="submenu-item">+Animate<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+Animate.css<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+Bootstrap<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+Font Awesome<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+Materialize<span class="status"></span></a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="menu-item" style="color: #F1BE24;">+JS</a>
<ul id="js-menu" class="dropdown-content">
<li><a href="#" class="submenu-item">+Anime<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+anime.js<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+Bootstrap<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+jQuery<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+Materialize<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+Three<span class="status"></span></a></li>
<li><a href="#" class="submenu-item">+three.js<span class="status"></span></a></li>
</ul>
</li>
</ul>
Expand Down

0 comments on commit 4b4f515

Please sign in to comment.