mirror of
https://github.com/xiaoyifang/goldendict-ng.git
synced 2024-11-27 15:24:05 +00:00
Merge pull request #807 from shenlebantongying/custom_js_injectino
feat: add `article-script.js`
This commit is contained in:
commit
87358f73c6
|
@ -201,6 +201,12 @@ body { background: #242525; }
|
|||
</script>
|
||||
)";
|
||||
}
|
||||
|
||||
// load the `article-style.js` in user's config folder
|
||||
if ( auto userJsFile = Config::getUserJsFileName(); userJsFile.has_value() ) {
|
||||
result += fmt::format( FMT_COMPILE( R"(<script src="file://{}"></script>)" ), userJsFile.value() );
|
||||
}
|
||||
|
||||
result += "</head><body>";
|
||||
|
||||
return result;
|
||||
|
|
|
@ -2262,6 +2262,17 @@ QString getUserCssFileName()
|
|||
return getHomeDir().filePath( "article-style.css" );
|
||||
}
|
||||
|
||||
std::optional< std::string > getUserJsFileName()
|
||||
{
|
||||
QString userJsPath = getHomeDir().filePath( "article-script.js" );
|
||||
if ( QFileInfo::exists( userJsPath ) ) {
|
||||
return userJsPath.toStdString();
|
||||
}
|
||||
else {
|
||||
return std::nullopt;
|
||||
}
|
||||
}
|
||||
|
||||
QString getUserCssPrintFileName()
|
||||
{
|
||||
return getHomeDir().filePath( "article-style-print.css" );
|
||||
|
|
|
@ -14,6 +14,7 @@
|
|||
#include <QMetaType>
|
||||
#include "ex.hh"
|
||||
#include <QLocale>
|
||||
#include <optional>
|
||||
|
||||
/// GoldenDict's configuration
|
||||
namespace Config {
|
||||
|
@ -807,9 +808,12 @@ QString getHistoryFileName() ;
|
|||
/// Returns the filename of a favorities file.
|
||||
QString getFavoritiesFileName() ;
|
||||
|
||||
/// Returns the user .css file name.
|
||||
/// Returns the user .css file name (article-style.css).
|
||||
QString getUserCssFileName() ;
|
||||
|
||||
/// Returns the user .js file name (article-script.js).
|
||||
std::optional< std::string > getUserJsFileName();
|
||||
|
||||
/// Returns the user .css file name used for printing only.
|
||||
QString getUserCssPrintFileName() ;
|
||||
|
||||
|
|
|
@ -1,7 +1,18 @@
|
|||
# User defined stylesheets
|
||||
By creating `article-style.css` or `article-script.js` in GoldenDict's configuration folder (beside the `config` file), you can change dictionaries' presentation or inject javascript to dictionaries.
|
||||
|
||||
To change of dictionary articles presentation you can create the file with styles which will be used while articles output. Such file must be named `article-style.css` and placed in GoldenDict configuration folder beside the "config" file. The `article-style.css` is just style sheet file wrote in accordance with standard html style sheet rules. To see a class names used in articles you can call inspector via article context menu.
|
||||
The `article-style.css` is just standard HTML [Style Sheets](https://developer.mozilla.org/docs/Web/CSS). To know class or id names used in article, you can open inspector by right click article's body and click `Inspect (F12)`. The inspector's documentation can be found at [Chrome DevTools](https://developer.chrome.com/docs/devtools/)
|
||||
|
||||
Also you can tune GoldenDict interface. To make it you should create the `qt-style.css` style sheet file in GoldenDict configuration folder beside the "config" file. The rules for Qt style sheets you can find here.
|
||||
You can adjust dark reader mode's parameter by add those lines to `article-script.js`
|
||||
|
||||
The examples of "article-style.css" and "qt-style.css" files you can find in GoldenDict
|
||||
```javascript
|
||||
DarkReader.enable({
|
||||
brightness: 100,
|
||||
contrast: 100,
|
||||
sepia: 0,
|
||||
grayscale: 0,
|
||||
});
|
||||
```
|
||||
|
||||
Also, you can tune GoldenDict's interface by creating `qt-style.css` style sheet file in GoldenDict configuration folder. It is a [Qt Style Sheet](https://doc.qt.io/qt-6/stylesheet-reference.html) loaded during startup.
|
||||
|
||||
Samples of `article-style.css` and `qt-style.css` files can found in GoldenDict's source code at [/src/stylesheets](https://github.com/xiaoyifang/goldendict-ng/tree/staged/src/stylesheets)
|
||||
|
|
|
@ -38,7 +38,7 @@ nav:
|
|||
- Special Usages:
|
||||
- Anki Integration: topic_anki.md
|
||||
- Command Lines: topic_commandline.md
|
||||
- Custom Stylesheets: topic_userstyle.md
|
||||
- Custom Stylesheet & JavaScript: topic_userstyle.md
|
||||
- Portable Mode: topic_portablemode.md
|
||||
- Custom transliteration: topic_transliteration.md
|
||||
- Customize Dictionary Name: custom_dictionary_name.md
|
||||
|
|
Loading…
Reference in a new issue