On top of 2.6.0d7. Debugs Footnotes for all input field values with footnotes coming in from field label. Preparing unreleased tagged v2.5.11 in response to Forum support request. Accessibility fixes and AMP compat enhancements not fully debugged yet, draft only. git-svn-id: https://plugins.svn.wordpress.org/footnotes/trunk@2499807 b8457f37-d9ea-0310-8a92-e5e31aec5664
65 lines
1.5 KiB
CSS
65 lines
1.5 KiB
CSS
/*<?php for docblocks
|
|
/**
|
|
* Additional stylesheet for AMP compatible tooltips.
|
|
*
|
|
* - Adding: Tooltips: make display work purely by style rules for AMP compatibility, thanks to @milindmore22 code contribution.
|
|
* - Bugfix: Tooltips: enable accessibility by keyboard navigation, thanks to @westonruter code contribution.
|
|
*
|
|
* @since 2.5.11 (draft)
|
|
*
|
|
* @contributor @milindmore22
|
|
* @link https://github.com/ampproject/amp-wp/issues/5913#issuecomment-785306933
|
|
*
|
|
* @contributor @westonruter
|
|
* @link https://github.com/ampproject/amp-wp/issues/5913#issuecomment-785419655
|
|
*
|
|
* To streamline internal CSS, immutable rules are in external stylesheet.
|
|
* Property values of settings are internal CSS.
|
|
* @see class/task.php
|
|
*
|
|
* System of unified minified style sheets tailored to the instance.
|
|
* @see dev-common.css.
|
|
*/
|
|
|
|
span.footnote_referrer > span.footnote_tooltip {
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
transition-property: visibility opacity;
|
|
/*
|
|
transition-delay: 500ms;
|
|
transition-duration: 1s;
|
|
*/
|
|
}
|
|
|
|
span.footnote_referrer:focus-within > span.footnote_tooltip,
|
|
span.footnote_referrer:hover > span.footnote_tooltip {
|
|
visibility: visible;
|
|
opacity: 1;
|
|
transition-property: visibility opacity;
|
|
/*
|
|
transition-delay: 0;
|
|
transition-duration: 200ms;
|
|
*/
|
|
}
|
|
|
|
/**
|
|
* Position.
|
|
*
|
|
* Values are defined by internal CSS.
|
|
* @see class/task.php
|
|
*/
|
|
|
|
.footnote_referrer.relative {
|
|
position: relative;
|
|
}
|
|
|
|
.footnote_tooltip.position {
|
|
display: unset;
|
|
position: absolute;
|
|
/*
|
|
bottom: 24px;
|
|
left: -50px;
|
|
width: 400px;
|
|
*/
|
|
}
|