PluginProbe
WpStream – Live Streaming, Video on Demand, Pay Per View / 4.8
WpStream – Live Streaming, Video on Demand, Pay Per View v4.8
4.14.1 4.14.0 4.13.2 4.13.1 4.13 4.12.5 4.12.4 4.12.3 4.12.2 4.12.1 4.12 4.4.4 4.4.5 4.4.6 4.4.7 4.4.8 4.4.9 4.5 4.5.1 4.5.11 4.5.11.1 4.5.11.2 4.5.11.4 4.5.11.5 4.5.11.6 All 181 releases
← All changes | admin/css/wpstream-admin.css +18 -92 4.14.14.8 View file →
@@ -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,9 +52,8 @@
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 }
@@ -138,9 +123,8 @@
138 123 width:100%;
139 124 margin-bottom: 10px;
140 125 }
141 126
142 -/* Section "pack details" cards (solid and transparent variants) grouping related settings. */
143 127 .pack_details_wrapper{
144 128 background-color: #fff;
145 129 padding: 20px;
146 130 margin-bottom: 20px;
@@ -164,9 +148,8 @@
164 148 }
165 149
166 150
167 151
168 -/* Utility classes toggling visibility of stream-data blocks. */
169 152 .hide_stream_data{
170 153 display:none;
171 154 }
172 155
@@ -175,9 +158,8 @@
175 158 display:block;
176 159 }
177 160
178 161
179 -/* Square channel/event thumbnail (background-image based). */
180 162 .event_thumb_wrapper{
181 163 margin-right: 15px;
182 164 min-width: 50px;
183 165 width: 50px;
@@ -190,9 +172,8 @@
190 172 }
191 173
192 174
193 175
194 -/* Live Channels list: the event card (event_list_unit), its title, hover/started states and column layout. */
195 176 .event_title{
196 177 width: 350px;
197 178 }
198 179 #wpstream-sidebar-meta .event_title{
@@ -253,9 +234,8 @@
253 234 flex-wrap: nowrap;
254 235 }
255 236
256 237
257 -/* Channel status badge (live/offline label) floating on the event card. */
258 238 .wpstream_channel_status {
259 239 position: absolute;
260 240 background-color: rgb(255 255 255);
261 241 color: red;
@@ -278,9 +258,8 @@
278 258 color: #209320;
279 259 }
280 260
281 261
282 -/* Small square icon buttons (edit, statistics, etc.) with their SVG icons. */
283 262 .wpstream-button-icon{
284 263 width: 37px;
285 264 height: 37px;
286 265 border: 0px solid #f0f0f0;
@@ -312,21 +291,8 @@
312 291 fill: #5b5b5b;
313 292 }
314 293
315 294
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 295 #wpstream-sidebar-meta .event_list_unit{
330 296 padding: 0px;
331 297 box-shadow: none;
332 298 margin: 0px;
@@ -369,21 +335,15 @@
369 335 width:100%;
370 336 box-sizing: border-box;
371 337 }
372 338
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 339 #wpstream-sidebar-meta .wpstream_event_streaming_local {
380 340 margin-left: 0px;
341 + height: 458px;
381 342 overflow: auto;
382 343 padding-right: 20px;
383 344 }
384 345
385 -/* Scrollable column holding the local-streaming event options. */
386 346 .wpstream_event_streaming_local{
387 347 margin-left: 0px;
388 348 height: 458px;
389 349 overflow: auto;
@@ -393,32 +353,15 @@
393 353 flex-direction: column;
394 354 flex-wrap: nowrap;
395 355 }
396 356
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 357 .wpstream_local_event_options_toggle_wrapper {
415 358 display: flex;
416 359 gap: 25px;
360 + padding-right: 20px;
417 361 padding-bottom: 10px;
418 362 border-bottom: 1px solid #e4e4e4;
419 363 margin-bottom: 10px;
420 - max-width: 443px;
421 364 }
422 365
423 366 .wpstream_local_event_options_toggle_wrapper .wpstream_local_event_options_toggle_info {
424 367 display: flex;
@@ -468,9 +411,8 @@
468 411 display: none;
469 412 }
470 413
471 414
472 -/* Empty-state warning card shown when there are no events/channels. */
473 415 .no_events_warning{
474 416 font-weight: bold;
475 417 font-size: 14px;
476 418 margin-left: 10px;
@@ -488,9 +430,8 @@
488 430 .no_events_warning_mes{
489 431 display: inline-block;
490 432 }
491 433
492 -/* WpStream API connection status pills (connected green / not-connected red, plus top notice). */
493 434 .api_conected{
494 435 background:#45a73f;
495 436 padding: 5px 10px;
496 437 color: #fff;
@@ -532,9 +473,8 @@
532 473 .api_not_conected a{
533 474 color:#fff;
534 475 }
535 476
536 -/* Event card title typography and the channel-id caption. */
537 477 .event_list_unit .event_title,
538 478 .event_list_unit h3{
539 479 font-weight: 500;
540 480 font-size: 16px;
@@ -547,9 +487,8 @@
547 487 color: #5b5b5b;
548 488 font-size: 12px;
549 489 }
550 490
551 -/* Action buttons: base .wpstream_button plus start/stop/turning-on/close/external variants and their hover states. */
552 491 .wpstream_button {
553 492 border-radius: 2px;
554 493 padding: 5px 5px;
555 494 -webkit-appearance: none;
@@ -598,12 +537,16 @@
598 537 .start_event.wpstream_button{
599 538 padding: 9px 20px;
600 539 width: auto;
601 540 min-width: 130px;
541 + color: #7a88a3;
542 + border: 1px solid #3dc93d;
602 543 color: #3b3b3b;
544 + background-color: #eaf2f7;
603 545 background-color: #e8f7e8;
604 546 border: 1px solid #3dc93d85;
605 - height: auto;
547 +
548 +
606 549 }
607 550
608 551
609 552
@@ -625,12 +568,18 @@
625 568 background: #45a73f;
626 569 color: #fff;
627 570 }
628 571
629 -.stop_server{
572 +.stop_server,
573 +.close_event.wpstream_button{
630 574 background: #c33a3a;
631 575 }
632 576
577 +stop_server wpstream_button:hover,
578 +.close_event.wpstream_button:hover{
579 + background: #d21009;
580 +}
581 +
633 582 .record_wrapper,
634 583 .event_list_unit_notificationx{
635 584 margin-bottom: 10px;
636 585 position:relative;
@@ -698,9 +647,8 @@
698 647 background: #FF4C4C;
699 648 color: #fff;
700 649 }
701 650
702 -/* "How to" panel and the external-software streaming info block. */
703 651 .how_to{
704 652 margin-top:10px;
705 653 width: 100%;
706 654 height: auto;
@@ -737,9 +685,8 @@
737 685 }
738 686
739 687
740 688
741 -/* Stream-key wrapper and the server ready / not-ready live status indicators and error notices. */
742 689 .event_list_stream_key_wrap{
743 690 margin-top:10px;
744 691 }
745 692
@@ -793,9 +740,8 @@
793 740 display:none;
794 741 margin-left: 10px;
795 742 }
796 743
797 -/* RTMP live key/URI text fields, their copy buttons and the "start with Larix mobile" button. */
798 744 .wpstream_live_key_text,
799 745 .wpstream_live_uri_text{
800 746 display: inline;
801 747 width: 250px;
@@ -850,9 +796,8 @@
850 796 .copy_live_uri:hover{
851 797 background: #5878b5;
852 798 }
853 799
854 -/* Subscription/pricing visibility toggles (hide when "movie on" mode). */
855 800 .show_if_subscription.hide_movieon{
856 801 display:none;
857 802 }
858 803
@@ -1007,9 +952,8 @@
1007 952 color: #fff;
1008 953 display:none;
1009 954 }
1010 955
1011 -/* Direct-upload container: drop area, progress bar and upload messages. */
1012 956 .wpstream_upload_container {
1013 957 background-color: #fff;
1014 958 padding: 20px;
1015 959 margin-bottom: 20px;
@@ -1079,9 +1023,8 @@
1079 1023 background: #078407;
1080 1024 margin: 10px;
1081 1025 }
1082 1026
1083 -/* Custom file-input styling: visually hidden native input with a styled label acting as the button. */
1084 1027 .js .inputfile {
1085 1028 width: 0.1px;
1086 1029 height: 0.1px;
1087 1030 opacity: 0;
@@ -1141,9 +1084,8 @@
1141 1084 .inputfile-1 + label:hover {
1142 1085 background-color: #5a9544;
1143 1086 }
1144 1087
1145 -/* Inline help tooltip trigger (question-mark link). */
1146 1088 .wpstream-tooltip {
1147 1089 cursor: pointer;
1148 1090 color: #0073aa;
1149 1091 vertical-align: middle;
@@ -1152,9 +1094,8 @@
1152 1094 .wpstream-tooltip:hover {
1153 1095 opacity: 0.8;
1154 1096 }
1155 1097
1156 -/* Per-event setting row wrapper and its help text. */
1157 1098 .wpstream_setting_event_unit_wrapper{
1158 1099 position:relative;
1159 1100 margin-bottom: 10px;
1160 1101 width: 100%;
@@ -1170,9 +1111,8 @@
1170 1111 }
1171 1112
1172 1113
1173 1114
1174 -/* Toggle switch component: the ON/OFF sliding checkbox (label + slider + before/after states). */
1175 1115 label.wpstream_switch {
1176 1116 position: relative;
1177 1117 display: inline-block;
1178 1118 width: 53px;
@@ -1259,9 +1199,8 @@
1259 1199 .wpstream_slider.round:before {
1260 1200 border-radius: 50%;
1261 1201 }
1262 1202
1263 -/* Setting-row label positioning inside the local-streaming column and the sidebar meta panel. */
1264 1203 .wpstream_event_streaming_local .wpstream_setting_event_unit_wrapper{
1265 1204 margin-bottom: 10px;
1266 1205 }
1267 1206
@@ -1271,10 +1210,9 @@
1271 1210 font-size: 14px;
1272 1211 left: 395px;
1273 1212 }
1274 1213
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 {
1214 +#wpstream-sidebar-meta .wpstream_setting_event_unit_wrapper label{
1277 1215 left: auto;
1278 1216 right: 0px;
1279 1217 }
1280 1218 #wpstream-sidebar-meta .settings_details{
@@ -1332,9 +1270,8 @@
1332 1270 margin: 0px 0px;
1333 1271 }
1334 1272
1335 1273
1336 -/* "How to" videos help block. */
1337 1274 .how_to_videos{
1338 1275 display: inline-block;
1339 1276 width: 100%;
1340 1277
@@ -1340,9 +1277,8 @@
1340 1277
1341 1278 }
1342 1279
1343 1280
1344 -/* Pagination list for the channel/video listings. */
1345 1281 .wpstream_pagination{
1346 1282 list-style: none;
1347 1283 display: inline;
1348 1284 float:left;
@@ -1374,9 +1310,8 @@
1374 1310 }
1375 1311
1376 1312
1377 1313
1378 -/* Modal dialog: dimmed backdrop, the centered form panel, its heading and close button. */
1379 1314 .wpstream_modal_background{
1380 1315 position: fixed;
1381 1316 z-index: 1001;
1382 1317 top:0px;
@@ -1401,9 +1336,9 @@
1401 1336 z-index: 1002;
1402 1337 padding: 30px;
1403 1338 border-radius: 5px;
1404 1339 }
1405 -.wpstream_modal_form.wpstream_settings_modal{
1340 +.wpstream_modal_form.wpestate_settings_modal{
1406 1341 height: 600px;
1407 1342 margin-top: -257px;
1408 1343 }
1409 1344
@@ -1429,9 +1364,8 @@
1429 1364 background-color: rgba(13,110,253,0.32);
1430 1365 }
1431 1366
1432 1367
1433 -/* Hover tooltips (enabled/disabled) with their caret arrows, including sidebar-meta positioning overrides. */
1434 1368 .wpstream_tooltip_wrapper{
1435 1369 position: relative;
1436 1370 }
1437 1371
@@ -1521,9 +1455,8 @@
1521 1455 }
1522 1456
1523 1457
1524 1458
1525 -/* Disabled/inactive icon state (dimmed, not-allowed cursor). */
1526 1459 .wpstream_inactive_icon{
1527 1460 cursor: not-allowed;
1528 1461 }
1529 1462 .wpstream_inactive_icon svg{
@@ -1529,9 +1462,8 @@
1529 1462 .wpstream_inactive_icon svg{
1530 1463 opacity: 0.35;
1531 1464 }
1532 1465
1533 -/* Centered error notification modal and its OK button. */
1534 1466 .wpstream_error_modal_notification{
1535 1467 width: 500px;
1536 1468 background-color: #fff;
1537 1469 position: fixed;
@@ -1557,9 +1489,8 @@
1557 1489 margin-top: 20px;
1558 1490 }
1559 1491
1560 1492
1561 -/* Modal content: external-broadcast options, explanation lists and the printable QR code. */
1562 1493 .wpstream_external_broadcast_options{
1563 1494 width: 50%;
1564 1495 border: 1px solid #6666;
1565 1496 }
@@ -1592,9 +1523,8 @@
1592 1523
1593 1524
1594 1525
1595 1526
1596 -/* Spinning circular loader indicator (used while actions are in progress). */
1597 1527 .wpstream_loader {
1598 1528 width: 8px;
1599 1529 height: 8px;
1600 1530 border: 1px solid #a5a8a4;
@@ -1626,9 +1556,8 @@
1626 1556 /* display: inline-block;*/
1627 1557 /* position: relative;*/
1628 1558 /*}*/
1629 1559
1630 -/* Options help link (styled as a blue pill button). */
1631 1560 .wpstream_options_help a{
1632 1561 display: inline-block;
1633 1562 position: relative;
1634 1563 white-space: nowrap;
@@ -1642,9 +1571,8 @@
1642 1571
1643 1572
1644 1573
1645 1574
1646 -/* Responsive: tablet / narrow screens — stack event cards, full-width buttons, full-screen modals. */
1647 1575 @media only screen and (max-width:1099px){
1648 1576
1649 1577 .wpstream_upgrade_topbar{
1650 1578 display: block;
@@ -1691,9 +1619,9 @@
1691 1619
1692 1620 .event_title{
1693 1621 width: 100%;
1694 1622 }
1695 - .wpstream_modal_form.wpstream_settings_modal,
1623 + .wpstream_modal_form.wpestate_settings_modal,
1696 1624 .wpstream_modal_form {
1697 1625 z-index: 99999;
1698 1626 margin-top: 0px;
1699 1627 top: 0px;
@@ -1720,9 +1648,9 @@
1720 1648 width: 100%;
1721 1649 box-sizing: border-box;
1722 1650 }
1723 1651
1724 - .wpstream_modal_form.wpstream_settings_modal {
1652 + .wpstream_modal_form.wpestate_settings_modal {
1725 1653 height: 100%;
1726 1654 margin-top: 0px;
1727 1655 overflow-y: auto;
1728 1656 }
@@ -1741,9 +1669,8 @@
1741 1669
1742 1670
1743 1671
1744 1672
1745 -/* Responsive: mobile — narrower broadcast details, wrapped copy buttons, break-all RTMP text. */
1746 1673 @media only screen and (max-width:500px){
1747 1674 .external_software_streaming_details{
1748 1675 width: 280px;
1749 1676 }
@@ -1761,9 +1688,8 @@
1761 1688 word-break: break-all;
1762 1689 }
1763 1690 }
1764 1691
1765 -/* Theme-side event list unit: spinner appearance (nested rule). */
1766 1692 .wpstream_theme_event_list_unit {
1767 1693 .spinner {
1768 1694 visibility: visible;
1769 1695 background-repeat: no-repeat;