Replaced OHIF Logo PNG with SVG

This commit is contained in:
Erik Ziegler 2016-08-10 11:39:26 +02:00
parent 2dbeea31a0
commit 77de389bb8
7 changed files with 35 additions and 199 deletions

View File

@ -2,7 +2,9 @@
<div class="topBar noselect {{#if onStudyList}}studyList{{/if}}">
<div class="clearfix p-x-1 p-t-1">
<a class="brandSection pull-left" href="http://ohif.org">
<img class="logoImage" src="/images/logo.png">
<svg class="logoImage">
<use xlink:href="/packages/viewerbase/assets/icons.svg#icon-ohif-logo"></use>
</svg>
<div class="logoText">
Open Health Imaging Foundation
</div>

View File

@ -2,9 +2,10 @@
$expandedHeight = 160px
img.logoImage
.logoImage
display: inline-block
height: 100%
float: left
.topBar
height: $topBarHeight
@ -17,14 +18,16 @@ img.logoImage
display: inline-block
text-decoration: none
img.logoImage
margin: 0 5px
.logoImage
margin: 0 8px
width: 30px
.logoText
display: inline-block
font-family: $logoFontFamily
font-weight: $logoFontWeight
color: $textPrimaryColor
line-height: 30px
.studyListLinkSection
border-left: $uiBorderThickness solid $uiBorderColor;
@ -51,8 +54,9 @@ img.logoImage
padding-left: 50px
line-height: $expandedHeight
img.logoImage
margin: 5px 5px 15px 5px
.logoImage
width: 50px
margin: 0 20px
.logoText
font-size: 30px

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

View File

@ -1,187 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<symbol id="icon-hud" viewBox="0 0 20 22">
<title>
HUD
</title>
<g id="icon-hud-group" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
<path id="icon-hud-dashes" d="m14.5,2.75 2,0 a2.5 2.5 0 0 1 2.5 2.5 l0,13.25 a2.5 2.5 0 0 1 -2.5 2.5 l-11.5,0 a2.5 2.5 0 0 1 -2.5 -2.5 l0,-1" stroke-dasharray="1,3" />
<path id="icon-hud-box" d="m0.5,2 0,14 a1.5 1.5 0 0 0 1.5 1.5 l12,0 a1.5 1.5 0 0 0 1.5 -1.5 l0,-14" />
<path id="icon-hud-top" d="m2,2 12,0" stroke-width="4" />
<path id="icon-hud-paralel" d="m4.4,7.5 7.2,0 m0,3 -7.2,0 m0,3 7.2,0" stroke-linecap="square" />
</g>
</symbol>
<symbol id="icon-measurements-additional" viewBox="0 0 16 16">
<title>
Additional Measurements
</title>
<g id="icon-measurements-additional-group" stroke="none">
<path id="icon-measurements-additional-boxes" d="M11,2 l1.85,-1.85 a1 1 0 0 1 1,0 l2,2 a1 1 0 0 1 0,1 l-1.85,1.85Z M10,3 l-10,10 0,3 3,0 10,-10Z M16,16 l0,-2 -9,0 -2,2Z" />
</g>
</symbol>
<symbol id="icon-measurements-lesions" viewBox="0 0 18 10">
<title>
Lesions
</title>
<g id="icon-measurements-lesions-group" stroke="none">
<path id="icon-measurements-lesions-boxes" d="M0,0 2,0 2,2 0,2Z M4,0 18,0 18,2 4,2Z M0,4 2,4 2,6 0,6Z M4,4 18,4 18,6 4,6Z M0,8 2,8 2,10 0,10Z M4,8 18,8 18,10 4,10Z" />
</g>
</symbol>
<symbol id="icon-settings" viewBox="0 0 15 15">
<title>
Settings
</title>
<path d="M12.85 8.25C12.85 8.03 12.93 7.8 12.93 7.5 12.93 7.2 12.93 6.98 12.85 6.75L14.43 5.48C14.58 5.33 14.58 5.18 14.5 5.03L13 2.4C12.93 2.33 12.78 2.25 12.55 2.33L10.68 3.08C10.3 2.78 9.85 2.55 9.4 2.33L9.1 0.38C9.18 0.15 8.95 0 8.8 0L5.8 0C5.65 0 5.43 0.15 5.43 0.3L5.13 2.33C4.68 2.48 4.3 2.78 3.85 3.08L2.05 2.33C1.83 2.25 1.68 2.33 1.53 2.48L0.03 5.1C-0.05 5.18 0.03 5.4 0.18 5.55L1.75 6.75C1.75 6.98 1.68 7.2 1.68 7.5 1.68 7.8 1.68 8.03 1.75 8.25L0.18 9.53C0.03 9.68 0.03 9.82 0.1 9.98L1.6 12.6C1.68 12.68 1.83 12.75 2.05 12.68L3.93 11.93C4.3 12.23 4.75 12.45 5.2 12.68L5.5 14.63C5.5 14.78 5.65 14.93 5.88 14.93L8.88 14.93C9.03 14.93 9.25 14.78 9.25 14.63L9.55 12.68C10 12.45 10.45 12.23 10.83 11.93L12.7 12.68C12.85 12.75 13.08 12.68 13.15 12.53L14.65 9.9C14.73 9.75 14.73 9.53 14.58 9.45L12.85 8.25 12.85 8.25ZM7.3 10.13C5.88 10.13 4.68 8.93 4.68 7.5 4.68 6.08 5.88 4.88 7.3 4.88 8.73 4.88 9.93 6.08 9.93 7.5 9.93 8.93 8.73 10.13 7.3 10.13L7.3 10.13Z" id="Shape"/>
</symbol>
<symbol id="icon-status-complete" viewBox="0 0 27 27">
<title>
Complete
</title>
<g id="icon-status-complete-group" stroke="none">
<path id="icon-status-complete-circle" d="M13.5,0 a13.5 13.5 0 0 1 0 27 a13.5 13.5 0 0 1 0 -27 M23,8 l-2,-2 -10,10, -5,-5 -2,2 7,7Z" />
</g>
</symbol>
<symbol id="icon-status-lock" viewBox="0 0 16 21">
<title>
Locked
</title>
<path d="M14 7L13 7 13 5C13 2.2 10.8 0 8 0 5.2 0 3 2.2 3 5L3 7 2 7C0.9 7 0 7.9 0 9L0 19C0 20.1 0.9 21 2 21L14 21C15.1 21 16 20.1 16 19L16 9C16 7.9 15.1 7 14 7L14 7ZM11.1 7L4.9 7 4.9 5C4.9 3.3 6.3 1.9 8 1.9 9.7 1.9 11.1 3.3 11.1 5L11.1 7 11.1 7Z"/>
</symbol>
<symbol id="icon-studies" viewBox="0 0 15 13">
<title>
Studies
</title>
<g id="icon-studies-group" stroke="none">
<path id="icon-studies-boxes" d="M0,0 7,0 7,6 0,6Z M8,0 15,0 15,6 8,6Z M0,7 7,7 7,13 0,13Z M8,7 15,7 15,13 8,13Z" />
</g>
</symbol>
<symbol id="icon-tools-levels" viewBox="0 0 18 18">
<title>
Window / Level
</title>
<g id="icon-tools-levels-group">
<path id="icon-tools-levels-path" d="M14.5,3.5 a1 1 0 0 1 -11,11 Z" stroke="none" opacity="0.8" />
<circle id="icon-tools-levels-circle" cx="9" cy="9" r="8" fill="none" stroke-width="2" />
</g>
</symbol>
<symbol id="icon-tools-link" viewBox="0 0 23 15">
<title>
Link
</title>
<g id="icon-tools-link-group" stroke="none">
<circle id="icon-tools-link-circle-l" opacity="0.8" cx="7.5" cy="7.5" r="7.5" />
<circle id="icon-tools-link-circle-r" opacity="0.6" cx="15.5" cy="7.5" r="7.5" />
</g>
</symbol>
<symbol id="icon-tools-measure-non-target" viewBox="0 0 24 24">
<title>
Non-Target Measurement
</title>
<g id="icon-tools-measure-non-target-group" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
<circle id="icon-tools-measure-non-target-circle" cx="6.5" cy="6.5" r="6" />
<path id="icon-tools-measure-non-target-plus" d="M6.5,3 l0,7 M3,6.5 l7,0"></path>
<path id="icon-tools-measure-non-target-arrow" d="M23,7 l-15,15 M7,17 l0,6 6,0" stroke-width="2" />
</g>
</symbol>
<symbol id="icon-tools-measure-target" viewBox="0 0 26 26">
<title>
Target Measurement
</title>
<g id="icon-tools-measure-target-group" stroke-width="0">
<path id="icon-tools-measure-target-ruler" d="m9.5,26 2,-2 -1.5,-1.5 0.5,-0.5 1.5,1.5 1.5,-1.5 -2.5,-2.5 0.5,-0.5 2.5,2.5 1.5,-1.5 -1.5,-1.5 0.5,-0.5 1.5,1.5 1.5,-1.5 -2.5,-2.5 0.5,-0.5 2.5,2.5 1.5,-1.5 -1.5,-1.5 0.5,-0.5 1.5,1.5 1.5,-1.5 -2.5,-2.5 0.5,-0.5 2.5,2.5 1.5,-1.5 -1.5,-1.5 0.5,-0.5 1.5,1.5 2,-2 -4,-4 a2 2 0 0 0 -2.5 0 l-14 14 a2 2 0 0 0 0 2.5 l4,4 Z" />
<path id="icon-tools-measure-target-plus" d="m6,0 a6 6 0 0 1 0 12 a6 6 0 0 1 0 -12 m0.5,3 a0.5 0.5 0 0 0 -1 0 l0,2.5 -2.5,0 a0.5 0.5 0 0 0 0 1 l2.5,0 0,2.5 a0.5 0.5 0 0 0 1 0 l0,-2.5 2.5,0 a0.5 0.5 0 0 0 0 -1 l-2.5,0 z" />
</g>
</symbol>
<symbol id="icon-tools-measure-temp" viewBox="0 0 24 24">
<title>
Temporary Measurement
</title>
<g id="icon-tools-measure-temp-group" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
<circle id="icon-tools-measure-temp-circle" cx="6.5" cy="6.5" r="6" />
<path id="icon-tools-measure-temp-plus" d="M6.5,3 l0,7 M3,6.5 l7,0"></path>
<path id="icon-tools-measure-temp-dashes" d="m22.5,6 -16.5,16.5" stroke-width="3" stroke-dasharray="0.6666,5" />
</g>
</symbol>
<symbol id="icon-tools-more" viewBox="0 0 18 18">
<title>
More
</title>
<g id="icon-tools-more-group" stroke="none">
<path id="icon-tools-more-circle" d="M9,0 a9 9 0 0 1 0 18 a9 9 0 0 1 0 -18 M4.5,8 a1.5 1.5 0 0 0 0 3 a1.5 1.5 0 0 0 0 -3 M9,8 a1.5 1.5 0 0 0 0 3 a1.5 1.5 0 0 0 0 -3 M13.5,8 a1.5 1.5 0 0 0 0 3 a1.5 1.5 0 0 0 0 -3" />
</g>
</symbol>
<symbol id="icon-tools-pan" viewBox="0 0 18 18">
<title>
Pan
</title>
<g id="icon-tools-pan-group" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path id="icon-tools-pan-line-v" d="M9,1 L9,17"></path>
<path id="icon-tools-pan-line-h" d="M1,9 L17,9"></path>
<polyline id="icon-tools-pan-caret-t" points="7 3 9 1 11 3"></polyline>
<polyline id="icon-tools-pan-caret-r" points="15 11 17 9 15 7"></polyline>
<polyline id="icon-tools-pan-caret-b" points="11 15 9 17 7 15"></polyline>
<polyline id="icon-tools-pan-caret-l" points="3 7 1 9 3 11"></polyline>
</g>
</symbol>
<symbol id="icon-tools-zoom" viewBox="0 0 17 17">
<title>
Zoom
</title>
<g id="icon-tools-zoom-group" fill="none" stroke-width="2" stroke-linecap="round">
<path id="icon-tools-zoom-path" d="m11.5,11.5 4.5,4.5" />
<circle id="icon-tools-zoom-circle" cx="7" cy="7" r="6" />
</g>
</symbol>
<symbol id="icon-trial-info" viewBox="0 0 20 20">
<title>
Trial Information
</title>
<g id="icon-trial-info-group" fill="none" stroke-width="2">
<path id="icon-trial-info-circle" d="M10,1 a9 9 0 0 1 0 18 a9 9 0 0 1 0 -18 M10,5 l0,2 m0,2 0,6" />
</g>
</symbol>
<symbol id="icon-ui-accordion-expand" viewBox="0 0 12 8">
<title>
Expand
</title>
<polygon transform="translate(6.000000, 3.700000) rotate(-270.000000) translate(-6.000000, -3.700000) " points="3.7 -2.3 2.3 -0.9 6.9 3.7 2.3 8.3 3.7 9.7 9.7 3.7"/>
</symbol>
<symbol id="icon-ui-add" viewBox="0 0 12 13">
<title>
Add
</title>
<path d="M6.5 7L6.5 12C6.5 12.28 6.28 12.5 6 12.5 5.72 12.5 5.5 12.28 5.5 12L5.5 7 0.5 7C0.22 7 0 6.78 0 6.5 0 6.22 0.22 6 0.5 6L5.5 6 5.5 1C5.5 0.72 5.72 0.5 6 0.5 6.28 0.5 6.5 0.72 6.5 1L6.5 6 11.5 6C11.78 6 12 6.22 12 6.5 12 6.78 11.78 7 11.5 7L6.5 7Z" id="Combined-Shape"/>
</symbol>
<symbol id="icon-ui-close" viewBox="0 0 14 14">
<title>
Close
</title>
<g id="icon-ui-close-group" stroke-width="1.75">
<path id="icon-ui-close-path" d="M1,1 13,13 M1,13 13,1" />
</g>
</symbol>
<symbol id="icon-create-comment" viewBox="0 0 37 34">
<title>
Comment
</title>
<path fill="#94a8b3" d="M22.32 14L35 14C36.1 14 37 14.9 37 16L37 28C37 29.1 36.1 30 35 30L21 30 17 34 17 20.39C19.45 18.97 21.36 16.71 22.32 14Z" id="Combined-Shape"/>
<path d="M10 0C4.5 0 0 4.5 0 10 0 15.5 4.5 20 10 20 15.5 20 20 15.5 20 10 20 4.5 15.5 0 10 0L10 0ZM15 11L11 11 11 15 9 15 9 11 5 11 5 9 9 9 9 5 11 5 11 9 15 9 15 11 15 11Z" id="Shape"/>
</symbol>
<symbol id="icon-create-screen-capture" viewBox="0 0 37 35">
<title>
Capture Screen
</title>
<g id="camera-alt" transform="translate(17.000000, 17.000000)" fill="#94a8b3">
<path d="M10 13C11.66 13 13 11.66 13 10 13 8.34 11.66 7 10 7 8.34 7 7 8.34 7 10 7 11.66 8.34 13 10 13Z" id="Oval"/>
<path d="M7 0L5.2 2 2 2C0.9 2 0 2.9 0 4L0 16C0 17.1 0.9 18 2 18L18 18C19.1 18 20 17.1 20 16L20 4C20 2.9 19.1 2 18 2L14.8 2 13 0 7 0 7 0ZM10 15C7.2 15 5 12.8 5 10 5 7.2 7.2 5 10 5 12.8 5 15 7.2 15 10 15 12.8 12.8 15 10 15L10 15Z" id="Shape"/>
</g>
<path d="M10 0C4.5 0 0 4.5 0 10 0 15.5 4.5 20 10 20 15.5 20 20 15.5 20 10 20 4.5 15.5 0 10 0L10 0ZM15 11L11 11 11 15 9 15 9 11 5 11 5 9 9 9 9 5 11 5 11 9 15 9 15 11 15 11Z" id="Shape"/>
</symbol>
<symbol id="icon-ui-warning" viewBox="0 0 22 20">
<title>
Warning
</title>
<g id="icon-ui-warning-group" stroke="none">
<path d="m11,0 11,20 -22,0Z m1,7 -2,0 0,6 2,0Z m0,8 -2,0 0,2 2,0Z" />
</g>
</symbol>
</svg>

Before

Width:  |  Height:  |  Size: 9.9 KiB

View File

@ -2,7 +2,9 @@
<div class="topBar noselect {{#if onStudyList}}studyList{{/if}}">
<div class="clearfix p-x-1 p-t-1">
<a class="brandSection pull-left" href="http://ohif.org">
<img class="logoImage" src="/images/logo.png">
<svg class="logoImage">
<use xlink:href="/packages/viewerbase/assets/icons.svg#icon-ohif-logo"></use>
</svg>
<div class="logoText">
Open Health Imaging Foundation
</div>

View File

@ -2,9 +2,10 @@
$expandedHeight = 160px
img.logoImage
.logoImage
display: inline-block
height: 100%
float: left
.topBar
height: $topBarHeight
@ -17,14 +18,16 @@ img.logoImage
display: inline-block
text-decoration: none
img.logoImage
margin: 0 5px
.logoImage
margin: 0 8px
width: 30px
.logoText
display: inline-block
font-family: $logoFontFamily
font-weight: $logoFontWeight
color: $textPrimaryColor
line-height: 30px
.studyListLinkSection
border-left: $uiBorderThickness solid $uiBorderColor;
@ -51,8 +54,9 @@ img.logoImage
padding-left: 50px
line-height: $expandedHeight
img.logoImage
margin: 5px 5px 15px 5px
.logoImage
width: 50px
margin: 0 20px
.logoText
font-size: 30px

View File

@ -184,4 +184,15 @@
<path d="m11,0 11,20 -22,0Z m1,7 -2,0 0,6 2,0Z m0,8 -2,0 0,2 2,0Z" />
</g>
</symbol>
<symbol id="icon-ohif-logo" viewBox="0 0 47 47">
<title>
Open Health Imaging Foundation
</title>
<g id="icon-ohif-logo" stroke="#fff" stroke-width="2.5" stroke-miterlimit="10">
<rect x="1.25" y="1.25" width="18.8" height="18.8" rx="1" ry="1"/>
<rect x="26" y="1.25" width="18.8" height="18.8" rx="1" ry="1"/>
<rect x="1.25" y="26" width="18.8" height="18.8" rx="1" ry="1"/>
<rect x="26" y="26" width="18.8" height="18.8" rx="1" ry="1"/></svg>
</g>
</symbol>
</svg>

Before

Width:  |  Height:  |  Size: 9.9 KiB

After

Width:  |  Height:  |  Size: 10 KiB