AO3Boxicons

Reusable library that initialized the boxicons css and serves functions to turn stats and menus into icons

Mint 2024.06.19.. Lásd a legutóbbi verzió

Ezt a szkriptet nem ajánlott közvetlenül telepíteni. Ez egy könyvtár más szkriptek számára, amik tartalmazzák a // @require https://updategf.qytechs.cn/scripts/497064/1397186/AO3Boxicons.js hivatkozást.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

Fejlesztő
genusslicht
Verzió
1.1
Létrehozva
2024.06.04.
Frissítve
2024.06.19.
Size
20 KB
Licensz
MIT

Basic Usage

  • Create a new User Script
  • add @required Tag with the newest version of this lib
  • Add to body:
(function () {
  const settings = {
    iconifyStats: true,
    iconifyUserNav: true
  };
  IconifyAO3(settings);
})();

Will turn the Stat names and the user navigation links into icons.

Settings

All described properties have to be in the settings object that is given to IconifyAO3.

  • boxiconsVersion: String - used version of boxicons. (current is "2.1.4", check boxicons.com for updates)
  • webFontsUri: String - Uri to a webfont that will be imported via CSS if set. See google web fonts for guidance. (!!! NO GOOGLE TRACKING IS ADDED IF LEFT UNSET !!!)
  • webFonts: Array<Object> - One or multiple objects that define an external font face (only latin)
  • iconifyStats: Boolean - if set to true, stat titles will be turned into icons.
  • statsSettings: Object - sets individual options for stat icons. See below.
  • iconifyUserNav: Boolean - if set to true, user navigation texts will be turned into icons.
  • userNavSettings: Object - sets individual options for user nav icons. See below.

External Web Font

Possible font source: https://fontsource.org/

Properties for each defined font

  • name: String - Name to address the loaded font face in local CSS. MANDATORY!
  • url: String - url to the external font file. MANDATORY!
  • format: String - format of the external font file. MANDATORY!
  • weight: String - The weight parameter of the font. Default: "400"
  • style: String - Font style. Default: "normal"
  • display: String - Display option of the font. Default: "swap"
  • width: String - Defines the font's stretch. Will not be set if not defined.

Example

[
  {
    "name: "Open Sans",
    "url": "https://cdn.jsdelivr.net/fontsource/fonts/open-sans:vf@latest/latin-wdth-normal.woff2",
    "format": "woff2-variations",
    "weight": "300 800",
    "width": "75% 100%"
  }
]

Individual Stat Icons

Define individual icons and tooltips, using the statsSettings object.

Properties

  • iconClass: String - name of boxicon icon (see https://boxicons.com)
  • solid: Boolean - sets the icon as solid or not. See selected icon properties on https://boxicons.com
  • tooltip: String - description that shows on mouse hover. Default is stats titles.

Example

{
  statsSettings: {
    kudosOptions: { solid: false }
  }
}

Will turn the solid heart for kudos into an unsolid heart. Note that the default settings will stay intact if not overwritten here.

List of possible Options

wordCountOptions, chaptersOptions, collectionsOptions, commentsOptions, kudosOptions, bookmarksOptions, hitsOptions, workSubsOptions, authorSubsOptions, commentThreadsOptions, fandomsOptions, workCountOptions, seriesCompleteOptions, kudos2HitsOptions,timeToReadOptions,dateWorkPublishedOptions, dateWorkUpdateOptions, dateWorkCompleteOptions

Individual User Navigation Icons

Define individual icons and tooltips, using the userNavSettings object.

Properties

  • iconClass: String - name of boxicon icon (see https://boxicons.com)
  • solid: Boolean - sets the icon as solid or not. See selected icon properties on https://boxicons.com
  • tooltip: String - description that shows on mouse hover.

Example

{
  userNavSettings: {
    accountOptions: { iconClass: "user-rectangle" }
  }
}

Will turn the round user icon into a rectangular one. Note that the default settings will stay intact if not overwritten here.

List of possible Options

accountOptions, postNewOptions, logoutOptions