corysanin/tubestation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bug 1853652 - Use image-set more in newtab. r=aminomancer

Browse Source 
Differential Revision: https://phabricator.services.mozilla.com/D188453
This commit is contained in:
Emilio Cobos Álvarez
2023-09-18 12:32:54 +00:00
parent 7dd63e216a
commit 790bac2054
5 changed files with 8 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
browser/components/newtab/content-src/components/DiscoveryStreamComponents/CardGrid/_CardGrid.scss
View File

@@ -111,12 +111,7 @@ $col4-header-font-size: 14;
}
.ds-onboarding-graphic {
background-image: url('chrome://activity-stream/content/data/content/assets/pocket-onboarding.avif');
@media (min-resolution: 2x) {
background-image: url('chrome://activity-stream/content/data/content/assets/pocket-onboarding@2x.avif');
}
background-image: image-set(url('chrome://activity-stream/content/data/content/assets/pocket-onboarding.avif'), url('chrome://activity-stream/content/data/content/assets/pocket-onboarding@2x.avif') 2x);
border-radius: 8px;
background-size: contain;
background-repeat: no-repeat;

6
browser/components/newtab/content-src/components/Search/_Search.scss
View File

@@ -26,12 +26,8 @@ $glyph-forward: url('chrome://browser/skin/forward.svg');
display: inline-block;
height: $logo-size;
width: $logo-size;
background: url('chrome://branding/content/about-logo.png') no-repeat center;
background: image-set(url('chrome://branding/content/about-logo.png'), url('chrome://branding/content/about-logo@2x.png') 2x) no-repeat center;
background-size: $logo-size;
@media (min-resolution: 2x) {
background-image: url('chrome://branding/content/about-logo@2x.png');
}
}
.wordmark {

14
browser/components/newtab/css/activity-stream-linux.css
View File

@@ -1183,14 +1183,9 @@ main.has-snippet {
display: inline-block;
height: 82px;
width: 82px;
background: url("chrome://branding/content/about-logo.png") no-repeat center;
background: image-set(url("chrome://branding/content/about-logo.png"), url("chrome://branding/content/about-logo@2x.png") 2x) no-repeat center;
background-size: 82px;
}
@media (min-resolution: 2x) {
.search-wrapper .logo-and-wordmark .logo {
background-image: url("chrome://branding/content/about-logo@2x.png");
}
}
.search-wrapper .logo-and-wordmark .wordmark {
background: url("chrome://branding/content/firefox-wordmark.svg") no-repeat center center;
background-size: 134px;
@@ -2726,7 +2721,7 @@ main.has-snippet {
}
}
.ds-onboarding-container .ds-onboarding-graphic {
background-image: url("chrome://activity-stream/content/data/content/assets/pocket-onboarding.avif");
background-image: image-set(url("chrome://activity-stream/content/data/content/assets/pocket-onboarding.avif"), url("chrome://activity-stream/content/data/content/assets/pocket-onboarding@2x.avif") 2x);
border-radius: 8px;
background-size: contain;
background-repeat: no-repeat;
@@ -2739,11 +2734,6 @@ main.has-snippet {
flex-shrink: 0;
display: none;
}
@media (min-resolution: 2x) {
.ds-onboarding-container .ds-onboarding-graphic {
background-image: url("chrome://activity-stream/content/data/content/assets/pocket-onboarding@2x.avif");
}
}
@media (min-width: 866px) {
.ds-onboarding-container .ds-onboarding-graphic {
display: block;

14
browser/components/newtab/css/activity-stream-mac.css
View File

@@ -1187,14 +1187,9 @@ main.has-snippet {
display: inline-block;
height: 82px;
width: 82px;
background: url("chrome://branding/content/about-logo.png") no-repeat center;
background: image-set(url("chrome://branding/content/about-logo.png"), url("chrome://branding/content/about-logo@2x.png") 2x) no-repeat center;
background-size: 82px;
}
@media (min-resolution: 2x) {
.search-wrapper .logo-and-wordmark .logo {
background-image: url("chrome://branding/content/about-logo@2x.png");
}
}
.search-wrapper .logo-and-wordmark .wordmark {
background: url("chrome://branding/content/firefox-wordmark.svg") no-repeat center center;
background-size: 134px;
@@ -2730,7 +2725,7 @@ main.has-snippet {
}
}
.ds-onboarding-container .ds-onboarding-graphic {
background-image: url("chrome://activity-stream/content/data/content/assets/pocket-onboarding.avif");
background-image: image-set(url("chrome://activity-stream/content/data/content/assets/pocket-onboarding.avif"), url("chrome://activity-stream/content/data/content/assets/pocket-onboarding@2x.avif") 2x);
border-radius: 8px;
background-size: contain;
background-repeat: no-repeat;
@@ -2743,11 +2738,6 @@ main.has-snippet {
flex-shrink: 0;
display: none;
}
@media (min-resolution: 2x) {
.ds-onboarding-container .ds-onboarding-graphic {
background-image: url("chrome://activity-stream/content/data/content/assets/pocket-onboarding@2x.avif");
}
}
@media (min-width: 866px) {
.ds-onboarding-container .ds-onboarding-graphic {
display: block;

14
browser/components/newtab/css/activity-stream-windows.css
View File

@@ -1183,14 +1183,9 @@ main.has-snippet {
display: inline-block;
height: 82px;
width: 82px;
background: url("chrome://branding/content/about-logo.png") no-repeat center;
background: image-set(url("chrome://branding/content/about-logo.png"), url("chrome://branding/content/about-logo@2x.png") 2x) no-repeat center;
background-size: 82px;
}
@media (min-resolution: 2x) {
.search-wrapper .logo-and-wordmark .logo {
background-image: url("chrome://branding/content/about-logo@2x.png");
}
}
.search-wrapper .logo-and-wordmark .wordmark {
background: url("chrome://branding/content/firefox-wordmark.svg") no-repeat center center;
background-size: 134px;
@@ -2726,7 +2721,7 @@ main.has-snippet {
}
}
.ds-onboarding-container .ds-onboarding-graphic {
background-image: url("chrome://activity-stream/content/data/content/assets/pocket-onboarding.avif");
background-image: image-set(url("chrome://activity-stream/content/data/content/assets/pocket-onboarding.avif"), url("chrome://activity-stream/content/data/content/assets/pocket-onboarding@2x.avif") 2x);
border-radius: 8px;
background-size: contain;
background-repeat: no-repeat;
@@ -2739,11 +2734,6 @@ main.has-snippet {
flex-shrink: 0;
display: none;
}
@media (min-resolution: 2x) {
.ds-onboarding-container .ds-onboarding-graphic {
background-image: url("chrome://activity-stream/content/data/content/assets/pocket-onboarding@2x.avif");
}
}
@media (min-width: 866px) {
.ds-onboarding-container .ds-onboarding-graphic {
display: block;