Skip to content
Permalink
Browse files
Full hi-DPI support (#786)
* Support retina screens

* Update menu assets

* Update active state of clipboard icon

* Update menu color

* Update small menu
  • Loading branch information
TheoChevalier committed Aug 1, 2016
1 parent 4be64e6 commit 0732efa82f1661715dbe230d55babd4946225b78
Showing 13 changed files with 33 additions and 16 deletions.
@@ -387,7 +387,7 @@ public static function resultsTable($search_object, $search_results, $page)
$target_string = '<em class="error">Warning: Empty string</em>';
} else {
$meta_target = "
<span class='clipboard' data-clipboard-target='#{$clipboard_target_string}' alt='Copy to clipboard'><img src='/img/copy_icon_black_18x18.png'></span>
<span class='clipboard' data-clipboard-target='#{$clipboard_target_string}' alt='Copy to clipboard'></span>
{$error_message}";
}

@@ -397,7 +397,7 @@ public static function resultsTable($search_object, $search_results, $page)
} elseif (! $target_string2) {
$target_string2 = '<em class="error">Warning: Empty string</em>';
} else {
$meta_target2 = "<span class='clipboard' data-clipboard-target='#{$clipboard_target_string2}' alt='Copy to clipboard'><img src='/img/copy_icon_black_18x18.png'></span>";
$meta_target2 = "<span class='clipboard' data-clipboard-target='#{$clipboard_target_string2}' alt='Copy to clipboard'></span>";
}

// Replace / and : in the key name and use it as an anchor name
@@ -75,7 +75,7 @@
} elseif (! $target_string2) {
$target_string2 = '<em class="error">Warning: Empty string</em>';
} else {
$meta_target2 = "<span class='clipboard' data-clipboard-target='#{$clipboard_target_string2}' alt='Copy to clipboard'><img src='/img/copy_icon_black_18x18.png'></span>";
$meta_target2 = "<span class='clipboard' data-clipboard-target='#{$clipboard_target_string2}' alt='Copy to clipboard'></span>";
}

$extra_column_rows = "
@@ -138,7 +138,7 @@
} else {
$meta_target = "
{$error_message}
<span class='clipboard' data-clipboard-target='#{$clipboard_target_string}' alt='Copy to clipboard'><img src='/img/copy_icon_black_18x18.png'></span>";
<span class='clipboard' data-clipboard-target='#{$clipboard_target_string}' alt='Copy to clipboard'></span>";
}

$table .= "
Deleted file not rendered
BIN -483 Bytes web/img/github.png
Deleted file not rendered
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN -726 Bytes (65%) web/img/menu.png 100644 → 100755
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN -4 Bytes (100%) web/img/menus.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Deleted file not rendered
Deleted file not rendered
@@ -3,7 +3,7 @@ $(document).ready(function() {
$('#links-top').slideToggle(transition, function(){
if ($('#links-top').is(':visible')) {
$('#links-top-button').attr('title', 'Hide Transvision Menu');
$('#links-top-button').css('background-position', '0 -38px');
$('#links-top-button').css('background-position', '0 -36px');
} else {
$('#links-top-button').attr('title', 'Display Transvision Menu');
$('#links-top-button').css('background-position', '0 0');
@@ -31,7 +31,8 @@
padding-left: 30px;
display: block;
height: 28px;
background: url(/img/github.png) top left no-repeat transparent;
background: url(/img/github.svg) top left no-repeat transparent;
background-size: 24px;
padding-top: 3px;
}

@@ -71,7 +71,7 @@ body {

#main-wrapper {
background-color: #cce0f0;
border-top: 1px solid #fff;
border-top: 2px solid #fff;
padding-bottom: 0.5em;
flex: 1;
-ms-flex: 1 0 0;
@@ -277,11 +277,20 @@ h3 {
display: block;
float: right;
margin-right: 5px;
width: 125px;
width: 147px;
height: 36px;
background: url(/img/menu.png) center 0 no-repeat transparent;
}

@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
#links-top-button {
background: url(/img/menu_highres.png) center 0 no-repeat transparent;
background-size: 147px 72px;
}
}

.nojs #links-top-button {
background-position: 0 -38px;
}
@@ -709,7 +718,8 @@ input[type="checkbox"]:disabled + label {
min-height: 18px;
min-width: 18px;
cursor: pointer;
background: url(/img/swap_icon_horiz_18x18.png) center no-repeat transparent;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24"><path style="fill: rgb(51,51,51)" d="M6.99 11L3 15l3.99 4v-3H14v-2H6.99v-3zM21 9l-3.99-4v3H10v2h7.01v3L21 9z"/></svg>') center no-repeat transparent;
fill: #fff;
}

#search_field_container {
@@ -1127,7 +1137,7 @@ input[type="checkbox"]:disabled + label {
}

#links-top-button {
width: 100px;
width: 114px;
background: url(/img/menus.png) top center no-repeat transparent;
}

@@ -1210,9 +1220,10 @@ input[type="checkbox"]:disabled + label {
#main_search fieldset#locale_switch {
margin: 0;
padding: 0 0 0 14.5em;
background: url(/img/swap_icon_vert_18x18.png) center no-repeat transparent;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24"><path style="fill: rgb(51,51,51)" d="M16 17.01V10h-2v7.01h-3L15 21l4-3.99h-3zM9 3L5 6.99h3V14h2V6.99h3L9 3z"/></svg>') center no-repeat transparent;
}


#main_search fieldset#locale_switch img {
display: block;
}
@@ -1241,11 +1252,18 @@ input[type="checkbox"]:disabled + label {
/* Tooltips for copy-pasting of strings */
.clipboard {
float: right;
width: 18px;
height: 18px;
font-size: 200%;
color: #000;
cursor: pointer;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24"><path style="fill: rgb(51,51,51)" d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>') center no-repeat transparent;
}

.clipboard:active {
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24"><path style="fill: rgb(0,149,221)" d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>') center no-repeat transparent;
}


@media only screen and (max-width: 850px) {
.clipboard img {
position: relative;
@@ -1254,10 +1272,6 @@ input[type="checkbox"]:disabled + label {
}
}

.clipboard:active {
background: #90ee90;
}

.tooltip {
position: relative;
}

0 comments on commit 0732efa

Please sign in to comment.