diff options
Diffstat (limited to 'help3xsl')
| -rw-r--r-- | help3xsl/default.css | 48 | ||||
| -rw-r--r-- | help3xsl/online_transform.xsl | 10 |
2 files changed, 56 insertions, 2 deletions
diff --git a/help3xsl/default.css b/help3xsl/default.css index bc053cc704..69d86fb2ce 100644 --- a/help3xsl/default.css +++ b/help3xsl/default.css @@ -397,6 +397,54 @@ h6 { [data-a11y-toggle]:not([aria-controls]) { display: none; } +/* You Tube matters */ +.youtube_placeholder{ + border: 1px solid #eee; + max-width:700px; + padding: 10px; + background-color: #eee; + text-align: center; +} +.youtube_button { + appearance: none; + backface-visibility: hidden; + background-color: #27ae60; + border-radius: 8px; + border-style: none; + box-shadow: rgba(39, 174, 96, .15) 0 4px 9px; + box-sizing: border-box; + color: #fff; + cursor: pointer; + display: inline-block; + font-size: 16px; + font-weight: 600; + letter-spacing: normal; + line-height: 1.5; + outline: none; + overflow: hidden; + padding: 13px 20px; + position: relative; + text-align: center; + text-decoration: none; + transform: translate3d(0, 0, 0); + transition: all .3s; + user-select: none; + -webkit-user-select: none; + touch-action: manipulation; + vertical-align: top; + white-space: nowrap; +} +.youtube_button:hover { + background-color: #1e8449; + opacity: 1; + transform: translateY(0); + transition-duration: .35s; + box-shadow: rgba(39, 174, 96, .2) 0 6px 12px; +} +.youtube_button:active { + transform: translateY(2px); + transition-duration: .35s; +} #langs-nav:not([aria-hidden='true']), #modules-nav:not([aria-hidden='true']) { z-index: 100; diff --git a/help3xsl/online_transform.xsl b/help3xsl/online_transform.xsl index a9c47ae1e5..a9de0d4f5a 100644 --- a/help3xsl/online_transform.xsl +++ b/help3xsl/online_transform.xsl @@ -109,6 +109,9 @@ <xsl:variable name ="ui_search"><xsl:apply-templates select="$tmp_doc_ui//variable[@id='searchhelpcontents']"/></xsl:variable> <xsl:variable name ="ui_copyclip"><xsl:apply-templates select="$tmp_doc_ui//variable[@id='copyclip']"/></xsl:variable> <xsl:variable name ="ytvideobutton"><xsl:apply-templates select="$tmp_doc_ui//variable[@id='ytbutton']"/></xsl:variable> +<xsl:variable name ="ytaccept"><xsl:apply-templates select="$tmp_doc_ui//variable[@id='ytaccept']"/></xsl:variable> +<xsl:variable name ="ytpromovideoH2"><xsl:apply-templates select="$tmp_doc_ui//variable[@id='externalvideo']"/></xsl:variable> +<xsl:variable name ="ytprivacy"><xsl:apply-templates select="$tmp_doc_ui//variable[@id='ytprivacy']"/></xsl:variable> <!-- ############# # Templates # @@ -1281,8 +1284,11 @@ <xsl:variable name="auxID" select="concat('obj',generate-id())"/> <xsl:choose> <xsl:when test="starts-with(@type,'video/youtube')"> - <div id="{@id}" class="youtube_placeholder" style="border: 1px solid #eee; max-width:500px; padding: 10px;"> - <button style="background-color: red;" onClick="youtubeLoader('{@id}', 700, 394)" > + <div id="{@id}" class="youtube_placeholder"> + <h2 id="promovideoH2"><xsl:value-of select="$ytpromovideoH2"/></h2> + <p><xsl:value-of select="$ytaccept"/></p> + <p><a href="https://policies.google.com/privacy" target="_blank"><xsl:value-of select="$ytprivacy"/></a></p> + <button class="youtube_button" onClick="youtubeLoader('{@id}', 700, 394)" > <xsl:value-of select="$ytvideobutton"/> </button> </div> |