aboutsummaryrefslogtreecommitdiffstats
path: root/src/less
diff options
context:
space:
mode:
Diffstat (limited to 'src/less')
-rw-r--r--src/less/base.less24
-rw-r--r--src/less/utilities.less21
-rw-r--r--src/less/variables.less5
3 files changed, 35 insertions, 15 deletions
diff --git a/src/less/base.less b/src/less/base.less
index 5ff866b6..6c384556 100644
--- a/src/less/base.less
+++ b/src/less/base.less
@@ -8,18 +8,22 @@
min-width: 200px;
font-family: Avenir, "Avenir Next", "Helvetica Neue", "Segoe UI", Helvetica, Arial, sans-serif;
- // border-box everything
- // http://paulirish.com/2012/box-sizing-border-box-ftw/
- &,
- *,
- *::after,
- *::before {
- box-sizing: border-box;
+ & when (@plyr-border-box = true) {
+ // border-box everything
+ // http://paulirish.com/2012/box-sizing-border-box-ftw/
+ &,
+ *,
+ *::after,
+ *::before {
+ box-sizing: border-box;
+ }
}
- // Fix 300ms delay
- a, button, input, label {
- touch-action: manipulation;
+ & when (@plyr-touch-action = true) {
+ // Fix 300ms delay
+ a, button, input, label {
+ touch-action: manipulation;
+ }
}
// Media elements
diff --git a/src/less/utilities.less b/src/less/utilities.less
index 518f2a8d..70c7f270 100644
--- a/src/less/utilities.less
+++ b/src/less/utilities.less
@@ -4,11 +4,22 @@
// Screen reader only elements
.plyr__sr-only {
- position: absolute !important;
clip: rect(1px, 1px, 1px, 1px);
- padding: 0 !important;
- border: 0 !important;
- height: 1px !important;
- width: 1px !important;
overflow: hidden;
+
+ // !important is not always needed
+ & when (@plyr-sr-only-important = true) {
+ position: absolute !important;
+ padding: 0 !important;
+ border: 0 !important;
+ height: 1px !important;
+ width: 1px !important;
+ }
+ & when (@plyr-sr-only-important = false) {
+ position: absolute;
+ padding: 0;
+ border: 0;
+ height: 1px;
+ width: 1px;
+ }
} \ No newline at end of file
diff --git a/src/less/variables.less b/src/less/variables.less
index 62fab14e..d152ecb7 100644
--- a/src/less/variables.less
+++ b/src/less/variables.less
@@ -2,6 +2,11 @@
// Variables
// ==========================================================================
+// Settings
+@plyr-border-box: true;
+@plyr-touch-action: true;
+@plyr-sr-only-important: true;
+
// Colors
@plyr-color-main: #3498db;