| @@ -1,16 +1,4 @@ | ||
| 1 | -/** | |
| 2 | - * WpStream admin stylesheet. | |
| 3 | - * | |
| 4 | - * Styles the plugin's wp-admin screens: the Live Channels list and its event | |
| 5 | - * cards, the video/VOD management and upload screens, the settings/options | |
| 6 | - * forms, the Gutenberg sidebar meta panel (#wpstream-sidebar-meta), broadcast | |
| 7 | - * credential UI (RTMP key/URI, social streaming), modals, toggle switches, | |
| 8 | - * tooltips, pagination, social-share buttons, the spinner/loader, and the | |
| 9 | - * responsive breakpoints for tablet and mobile. | |
| 10 | - */ | |
| 11 | - | |
| 12 | -/* New PPV/free video and "add channel" creation links, plus the create-product link. */ | |
| 13 | 1 | .create_new_ppv_video{ |
| 14 | 2 | margin-left: 30px; |
| 15 | 3 | } |
| 16 | 4 | .create_new_free_video{ |
| @@ -33,9 +21,8 @@ | ||
| 33 | 21 | font-weight: bold; |
| 34 | 22 | } |
| 35 | 23 | |
| 36 | 24 | |
| 37 | -/* Settings/theme-options tab: the white card container that wraps an options panel. */ | |
| 38 | 25 | .theme_options_tab_wpstream{ |
| 39 | 26 | background: #fff; |
| 40 | 27 | border-left: 4px solid #fff; |
| 41 | 28 | box-shadow: 0 10px 31px 0 rgba(7,152,255,0.09); |
| @@ -46,9 +33,8 @@ | ||
| 46 | 33 | border: 1px solid #e2e5e8; |
| 47 | 34 | border-radius: 5px; |
| 48 | 35 | } |
| 49 | 36 | |
| 50 | -/* Green "Upgrade" pill button shown in the admin top bar. */ | |
| 51 | 37 | .wpstream_upgrade_topbar{ |
| 52 | 38 | background: #45a73f; |
| 53 | 39 | color: #fff; |
| 54 | 40 | cursor: pointer; |
| @@ -66,28 +52,19 @@ | ||
| 66 | 52 | background: #378532; |
| 67 | 53 | color:#fff; |
| 68 | 54 | } |
| 69 | 55 | |
| 70 | -/* Settings option rows: field wrappers, labels, text inputs, help text and the image-upload control. */ | |
| 71 | 56 | .wpstream_option_wrapper{ |
| 72 | 57 | max-width: 70%; |
| 73 | 58 | padding: 30px 0px 0px 0px; |
| 74 | 59 | } |
| 75 | 60 | |
| 76 | -.wpstream_page_wpstream_settings .wpstream_option_wrapper{ | |
| 77 | - display: flex; | |
| 78 | - justify-content: space-between; | |
| 79 | - gap: 10px; | |
| 80 | - max-width: 40%; | |
| 81 | -} | |
| 82 | - | |
| 83 | -.wpstream_option, .wpstream_setting_event_unit_wrapper { | |
| 84 | - display: flex; | |
| 85 | - flex-direction: column; | |
| 61 | +.wpstream_option{ | |
| 86 | 62 | clear: both; |
| 63 | + width: 51%; | |
| 64 | + display: inline-block; | |
| 87 | 65 | margin-bottom: 20px; |
| 88 | 66 | position: relative; |
| 89 | - max-width: 443px; | |
| 90 | 67 | } |
| 91 | 68 | |
| 92 | 69 | .wpstream_option input{ |
| 93 | 70 | border: 1px solid #d6d6d6; |
| @@ -110,30 +87,9 @@ | ||
| 110 | 87 | margin-top: 5px; |
| 111 | 88 | max-width: 365px; |
| 112 | 89 | } |
| 113 | 90 | |
| 114 | -.wpstream_option .wpstream-image-upload-wrapper { | |
| 115 | - margin-bottom: 10px; | |
| 116 | -} | |
| 117 | 91 | |
| 118 | -.wpstream_option .wpstream-image-upload-wrapper .wpstream-image-preview { | |
| 119 | - margin: 10px 0; | |
| 120 | - max-width: 300px; | |
| 121 | -} | |
| 122 | - | |
| 123 | -.wpstream_option .wpstream-image-upload-wrapper .wpstream-image-preview img { | |
| 124 | - max-width: 100%; | |
| 125 | - height: auto; | |
| 126 | - border: 1px solid #ddd; | |
| 127 | - padding: 5px; | |
| 128 | - background: #fff; | |
| 129 | -} | |
| 130 | - | |
| 131 | -.wpstream_option .wpstream-image-upload-wrapper .wpstream-image-upload-buttons .button { | |
| 132 | - margin-right: 5px; | |
| 133 | -} | |
| 134 | - | |
| 135 | - | |
| 136 | 92 | .event_list_unit_notification{ |
| 137 | 93 | float:left; |
| 138 | 94 | width:100%; |
| 139 | 95 | margin-bottom: 10px; |
| @@ -138,9 +94,8 @@ | ||
| 138 | 94 | width:100%; |
| 139 | 95 | margin-bottom: 10px; |
| 140 | 96 | } |
| 141 | 97 | |
| 142 | -/* Section "pack details" cards (solid and transparent variants) grouping related settings. */ | |
| 143 | 98 | .pack_details_wrapper{ |
| 144 | 99 | background-color: #fff; |
| 145 | 100 | padding: 20px; |
| 146 | 101 | margin-bottom: 20px; |
| @@ -164,9 +119,8 @@ | ||
| 164 | 119 | } |
| 165 | 120 | |
| 166 | 121 | |
| 167 | 122 | |
| 168 | -/* Utility classes toggling visibility of stream-data blocks. */ | |
| 169 | 123 | .hide_stream_data{ |
| 170 | 124 | display:none; |
| 171 | 125 | } |
| 172 | 126 | |
| @@ -175,9 +129,8 @@ | ||
| 175 | 129 | display:block; |
| 176 | 130 | } |
| 177 | 131 | |
| 178 | 132 | |
| 179 | -/* Square channel/event thumbnail (background-image based). */ | |
| 180 | 133 | .event_thumb_wrapper{ |
| 181 | 134 | margin-right: 15px; |
| 182 | 135 | min-width: 50px; |
| 183 | 136 | width: 50px; |
| @@ -190,9 +143,8 @@ | ||
| 190 | 143 | } |
| 191 | 144 | |
| 192 | 145 | |
| 193 | 146 | |
| 194 | -/* Live Channels list: the event card (event_list_unit), its title, hover/started states and column layout. */ | |
| 195 | 147 | .event_title{ |
| 196 | 148 | width: 350px; |
| 197 | 149 | } |
| 198 | 150 | #wpstream-sidebar-meta .event_title{ |
| @@ -226,12 +178,8 @@ | ||
| 226 | 178 | position: relative; |
| 227 | 179 | border: 1px solid #e2e5e8; |
| 228 | 180 | } |
| 229 | 181 | |
| 230 | -div.video-js.vjs-has-started button.vjs-big-play-button{ | |
| 231 | - display:none; | |
| 232 | -} | |
| 233 | - | |
| 234 | 182 | .event_list_unit:hover{ |
| 235 | 183 | box-shadow: 0 3px 23px 9px rgba(7,152,255,0.15); |
| 236 | 184 | background-color: #fcfcfc; |
| 237 | 185 | } |
| @@ -253,10 +201,9 @@ | ||
| 253 | 201 | flex-wrap: nowrap; |
| 254 | 202 | } |
| 255 | 203 | |
| 256 | 204 | |
| 257 | -/* Channel status badge (live/offline label) floating on the event card. */ | |
| 258 | -.wpstream_channel_status { | |
| 205 | +.wpstream_channel_status{ | |
| 259 | 206 | position: absolute; |
| 260 | 207 | background-color: rgb(255 255 255); |
| 261 | 208 | color: red; |
| 262 | 209 | border-radius: 5px; |
| @@ -265,14 +212,8 @@ | ||
| 265 | 212 | font-size: 12px; |
| 266 | 213 | padding: 4px 15px; |
| 267 | 214 | letter-spacing: 0.25px; |
| 268 | 215 | font-weight: 500; |
| 269 | - | |
| 270 | - .spinner { | |
| 271 | - display: block; | |
| 272 | - margin: 0 auto; | |
| 273 | - float: none; | |
| 274 | - } | |
| 275 | 216 | } |
| 276 | 217 | |
| 277 | 218 | .event_list_unit.wpstream_show_started .wpstream_channel_status{ |
| 278 | 219 | color: #209320; |
| @@ -278,9 +219,8 @@ | ||
| 278 | 219 | color: #209320; |
| 279 | 220 | } |
| 280 | 221 | |
| 281 | 222 | |
| 282 | -/* Small square icon buttons (edit, statistics, etc.) with their SVG icons. */ | |
| 283 | 223 | .wpstream-button-icon{ |
| 284 | 224 | width: 37px; |
| 285 | 225 | height: 37px; |
| 286 | 226 | border: 0px solid #f0f0f0; |
| @@ -312,21 +252,8 @@ | ||
| 312 | 252 | fill: #5b5b5b; |
| 313 | 253 | } |
| 314 | 254 | |
| 315 | 255 | |
| 316 | -/* Channel editor (block editor): the editor parks classic metaboxes under all of its own | |
| 317 | - document panels. Turn the document tab into a flex column and pull the metabox area | |
| 318 | - (which holds the Live Streaming panel) to the top so the channel controls come first. | |
| 319 | - Scoped to the channel post type; if the editor markup changes, the default order returns. */ | |
| 320 | -.block-editor-page.post-type-wpstream_product .editor-sidebar__panel > div:has(> .edit-post-meta-boxes-area.is-side){ | |
| 321 | - display: flex; | |
| 322 | - flex-direction: column; | |
| 323 | -} | |
| 324 | -.block-editor-page.post-type-wpstream_product .editor-sidebar__panel .edit-post-meta-boxes-area.is-side{ | |
| 325 | - order: -1; | |
| 326 | -} | |
| 327 | - | |
| 328 | -/* Gutenberg sidebar meta panel (#wpstream-sidebar-meta): compact overrides of the event card and its controls. */ | |
| 329 | 256 | #wpstream-sidebar-meta .event_list_unit{ |
| 330 | 257 | padding: 0px; |
| 331 | 258 | box-shadow: none; |
| 332 | 259 | margin: 0px; |
| @@ -369,68 +296,12 @@ | ||
| 369 | 296 | width:100%; |
| 370 | 297 | box-sizing: border-box; |
| 371 | 298 | } |
| 372 | 299 | |
| 373 | -/* The icon tooltips open below their button; on the last icon row they extend past | |
| 374 | - the metabox edge, so the box must not clip its overflow. */ | |
| 375 | -#wpstream-sidebar-meta.postbox{ | |
| 376 | - overflow: visible; | |
| 377 | -} | |
| 378 | - | |
| 379 | 300 | #wpstream-sidebar-meta .wpstream_event_streaming_local { |
| 380 | 301 | margin-left: 0px; |
| 381 | - overflow: auto; | |
| 382 | - padding-right: 20px; | |
| 383 | 302 | } |
| 384 | 303 | |
| 385 | -/* Scrollable column holding the local-streaming event options. */ | |
| 386 | -.wpstream_event_streaming_local{ | |
| 387 | - margin-left: 0px; | |
| 388 | - height: 458px; | |
| 389 | - overflow: auto; | |
| 390 | - padding-right: 20px; | |
| 391 | - width: 456px; | |
| 392 | - display: flex; | |
| 393 | - flex-direction: column; | |
| 394 | - flex-wrap: nowrap; | |
| 395 | -} | |
| 396 | - | |
| 397 | -/* Red "basic mode" notice banner. */ | |
| 398 | -.basic-mode-notice { | |
| 399 | - color:#fff; | |
| 400 | - background: #f40000; | |
| 401 | - box-shadow: 0 1px 1px 0 rgb(0 0 0 / 10%); | |
| 402 | - margin: 5px 0px 15px 0px; | |
| 403 | - font-size: 14px; | |
| 404 | - padding: 10px; | |
| 405 | - border-radius: 10px; | |
| 406 | -} | |
| 407 | - | |
| 408 | -.basic-mode-notice a { | |
| 409 | - color:#fff; | |
| 410 | - text-decoration: underline; | |
| 411 | -} | |
| 412 | - | |
| 413 | -/* Row wrapping a local-event option toggle and its info text; disabled toggle state. */ | |
| 414 | -.wpstream_local_event_options_toggle_wrapper { | |
| 415 | - display: flex; | |
| 416 | - gap: 25px; | |
| 417 | - padding-bottom: 10px; | |
| 418 | - border-bottom: 1px solid #e4e4e4; | |
| 419 | - margin-bottom: 10px; | |
| 420 | - max-width: 443px; | |
| 421 | -} | |
| 422 | - | |
| 423 | -.wpstream_local_event_options_toggle_wrapper .wpstream_local_event_options_toggle_info { | |
| 424 | - display: flex; | |
| 425 | - flex-direction: column; | |
| 426 | -} | |
| 427 | - | |
| 428 | -input[type="checkbox"]:disabled + .wpstream_slider.round { | |
| 429 | - background: #e4e4e4; | |
| 430 | - cursor: not-allowed; | |
| 431 | -} | |
| 432 | - | |
| 433 | 304 | #wpstream-sidebar-meta .external_software_streaming{ |
| 434 | 305 | margin-top: 10px; |
| 435 | 306 | } |
| 436 | 307 | |
| @@ -468,9 +339,8 @@ | ||
| 468 | 339 | display: none; |
| 469 | 340 | } |
| 470 | 341 | |
| 471 | 342 | |
| 472 | -/* Empty-state warning card shown when there are no events/channels. */ | |
| 473 | 343 | .no_events_warning{ |
| 474 | 344 | font-weight: bold; |
| 475 | 345 | font-size: 14px; |
| 476 | 346 | margin-left: 10px; |
| @@ -488,9 +358,8 @@ | ||
| 488 | 358 | .no_events_warning_mes{ |
| 489 | 359 | display: inline-block; |
| 490 | 360 | } |
| 491 | 361 | |
| 492 | -/* WpStream API connection status pills (connected green / not-connected red, plus top notice). */ | |
| 493 | 362 | .api_conected{ |
| 494 | 363 | background:#45a73f; |
| 495 | 364 | padding: 5px 10px; |
| 496 | 365 | color: #fff; |
| @@ -532,9 +401,8 @@ | ||
| 532 | 401 | .api_not_conected a{ |
| 533 | 402 | color:#fff; |
| 534 | 403 | } |
| 535 | 404 | |
| 536 | -/* Event card title typography and the channel-id caption. */ | |
| 537 | 405 | .event_list_unit .event_title, |
| 538 | 406 | .event_list_unit h3{ |
| 539 | 407 | font-weight: 500; |
| 540 | 408 | font-size: 16px; |
| @@ -547,9 +415,8 @@ | ||
| 547 | 415 | color: #5b5b5b; |
| 548 | 416 | font-size: 12px; |
| 549 | 417 | } |
| 550 | 418 | |
| 551 | -/* Action buttons: base .wpstream_button plus start/stop/turning-on/close/external variants and their hover states. */ | |
| 552 | 419 | .wpstream_button { |
| 553 | 420 | border-radius: 2px; |
| 554 | 421 | padding: 5px 5px; |
| 555 | 422 | -webkit-appearance: none; |
| @@ -565,12 +432,8 @@ | ||
| 565 | 432 | border-radius: 5px; |
| 566 | 433 | text-align: center; |
| 567 | 434 | display: inline-block; |
| 568 | 435 | margin-right: 10px; |
| 569 | - | |
| 570 | - .spinner { | |
| 571 | - float: none; | |
| 572 | - } | |
| 573 | 436 | } |
| 574 | 437 | |
| 575 | 438 | .wpstream_button:hover{ |
| 576 | 439 | background:#378532; |
| @@ -579,31 +442,20 @@ | ||
| 579 | 442 | .wpstream_button_action{ |
| 580 | 443 | padding: 12px 25px; |
| 581 | 444 | } |
| 582 | 445 | |
| 583 | -.default-channel-settings-info { | |
| 584 | - padding-bottom: 20px; | |
| 585 | - font-size: 14px; | |
| 586 | - line-height: 1.4rem;; | |
| 587 | -} | |
| 588 | - | |
| 589 | -.wpstream-save-settings { | |
| 590 | - display: flex; | |
| 591 | - align-items: center; | |
| 592 | -} | |
| 593 | - | |
| 594 | -.wpstream-save-settings-error { | |
| 595 | - color: #f00; | |
| 596 | -} | |
| 597 | - | |
| 598 | 446 | .start_event.wpstream_button{ |
| 599 | 447 | padding: 9px 20px; |
| 600 | 448 | width: auto; |
| 601 | 449 | min-width: 130px; |
| 450 | + color: #7a88a3; | |
| 451 | + border: 1px solid #3dc93d; | |
| 602 | 452 | color: #3b3b3b; |
| 453 | + background-color: #eaf2f7; | |
| 603 | 454 | background-color: #e8f7e8; |
| 604 | 455 | border: 1px solid #3dc93d85; |
| 605 | - height: auto; | |
| 456 | + | |
| 457 | + | |
| 606 | 458 | } |
| 607 | 459 | |
| 608 | 460 | |
| 609 | 461 | |
| @@ -625,12 +477,18 @@ | ||
| 625 | 477 | background: #45a73f; |
| 626 | 478 | color: #fff; |
| 627 | 479 | } |
| 628 | 480 | |
| 629 | -.stop_server{ | |
| 481 | +.stop_server, | |
| 482 | +.close_event.wpstream_button{ | |
| 630 | 483 | background: #c33a3a; |
| 631 | 484 | } |
| 632 | 485 | |
| 486 | +stop_server wpstream_button:hover, | |
| 487 | +.close_event.wpstream_button:hover{ | |
| 488 | + background: #d21009; | |
| 489 | +} | |
| 490 | + | |
| 633 | 491 | .record_wrapper, |
| 634 | 492 | .event_list_unit_notificationx{ |
| 635 | 493 | margin-bottom: 10px; |
| 636 | 494 | position:relative; |
| @@ -698,9 +556,8 @@ | ||
| 698 | 556 | background: #FF4C4C; |
| 699 | 557 | color: #fff; |
| 700 | 558 | } |
| 701 | 559 | |
| 702 | -/* "How to" panel and the external-software streaming info block. */ | |
| 703 | 560 | .how_to{ |
| 704 | 561 | margin-top:10px; |
| 705 | 562 | width: 100%; |
| 706 | 563 | height: auto; |
| @@ -737,9 +594,8 @@ | ||
| 737 | 594 | } |
| 738 | 595 | |
| 739 | 596 | |
| 740 | 597 | |
| 741 | -/* Stream-key wrapper and the server ready / not-ready live status indicators and error notices. */ | |
| 742 | 598 | .event_list_stream_key_wrap{ |
| 743 | 599 | margin-top:10px; |
| 744 | 600 | } |
| 745 | 601 | |
| @@ -793,9 +649,8 @@ | ||
| 793 | 649 | display:none; |
| 794 | 650 | margin-left: 10px; |
| 795 | 651 | } |
| 796 | 652 | |
| 797 | -/* RTMP live key/URI text fields, their copy buttons and the "start with Larix mobile" button. */ | |
| 798 | 653 | .wpstream_live_key_text, |
| 799 | 654 | .wpstream_live_uri_text{ |
| 800 | 655 | display: inline; |
| 801 | 656 | width: 250px; |
| @@ -820,11 +675,8 @@ | ||
| 820 | 675 | font-weight: 400; |
| 821 | 676 | letter-spacing: 0.03em; |
| 822 | 677 | border: 1px solid #5f83c8; |
| 823 | 678 | transition: 0.3s ease-out; |
| 824 | - -webkit-user-select: none; | |
| 825 | - -ms-user-select: none; | |
| 826 | - user-select: none; | |
| 827 | 679 | } |
| 828 | 680 | .wpstream_start_with_larix_mobile{ |
| 829 | 681 | background: #688ed8; |
| 830 | 682 | padding: 20px; |
| @@ -850,9 +702,8 @@ | ||
| 850 | 702 | .copy_live_uri:hover{ |
| 851 | 703 | background: #5878b5; |
| 852 | 704 | } |
| 853 | 705 | |
| 854 | -/* Subscription/pricing visibility toggles (hide when "movie on" mode). */ | |
| 855 | 706 | .show_if_subscription.hide_movieon{ |
| 856 | 707 | display:none; |
| 857 | 708 | } |
| 858 | 709 | |
| @@ -1007,9 +858,8 @@ | ||
| 1007 | 858 | color: #fff; |
| 1008 | 859 | display:none; |
| 1009 | 860 | } |
| 1010 | 861 | |
| 1011 | -/* Direct-upload container: drop area, progress bar and upload messages. */ | |
| 1012 | 862 | .wpstream_upload_container { |
| 1013 | 863 | background-color: #fff; |
| 1014 | 864 | padding: 20px; |
| 1015 | 865 | margin-bottom: 20px; |
| @@ -1079,9 +929,8 @@ | ||
| 1079 | 929 | background: #078407; |
| 1080 | 930 | margin: 10px; |
| 1081 | 931 | } |
| 1082 | 932 | |
| 1083 | -/* Custom file-input styling: visually hidden native input with a styled label acting as the button. */ | |
| 1084 | 933 | .js .inputfile { |
| 1085 | 934 | width: 0.1px; |
| 1086 | 935 | height: 0.1px; |
| 1087 | 936 | opacity: 0; |
| @@ -1141,28 +990,18 @@ | ||
| 1141 | 990 | .inputfile-1 + label:hover { |
| 1142 | 991 | background-color: #5a9544; |
| 1143 | 992 | } |
| 1144 | 993 | |
| 1145 | -/* Inline help tooltip trigger (question-mark link). */ | |
| 1146 | -.wpstream-tooltip { | |
| 1147 | - cursor: pointer; | |
| 1148 | - color: #0073aa; | |
| 1149 | - vertical-align: middle; | |
| 1150 | -} | |
| 1151 | 994 | |
| 1152 | -.wpstream-tooltip:hover { | |
| 1153 | - opacity: 0.8; | |
| 1154 | -} | |
| 1155 | - | |
| 1156 | -/* Per-event setting row wrapper and its help text. */ | |
| 1157 | 995 | .wpstream_setting_event_unit_wrapper{ |
| 1158 | 996 | position:relative; |
| 997 | + display: inline-block; | |
| 1159 | 998 | margin-bottom: 10px; |
| 1160 | 999 | width: 100%; |
| 1161 | 1000 | } |
| 1162 | 1001 | |
| 1163 | 1002 | .wpstream_setting_event_unit_wrapper .settings_details{ |
| 1164 | - max-width: 365px; | |
| 1003 | + max-width: 385px; | |
| 1165 | 1004 | } |
| 1166 | 1005 | |
| 1167 | 1006 | .wpstream_modal_form .wpstream_setting_event_unit_wrapper .settings_details{ |
| 1168 | 1007 | color: #666; |
| @@ -1170,16 +1009,15 @@ | ||
| 1170 | 1009 | } |
| 1171 | 1010 | |
| 1172 | 1011 | |
| 1173 | 1012 | |
| 1174 | -/* Toggle switch component: the ON/OFF sliding checkbox (label + slider + before/after states). */ | |
| 1175 | 1013 | label.wpstream_switch { |
| 1176 | - position: relative; | |
| 1014 | + position: absolute; | |
| 1177 | 1015 | display: inline-block; |
| 1178 | - width: 53px; | |
| 1179 | - min-width: 53px; | |
| 1016 | + width: 53px!important; | |
| 1180 | 1017 | height: 25px; |
| 1181 | 1018 | top: 12px; |
| 1019 | + left: 390px; | |
| 1182 | 1020 | } |
| 1183 | 1021 | |
| 1184 | 1022 | .wpstream_switch input { |
| 1185 | 1023 | opacity: 0; |
| @@ -1196,13 +1034,8 @@ | ||
| 1196 | 1034 | bottom: 0; |
| 1197 | 1035 | background-color: #ccc; |
| 1198 | 1036 | -webkit-transition: .4s; |
| 1199 | 1037 | transition: .4s; |
| 1200 | - text-align: center; | |
| 1201 | - line-height: 25px; | |
| 1202 | - font-size: 11px; | |
| 1203 | - font-weight: 500; | |
| 1204 | - color: #666; | |
| 1205 | 1038 | } |
| 1206 | 1039 | |
| 1207 | 1040 | .wpstream_slider:before { |
| 1208 | 1041 | position: absolute; |
| @@ -1213,35 +1046,14 @@ | ||
| 1213 | 1046 | bottom: 4px; |
| 1214 | 1047 | background-color: white; |
| 1215 | 1048 | -webkit-transition: .4s; |
| 1216 | 1049 | transition: .4s; |
| 1217 | - z-index: 1; | |
| 1218 | 1050 | } |
| 1219 | 1051 | |
| 1220 | -.wpstream_slider:after { | |
| 1221 | - content: "OFF"; | |
| 1222 | - position: absolute; | |
| 1223 | - left: 0; | |
| 1224 | - right: 0; | |
| 1225 | - top: 0; | |
| 1226 | - bottom: 0; | |
| 1227 | - line-height: 25px; | |
| 1228 | - z-index: 0; | |
| 1229 | - text-align: right; | |
| 1230 | - margin-right: 8px; | |
| 1231 | -} | |
| 1232 | - | |
| 1233 | 1052 | input:checked + .wpstream_slider { |
| 1234 | 1053 | background-color: #2196F3; |
| 1235 | - color: #fff; | |
| 1236 | 1054 | } |
| 1237 | 1055 | |
| 1238 | -input:checked + .wpstream_slider:after { | |
| 1239 | - content: "ON"; | |
| 1240 | - text-align: left; | |
| 1241 | - margin-left: 8px; | |
| 1242 | -} | |
| 1243 | - | |
| 1244 | 1056 | input:focus + .wpstream_slider { |
| 1245 | 1057 | box-shadow: 0 0 1px #2196F3; |
| 1246 | 1058 | } |
| 1247 | 1059 | |
| @@ -1259,22 +1071,19 @@ | ||
| 1259 | 1071 | .wpstream_slider.round:before { |
| 1260 | 1072 | border-radius: 50%; |
| 1261 | 1073 | } |
| 1262 | 1074 | |
| 1263 | -/* Setting-row label positioning inside the local-streaming column and the sidebar meta panel. */ | |
| 1264 | 1075 | .wpstream_event_streaming_local .wpstream_setting_event_unit_wrapper{ |
| 1265 | 1076 | margin-bottom: 10px; |
| 1266 | 1077 | } |
| 1267 | 1078 | |
| 1268 | -.wpstream_event_streaming_local .wpstream_setting_event_unit_wrapper label, | |
| 1269 | -.wpstream_local_event_options_toggle_wrapper .wpstream_local_event_options_toggle_info label { | |
| 1079 | +.wpstream_event_streaming_local .wpstream_setting_event_unit_wrapper label{ | |
| 1270 | 1080 | font-weight: 700; |
| 1271 | 1081 | font-size: 14px; |
| 1272 | - left: 395px; | |
| 1082 | + left:415px; | |
| 1273 | 1083 | } |
| 1274 | 1084 | |
| 1275 | -#wpstream-sidebar-meta .wpstream_setting_event_unit_wrapper label, | |
| 1276 | -.wpstream_page_wpstream_live_channels .event_list_unit .wpstream_setting_event_unit_wrapper label { | |
| 1085 | +#wpstream-sidebar-meta .wpstream_setting_event_unit_wrapper label{ | |
| 1277 | 1086 | left: auto; |
| 1278 | 1087 | right: 0px; |
| 1279 | 1088 | } |
| 1280 | 1089 | #wpstream-sidebar-meta .settings_details{ |
| @@ -1332,9 +1141,8 @@ | ||
| 1332 | 1141 | margin: 0px 0px; |
| 1333 | 1142 | } |
| 1334 | 1143 | |
| 1335 | 1144 | |
| 1336 | -/* "How to" videos help block. */ | |
| 1337 | 1145 | .how_to_videos{ |
| 1338 | 1146 | display: inline-block; |
| 1339 | 1147 | width: 100%; |
| 1340 | 1148 | |
| @@ -1340,9 +1148,8 @@ | ||
| 1340 | 1148 | |
| 1341 | 1149 | } |
| 1342 | 1150 | |
| 1343 | 1151 | |
| 1344 | -/* Pagination list for the channel/video listings. */ | |
| 1345 | 1152 | .wpstream_pagination{ |
| 1346 | 1153 | list-style: none; |
| 1347 | 1154 | display: inline; |
| 1348 | 1155 | float:left; |
| @@ -1374,9 +1181,8 @@ | ||
| 1374 | 1181 | } |
| 1375 | 1182 | |
| 1376 | 1183 | |
| 1377 | 1184 | |
| 1378 | -/* Modal dialog: dimmed backdrop, the centered form panel, its heading and close button. */ | |
| 1379 | 1185 | .wpstream_modal_background{ |
| 1380 | 1186 | position: fixed; |
| 1381 | 1187 | z-index: 1001; |
| 1382 | 1188 | top:0px; |
| @@ -1401,10 +1207,10 @@ | ||
| 1401 | 1207 | z-index: 1002; |
| 1402 | 1208 | padding: 30px; |
| 1403 | 1209 | border-radius: 5px; |
| 1404 | 1210 | } |
| 1405 | -.wpstream_modal_form.wpstream_settings_modal{ | |
| 1406 | - height: 600px; | |
| 1211 | +.wpstream_modal_form.wpestate_settings_modal{ | |
| 1212 | + height: 525px; | |
| 1407 | 1213 | margin-top: -257px; |
| 1408 | 1214 | } |
| 1409 | 1215 | |
| 1410 | 1216 | .wpstream_modal_form h3{ |
| @@ -1429,9 +1235,8 @@ | ||
| 1429 | 1235 | background-color: rgba(13,110,253,0.32); |
| 1430 | 1236 | } |
| 1431 | 1237 | |
| 1432 | 1238 | |
| 1433 | -/* Hover tooltips (enabled/disabled) with their caret arrows, including sidebar-meta positioning overrides. */ | |
| 1434 | 1239 | .wpstream_tooltip_wrapper{ |
| 1435 | 1240 | position: relative; |
| 1436 | 1241 | } |
| 1437 | 1242 | |
| @@ -1521,9 +1326,8 @@ | ||
| 1521 | 1326 | } |
| 1522 | 1327 | |
| 1523 | 1328 | |
| 1524 | 1329 | |
| 1525 | -/* Disabled/inactive icon state (dimmed, not-allowed cursor). */ | |
| 1526 | 1330 | .wpstream_inactive_icon{ |
| 1527 | 1331 | cursor: not-allowed; |
| 1528 | 1332 | } |
| 1529 | 1333 | .wpstream_inactive_icon svg{ |
| @@ -1529,9 +1333,8 @@ | ||
| 1529 | 1333 | .wpstream_inactive_icon svg{ |
| 1530 | 1334 | opacity: 0.35; |
| 1531 | 1335 | } |
| 1532 | 1336 | |
| 1533 | -/* Centered error notification modal and its OK button. */ | |
| 1534 | 1337 | .wpstream_error_modal_notification{ |
| 1535 | 1338 | width: 500px; |
| 1536 | 1339 | background-color: #fff; |
| 1537 | 1340 | position: fixed; |
| @@ -1557,9 +1360,8 @@ | ||
| 1557 | 1360 | margin-top: 20px; |
| 1558 | 1361 | } |
| 1559 | 1362 | |
| 1560 | 1363 | |
| 1561 | -/* Modal content: external-broadcast options, explanation lists and the printable QR code. */ | |
| 1562 | 1364 | .wpstream_external_broadcast_options{ |
| 1563 | 1365 | width: 50%; |
| 1564 | 1366 | border: 1px solid #6666; |
| 1565 | 1367 | } |
| @@ -1586,15 +1388,13 @@ | ||
| 1586 | 1388 | .print_qrcode{ |
| 1587 | 1389 | position: absolute; |
| 1588 | 1390 | top: 73px; |
| 1589 | 1391 | right: 12px; |
| 1590 | - width: 75px; | |
| 1591 | 1392 | } |
| 1592 | 1393 | |
| 1593 | 1394 | |
| 1594 | 1395 | |
| 1595 | 1396 | |
| 1596 | -/* Spinning circular loader indicator (used while actions are in progress). */ | |
| 1597 | 1397 | .wpstream_loader { |
| 1598 | 1398 | width: 8px; |
| 1599 | 1399 | height: 8px; |
| 1600 | 1400 | border: 1px solid #a5a8a4; |
| @@ -1619,20 +1419,17 @@ | ||
| 1619 | 1419 | border: 1px solid; |
| 1620 | 1420 | border-color: #FF3D00 transparent; |
| 1621 | 1421 | } |
| 1622 | 1422 | |
| 1623 | -/*.wpstream_options_help{*/ | |
| 1624 | -/* clear: both;*/ | |
| 1625 | -/* width: 51%;*/ | |
| 1626 | -/* display: inline-block;*/ | |
| 1627 | -/* position: relative;*/ | |
| 1628 | -/*}*/ | |
| 1423 | +.wpstream_options_help{ | |
| 1424 | + clear: both; | |
| 1425 | + width: 51%; | |
| 1426 | + display: inline-block; | |
| 1427 | + position: relative; | |
| 1428 | +} | |
| 1629 | 1429 | |
| 1630 | -/* Options help link (styled as a blue pill button). */ | |
| 1631 | 1430 | .wpstream_options_help a{ |
| 1632 | - display: inline-block; | |
| 1633 | - position: relative; | |
| 1634 | - white-space: nowrap; | |
| 1431 | + width: auto; | |
| 1635 | 1432 | background-color: green; |
| 1636 | 1433 | color: #fff; |
| 1637 | 1434 | border-radius: 3px; |
| 1638 | 1435 | padding: 5px 10px; |
| @@ -1637,14 +1434,16 @@ | ||
| 1637 | 1434 | border-radius: 3px; |
| 1638 | 1435 | padding: 5px 10px; |
| 1639 | 1436 | text-decoration: none; |
| 1640 | 1437 | background-color: #2196F3; |
| 1438 | + position: absolute; | |
| 1439 | + right: -51px; | |
| 1440 | + top: 0px; | |
| 1641 | 1441 | } |
| 1642 | 1442 | |
| 1643 | 1443 | |
| 1644 | 1444 | |
| 1645 | 1445 | |
| 1646 | -/* Responsive: tablet / narrow screens — stack event cards, full-width buttons, full-screen modals. */ | |
| 1647 | 1446 | @media only screen and (max-width:1099px){ |
| 1648 | 1447 | |
| 1649 | 1448 | .wpstream_upgrade_topbar{ |
| 1650 | 1449 | display: block; |
| @@ -1691,9 +1490,9 @@ | ||
| 1691 | 1490 | |
| 1692 | 1491 | .event_title{ |
| 1693 | 1492 | width: 100%; |
| 1694 | 1493 | } |
| 1695 | - .wpstream_modal_form.wpstream_settings_modal, | |
| 1494 | + .wpstream_modal_form.wpestate_settings_modal, | |
| 1696 | 1495 | .wpstream_modal_form { |
| 1697 | 1496 | z-index: 99999; |
| 1698 | 1497 | margin-top: 0px; |
| 1699 | 1498 | top: 0px; |
| @@ -1720,9 +1519,9 @@ | ||
| 1720 | 1519 | width: 100%; |
| 1721 | 1520 | box-sizing: border-box; |
| 1722 | 1521 | } |
| 1723 | 1522 | |
| 1724 | - .wpstream_modal_form.wpstream_settings_modal { | |
| 1523 | + .wpstream_modal_form.wpestate_settings_modal { | |
| 1725 | 1524 | height: 100%; |
| 1726 | 1525 | margin-top: 0px; |
| 1727 | 1526 | overflow-y: auto; |
| 1728 | 1527 | } |
| @@ -1741,9 +1540,8 @@ | ||
| 1741 | 1540 | |
| 1742 | 1541 | |
| 1743 | 1542 | |
| 1744 | 1543 | |
| 1745 | -/* Responsive: mobile — narrower broadcast details, wrapped copy buttons, break-all RTMP text. */ | |
| 1746 | 1544 | @media only screen and (max-width:500px){ |
| 1747 | 1545 | .external_software_streaming_details{ |
| 1748 | 1546 | width: 280px; |
| 1749 | 1547 | } |
| @@ -1758,17 +1556,6 @@ | ||
| 1758 | 1556 | .wpstream_live_uri_text.wpstream_larix_rtmp, |
| 1759 | 1557 | .wpstream_live_uri_text{ |
| 1760 | 1558 | width: 280px; |
| 1761 | 1559 | word-break: break-all; |
| 1762 | - } | |
| 1763 | -} | |
| 1764 | - | |
| 1765 | -/* Theme-side event list unit: spinner appearance (nested rule). */ | |
| 1766 | -.wpstream_theme_event_list_unit { | |
| 1767 | - .spinner { | |
| 1768 | - visibility: visible; | |
| 1769 | - background-repeat: no-repeat; | |
| 1770 | - height: 20px; | |
| 1771 | - background-size: contain; | |
| 1772 | - background-position-x: center; | |
| 1773 | 1560 | } |
| 1774 | 1561 | } |
