Skip to content

Commit

Permalink
new design for navbar; add icomoon
Browse files Browse the repository at this point in the history
  • Loading branch information
nconrad committed May 7, 2015
1 parent 3128258 commit 01291f2
Show file tree
Hide file tree
Showing 20 changed files with 964 additions and 35 deletions.
1 change: 1 addition & 0 deletions Gruntfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ module.exports = function(grunt) {
js: {
files: ['**/*.js',
'**/*.html',
'**/*.css',
'!node_modules/**',
'!lib/ui-common/**',

Expand Down
3 changes: 2 additions & 1 deletion app/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,8 @@ angular.module('ModelSEED',
}).state('app.publicModels', {
url: "/models/",
templateUrl: 'app/views/public-models.html',
controller: 'Public'
controller: 'Public',
authenticate: true
}).state('app.modelEditor', {
url: "/model-editor/",
templateUrl: 'app/views/editor/model-editor.html',
Expand Down
24 changes: 18 additions & 6 deletions app/views/app.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,36 +13,48 @@
<a class="navbar-brand" ui-sref="home">
ModelSEED
</a>
<div class="label label-danger label-beta">alpha</div>


</div>

<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-top-links">
<li ng-class="{ active: $state.includes('app.biochem') }">
<a ui-sref="app.biochem">Biochemistry</a>
<a ui-sref="app.biochem">
<i class="icon-benzene"></i>
Biochemistry
</a>
</li>
<li ng-class="{ active: $state.includes('app.reconstruct') }">
<a ui-sref="app.reconstruct">Reconstruct</a>
<a ui-sref="app.reconstruct">
<i class="icon-tools-2"></i>
Reconstruct
</a>
</li>
<!--<li ng-class="{ active: $state.includes('app.myModels') }">
<a ui-sref="app.myModels">My Models</a>
</li>-->
<li ng-class="{ active: $state.includes('app.publicModels') }">
<a ui-sref="app.publicModels">Public</a>
<a ui-sref="app.publicModels">
<i class="icon-earth"></i>
Public
</a>
</li>
<!--<li ng-class="{ active: $state.includes('app.modelEditor')}" >
<a ui-sref="app.modelEditor">Model Editor</a>
</li>-->
<li ng-class="{ active: $state.includes('app.compare')}" >
<a ui-sref="app.compare">Analysis
<a ui-sref="app.compare">
<i class="icon-lab"></i>
Analysis
<span class="model-count" ng-controller="ModelCount">({{MV.models.length}})</span>
</a>
</li>
</ul>


<ul class="nav navbar-nav navbar-top-links pull-right">

<ul class="nav navbar-nav pull-right">
<li class="dropdown">
<!--<a class="dropdown-toggle" data-toggle="dropdown">Help
<i class="fa fa-caret-down"></i>
Expand Down
2 changes: 1 addition & 1 deletion app/views/home.html
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#page-top" du-smooth-scroll>ModelSEED</a>
<a class="navbar-brand brand-home" href="#page-top" du-smooth-scroll>ModelSEED</a>
<span class="label label-danger label-beta">alpha</span>
</div>

Expand Down
60 changes: 50 additions & 10 deletions css/core.css
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,13 @@
position: absolute;
}

.navbar-header .label-beta {
margin-top: 10px;
}
.navbar-header {
position: relative;

}
.label-alpha {
font-size: 10px;
}

:focus {
outline: none !important;
Expand Down Expand Up @@ -58,12 +61,34 @@
}

.navbar-nav {
margin: 0 0 0 50px;
margin-left: 15px;
}

.navbar-default .navbar-nav>li>a {
color: #fff;
font-weight: 300;
color: #fff;
font-weight: 300;
}

.navbar-default .navbar-top-links > li > a{
padding: 0;
font-size: 8pt;
line-height: 1.1em;
margin: 0 7px;
text-align: center;
}
.navbar-default .navbar-top-links > li i {
display: inline-block;
padding-top: 8px;
font-size: 30px;
text-align: center;
}

.icon-benzene {
font-weight: 600;
}

.icon-tools-2 {
font-weight: 600;
}

.navbar-default .navbar-nav>li>a:hover {
Expand All @@ -79,13 +104,23 @@


.navbar-brand {
padding-right: 5px;
padding-left: 20px;
padding-right: 37px;
color: #fff !important;
background-color: #444;
}
.navbar-brand:hover {
color: #dfdfdf !important; /*overrides*/
background-color: #444 !important;
}
.brand-home {
background-color: transparent;
}
.navbar-brand:hover {
color: #f2f2f2 !important;
background-color: transparent !important;
}


.sidebar {
z-index: 3000;
color: #fff;
Expand All @@ -112,10 +147,15 @@
}

.sidebar-collapse {
color: #444 !important;
float: left;
height: 50px;
padding: 15px 15px;
font-size: 18px;
line-height: 20px;

}
.sidebar-collapse:hover {
color: #555 !important;
color: #dfdfdf;
}

.nav .open>a {
Expand Down
5 changes: 5 additions & 0 deletions icomoon/Read Me.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
Open *demo.html* to see a list of all the glyphs in your font along with their codes/ligatures.

You won't need any of the files located under the *demo-files* directory when including the generated font in your own projects.

You can import *selection.json* back to the IcoMoon app using the *Import Icons* button (or via Main Menu > Manage Projects) to retrieve your icon selection.
162 changes: 162 additions & 0 deletions icomoon/demo-files/demo.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,162 @@
body {
padding: 0;
margin: 0;
font-family: sans-serif;
font-size: 1em;
line-height: 1.5;
color: #555;
background: #fff;
}
h1 {
font-size: 1.5em;
font-weight: normal;
}
small {
font-size: .66666667em;
}
a {
color: #e74c3c;
text-decoration: none;
}
a:hover, a:focus {
box-shadow: 0 1px #e74c3c;
}
.bshadow0, input {
box-shadow: inset 0 -2px #e7e7e7;
}
input:hover {
box-shadow: inset 0 -2px #ccc;
}
input, fieldset {
font-size: 1em;
margin: 0;
padding: 0;
border: 0;
}
input {
color: inherit;
line-height: 1.5;
height: 1.5em;
padding: .25em 0;
}
input:focus {
outline: none;
box-shadow: inset 0 -2px #449fdb;
}
.glyph {
font-size: 16px;
width: 15em;
padding-bottom: 1em;
margin-right: 4em;
margin-bottom: 1em;
float: left;
overflow: hidden;
}
.liga {
width: 80%;
width: calc(100% - 2.5em);
}
.talign-right {
text-align: right;
}
.talign-center {
text-align: center;
}
.bgc1 {
background: #f1f1f1;
}
.fgc1 {
color: #999;
}
.fgc0 {
color: #000;
}
p {
margin-top: 1em;
margin-bottom: 1em;
}
.mvm {
margin-top: .75em;
margin-bottom: .75em;
}
.mtn {
margin-top: 0;
}
.mtl, .mal {
margin-top: 1.5em;
}
.mbl, .mal {
margin-bottom: 1.5em;
}
.mal, .mhl {
margin-left: 1.5em;
margin-right: 1.5em;
}
.mhmm {
margin-left: 1em;
margin-right: 1em;
}
.mls {
margin-left: .25em;
}
.ptl {
padding-top: 1.5em;
}
.pbs, .pvs {
padding-bottom: .25em;
}
.pvs, .pts {
padding-top: .25em;
}
.unit {
float: left;
}
.unitRight {
float: right;
}
.size1of2 {
width: 50%;
}
.size1of1 {
width: 100%;
}
.clearfix:before, .clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.hidden-true {
display: none;
}
.textbox0 {
width: 3em;
background: #f1f1f1;
padding: .25em .5em;
line-height: 1.5;
height: 1.5em;
}
#testDrive {
display: block;
padding-top: 24px;
line-height: 1.5;
}
.fs0 {
font-size: 16px;
}
.fs1 {
font-size: 28px;
}
.fs2 {
font-size: 32px;
}
.fs3 {
font-size: 32px;
}
.fs4 {
font-size: 20px;
}
.fs5 {
font-size: 32px;
}
30 changes: 30 additions & 0 deletions icomoon/demo-files/demo.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
if (!('boxShadow' in document.body.style)) {
document.body.setAttribute('class', 'noBoxShadow');
}

document.body.addEventListener("click", function(e) {
var target = e.target;
if (target.tagName === "INPUT" &&
target.getAttribute('class').indexOf('liga') === -1) {
target.select();
}
});

(function() {
var fontSize = document.getElementById('fontSize'),
testDrive = document.getElementById('testDrive'),
testText = document.getElementById('testText');
function updateTest() {
testDrive.innerHTML = testText.value || String.fromCharCode(160);
if (window.icomoonLiga) {
window.icomoonLiga(testDrive);
}
}
function updateSize() {
testDrive.style.fontSize = fontSize.value + 'px';
}
fontSize.addEventListener('change', updateSize, false);
testText.addEventListener('input', updateTest, false);
testText.addEventListener('change', updateTest, false);
updateSize();
}());
Loading

0 comments on commit 01291f2

Please sign in to comment.