/* * .footnote_plugin_tooltip_text = inner * .footnote_tooltip = inner */ .footnote_referrer, .footnote_referrer:link, .footnote_referrer:hover, .footnote_referrer > a, .footnote_referrer > a:link, .footnote_referrer > a:hover, .footnote_plugin_tooltip_text, .footnote_plugin_tooltip_text:hover, .main-content .footnote_referrer, .main-content .footnote_referrer:link, .main-content .footnote_referrer:hover, .main-content .footnote_referrer > a, .main-content .footnote_referrer > a:link, .main-content .footnote_referrer > a:hover, .main-content .footnote_plugin_tooltip_text, .main-content .footnote_plugin_tooltip_text:hover { text-decoration: none !important; border-bottom: none !important; box-shadow: none !important; } /** * Footnote referrer (not “tooltip text”) * * - Bugfix: Referrers: line height 0 to fix superscript, thanks to @cwbayer bug report. * * @reporter @cwbayer * @link https://wordpress.org/support/topic/footnote-number-in-text-superscript-disrupts-leading/ * * @since 2.1.1 * * - Bugfix: Tooltips: fix jQuery positioning bug moving tooltips out of view and affecting (TablePress tables in) some themes, thanks to @wisenilesh bug report. * * @reporter @wisenilesh * @link https://wordpress.org/support/topic/footnotes-not-working-properly-inside-the-tables-of-tablepress-plugin/ * * @since 2.5.4 */ .footnote_plugin_tooltip_text { line-height: 0; position: relative !important; cursor: pointer; } /***************************************************** Footnote reference container Templates: templates/public/reference-container.html templates/public/reference-container-body.html templates/public/reference-container-combi.html templates/public/reference-container-switch.html templates/public/reference-container-3column.html Optional responsive basic page layout support stylesheets: css/layout-reference-container.css css/layout-main-content.css css/layout-page-content.css Classes: .footnotes_reference_container = enclosing
.footnote_container_prepare = label
.footnote_reference_container_label = .footnote_reference_container_collapse_button = sibling .footnote-reference-container = misleading and inconsistent; alias: .footnotes_table = .footnotes_plugin_reference_row = .footnote_plugin_index_combi = first
if identical footnotes are combined .footnote_plugin_index = first if not .footnote_index = or in first in 3-column table .footnote_plugin_symbol = second in 3-column table .footnote_plugin_link = or (identical footnotes not combined) .footnote_backlink = or .footnote_index_arrow = nested , symbol only .footnote_plugin_text = second , or third in 3-column table */ .footnotes_reference_container { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .footnotes_reference_container .collapsed, .footnote_reference_container_collapse_button.collapsed { display: none; } /** * Reference container label. * * - Bugfix: Layout: support right-to-left writing direction by replacing remaining CSS values 'left' with 'start', thanks to @arahmanshaalan bug report. * * @reporter @arahmanshaalan * @link https://wordpress.org/support/topic/right-to-left-text-problem/ * * @since 2.5.8 */ .footnote_container_prepare { display: block !important; padding-top: 24px !important; } .footnote_container_prepare > p { line-height: 1.3 !important; margin-top: 1em !important; margin-bottom: 0.25em !important; padding: 0 !important; font-weight: normal !important; /* bottom border optional since 2.2.5 */ display: block !important; -webkit-margin-before: 0.83em !important; -webkit-margin-after: 0.83em !important; -webkit-margin-start: 0 !important; -webkit-margin-end: 0 !important; text-align: start !important; vertical-align: middle; } .footnote_container_prepare > p > span:first-child, .footnote_container_prepare > p > span:nth-child(3) { text-align: start !important; font-size: 1.5em !important; } /* collapse button fully clickable, not sign only */ .footnote_reference_container_collapse_button { cursor: pointer; padding: 0 0.5em; font-size: 1.3em !important; vertical-align: 2px; text-decoration: none !important; } h2 > .footnote_reference_container_collapse_button, h3 > .footnote_reference_container_collapse_button, h4 > .footnote_reference_container_collapse_button, h5 > .footnote_reference_container_collapse_button, h6 > .footnote_reference_container_collapse_button { font-size: inherit !important; } .footnote_container_prepare > p > span:last-child a, .footnote_reference_container_collapse_button a { text-decoration: none !important; } /* table */ .footnotes_table, .footnote-reference-container { width: 100% !important; border: none !important; } /** * Table caption for accessibility. * * - Bugfix: Reference container: apply web semantics to improve readability for assistive technologies, thanks to @derivationfr issue report and code contribution. * * @contributor @derivationfr * @link https://wordpress.org/support/topic/enhance-accesibility-by-using-instead-of/ * @link https://a11y-101.com/development/tables * * @since 2.5.11 * * The table caption must be present for screen readers but may be hidden to sighted users. */ .footnotes_table caption.accessibility { text-align: start; margin-top: -2px !important; height: 1px !important; width: 1px !important; white-space: nowrap !important; overflow: hidden !important; color: #fff0 !important; background-color: #fff0 !important; } /** * Footnotes list, table header cells. * * - Bugfix: Reference container: debug footnotes number text color in the table header cells required for accessibility, thanks to @spaceling bug report. * * @reporter @spaceling * @link https://wordpress.org/support/topic/footnote-numbers-not-visible-in-2-6-0/ * * @since 2.6.3 * The background was fixed but not the text color. * The color mustn’t be inherited as that would disable link color. */ .footnotes_table .footnotes_plugin_reference_row th { color: unset !important; background-color: inherit !important; } /** * Footnotes list, table cell borders. * * - Bugfix: Reference container: no borders around footnotes, thanks to @ragonesi bug report. * * @reporter @ragonesi * @link https://wordpress.org/support/topic/thin-box-around-notes-in-reference-container/ * * @since 2.0.0 * * - Bugfix: Reference container: enforce borderless table cells, thanks to @ragonesi bug report. * * @reporter @ragonesi * @link https://wordpress.org/support/topic/box-around-c-references-container/ * * @since 2.0.1 * * - Bugfix: Layout: support right-to-left writing direction by replacing remaining CSS values 'left' with 'start', thanks to @arahmanshaalan bug report. * - Bugfix: Layout: support right-to-left writing direction by enabling mirrored paddings on HTML dir="rtl" pages, thanks to @arahmanshaalan bug report. * * @reporter @arahmanshaalan * @link https://wordpress.org/support/topic/right-to-left-text-problem/ * * @since 2.5.8 */ .footnote_plugin_index, .footnote_plugin_index_combi, .footnote_plugin_symbol, .footnote_plugin_text { border: none !important; text-align: start !important; vertical-align: top !important; padding: 5px 6px 10px 0 !important; } html[dir="rtl"] .footnote_plugin_index, html[dir="rtl"] .footnote_plugin_index_combi, html[dir="rtl"] .footnote_plugin_symbol, html[dir="rtl"] .footnote_plugin_text { padding: 5px 0 10px 6px !important; } .footnote_backlink, .footnote_backlink:link, .footnote_plugin_link, .footnote_plugin_link:link, .main-content .footnote_backlink, .main-content .footnote_backlink:link, .main-content .footnote_plugin_link, .main-content .footnote_plugin_link:link { text-decoration: none !important; border-bottom: none !important; } .footnote_backlink, .footnote_plugin_link { white-space: nowrap; } .pointer, .footnote_index, .footnote_backlink { cursor: pointer; } /* These rules when enabled cause the backlink to take an overline when hovered in some themes, not in others: .footnote_plugin_index:hover, .footnote_plugin_index_combi:hover, .footnote_plugin_index.pointer:hover, .footnote_plugin_index_combi.pointer:hover, */ .footnote_backlink:hover, .footnote_plugin_link:hover, .footnote_plugin_text a:hover { text-decoration: unset; text-decoration: underline; /*deprioritized to ease customization*/ } .footnote_plugin_text { width: unset; /*unset width of text column to fix site issues*/ } /* These rules are just defaults preventing the table from filling the width. They are not very effective by lack of table-layout: fixed; since 2.1.4 settings are optionally available, with table-layout: fixed; By default, the backlink column is auto-expanding to fit widest. Not using 'max-content' as that causes no-wrap and overflows. These are overridden if settings are enabled. */ .footnote_plugin_index, .footnote_plugin_index_combi { max-width: 100px; width: 2.5em; } /* Responsive */ @media only screen and (max-width: 768px) { .footnote_plugin_index, .footnote_plugin_index_combi { max-width: 80px; } } /**************************************************************** Footnotes printing style rules Printing a table, browsers tend to avoid page breaks inside, but it takes a wrapper to avoid a page break before the table just after the reference container headline. UI elements (expand/collapse button, backlink arrows) are hidden. Link color set to inherit, so referrers/numbers are not grayed out. @since 2.0.0 Tooltips: fix bug displaying content inline when page is printed, thanks to @gernsheim bug report @see */ .footnotes_reference_container { page-break-inside: avoid; } @media print { .footnote_tooltip, .footnote_reference_container_collapse_button, .footnote_index_arrow { display: none; } .footnote_plugin_tooltip_text { color: inherit; } .footnote_plugin_index a, .footnote_plugin_index_combi a { color: inherit; text-decoration: none !important; } /* Edit button in WP2020 (added as a service) */ div.post-meta-edit-link-wrapper { display: none; } } /** * MCI Footnotes logo * * The classes with 'heading' fixing display in dashboard * have all their rules moved to settings.css so as to alleviate * the common stylesheet. Still these rules are only used if the * Footnotes ad link logo is present in the page footer per user * dashboard setting. Making these rules conditional like those * pertaining to tooltips, either jQuery or alternative, would * double the number of united minified stylesheets shipped with * the plugin. Hence these are present by default at the bottom. * * @see class/config.php * @see css/settings.css */ .footnotes_logo, .footnotes_logo:hover { text-decoration: none; font-weight: normal; } .footnotes_logo_part1 { color: #2bb975; } .footnotes_logo_part2 { color: #545f5a; }