diff --git a/src/contents/_activity_stream.scss b/src/contents/_activity_stream.scss index 8734a34..d4ac910 100644 --- a/src/contents/_activity_stream.scss +++ b/src/contents/_activity_stream.scss @@ -1,6 +1,6 @@ @-moz-document url("about:home"), url("about:newtab") { /** Activity Stream - Search Focus Border: like URL *************************/ - @include Option("userContent.newTab.field_border") { + @include Option("userContent.page.field_border") { /* At DarkMode, Color */ body[style*="--newtab-background-color:rgba(28, 27, 34, 1);"], body[style*="--newtab-background-color:rgba(42, 42, 46, 1);"], @@ -69,9 +69,11 @@ .search-wrapper input:focus { transition: border-color 0.5s var(--animation-easing-function), box-shadow 1s var(--animation-easing-function); } - .search-wrapper .search-inner-wrapper:hover input { - border-color: var(--newtab-primary-action-background) !important; - transition: border-color 0.5s var(--animation-easing-function); + @include Option("userContent.page.field_border") { + .search-wrapper .search-inner-wrapper:hover input { + border-color: var(--newtab-primary-action-background) !important; + transition: border-color 0.5s var(--animation-easing-function); + } } } } diff --git a/src/contents/_proton_contents.scss b/src/contents/_proton_contents.scss index 3da52b3..95df40b 100644 --- a/src/contents/_proton_contents.scss +++ b/src/contents/_proton_contents.scss @@ -1,6 +1,13 @@ /*= Common contents ==========================================================*/ @import "proton_contents/proton_commons"; +/*= Field Border =============================================================*/ +@include Option("userContent.page.field_border") { + @include Animate { + @import "proton_contents/field_border"; + } +} + /*= View Source ==============================================================*/ @import "proton_contents/view_source"; diff --git a/src/contents/proton_contents/_field_border.scss b/src/contents/proton_contents/_field_border.scss new file mode 100644 index 0000000..65877e0 --- /dev/null +++ b/src/contents/proton_contents/_field_border.scss @@ -0,0 +1,12 @@ +@-moz-document url-prefix("about:") { + xul|search-textbox:hover { + border-color: var(--in-content-focus-outline-color) !important; + transition: border-color 0.5s var(--animation-easing-function); + } +} +@-moz-document url-prefix("about:config") { + #about-config-search:hover { + border-color: var(--in-content-focus-outline-color) !important; + transition: border-color 0.5s var(--animation-easing-function); + } +} diff --git a/userContent.css b/userContent.css index 5039125..3e1b740 100644 --- a/userContent.css +++ b/userContent.css @@ -259,7 +259,7 @@ /** Activity Stream ***********************************************************/ @-moz-document url("about:home"), url("about:newtab") { /** Activity Stream - Search Focus Border: like URL *************************/ - @supports -moz-bool-pref("userContent.newTab.field_border") { + @supports -moz-bool-pref("userContent.page.field_border") { /* At DarkMode, Color */ body[style*="--newtab-background-color:rgba(28, 27, 34, 1);"], body[style*="--newtab-background-color:rgba(42, 42, 46, 1);"], @@ -332,9 +332,11 @@ transition: border-color 0.5s var(--animation-easing-function), box-shadow 1s var(--animation-easing-function); } - .search-wrapper .search-inner-wrapper:hover input { - border-color: var(--newtab-primary-action-background) !important; - transition: border-color 0.5s var(--animation-easing-function); + @supports -moz-bool-pref("userContent.page.field_border") { + .search-wrapper .search-inner-wrapper:hover input { + border-color: var(--newtab-primary-action-background) !important; + transition: border-color 0.5s var(--animation-easing-function); + } } } } @@ -1630,6 +1632,23 @@ color: var(--in-content-table-header-color) !important; } } + /*= Field Border =============================================================*/ + @supports -moz-bool-pref("userContent.page.field_border") { + @media (prefers-reduced-motion: no-preference) { + @-moz-document url-prefix("about:") { + xul|search-textbox:hover { + border-color: var(--in-content-focus-outline-color) !important; + transition: border-color 0.5s var(--animation-easing-function); + } + } + @-moz-document url-prefix("about:config") { + #about-config-search:hover { + border-color: var(--in-content-focus-outline-color) !important; + transition: border-color 0.5s var(--animation-easing-function); + } + } + } + } /*= View Source ==============================================================*/ @-moz-document url-prefix("view-source") { :root {