Skip to content

Commit

Permalink
Some enhancements to the logo and how it resizes
Browse files Browse the repository at this point in the history
  • Loading branch information
misterGF committed May 22, 2017
1 parent d9dd4ee commit 70ef8c9
Show file tree
Hide file tree
Showing 2 changed files with 43 additions and 42 deletions.
71 changes: 36 additions & 35 deletions src/components/Dash.vue
Original file line number Diff line number Diff line change
@@ -1,16 +1,9 @@
<template>
<div :class="['wrapper', classes]">
<header class="main-header">
<a href="/" class="logo">
<!-- mini logo for sidebar mini 40x50 pixels -->
<span class="logo-mini"><img src="/static/img/copilot-logo-white.svg" alt="Logo" class="img-responsive center-block"></span>
<!-- logo for regular state and mobile devices -->
<div class="logo-lg">
<img src="/static/img/copilot-logo-white.svg" alt="Logo" class="img-responsive">
<span>CoPilot</span>
</div>
</a>

<span class="logo-mini">
<a href="/"><img src="/static/img/copilot-logo-white.svg" alt="Logo" class="img-responsive center-block logo"></a>
</span>
<!-- Header Navbar -->
<nav class="navbar navbar-static-top" role="navigation">
<!-- Sidebar toggle button-->
Expand All @@ -31,12 +24,14 @@
<li v-if="userInfo.messages.length > 0">
<!-- inner menu: contains the messages -->
<ul class="menu">
<li><!-- start message -->
<li>
<!-- start message -->
<a href="javascript:;">
<!-- Message title and timestamp -->
<h4>
Support Team
<small><i class="fa fa-clock-o"></i> 5 mins</small>
<small>
<i class="fa fa-clock-o"></i> 5 mins</small>
</h4>
<!-- The message -->
<p>Why not consider this a test message?</p>
Expand All @@ -46,11 +41,13 @@
</ul>
<!-- /.menu -->
</li>
<li class="footer" v-if="userInfo.messages.length > 0"><a href="javascript:;">See All Messages</a></li>
<li class="footer" v-if="userInfo.messages.length > 0">
<a href="javascript:;">See All Messages</a>
</li>
</ul>
</li>
<!-- /.messages-menu -->

<!-- Notifications Menu -->
<li class="dropdown notifications-menu">
<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown">
Expand All @@ -62,30 +59,34 @@
<li v-if="userInfo.notifications.length > 0">
<!-- Inner Menu: contains the notifications -->
<ul class="menu">
<li><!-- start notification -->
<li>
<!-- start notification -->
<a href="javascript:;">
<i class="fa fa-users text-aqua"></i> 5 new members joined today
</a>
</li>
<!-- end notification -->
</ul>
</li>
<li class="footer" v-if="userInfo.notifications.length > 0"><a href="javascript:;">View all</a></li>
<li class="footer" v-if="userInfo.notifications.length > 0">
<a href="javascript:;">View all</a>
</li>
</ul>
</li>

<!-- Tasks Menu -->
<li class="dropdown tasks-menu">
<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-flag-o"></i>
<span class="label label-danger">{{ userInfo.tasks | count }} </span>
</a>
<ul class="dropdown-menu">
<li class="header">You have {{ userInfo.tasks | count }} task(s)</li>
<li class="header">You have {{ userInfo.tasks | count }} task(s)</li>
<li v-if="userInfo.tasks.length > 0">
<!-- Inner menu: contains the tasks -->
<ul class="menu">
<li><!-- Task item -->
<li>
<!-- Task item -->
<a href="javascript:;">
<!-- Task title and progress text -->
<h3>
Expand All @@ -95,12 +96,7 @@
<!-- The progress bar -->
<div class="progress xs">
<!-- Change the css width attribute to simulate progress -->
<div class="progress-bar progress-bar-aqua"
style="width: 20%"
role="progressbar"
aria-valuenow="20"
aria-valuemin="0"
aria-valuemax="100">
<div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
<span class="sr-only">20% Complete</span>
</div>
</div>
Expand All @@ -114,7 +110,7 @@
</li>
</ul>
</li>

<!-- User Account Menu -->
<li class="dropdown user user-menu">
<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown">
Expand All @@ -129,9 +125,8 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<sidebar :display-name="demo.displayName"
:picture-url="demo.avatar" />

<sidebar :display-name="demo.displayName" :picture-url="demo.avatar" />

<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
Expand All @@ -141,18 +136,22 @@
<small>{{ $route.meta.description }}</small>
</h1>
<ol class="breadcrumb">
<li><a href="javascript:;"><i class="fa fa-home"></i>Home</a></li>
<li>
<a href="javascript:;">
<i class="fa fa-home"></i>Home</a>
</li>
<li class="active">{{$route.name.toUpperCase()}}</li>
</ol>
</section>

<router-view></router-view>
</div>
<!-- /.content-wrapper -->

<!-- Main Footer -->
<footer class="main-footer">
<strong>Copyright &copy; {{year}} <a href="javascript:;">CoPilot</a>.</strong> All rights reserved.
<strong>Copyright &copy; {{year}}
<a href="javascript:;">CoPilot</a>.</strong> All rights reserved.
</footer>
</div>
<!-- ./wrapper -->
Expand Down Expand Up @@ -227,11 +226,12 @@ export default {
}
}
.logo-mini, .logo-lg {
.logo-mini,
.logo-lg {
text-align: left;
img {
padding: .4em;
padding: .4em !important;
}
}
Expand All @@ -241,6 +241,7 @@ export default {
width: 25%;
}
}
.user-panel {
height: 4em;
}
Expand Down
14 changes: 7 additions & 7 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -3583,11 +3583,11 @@ karma-phantomjs-launcher@^1.0.2:
lodash "^4.0.1"
phantomjs-prebuilt "^2.1.7"

karma-sinon-chai@^1.2.4:
version "1.3.1"
resolved "https://registry.yarnpkg.com/karma-sinon-chai/-/karma-sinon-chai-1.3.1.tgz#4633419494d9e2d848787dd76053031859f5b7f5"
[email protected]:
version "1.2.4"
resolved "https://registry.yarnpkg.com/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz#fea935f62be3366cf0271c8d8be51c0c70e40abc"
dependencies:
lolex "^1.6.0"
lolex "^1.5.0"

karma-sourcemap-loader@^0.3.7:
version "0.3.7"
Expand Down Expand Up @@ -3894,7 +3894,7 @@ [email protected]:
version "1.3.2"
resolved "https://registry.yarnpkg.com/lolex/-/lolex-1.3.2.tgz#7c3da62ffcb30f0f5a80a2566ca24e45d8a01f31"

lolex@^1.5.2, lolex@^1.6.0:
lolex@^1.5.0, lolex@^1.5.2:
version "1.6.0"
resolved "https://registry.yarnpkg.com/lolex/-/lolex-1.6.0.tgz#3a9a0283452a47d7439e72731b9e07d7386e49f6"

Expand Down Expand Up @@ -5831,7 +5831,7 @@ strip-json-comments@~2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"

[email protected]:
[email protected], supports-color@^3.1.0:
version "3.1.2"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-3.1.2.tgz#72a262894d9d408b956ca05ff37b2ed8a6e2a2d5"
dependencies:
Expand All @@ -5841,7 +5841,7 @@ supports-color@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"

supports-color@^3.1.0, supports-color@^3.2.3:
supports-color@^3.2.3:
version "3.2.3"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-3.2.3.tgz#65ac0504b3954171d8a64946b2ae3cbb8a5f54f6"
dependencies:
Expand Down

0 comments on commit 70ef8c9

Please sign in to comment.