Commit 5280b3b3 authored by Laura Kalbag's avatar Laura Kalbag

Update fullscreen CSS and sprites

parent 52a86e35
......@@ -262,6 +262,32 @@
background-position: -10px -352px;
}
}
.px-video-fullscreen-btn-container label {
display: inline-block;
width: 25px;
height: 20px;
margin-left: 10px;
background: no-repeat url("../images/px-video-sprite.png");
background-position: -6px -907px;
}
.px-video-fullscreen-btn-container input[type="checkbox"]:focus+label {
outline: 1px #999 dotted;
background-position: -6px -943px;
}
.px-video-fullscreen-btn-container input[type="checkbox"]:hover+label {
background-position: -6px -943px;
cursor: pointer;
}
.px-video-fullscreen-btn-container input[type="checkbox"]:focus+label {
outline: 1px #999 dotted;
background-position: -6px -943px;
}
.px-video-fullscreen-btn-container input[type="checkbox"]:checked+label {
background-position: -6px -979px;
}
.px-video-fullscreen-btn-container input[type="checkbox"]:checked:hover+label {
background-position: -6px -1015px;
}
/* captions button */
.px-video-captions-btn-container {
float: right;
......
images/px-video-sprite.png

5.93 KB | W: | H:

images/px-video-sprite.png

3.37 KB | W: | H:

images/px-video-sprite.png
images/px-video-sprite.png
images/px-video-sprite.png
images/px-video-sprite.png
  • 2-up
  • Swipe
  • Onion skin
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="36px" height="900px" viewBox="0 0 36 900" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<svg width="36px" height="1044px" viewBox="0 0 36 1044" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.3.2 (12043) - http://www.bohemiancoding.com/sketch -->
<title>px-video-sprite</title>
<desc>Created with Sketch.</desc>
<defs></defs>
......@@ -31,6 +31,10 @@
<path d="M10,807.995826 C10,805.788992 11.7888304,804 13.9962027,804 L22.0037973,804 C24.2108391,804 26,805.796521 26,807.995826 L26,812.004174 C26,814.211008 24.2111696,816 22.0037973,816 L13.9962027,816 C11.7891609,816 10,814.203479 10,812.004174 L10,807.995826 Z M11.9901733,810.005005 C11.9901733,806.623535 16.6294556,805.807068 17.8296507,809.013977 C17.8329163,809.022703 16.4950694,809.438808 16.4888916,809.426453 C15.5649414,807.578613 13.3978882,808.480789 13.3978882,810.005005 C13.3978882,811.017029 14.34021,811.607361 15.0359497,811.607361 C16.0014648,811.607361 16.4400005,810.681824 16.4400005,810.681824 C16.4400005,810.681824 17.8296509,811.017029 17.8296509,811.017029 C17.8296507,811.132446 16.9962766,813.009705 15.0359497,813.009705 C13.1976929,813.009705 11.9901733,811.505127 11.9901733,810.005005 Z M17.9901733,810.005005 C17.9901733,806.623535 22.6294556,805.807068 23.8296507,809.013977 C23.8329163,809.022703 22.4950694,809.438808 22.4888916,809.426453 C21.5649414,807.578613 19.3978882,808.480789 19.3978882,810.005005 C19.3978882,811.017029 20.34021,811.607361 21.0359497,811.607361 C22.0014648,811.607361 22.4400005,810.681824 22.4400005,810.681824 C22.4400005,810.681824 23.8296509,811.017029 23.8296509,811.017029 C23.8296507,811.132446 22.9962766,813.009705 21.0359497,813.009705 C19.1976929,813.009705 17.9901733,811.505127 17.9901733,810.005005 Z" id="closed-captions---light" fill="#666666" sketch:type="MSShapeGroup"></path>
<path d="M10,843.995826 C10,841.788992 11.7888304,840 13.9962027,840 L22.0037973,840 C24.2108391,840 26,841.796521 26,843.995826 L26,848.004174 C26,850.211008 24.2111696,852 22.0037973,852 L13.9962027,852 C11.7891609,852 10,850.203479 10,848.004174 L10,843.995826 Z M11.9901733,846.005005 C11.9901733,842.623535 16.6294556,841.807068 17.8296507,845.013977 C17.8329163,845.022703 16.4950694,845.438808 16.4888916,845.426453 C15.5649414,843.578613 13.3978882,844.480789 13.3978882,846.005005 C13.3978882,847.017029 14.34021,847.607361 15.0359497,847.607361 C16.0014648,847.607361 16.4400005,846.681824 16.4400005,846.681824 C16.4400005,846.681824 17.8296509,847.017029 17.8296509,847.017029 C17.8296507,847.132446 16.9962766,849.009705 15.0359497,849.009705 C13.1976929,849.009705 11.9901733,847.505127 11.9901733,846.005005 Z M17.9901733,846.005005 C17.9901733,842.623535 22.6294556,841.807068 23.8296507,845.013977 C23.8329163,845.022703 22.4950694,845.438808 22.4888916,845.426453 C21.5649414,843.578613 19.3978882,844.480789 19.3978882,846.005005 C19.3978882,847.017029 20.34021,847.607361 21.0359497,847.607361 C22.0014648,847.607361 22.4400005,846.681824 22.4400005,846.681824 C22.4400005,846.681824 23.8296509,847.017029 23.8296509,847.017029 C23.8296507,847.132446 22.9962766,849.009705 21.0359497,849.009705 C19.1976929,849.009705 17.9901733,847.505127 17.9901733,846.005005 Z" id="closed-captions---dark" fill="#444444" sketch:type="MSShapeGroup"></path>
<path d="M10,879.995826 C10,877.788992 11.7888304,876 13.9962027,876 L22.0037973,876 C24.2108391,876 26,877.796521 26,879.995826 L26,884.004174 C26,886.211008 24.2111696,888 22.0037973,888 L13.9962027,888 C11.7891609,888 10,886.203479 10,884.004174 L10,879.995826 Z M11.9901733,882.005005 C11.9901733,878.623535 16.6294556,877.807068 17.8296507,881.013977 C17.8329163,881.022703 16.4950694,881.438808 16.4888916,881.426453 C15.5649414,879.578613 13.3978882,880.480789 13.3978882,882.005005 C13.3978882,883.017029 14.34021,883.607361 15.0359497,883.607361 C16.0014648,883.607361 16.4400005,882.681824 16.4400005,882.681824 C16.4400005,882.681824 17.8296509,883.017029 17.8296509,883.017029 C17.8296507,883.132446 16.9962766,885.009705 15.0359497,885.009705 C13.1976929,885.009705 11.9901733,883.505127 11.9901733,882.005005 Z M17.9901733,882.005005 C17.9901733,878.623535 22.6294556,877.807068 23.8296507,881.013977 C23.8329163,881.022703 22.4950694,881.438808 22.4888916,881.426453 C21.5649414,879.578613 19.3978882,880.480789 19.3978882,882.005005 C19.3978882,883.017029 20.34021,883.607361 21.0359497,883.607361 C22.0014648,883.607361 22.4400005,882.681824 22.4400005,882.681824 C22.4400005,882.681824 23.8296509,883.017029 23.8296509,883.017029 C23.8296507,883.132446 22.9962766,885.009705 21.0359497,885.009705 C19.1976929,885.009705 17.9901733,883.505127 17.9901733,882.005005 Z" id="closed-captions---colour" fill="#009CDE" sketch:type="MSShapeGroup"></path>
<path d="M15,912 L10,912 L10,917 L12.5,917 L12.5,914.5 L15,914.5 L15,912 Z M26,917 L26,912 L21,912 L21,914.5 L23.5,914.5 L23.5,917 L26,917 Z M15,924 L10,924 L10,919 L12.5,919 L12.5,921.5 L15,921.5 L15,924 Z M26,919 L26,924 L21,924 L21,921.5 L23.5,921.5 L23.5,919 L26,919 Z" id="fullscreen-light" fill="#666666" sketch:type="MSShapeGroup"></path>
<path d="M15,948 L10,948 L10,953 L12.5,953 L12.5,950.5 L15,950.5 L15,948 Z M26,953 L26,948 L21,948 L21,950.5 L23.5,950.5 L23.5,953 L26,953 Z M15,960 L10,960 L10,955 L12.5,955 L12.5,957.5 L15,957.5 L15,960 Z M26,955 L26,960 L21,960 L21,957.5 L23.5,957.5 L23.5,955 L26,955 Z" id="fullscreen-dark" fill="#444444" sketch:type="MSShapeGroup"></path>
<path d="M21,984 L21,989 L26,989 L26,987 L23,987 L23,984 L21,984 Z M10,989 L15,989 L15,984 L13,984 L13,987 L10,987 L10,989 Z M15,996 L15,991 L10,991 L10,993 L13,993 L13,996 L15,996 Z M26,991 L21,991 L21,996 L23,996 L23,993 L26,993 L26,991 Z" id="in-window---light" fill="#666666" sketch:type="MSShapeGroup"></path>
<path d="M21,1020 L21,1025 L26,1025 L26,1023 L23,1023 L23,1020 L21,1020 Z M10,1025 L15,1025 L15,1020 L13,1020 L13,1023 L10,1023 L10,1025 Z M15,1032 L15,1027 L10,1027 L10,1029 L13,1029 L13,1032 L15,1032 Z M26,1027 L21,1027 L21,1032 L23,1032 L23,1029 L26,1029 L26,1027 Z" id="in-window---dark" fill="#444444" sketch:type="MSShapeGroup"></path>
</g>
</g>
</svg>
\ No newline at end of file
......@@ -232,6 +232,34 @@
&:hover, &:focus
background-position -10px -352px
.px-video-fullscreen-btn-container label
display inline-block
width 25px
height 20px
margin-left 10px
background no-repeat url('../images/px-video-sprite.png')
background-position -6px -907px
.px-video-fullscreen-btn-container input[type="checkbox"]:focus+label
outline 1px #999 dotted
background-position -6px -943px
.px-video-fullscreen-btn-container input[type="checkbox"]:hover+label
background-position -6px -943px
cursor pointer
.px-video-fullscreen-btn-container input[type="checkbox"]:focus+label
outline 1px #999 dotted
background-position -6px -943px
.px-video-fullscreen-btn-container input[type="checkbox"]:checked+label
background-position -6px -979px
.px-video-fullscreen-btn-container input[type="checkbox"]:checked:hover+label
background-position -6px -1015px
/* captions button */
.px-video-captions-btn-container
......
No preview for this file type
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment