Metro-UI-CSS/source/common-css/embed.less at dev · cgb-javascript-css-typescript/Metro-UI-CSS · GitHub

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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
@import (once) "../include/vars";
@import (once) "../include/mixins";

.embed-container {
    position:relative;
    display: block;
    padding: 0;
    overflow:hidden;
    width: 100%;
    height: 100%;

    &::before {
        padding-top: percentage((9 / 16));
        display: block;
        content: "";
    }
}

.embed-container {
    iframe, object, embed, video, .embed-item {
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        border: 0;
    }
}

.embed-container {
    &.size-21x9 {
        &::before {
            padding-top: percentage((9 / 21));
        }
    }
    &.size-16x9 {
        &::before {
            padding-top: percentage((9 / 16));
        }
    }
    &.size-4x3 {
        &::before {
            padding-top: percentage((3 / 4));
        }
    }
    &.size-1x1 {
        &::before {
            padding-top: percentage((1 / 1));
        }
    }
}