diff --git a/wp-hyperaudio/hyperaudio.php b/wp-hyperaudio/hyperaudio.php index da87299..677f319 100644 --- a/wp-hyperaudio/hyperaudio.php +++ b/wp-hyperaudio/hyperaudio.php @@ -139,7 +139,42 @@ function hyperaudio_shortcode_handler($atts, $transcript, $tag) .hyperaudio-transcript a { text-decoration:none !important; - }'; + } + + #popover { + position: absolute; + background-color: #f9f9f9; + + border: 1px solid #ccc; + padding: 10px; + border-radius: 4px; + box-shadow: 0 2px 5px rgba(0,0,0,0.2); + display: none; + z-index: 1; + font-size: small; + font-family: Arial,Helvetica Neue,Helvetica,sans-serif; + } + + #popover a { + text-decoration: none; + color: #303030; + cursor: pointer; + } + + #clipboard-text { + font-family: Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace; + font-size: 0.8em; + line-height: 1.2; + } + + #clipboard-confirm { + font-size: medium; + } + + #clipboard-dialog { + width: 50%; + } + '; if (!is_null($fontfamily)) { $o .=' .hyperaudio-transcript { @@ -170,8 +205,7 @@ function hyperaudio_shortcode_handler($atts, $transcript, $tag) } - $o .=' - .share-this-popover{max-width:8em;pointer-events:none;-webkit-filter:drop-shadow(0 1px 3px rgba(0,0,0,.35));filter:drop-shadow(0 1px 3px rgba(0,0,0,.35));-webkit-animation:a .3s;animation:a .3s}.share-this-popover:before{content:"";position:absolute;bottom:100%;left:50%;width:0;height:0;margin:.25em -.5em;border-width:.5em .5em 0;border-style:solid;border-color:#333 transparent}.share-this-popover>ul{pointer-events:auto;list-style:none;padding:0;margin:-.75em 0 0;white-space:nowrap;background:#333;color:#fff;border-radius:.25em;position:absolute;left:50%;-webkit-transform:translate(-50%,-100%);-ms-transform:translate(-50%,-100%);transform:translate(-50%,-100%)}.share-this-popover>ul>li{display:inline-block;width:2em;height:2em;line-height:2em;text-align:center}.share-this-popover>ul>li>a{display:inline-block;width:100%;height:100%;color:inherit;box-sizing:border-box;padding:.35em}.share-this-popover>ul>li>a:focus,.share-this-popover>ul>li>a:hover{background:hsla(0,0%,100%,.25)}@media (pointer:coarse){.share-this-popover{font-size:150%}.share-this-popover:before{bottom:auto;top:100%;border-width:0 .5em .5em;margin-top:0}.share-this-popover>ul{top:100%;transform:translateX(-50%);margin:.5em 0 0}}@media (max-width:575px){.share-this-popover{left:0!important;right:0!important;width:auto!important;max-width:none}.share-this-popover:before{bottom:auto;top:100%;border-width:0 .5em .5em;margin-top:0}.share-this-popover>ul{top:100%;transform:translateX(-50%);margin:.5em 0 0;left:0;width:100%;transform:none;border-radius:0;text-align:center}}@-webkit-keyframes a{0%{-webkit-transform:translateY(-3em);opacity:0}80%{-webkit-transform:translateY(.5em);opacity:1}to{-webkit-transform:translateY(0)}}@keyframes a{0%{transform:translateY(-3em);opacity:0}80%{transform:translateY(.5em);opacity:1}to{transform:translateY(0)}}'; + $o .=''; $o .='