From 6fc5fa181a3230e15f536b0d4cd9c0460c949529 Mon Sep 17 00:00:00 2001 From: Zap <134786889+zapSNH@users.noreply.github.com> Date: Sat, 31 Aug 2024 13:39:29 +0800 Subject: [PATCH] Photonize review checker/shopping sidebar --- resources/content.css | 39 +++++++++++++++++++++++++++-- resources/icons.css | 9 ++++++- resources/icons/competitiveness.svg | 1 + resources/icons/packaging.svg | 1 + resources/icons/price.svg | 1 + resources/icons/quality.svg | 1 + resources/icons/shopping-open.svg | 1 + resources/icons/shopping.svg | 1 + resources/misc.css | 1 - resources/tabs-and-urlbar.css | 8 ++++++ 10 files changed, 59 insertions(+), 4 deletions(-) create mode 100644 resources/icons/competitiveness.svg create mode 100644 resources/icons/packaging.svg create mode 100644 resources/icons/price.svg create mode 100644 resources/icons/quality.svg create mode 100644 resources/icons/shopping-open.svg create mode 100644 resources/icons/shopping.svg diff --git a/resources/content.css b/resources/content.css index 4a52924..4c16a63 100644 --- a/resources/content.css +++ b/resources/content.css @@ -322,7 +322,7 @@ .chevron-icon { background-image: url("./icons/arrow-dropdown-16.svg") !important; scale: 1 -1; - .card-container:not([open]) & { + :is(.card-container, #shopping-details):not([open]) & { scale: 1; } } @@ -1511,7 +1511,6 @@ } /* debugging */ - @-moz-document url-prefix("about:debugging") { :root { --in-content-background-color: light-dark(#f9f9fa, #2a2a2e) !important; @@ -1527,6 +1526,42 @@ } } } +@-moz-document url-prefix("about:shoppingsidebar") { + :root { + --shopping-header-background: var(--in-content-page-background) !important; + } + * { + --shopping-card-border-radius: var(--photon-primary-border-radius) !important; + } + #close-button { + background-image: url(./icons/close.svg) !important; + } + .price { + content: url("./icons/price.svg") !important; + } + .quality { + content: url("./icons/quality.svg") !important; + } + .shipping { + content: url("./icons/shipping.svg") !important; + } + .competitiveness { + content: url("./icons/competitiveness.svg") !important; + } + .packaging\/appearance { + content: url("./icons/packaging.svg") !important; + } + @media (prefers-color-scheme: dark) { + .shopping-card { + background: var(--grey-60) !important; + --shopping-card-border-color: var(--in-content-box-border-color) !important; + } + .show-more footer { + background-color: var(--grey-60) !important;; + box-shadow: 2px -10px 11px var(--grey-60) !important;; + } + } +} /* Error page illustrations */ /* From Lepton https://github.com/black7375/Firefox-UI-Fix/blob/master/src/contents/_error_page.scss */ @-moz-document url-prefix("about:neterror"), url-prefix("about:restartrequired"), url("chrome://browser/content/aboutRestartRequired.xhtml"), url("about:sessionrestore"), url("chrome://browser/content/aboutSessionRestore.xhtml") diff --git a/resources/icons.css b/resources/icons.css index 536e6e4..fef5e17 100644 --- a/resources/icons.css +++ b/resources/icons.css @@ -306,7 +306,7 @@ list-style-image: url(./icons/home.svg) !important; } /* Reload button animation */ -/* from github.com/1280px/rainfox, check out the theme! */ +/* from github.com/1280px/rainfox, check out the theme! (maybe not since it's dead now lol) */ /* fixed version by me */ :root:not([customizing]) #stop-reload-button[animate] > #reload-button @@ -370,6 +370,13 @@ #reader-mode-button-icon { list-style-image: url(./icons/readerMode.svg) !important; } +/* review checker */ +#shopping-sidebar-button > .urlbar-icon { + list-style-image: url(./icons/shopping.svg) !important; + #shopping-sidebar-button[shoppingsidebaropen="true"] & { + list-style-image: url(./icons/shopping-open.svg) !important; + } +} #downloads-indicator-anchor { list-style-image: url(./icons/download-icons.svg#arrow-with-bar) !important; } diff --git a/resources/icons/competitiveness.svg b/resources/icons/competitiveness.svg new file mode 100644 index 0000000..1b71787 --- /dev/null +++ b/resources/icons/competitiveness.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/icons/packaging.svg b/resources/icons/packaging.svg new file mode 100644 index 0000000..291b9e4 --- /dev/null +++ b/resources/icons/packaging.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/icons/price.svg b/resources/icons/price.svg new file mode 100644 index 0000000..588a147 --- /dev/null +++ b/resources/icons/price.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/icons/quality.svg b/resources/icons/quality.svg new file mode 100644 index 0000000..c2b3f87 --- /dev/null +++ b/resources/icons/quality.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/icons/shopping-open.svg b/resources/icons/shopping-open.svg new file mode 100644 index 0000000..88bee29 --- /dev/null +++ b/resources/icons/shopping-open.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/icons/shopping.svg b/resources/icons/shopping.svg new file mode 100644 index 0000000..4dfcac8 --- /dev/null +++ b/resources/icons/shopping.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/misc.css b/resources/misc.css index 8d21a57..dc01566 100644 --- a/resources/misc.css +++ b/resources/misc.css @@ -29,7 +29,6 @@ } } } - @-moz-document url-prefix("chrome://global/content/commonDialog.xhtml") { :root { --in-content-primary-button-background: var(--photon-accent) !important; diff --git a/resources/tabs-and-urlbar.css b/resources/tabs-and-urlbar.css index ffc8480..928d14a 100644 --- a/resources/tabs-and-urlbar.css +++ b/resources/tabs-and-urlbar.css @@ -733,6 +733,11 @@ credits to phroton for some of this stuff */ #urlbar .search-one-offs *:not(toolbarseparator) { color: var(--toolbarbutton-icon-fill) !important; } +/* special case for review checker */ + +#shopping-sidebar-button[shoppingsidebaropen="true"] { + background-color: var(--urlbar-box-active-bgcolor); +} /* Multiselected tabs */ .tab-background[multiselected="true"] { outline: none !important; @@ -923,6 +928,9 @@ credits to phroton for some of this stuff */ --space-sidebar: var(--space-xxsmall); } } + #appcontent { + box-shadow: none !important; + } .sidebar-splitter { &:hover { background-color: var(--in-content-primary-button-background, var(--photon-accent)) !important;