From 33700d8fa9baf8b779d5a6eaed5c722a773e16fe Mon Sep 17 00:00:00 2001 From: Heckyel Date: Sun, 26 Feb 2017 18:16:35 -0500 Subject: Correction style of play button and New version --- librevideojs/css/material/libre-skin-blue.css | 7 ++- librevideojs/css/material/libre-skin-grey.css | 7 ++- librevideojs/css/material/libre-skin-purple.css | 7 ++- librevideojs/css/material/libre-skin-red.css | 7 ++- librevideojs/css/material/libre-skin-teal.css | 7 ++- librevideojs/css/material/libre-skin-yellow.css | 7 ++- librevideojs/css/material/master.css | 42 +++++++------ librevideojs/fonts/libre-material/libre-icons.eot | Bin 5098 -> 4994 bytes librevideojs/fonts/libre-material/libre-icons.svg | 67 ++++++++++++--------- librevideojs/fonts/libre-material/libre-icons.ttf | Bin 4916 -> 4812 bytes librevideojs/fonts/libre-material/libre-icons.woff | Bin 2832 -> 2840 bytes 11 files changed, 87 insertions(+), 64 deletions(-) (limited to 'librevideojs') diff --git a/librevideojs/css/material/libre-skin-blue.css b/librevideojs/css/material/libre-skin-blue.css index f5cdf77..6bbbecf 100644 --- a/librevideojs/css/material/libre-skin-blue.css +++ b/librevideojs/css/material/libre-skin-blue.css @@ -284,7 +284,7 @@ content:"\e00b" /*Centrado del button Play y personalizado*/ .librevjs-libre-materialblue-skin .librevjs-big-play-button { left: 50%; -top: 40%; +top: 50%; font-size: 10em; display: block; z-index: 2; @@ -298,6 +298,7 @@ vertical-align: middle; cursor: pointer; opacity: 1; color: #2196F3; +line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialblue-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -628,7 +629,7 @@ left: 0; } .librevjs-libre-materialblue-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } .cliplibre-js .librevjs-text-track-display{ bottom: 1em; @@ -641,7 +642,7 @@ left: 0; } @media screen and (max-width: 200px){ .librevjs-libre-materialblue-skin .librevjs-big-play-button { - top:35%; + top:50%; } } @media screen and (max-width: 150px){ diff --git a/librevideojs/css/material/libre-skin-grey.css b/librevideojs/css/material/libre-skin-grey.css index cd74eef..41bdced 100644 --- a/librevideojs/css/material/libre-skin-grey.css +++ b/librevideojs/css/material/libre-skin-grey.css @@ -284,7 +284,7 @@ content:"\e00b" /*Centrado del button Play y personalizado*/ .librevjs-libre-materialgrey-skin .librevjs-big-play-button { left: 50%; -top: 40%; +top: 50%; font-size: 10em; display: block; z-index: 2; @@ -298,6 +298,7 @@ vertical-align: middle; cursor: pointer; opacity: 1; color: #9e9e9e; +line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialgrey-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -628,7 +629,7 @@ left: 0; } .librevjs-libre-materialgrey-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } .cliplibre-js .librevjs-text-track-display{ bottom: 1em; @@ -641,7 +642,7 @@ left: 0; } @media screen and (max-width: 200px){ .librevjs-libre-materialgrey-skin .librevjs-big-play-button { - top:35%; + top:50%; } } @media screen and (max-width: 150px){ diff --git a/librevideojs/css/material/libre-skin-purple.css b/librevideojs/css/material/libre-skin-purple.css index 3eeb9d6..e6139d9 100644 --- a/librevideojs/css/material/libre-skin-purple.css +++ b/librevideojs/css/material/libre-skin-purple.css @@ -284,7 +284,7 @@ content:"\e00b" /*Centrado del button Play y personalizado*/ .librevjs-libre-materialpurple-skin .librevjs-big-play-button { left: 50%; -top: 40%; +top: 50%; font-size: 10em; display: block; z-index: 2; @@ -298,6 +298,7 @@ vertical-align: middle; cursor: pointer; opacity: 1; color: #9c27b0; +line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialpurple-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -628,7 +629,7 @@ left: 0; } .librevjs-libre-materialpurple-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } .cliplibre-js .librevjs-text-track-display{ bottom: 1em; @@ -641,7 +642,7 @@ left: 0; } @media screen and (max-width: 200px){ .librevjs-libre-materialpurple-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ diff --git a/librevideojs/css/material/libre-skin-red.css b/librevideojs/css/material/libre-skin-red.css index 2a14676..4e76331 100644 --- a/librevideojs/css/material/libre-skin-red.css +++ b/librevideojs/css/material/libre-skin-red.css @@ -283,7 +283,7 @@ content:"\e00b" /*Centrado del button Play y personalizado*/ .librevjs-libre-materialred-skin .librevjs-big-play-button { left: 50%; -top: 40%; +top: 50%; font-size: 10em; display: block; z-index: 2; @@ -297,6 +297,7 @@ vertical-align: middle; cursor: pointer; opacity: 1; color: #f44336; +line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialred-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -626,7 +627,7 @@ left: 0; } .librevjs-libre-materialred-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } .cliplibre-js .librevjs-text-track-display{ bottom: 1em; @@ -639,7 +640,7 @@ left: 0; } @media screen and (max-width: 200px){ .librevjs-libre-materialred-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ diff --git a/librevideojs/css/material/libre-skin-teal.css b/librevideojs/css/material/libre-skin-teal.css index d36a6ac..040bba8 100644 --- a/librevideojs/css/material/libre-skin-teal.css +++ b/librevideojs/css/material/libre-skin-teal.css @@ -283,7 +283,7 @@ content:"\e00b" /*Centrado del button Play y personalizado*/ .librevjs-libre-materialteal-skin .librevjs-big-play-button { left: 50%; -top: 40%; +top: 50%; font-size: 10em; display: block; z-index: 2; @@ -297,6 +297,7 @@ vertical-align: middle; cursor: pointer; opacity: 1; color: #1abc9c; +line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialteal-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -627,7 +628,7 @@ left: 0; } .librevjs-libre-materialteal-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } .cliplibre-js .librevjs-text-track-display{ bottom: 1em; @@ -640,7 +641,7 @@ left: 0; } @media screen and (max-width: 200px){ .librevjs-libre-materialteal-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ diff --git a/librevideojs/css/material/libre-skin-yellow.css b/librevideojs/css/material/libre-skin-yellow.css index 22b2b08..ff9d009 100644 --- a/librevideojs/css/material/libre-skin-yellow.css +++ b/librevideojs/css/material/libre-skin-yellow.css @@ -283,7 +283,7 @@ content:"\e00b" /*Centrado del button Play y personalizado*/ .librevjs-libre-materialyellow-skin .librevjs-big-play-button { left: 50%; -top: 40%; +top: 50%; font-size: 10em; display: block; z-index: 2; @@ -297,6 +297,7 @@ vertical-align: middle; cursor: pointer; opacity: 1; color: #f1c40f; +line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialyellow-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -626,7 +627,7 @@ left: 0; } .librevjs-libre-materialyellow-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } .cliplibre-js .librevjs-text-track-display{ bottom: 1em; @@ -639,7 +640,7 @@ left: 0; } @media screen and (max-width: 200px){ .librevjs-libre-materialyellow-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ diff --git a/librevideojs/css/material/master.css b/librevideojs/css/material/master.css index 8aaa213..e700b80 100644 --- a/librevideojs/css/material/master.css +++ b/librevideojs/css/material/master.css @@ -327,7 +327,7 @@ easily in the skin designer by LibreVideoJS FreeArts. */ .librevjs-libre-materialblue-skin .librevjs-big-play-button { left: 50%; - top: 40%; + top: 50%; font-size: 10em; display: block; z-index: 2; @@ -341,6 +341,7 @@ easily in the skin designer by LibreVideoJS FreeArts. cursor: pointer; opacity: 1; color: #2196F3; + line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialblue-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -477,12 +478,12 @@ background-color: inherit; @media screen and (max-width: 400px){ .librevjs-libre-materialblue-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } } @media screen and (max-width: 200px){ .librevjs-libre-materialblue-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ @@ -792,7 +793,7 @@ easily in the skin designer by LibreVideoJS FreeArts. */ .librevjs-libre-materialgrey-skin .librevjs-big-play-button { left: 50%; - top: 40%; + top: 50%; font-size: 10em; display: block; z-index: 2; @@ -806,6 +807,7 @@ easily in the skin designer by LibreVideoJS FreeArts. cursor: pointer; opacity: 1; color: #9e9e9e; + line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialgrey-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -941,12 +943,12 @@ background-color: inherit; @media screen and (max-width: 400px){ .librevjs-libre-materialgrey-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } } @media screen and (max-width: 200px){ .librevjs-libre-materialgrey-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ @@ -1257,7 +1259,7 @@ easily in the skin designer by LibreVideoJS FreeArts. */ .librevjs-libre-materialpurple-skin .librevjs-big-play-button { left: 50%; - top: 40%; + top: 50%; font-size: 10em; display: block; z-index: 2; @@ -1271,6 +1273,7 @@ easily in the skin designer by LibreVideoJS FreeArts. cursor: pointer; opacity: 1; color: #9c27b0; + line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialpurple-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -1406,12 +1409,12 @@ background-color: inherit; @media screen and (max-width: 400px){ .librevjs-libre-materialpurple-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } } @media screen and (max-width: 200px){ .librevjs-libre-materialpurple-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ @@ -1722,7 +1725,7 @@ easily in the skin designer by LibreVideoJS FreeArts. */ .librevjs-libre-materialred-skin .librevjs-big-play-button { left: 50%; - top: 40%; + top: 50%; font-size: 10em; display: block; z-index: 2; @@ -1736,6 +1739,7 @@ easily in the skin designer by LibreVideoJS FreeArts. cursor: pointer; opacity: 1; color: #f44336; + line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialred-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -1871,12 +1875,12 @@ background-color: inherit; @media screen and (max-width: 400px){ .librevjs-libre-materialred-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } } @media screen and (max-width: 200px){ .librevjs-libre-materialred-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ @@ -2187,7 +2191,7 @@ easily in the skin designer by LibreVideoJS FreeArts. */ .librevjs-libre-materialteal-skin .librevjs-big-play-button { left: 50%; -top: 40%; +top: 50%; font-size: 10em; display: block; z-index: 2; @@ -2201,6 +2205,7 @@ vertical-align: middle; cursor: pointer; opacity: 1; color: #1abc9c; +line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialteal-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -2337,12 +2342,12 @@ background-color: inherit; @media screen and (max-width: 400px){ .librevjs-libre-materialteal-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } } @media screen and (max-width: 200px){ .librevjs-libre-materialteal-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ @@ -2653,7 +2658,7 @@ easily in the skin designer by LibreVideoJS FreeArts. */ .librevjs-libre-materialyellow-skin .librevjs-big-play-button { left: 50%; - top: 40%; + top: 50%; font-size: 10em; display: block; z-index: 2; @@ -2667,6 +2672,7 @@ easily in the skin designer by LibreVideoJS FreeArts. cursor: pointer; opacity: 1; color: #f1c40f; + line-height: normal; } /* Hide if controls are disabled */ .librevjs-libre-materialyellow-skin.librevjs-controls-disabled .librevjs-big-play-button { @@ -2803,12 +2809,12 @@ background-color: inherit; @media screen and (max-width: 400px){ .librevjs-libre-materialyellow-skin .librevjs-big-play-button{ font-size: 5em; - top: 45%; + top: 50%; } } @media screen and (max-width: 200px){ .librevjs-libre-materialyellow-skin .librevjs-big-play-button { - top:35%; + top: 50%; } } @media screen and (max-width: 150px){ diff --git a/librevideojs/fonts/libre-material/libre-icons.eot b/librevideojs/fonts/libre-material/libre-icons.eot index 1782417..8c4be9d 100644 Binary files a/librevideojs/fonts/libre-material/libre-icons.eot and b/librevideojs/fonts/libre-material/libre-icons.eot differ diff --git a/librevideojs/fonts/libre-material/libre-icons.svg b/librevideojs/fonts/libre-material/libre-icons.svg index daf61c0..e7a69df 100644 --- a/librevideojs/fonts/libre-material/libre-icons.svg +++ b/librevideojs/fonts/libre-material/libre-icons.svg @@ -2,38 +2,49 @@ -Created by FontForge 20161003 at Fri Dec 9 18:02:20 2016 -By Jesús Eduardo, Jorge Maldonado Ventura, Gabriel Alexander. +Created by FontForge 20170224 at Fri Feb 24 18:22:12 2017 +By Jesús Eduardo - - + + - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/librevideojs/fonts/libre-material/libre-icons.ttf b/librevideojs/fonts/libre-material/libre-icons.ttf index e68b6f7..efa2437 100644 Binary files a/librevideojs/fonts/libre-material/libre-icons.ttf and b/librevideojs/fonts/libre-material/libre-icons.ttf differ diff --git a/librevideojs/fonts/libre-material/libre-icons.woff b/librevideojs/fonts/libre-material/libre-icons.woff index 4212649..010e03f 100644 Binary files a/librevideojs/fonts/libre-material/libre-icons.woff and b/librevideojs/fonts/libre-material/libre-icons.woff differ -- cgit v1.2.3