This documentation is only applicable to version 2.10.1 and 2.10.2 of Page Shadow
The filter rules are used to fix the display of websites when the Increase page contrast and/or Invert the colors features are enabled. The fixes can relate to the disabling of the modification of the style of an element (background color, color of texts or links, inversion of the color) or the fact of forcing a style on an element. These rules make it possible, for example, to correct the display of certain elements that don't appear. You can write your own filter rules. If you have some knowledge of HTML/CSS, it's pretty straightforward. In a filter file, only one rule per line is possible.
You can use the extension's internal editor (Filters > Edit my filter) which has the appropriate syntax highlighting and which automatically auto-completes the rules you write.
The syntax of a filter is of the following form:
Each part of the filter is divided by a character
| (vertical bar).
The first part of the rule (websiteOrPage) indicates the website/web page on which the filter should be applied. This part can be of the following form:
www.eliastiksofts.com(these two domains are treated separately)
*eliastiksofts.com/en/*matches all the pages of the Eliastik's Softs website in English version
/(.*)google.(.*)recaptcha(.*)/match Google ReCaptcha
This part of the filter corresponds to the rule itself. There are several different rules that are recognized by the extension:
disableContrastFor: completely disables the Increase page contrast feature for one or more elements
forceTransparentBackground: forces a transparent background for one or more elements
disableBackgroundStylingFor: disables the background coloring by the Increase page contrast feature for one or more elements
disableTextColorStylingFor: disables the coloring of texts by the Increase page contrast feature for one or more elements
disableInputBorderStylingFor: disables the coloring of the borders of form fields by the Increase page contrast feature for one or more elements
disableLinkStylingFor: disables the coloring of links by the Increase page contrast feature for one or more elements
disableFontFamilyStylingFor: disables the modification of the font (custom themes) by the Increase page contrast features for one or more elements
disableElementInvertFor: disables the inversion of colors by the function Invert the colors for one or more elements
hasBackgroundImg: tells Page Shadow that one or more elements have a background image
forceCustomLinkColorFor: forces the modification of the color of the links by the feature Increase page contrast for one or more elements
forceCustomBackgroundColorFor: forces the modification of the background color by the feature Increase page contrast for one or more elements
forceCustomTextColorFor: forces the modification of the color of the texts by the feature Increase page contrast for one or more elements
disableShadowRootsCustomStyle: forces the disabling of the Shadow Roots styles by the Increase page contrast function for one or more elements
forceCustomVisitedLinkColor: forces the modification of the color of the visited links for one or more elements
disableCustomVisitedLinkColor: disables the modification of the color of visited links for one or more elements
forceFontFamilyStylingFor: forces custom font from custom themes for one or more elements
forceInputBorderStylingFor: forces the display of a border for one or more form fields
forceCustomLinkColorAsBackground: sets the background color of one or more elements to that of the links color from the theme
forceCustomTextColorAsBackground: sets the background color of one or more elements to that of the texts color from the theme
forceCustomLinkVisitedColorAsBackground: sets the background color of one or more elements to that of the visited links color from the theme
forceDisableDefaultBackgroundColor: forces the default background color of one or more elements to be disabled, to be used as a last resort
forceDisableDefaultBackground: forces the default background of one or more elements to be disabled, to be used as a last resort
forceDisableDefaultFontColor: forces the default font for one or more elements to be disabled, to be used as a last resort
enablePseudoElementsStyling: enables the modification of the style of CSS pseudo-elements :after and :before by the extension for one or more elements, disabled by default
overrideShadowRootsCustomStyle: same rule as disableShadowRootsCustomStyle
invertElementAsImage: enable colors invert of one or more elements as an image
invertElementAsVideo: enable colors invert of one or more elements as a video
invertElementAsBackground: enable colors invert of one or more elements as a background image
enableSelectiveInvert: enable selective invert of one or more elements
enablePseudoElementSelectiveInvert: enable selective invert of one or more pseudo-elements
invertPseudoElement: enable colors invert of one or more pseudo-elements
These rules change the way Page Shadow works internally. They allow you to enable or disable certain features.
enablePerformanceMode: activates performance mode for the website or webpage. This rule doesn't require a CSS selector. This is equivalent to disabling background image detection and enabling the disableTransparentBackgroundAutoDetect, disableMutationObserversForSubChilds, disableMutationObserverAttributes, disableMutationObserverClass, disableMutationObserverStyle, and disableShadowRootStyleOverride rules. This can therefore cause display problems on some websites with the Increase page contrast feature (which can be compensated for with the standard rules on poorly displayed elements).
disablePerformanceMode: disables performance mode for the website or webpage. Rule intended to be combined with the rule
enablePerformanceModefor example to enable performance mode for the whole website and to disable it for some pages.
disableTransparentBackgroundAutoDetect: disables automatic detection of transparent backgrounds, doesn't improve performance when disabled alone
enableTransparentBackgroundAutoDetect: enables automatic detection of transparent backgrounds (this feature is enabled by default)
opacityDetectedAsTransparentThreshold: sets the limit for which the automatic detection of transparent backgrounds treats an opacity as being a transparent background (by default any opacity less than or equal to 0.1 is treated as a transparent background)
enableMutationObserversForSubChilds: when enabled, the extension will loop through all the sub-elements of an element added to the page (enabled by default)
disableMutationObserversForSubChilds: disables browsing of all sub-elements of an element added to the page, may improve performance but may cause display issues
enableMutationObserverAttributes: enables the detection of attribute mutations (style or class in HTML), enabled by default
disableMutationObserverAttributes: disablesthe detection of attribute mutations, may improve performance
enableMutationObserverClass: enables the detection of mutations of the HTML class attribute (disabled by default)
disableMutationObserverClass: disables detection of HTML class attribute mutations, may improve performance
enableMutationObserverStyle: enables the detection of mutations of the HTML style attribute (enabled by default)
disableMutationObserverStyle: disables mutations detection of HTML style attribute, may improve performance
enableShadowRootStyleOverride: enables overriding of the default styles of Shadow Roots elements (enabled by default)
disableShadowRootStyleOverride: disables overriding of default styles of Shadow Roots elements, may improve performance on websites that use this feature
shadowRootStyleOverrideDelay: set the delay (by default 100 ms) necessary before analyzing an element which contains a Shadow Root to improve their detection, setting a delay less than or equal to 0 disables this feature
enableThrottleMutationObserverBackgrounds: enables the throttle of the processing of Mutation Observers, considerably improves performance. Disabled by default
disableThrottleMutationObserverBackgrounds: disables the throttle of the processing of Mutation Observers
delayMutationObserverBackgrounds: delay in ms applied to processing of Mutation Observers when the enableThrottleMutationObserverBackgrounds rule is enabled. Default to 0, which means that mutations are processed as soon as possible
enableAutoThrottleMutationObserverBackgrounds: automatically enables the throttle of the processing of Mutation Observers when needed: when a large number of mutations are processed (configurable by the filter rule autoThrottleMutationObserverBackgroundsTreshold), and disables again when this is no longer needed. Enabled by default.
disableAutoThrottleMutationObserverBackgrounds: disables the automatic throttle option for Mutation Observers
autoThrottleMutationObserverBackgroundsTreshold: threshold of the number of Mutation Observers processed before automatic throttle is enabled, by default 75
throttledMutationObserverTreatedByCall: number of mutations to process on each call, default to 50. A large number reduces performance
delayApplyMutationObserversSafeTimer: delay before reapplying Page Shadow settings after detection by Mutation Observers
disableObserveBodyChange: observes the state change of the body element (deletion then creation of a new body element). Fixes issues with some websites (like Github) or SPA applications. Disabling this option may improve performance
observeBodyChangeTimerInterval: observing the state change of the body element relies on a timer that runs at a given interval (instead of using Mutation Observers). The interval is in ms
disableBrightColorDetection: detect element with bright color, and if enabled by the user, disable the Increase contrast function for these elements. Disabling this option may improve performance
brightColorLightnessTresholdMin: if an element has a lightness value that is above this treshold but lower than the maximum, the element will be detected as bright color element
brightColorLightnessTresholdMax: if an element has a lightness value that is lower than this treshold but above the minimum, the element will be detected as bright color element
disableThrottleBackgroundDetection: applies a delay to the detection of backgrounds on page load, which can improve performance on large pages
throttleBackgroundDetectionElementsTreatedByCall: sets the number of elements processed by each loop call when background detection is throttled. A high value can impact performance
backgroundDetectionStartDelay: apply a delay before applying background detection of the elements. By default 1 ms.
useBackgroundDetectionAlreadyProcessedNodes: use an already processed elements list for background detection to avoid re-processing elements. May increase performance but may increase memory usage.
It's possible to indicate several rules of the same type by separating them with a comma. The name of the rules is case sensitive.
This part of the filter contains the CSS selector corresponding to the elements on which to apply the filter. You can specify multiple selectors by separating them with a comma. If the selector is not valid, the rule will be ignored. The CSS selector is processed by the function document.querySelectorAll within the extension code. For the full list of available CSS selectors, visit the MDN documentation.
This part of the filter is not needed for special rules (except for some rules like opacityDetectedAsTransparentThreshold, shadowRootStyleOverrideDelay, delayMutationObserverBackgrounds, autoThrottleMutationObserverBackgroundsTreshold, throttledMutationObserverTreatedByCall, delayApplyMutationObserversSafeTimer, observeBodyChangeTimerInterval, brightColorLightnessTresholdMin, brightColorLightnessTresholdMax and throttleBackgroundDetectionElementsTreatedByCall). The shadowRootStyleOverrideDelay special rule also requires an additional parameter (the delay in ms).
This filter is used to correct the display of Google ReCaptchas when the Increase page contrast feature is enabled. It disables the function for some elements that were hidden.
/(.*)google.(.*)recaptcha(.*)/|disableContrastFor|.rc-imageselect-checkbox,.rc-imageselect-checkbox *,.rc-button-default,.rc-button-default *,.rc-imageselect-candidates,.rc-imageselect-candidates *,.rc-imageselect-desc,.rc-imageselect-desc *
It's possible to create a complete filter file. For this, it's necessary that the file begins with the following code which contains the metadata of the filter file:
#! Page Shadow Filter 1.0 #! Name: Filter title #! Homepage: https://www.filterhomepage.com #! Sourcename: Website source name (website name or other) #! Version: Filter version #! License: License #! Expires: Number of days for the user-side filter cache to expire, followed by an automatic update #! Description: Filter description
You must then write a filter rule per line.