]>
Commit | Line | Data |
---|---|---|
2a19a1e4 C |
1 | @import '_variables'; |
2 | @import '_mixins'; | |
3 | @import './_player-variables'; | |
4 | ||
5 | $context-menu-width: 350px; | |
6 | ||
7 | /* Sass for videojs-contextmenu-ui */ | |
8 | ||
9 | .video-js .vjs-contextmenu-ui-menu { | |
10 | position: absolute; | |
11 | background-color: rgba(0, 0, 0, 0.5); | |
83ff5481 RK |
12 | padding: 8px 0; |
13 | border-radius: 4px; | |
2a19a1e4 C |
14 | width: $context-menu-width; |
15 | ||
16 | .vjs-menu-content { | |
17 | opacity: $primary-foreground-opacity; | |
d7941370 | 18 | color: pvar(--embedForegroundColor); |
2a19a1e4 C |
19 | font-size: $font-size !important; |
20 | font-weight: $font-semibold; | |
21 | } | |
22 | ||
23 | .vjs-menu-item { | |
24 | cursor: pointer; | |
25 | font-size: 1em; | |
26 | padding: 8px 16px; | |
27 | text-align: left; | |
28 | text-transform: none; | |
29 | ||
30 | &:hover { | |
31 | background-color: rgba(255, 255, 255, 0.2); | |
32 | } | |
83ff5481 RK |
33 | |
34 | [class^="vjs-icon-"] { | |
35 | display: inline-flex; | |
36 | position: relative; | |
37 | top: 2px; | |
38 | cursor: pointer; | |
39 | width: 14px; | |
40 | height: 14px; | |
41 | background-color: white; | |
42 | mask-size: cover; | |
43 | margin-right: 0.8rem !important; | |
44 | ||
45 | $icons: 'link-2', 'repeat', 'code', 'tick-white'; | |
46 | ||
47 | @each $icon in $icons { | |
48 | &[class$="-#{$icon}"] { | |
49 | mask-image: url('#{$assets-path}/player/images/#{$icon}.svg'); | |
50 | } | |
51 | } | |
52 | ||
53 | &[class$="-tick-white"] { | |
54 | float: right; | |
55 | margin: 0 !important; | |
56 | } | |
57 | } | |
2a19a1e4 | 58 | } |
5efab546 | 59 | } |