src/less/base.less


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

// ==========================================================================
// Base
// ==========================================================================

.plyr {
    position: relative;
    max-width: 100%;
    min-width: 200px;
    font-family: Avenir, "Avenir Next", "Helvetica Neue", "Segoe UI", Helvetica, Arial, sans-serif;

    & when (@plyr-border-box = true) {
        // border-box everything
        // http://paulirish.com/2012/box-sizing-border-box-ftw/
        &,
        *,
        *::after,
        *::before {
            box-sizing: border-box;
        }
    }

    & when (@plyr-touch-action = true) {
        // Fix 300ms delay
        a, button, input, label {
            touch-action: manipulation;
        }
    }

    // Media elements
    video,
    audio {
        width: 100%;
        height: auto;
        vertical-align: middle;
        border-radius: inherit;
    }
}