PluginProbe
MxChat – AI Chatbot & Content Generation for WordPress / 3.2.25
MxChat – AI Chatbot & Content Generation for WordPress v3.2.25
3.2.25 3.2.24 3.2.23 3.2.22 3.2.21 3.2.20 3.2.19 3.2.18 3.2.17 3.2.16 3.2.15 3.2.14 3.2.12 3.2.13 3.2.11 3.2.10 3.2.9 3.2.8 3.2.7 3.2.6 3.2.5 3.2.4 3.2.3 3.2.2 3.2.1 All 156 releases
← All changes | css/knowledge-style.css +421 -27 3.2.1 → 3.2.25 View file →
@@ -266,8 +266,14 @@
266 266 border: 1px solid #e5e5e5;
267 267 text-align: center;
268 268 }
269 269
270 +/* YouTube import: multi-line radio/description stack reads left-aligned,
271 + unlike the single-row URL forms the centered default was made for. */
272 +#mxchat-youtube-input-area {
273 + text-align: left;
274 +}
275 +
270 276 /* PDF Upload Area */
271 277 #mxchat-pdf-upload-area input[type="file"] {
272 278 margin-bottom: 12px;
273 279 }
@@ -604,8 +610,19 @@
604 610 input:checked + .mxchat-toggle-slider:before {
605 611 transform: translateX(26px);
606 612 }
607 613
614 +/* Group-level ACF toggle, mixed state: some fields in the group are excluded.
615 + Knob parks mid-track on a washed-out tint of the brand gradient until the
616 + owner picks a side (plan bf57e0). */
617 +input:indeterminate + .mxchat-toggle-slider {
618 + background: linear-gradient(135deg, #e3b8dd, #b9b6e8);
619 +}
620 +
621 +input:indeterminate + .mxchat-toggle-slider:before {
622 + transform: translateX(13px);
623 +}
624 +
608 625 .mxchat-toggle-label {
609 626 font-size: 14px;
610 627 color: #333;
611 628 }
@@ -1205,8 +1222,12 @@
1205 1222 .rtl input:checked + .mxchat-toggle-slider:before {
1206 1223 transform: translateX(-26px);
1207 1224 }
1208 1225
1226 +.rtl input:indeterminate + .mxchat-toggle-slider:before {
1227 + transform: translateX(-13px);
1228 +}
1229 +
1209 1230 .rtl .mxchat-error-notice {
1210 1231 border-left: none;
1211 1232 border-right: 3px solid #f44336;
1212 1233 }
@@ -1274,20 +1295,36 @@
1274 1295
1275 1296 .mxchat-kb-modal-content {
1276 1297 position: relative;
1277 1298 background-color: #fff;
1278 - margin: 50px auto;
1299 + margin: 24px auto;
1279 1300 padding: 0;
1280 1301 border-radius: 8px;
1281 1302 box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
1282 1303 width: 90%;
1283 1304 max-width: 1000px;
1305 + /* The box is the ONLY place height is constrained; children flex within it.
1306 + dvh tracks the real visible viewport on mobile (vh line = older-browser fallback). */
1284 1307 max-height: 85vh;
1308 + max-height: min(85vh, calc(100dvh - 48px));
1285 1309 display: flex;
1286 1310 flex-direction: column;
1287 1311 animation: mxchat-kb-modal-appear 0.3s ease-out;
1288 1312 }
1289 1313
1314 +/* Fixed chrome rows never grow or shrink — the results list is the only scroller. */
1315 +.mxchat-kb-modal-header,
1316 +.mxchat-kb-modal-filters,
1317 +.mxchat-kb-selection-header,
1318 +.mxchat-kb-modal-footer {
1319 + flex: 0 0 auto;
1320 +}
1321 +
1322 +/* The footer holds the primary actions — it can never be squeezed out of the box. */
1323 +.mxchat-kb-modal-footer {
1324 + flex-shrink: 0;
1325 +}
1326 +
1290 1327 @keyframes mxchat-kb-modal-appear {
1291 1328 from {
1292 1329 opacity: 0;
1293 1330 transform: translateY(-30px);
@@ -1395,8 +1432,36 @@
1395 1432 outline: none;
1396 1433 box-shadow: 0 0 0 1px #7873f5;
1397 1434 }
1398 1435
1436 +/* Contextual note under the modal filter strip — only rendered for content types
1437 + that need one (currently Media). Continues the filter strip's own surface so it
1438 + reads as part of it rather than as a banner dropped on top. */
1439 +.mxchat-kb-filter-note {
1440 + display: flex;
1441 + align-items: center;
1442 + gap: 8px;
1443 + padding: 10px 20px;
1444 + background-color: #f8f9fa;
1445 + border-bottom: 1px solid #e5e5e5;
1446 + color: #555;
1447 + font-size: 13px;
1448 + line-height: 1.4;
1449 +}
1450 +
1451 +/* An author-level display value outranks the browser default for [hidden], so the
1452 + hidden state has to be restated here or the note would never hide. */
1453 +.mxchat-kb-filter-note[hidden] {
1454 + display: none;
1455 +}
1456 +
1457 +.mxchat-kb-filter-note-icon {
1458 + width: 16px;
1459 + height: 16px;
1460 + flex-shrink: 0;
1461 + color: #7873f5;
1462 +}
1463 +
1399 1464 /* Special style for the "processed" filter */
1400 1465 #mxchat-kb-processed-filter {
1401 1466 border-left: 3px solid #1e88e5;
1402 1467 }
@@ -1401,12 +1466,15 @@
1401 1466 border-left: 3px solid #1e88e5;
1402 1467 }
1403 1468
1404 1469 .mxchat-kb-content-selection {
1405 - overflow-y: auto;
1406 - flex: 1;
1407 - min-height: 300px;
1408 - max-height: calc(85vh - 200px);
1470 + /* Flexible middle region: header row stays put, the list below scrolls.
1471 + min-height: 0 is load-bearing — without it flex refuses to shrink this
1472 + column and the footer gets pushed out of the box (the mobile bug). */
1473 + flex: 1 1 auto;
1474 + min-height: 0;
1475 + display: flex;
1476 + flex-direction: column;
1409 1477 }
1410 1478
1411 1479 .mxchat-kb-selection-header {
1412 1480 display: flex;
@@ -1411,8 +1479,9 @@
1411 1479 .mxchat-kb-selection-header {
1412 1480 display: flex;
1413 1481 justify-content: space-between;
1414 1482 align-items: center;
1483 + gap: var(--mxch-spacing-md, 16px);
1415 1484 padding: 15px 20px;
1416 1485 background-color: #f8f9fa;
1417 1486 border-bottom: 1px solid #eee;
1418 1487 position: sticky;
@@ -1434,8 +1503,12 @@
1434 1503 }
1435 1504
1436 1505 .mxchat-kb-content-list {
1437 1506 padding: 0;
1507 + /* The one and only scroller inside the modal. */
1508 + flex: 1 1 auto;
1509 + min-height: 0;
1510 + overflow-y: auto;
1438 1511 }
1439 1512
1440 1513 .mxchat-kb-content-item {
1441 1514 display: flex;
@@ -1464,19 +1537,23 @@
1464 1537 align-items: flex-start;
1465 1538 padding-top: 3px;
1466 1539 }
1467 1540
1541 +/* Native control, brand-tinted — identical to the "select all" checkbox above the
1542 + list, which carries no custom styling at all and renders correctly.
1543 + Do NOT re-add width / height / border / border-radius / background here. WP admin
1544 + draws the tick as a 21px dashicon positioned with negative margins for its OWN
1545 + default box, so forcing a custom box makes the tick overflow it. That mismatch
1546 + shipped for a long time but was invisible while the tick was white-on-white. */
1468 1547 .mxchat-kb-content-checkbox input[type="checkbox"] {
1469 - width: 18px;
1470 - height: 18px;
1471 - border: 1px solid #8c8f94;
1472 - border-radius: 3px;
1473 - background: #fff;
1474 1548 margin: 0;
1549 + cursor: pointer;
1550 + accent-color: var(--mxch-primary, #7873f5);
1475 1551 }
1476 1552
1477 -.mxchat-kb-content-checkbox input[type="checkbox"]:checked {
1478 - border-color: #7873f5;
1553 +.mxchat-kb-content-checkbox input[type="checkbox"]:focus-visible {
1554 + outline: 2px solid var(--mxch-primary, #7873f5);
1555 + outline-offset: 2px;
1479 1556 }
1480 1557
1481 1558 .mxchat-kb-content-details {
1482 1559 flex: 1;
@@ -1848,38 +1925,70 @@
1848 1925
1849 1926 /* Modal responsive adjustments */
1850 1927 .mxchat-kb-modal-content {
1851 1928 width: 95%;
1852 - max-height: 90vh;
1853 - margin: 20px auto;
1929 + /* dvh = real visible viewport (mobile vh includes the URL-bar region);
1930 + vh line is the older-browser fallback. */
1931 + max-height: calc(100vh - 24px);
1932 + max-height: calc(100dvh - 24px);
1933 + margin: 12px auto;
1934 + /* Last-resort scroll: on extreme-short viewports (landscape phones)
1935 + the compacted chrome + the list's floor can still exceed the box —
1936 + scroll inside the box rather than clipping the footer. */
1937 + overflow-y: auto;
1854 1938 }
1855 -
1939 +
1940 + /* Compact the fixed chrome on mobile — stacked filters + a stacked footer
1941 + are tall, and every saved pixel goes to the content list. */
1942 + .mxchat-kb-modal-header {
1943 + padding: 12px 16px;
1944 + }
1945 +
1946 + .mxchat-kb-modal-header h3 {
1947 + font-size: 16px;
1948 + }
1949 +
1856 1950 .mxchat-kb-modal-filters {
1857 1951 flex-direction: column;
1858 1952 align-items: stretch;
1953 + padding: 10px 16px;
1954 + gap: 8px;
1859 1955 }
1860 -
1956 +
1861 1957 .mxchat-kb-search-group {
1862 1958 max-width: none;
1863 1959 }
1864 -
1960 +
1865 1961 .mxchat-kb-filter-group {
1866 1962 flex-direction: column;
1963 + gap: 8px;
1867 1964 }
1868 -
1869 - .mxchat-kb-content-selection {
1870 - max-height: calc(90vh - 250px);
1965 +
1966 + .mxchat-kb-filter-group select {
1967 + padding: 6px 30px 6px 10px;
1871 1968 }
1872 -
1969 +
1873 1970 .mxchat-kb-selection-header {
1874 1971 flex-direction: column;
1875 1972 align-items: flex-start;
1876 - gap: 10px;
1973 + gap: 6px;
1974 + padding: 10px 16px;
1877 1975 }
1878 -
1976 +
1977 + /* Guarantee a usable slice of visible rows — reachable buttons are no
1978 + help if there is nothing to select above them. */
1979 + .mxchat-kb-content-list {
1980 + min-height: 96px;
1981 + }
1982 +
1983 + .mxchat-kb-content-item {
1984 + padding: 10px 16px;
1985 + }
1986 +
1879 1987 .mxchat-kb-modal-footer {
1880 1988 flex-direction: column;
1881 - gap: 10px;
1989 + gap: 8px;
1990 + padding: 10px 16px;
1882 1991 }
1883 1992
1884 1993 .mxchat-kb-modal-footer .mxchat-kb-pagination {
1885 1994 width: 100%;
@@ -3749,13 +3858,18 @@
3749 3858 }
3750 3859
3751 3860 .mxchat-kb-edit-modal-content {
3752 3861 max-width: 760px;
3862 + /* Same viewport-safe cap as the content-selector modal (vh = fallback). */
3753 3863 max-height: 90vh;
3864 + max-height: min(90vh, calc(100dvh - 24px));
3754 3865 }
3755 3866
3756 3867 .mxchat-kb-edit-body {
3757 - flex: 1;
3868 + flex: 1 1 auto;
3869 + /* min-height: 0 lets the body shrink inside the capped modal box so the
3870 + footer (Save/Cancel) can never be pushed below the viewport. */
3871 + min-height: 0;
3758 3872 display: flex;
3759 3873 flex-direction: column;
3760 3874 padding: 20px;
3761 3875 overflow: hidden;
@@ -3808,8 +3922,10 @@
3808 3922 justify-content: space-between;
3809 3923 padding: 14px 20px;
3810 3924 border-top: 1px solid #e5e5e5;
3811 3925 gap: 12px;
3926 + /* Action row can never be squeezed out of the box. */
3927 + flex-shrink: 0;
3812 3928 }
3813 3929
3814 3930 .mxchat-kb-edit-notice {
3815 3931 flex: 1;
@@ -3823,8 +3939,45 @@
3823 3939 gap: 8px;
3824 3940 flex-shrink: 0;
3825 3941 }
3826 3942
3943 +/* ── Knowledge Inspector modal (plan-d8cb4b) ──────────────────────────
3944 + Read-only "View indexed content" viewer. Reuses the Testing tab's
3945 + match-card / chunk-detail components (admin-testing-tab.css, scoped under
3946 + .mxch-testing-results) so it looks native; this block only adds the modal
3947 + body scroll + the chunk-text container the Testing tab doesn't have. */
3948 +.mxchat-kb-inspect-body {
3949 + flex: 1 1 auto;
3950 + /* Same footer-pushout guard as the edit modal. */
3951 + min-height: 0;
3952 + display: flex;
3953 + flex-direction: column;
3954 + padding: 20px;
3955 + overflow-y: auto;
3956 + gap: 12px;
3957 +}
3958 +/* The modal body is the scroll container — let the inner results grow naturally
3959 + instead of the Testing tab's own 400px inner scroll (avoids a double scrollbar). */
3960 +.mxchat-kb-inspect-body .mxch-testing-results {
3961 + max-height: none;
3962 + overflow: visible;
3963 +}
3964 +.mxch-kb-inspect-chunk-text {
3965 + margin: 8px 0 0;
3966 + padding: 12px 14px;
3967 + background: #f8fafc;
3968 + border: 1px solid #e2e8f0;
3969 + border-radius: 6px;
3970 + max-height: 260px;
3971 + overflow-y: auto;
3972 + white-space: pre-wrap;
3973 + word-break: break-word;
3974 + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
3975 + font-size: 13px;
3976 + line-height: 1.6;
3977 + color: var(--mxch-text-primary, #334155);
3978 +}
3979 +
3827 3980 .mxchat-kb-edit-save-spinner {
3828 3981 display: inline-flex;
3829 3982 align-items: center;
3830 3983 gap: 6px;
@@ -3834,9 +3987,10 @@
3834 3987 .mxchat-kb-edit-modal-content {
3835 3988 width: 96%;
3836 3989 max-width: 96%;
3837 3990 margin: 10px auto;
3838 - max-height: 95vh;
3991 + max-height: calc(100vh - 20px);
3992 + max-height: calc(100dvh - 20px);
3839 3993 }
3840 3994 .mxchat-kb-edit-body {
3841 3995 padding: 14px;
3842 3996 }
@@ -3854,5 +4008,245 @@
3854 4008 .mxchat-kb-edit-actions .mxch-btn {
3855 4009 flex: 1;
3856 4010 text-align: center;
3857 4011 }
3858 -}
4012 +}
4013 +/* ==========================================================================
4014 + Custom Meta-key discovery picker (plan-mxchat-20260709-fe8e4e)
4015 + Canon-token chip picker mirroring the ACF discovery UX for non-ACF meta.
4016 + ========================================================================== */
4017 +.mxchat-meta-scan-controls {
4018 + display: flex;
4019 + align-items: center;
4020 + flex-wrap: wrap;
4021 + gap: 12px;
4022 + margin-bottom: 12px;
4023 +}
4024 +#mxchat-scan-meta-btn {
4025 + display: inline-flex;
4026 + align-items: center;
4027 + gap: 8px;
4028 +}
4029 +.mxchat-meta-scan-internal {
4030 + display: inline-flex;
4031 + align-items: center;
4032 + gap: 6px;
4033 + font-size: 13px;
4034 + color: var(--mxch-text-secondary, #64748b);
4035 + cursor: pointer;
4036 +}
4037 +.mxchat-meta-scan-loading,
4038 +.mxchat-meta-scan-empty {
4039 + font-size: 13px;
4040 + color: var(--mxch-text-secondary, #64748b);
4041 + margin: 8px 0 0;
4042 +}
4043 +.mxchat-meta-chip-grid {
4044 + display: grid;
4045 + grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
4046 + gap: 10px;
4047 + margin-top: 12px;
4048 +}
4049 +.mxchat-meta-chip {
4050 + display: flex;
4051 + flex-direction: column;
4052 + align-items: flex-start;
4053 + gap: 4px;
4054 + text-align: left;
4055 + width: 100%;
4056 + padding: 10px 12px;
4057 + background: var(--mxch-card-bg, #fff);
4058 + border: 1px solid var(--mxch-card-border, #e2e8f0);
4059 + border-radius: var(--mxch-radius-md, 8px);
4060 + cursor: pointer;
4061 + transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
4062 +}
4063 +.mxchat-meta-chip:hover {
4064 + border-color: var(--mxch-primary, #7873f5);
4065 + box-shadow: 0 1px 4px rgba(120, 115, 245, 0.15);
4066 +}
4067 +.mxchat-meta-chip-main {
4068 + display: flex;
4069 + align-items: baseline;
4070 + flex-wrap: wrap;
4071 + gap: 8px;
4072 +}
4073 +.mxchat-meta-chip-name {
4074 + font-weight: 600;
4075 + color: var(--mxch-text-primary, #1a1a2e);
4076 + font-size: 13px;
4077 +}
4078 +.mxchat-meta-chip-key {
4079 + font-family: monospace;
4080 + font-size: 11px;
4081 + color: var(--mxch-text-muted, #94a3b8);
4082 + background: #f1f5f9;
4083 + padding: 1px 6px;
4084 + border-radius: 4px;
4085 +}
4086 +.mxchat-meta-chip-meta {
4087 + font-size: 11px;
4088 + color: var(--mxch-text-muted, #94a3b8);
4089 + white-space: nowrap;
4090 + overflow: hidden;
4091 + text-overflow: ellipsis;
4092 + max-width: 100%;
4093 +}
4094 +.mxchat-meta-chip-tick {
4095 + font-size: 11px;
4096 + font-weight: 600;
4097 + color: var(--mxch-primary, #7873f5);
4098 + margin-top: 2px;
4099 +}
4100 +.mxchat-meta-chip.is-added {
4101 + border-color: var(--mxch-success, #10b981);
4102 + background: rgba(16, 185, 129, 0.06);
4103 + cursor: default;
4104 +}
4105 +.mxchat-meta-chip.is-added .mxchat-meta-chip-tick {
4106 + color: var(--mxch-success, #10b981);
4107 +}
4108 +@media (max-width: 782px) {
4109 + .mxchat-meta-chip-grid {
4110 + grid-template-columns: 1fr;
4111 + }
4112 +}
4113 +
4114 +/* ==========================================================================
4115 + Re-import affected entries (plan 89739b)
4116 + Layout only. Every colour, radius and space is a shell token; the badges,
4117 + notices, progress bar and disclosure are the shell's own.
4118 + ========================================================================== */
4119 +.mxch-kb-reimport [hidden] {
4120 + display: none;
4121 +}
4122 +.mxch-kb-reimport-controls {
4123 + display: flex;
4124 + align-items: flex-end;
4125 + flex-wrap: wrap;
4126 + gap: var(--mxch-spacing-md);
4127 + margin-top: var(--mxch-spacing-lg);
4128 +}
4129 +.mxch-kb-reimport-controls .mxch-field {
4130 + flex: 0 0 220px;
4131 + margin-bottom: 0;
4132 +}
4133 +.mxch-kb-reimport .mxch-btn[disabled] {
4134 + opacity: 0.55;
4135 + cursor: default;
4136 +}
4137 +/* Also rewrite edited entries: the toggle beside its label (plan a00ef8) */
4138 +.mxch-kb-reimport-edited {
4139 + display: flex;
4140 + align-items: flex-start;
4141 + gap: var(--mxch-spacing-sm);
4142 + margin-top: var(--mxch-spacing-md);
4143 +}
4144 +.mxch-kb-reimport-edited .toggle-switch {
4145 + flex: 0 0 auto;
4146 + margin-top: 2px;
4147 +}
4148 +.mxch-kb-reimport-edited .mxch-field-label {
4149 + margin-bottom: 2px;
4150 + cursor: pointer;
4151 +}
4152 +.mxch-kb-reimport-edited .mxch-field-description {
4153 + margin: 0;
4154 +}
4155 +.mxch-kb-reimport-progress,
4156 +.mxch-kb-reimport-error {
4157 + margin-top: var(--mxch-spacing-lg);
4158 +}
4159 +.mxch-kb-reimport-progress .mxch-progress-label {
4160 + margin-bottom: 0;
4161 +}
4162 +.mxch-kb-reimport-results {
4163 + margin-top: var(--mxch-spacing-lg);
4164 + padding-top: var(--mxch-spacing-lg);
4165 + border-top: 1px solid var(--mxch-card-border);
4166 +}
4167 +.mxch-kb-reimport-done {
4168 + margin-bottom: var(--mxch-spacing-md);
4169 +}
4170 +.mxch-kb-reimport-counts {
4171 + display: flex;
4172 + flex-wrap: wrap;
4173 + gap: var(--mxch-spacing-sm);
4174 +}
4175 +.mxch-kb-reimport-list {
4176 + list-style: none;
4177 + margin: var(--mxch-spacing-md) 0 0;
4178 + padding: 0;
4179 + max-height: 336px;
4180 + overflow-y: auto;
4181 + border: 1px solid var(--mxch-card-border);
4182 + border-radius: var(--mxch-radius-md);
4183 +}
4184 +.mxch-kb-reimport-list li {
4185 + display: flex;
4186 + align-items: center;
4187 + justify-content: space-between;
4188 + gap: var(--mxch-spacing-md);
4189 + margin: 0;
4190 + padding: var(--mxch-spacing-sm) var(--mxch-spacing-md);
4191 + border-top: 1px solid var(--mxch-card-border);
4192 + font-size: 13px;
4193 + line-height: 1.5;
4194 +}
4195 +.mxch-kb-reimport-list li:first-child {
4196 + border-top: 0;
4197 +}
4198 +.mxch-kb-reimport-source {
4199 + min-width: 0;
4200 + overflow-wrap: anywhere;
4201 + color: var(--mxch-text-primary);
4202 +}
4203 +.mxch-kb-reimport-note {
4204 + display: block;
4205 + font-size: 12px;
4206 + color: var(--mxch-text-secondary);
4207 +}
4208 +.mxch-kb-reimport-reasons {
4209 + display: flex;
4210 + flex-wrap: wrap;
4211 + justify-content: flex-end;
4212 + gap: var(--mxch-spacing-xs);
4213 + flex-shrink: 0;
4214 +}
4215 +.mxch-kb-reimport-notes {
4216 + margin-top: var(--mxch-spacing-sm);
4217 + border: 0;
4218 + border-radius: 0;
4219 +}
4220 +.mxch-kb-reimport-notes li {
4221 + padding-left: 0;
4222 + padding-right: 0;
4223 +}
4224 +.mxch-kb-reimport-footer {
4225 + display: flex;
4226 + align-items: center;
4227 + flex-wrap: wrap;
4228 + gap: var(--mxch-spacing-sm) var(--mxch-spacing-md);
4229 +}
4230 +.mxch-kb-reimport-footer .mxch-field-hint {
4231 + margin-top: 0;
4232 +}
4233 +@media (max-width: 600px) {
4234 + .mxch-kb-reimport-controls .mxch-field {
4235 + flex-basis: 100%;
4236 + }
4237 + .mxch-kb-reimport-controls .mxch-btn {
4238 + width: 100%;
4239 + justify-content: center;
4240 + }
4241 + .mxch-kb-reimport-list li {
4242 + flex-direction: column;
4243 + align-items: flex-start;
4244 + gap: var(--mxch-spacing-xs);
4245 + }
4246 + .mxch-kb-reimport-reasons {
4247 + justify-content: flex-start;
4248 + }
4249 + .mxch-kb-reimport-list {
4250 + max-height: 480px;
4251 + }
4252 +}