@blokkli/editor 2.0.0-alpha.51 → 2.0.0-alpha.53

package/dist/runtime/editor/features/publish/index.vue

@@ -133,3 +133,838 @@ export default {
   name: "Publish"
 };
 </script>
+
+<style>
+.bk .bk-publish-dialog-table td:nth-child(n + 2), .bk .bk-publish-dialog-table th:nth-child(n + 2) {
+
+    white-space: nowrap;
+
+    padding-left: 18px;
+
+    text-align: right;
+}
+      .bk .bk-publish-dialog-table td:first-child, .bk .bk-publish-dialog-table th:first-child {
+
+    width: 100%;
+}
+    .bk .bk-publish-dialog-table tr:has(input:checked) td {
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-mono-100) / var(--bk-tw-bg-opacity, 1));
+}
+    .bk .bk-publish-dialog-table tr.bk-is-success td {
+
+    background-color: rgb(var(--bk-theme-lime-light) / 0.4) !important;
+}
+    .bk .bk-publish-dialog-table tr.bk-is-success input:checked + span:before {
+
+    background-color: rgb(var(--bk-theme-lime-normal) / 0.5) !important;
+}
+    .bk .bk-publish-dialog-table tr.bk-is-error td {
+
+    background-color: rgb(var(--bk-theme-red-normal) / 0.1) !important;
+}
+    .bk .bk-publish-dialog-table tr.bk-is-error input:checked + span:before {
+
+    background-color: rgb(var(--bk-theme-red-normal) / 0.9) !important;
+}
+    .bk .bk-publish-dialog-table td.bk-is-status > div {
+
+    width: 60px;
+
+    display: flex;
+
+    align-items: center;
+
+    justify-content: flex-end;
+
+    gap: 10px;
+}
+    .bk .bk-publish-dialog-table tbody td:first-child {
+
+    padding-left: 3px;
+}
+    .bk .bk-publish-dialog-table .bk-icon-arrow-right-thin svg {
+
+    width: 15px;
+
+    height: 15px;
+}
+    .bk .bk-publish-dialog-table .bk-icon-loader svg {
+
+    margin-right: 15px;
+
+    height: 30px;
+
+    width: 30px;
+
+    fill: rgb(var(--bk-theme-mono-500) / 1);
+}
+  .bk .bk-publish-dialog-table + .bk-publish-dialog-table {
+
+    margin-top: 40px;
+}
+  .bk .bk-dialog-publish-form {
+
+    display: flex;
+
+    flex-direction: column;
+
+    min-height: calc(100vh - 500px);
+}
+  .bk .bk-dialog-publish-form .bk-heading-2 {
+
+    margin-bottom: 10px;
+
+    font-size: 20px;
+
+    line-height: 28px;
+
+    font-weight: 700;
+}
+  .bk .bk-publish-options {
+
+    margin-top: 20px;
+
+    margin-bottom: 20px;
+
+    display: grid;
+
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+
+    gap: 10px;
+}
+  .bk .bk-publish-option {
+
+    position: relative;
+
+    display: grid;
+
+    cursor: pointer;
+
+    grid-template-columns: auto 1fr;
+
+    align-items: center;
+
+    gap: 15px;
+
+    hyphens: auto;
+
+    line-height: 1;
+}
+  .bk .bk-publish-option.bk-is-disabled {
+
+    pointer-events: none;
+}
+  .bk .bk-publish-option.bk-is-disabled .bk-publish-option-icon {
+
+    --bk-tw-border-opacity: 1 !important;
+
+    border-color: rgb(var(--bk-theme-mono-300) / var(--bk-tw-border-opacity, 1)) !important;
+
+    --bk-tw-text-opacity: 1 !important;
+
+    color: rgb(var(--bk-theme-mono-300) / var(--bk-tw-text-opacity, 1)) !important;
+}
+  .bk .bk-publish-option.bk-is-disabled .bk-publish-option-label {
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-mono-300) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-option.bk-is-disabled .bk-publish-option-description {
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-mono-300) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-option input {
+
+    position: absolute;
+
+    top: 0px;
+
+    left: 0px;
+
+    appearance: none;
+
+    opacity: 0;
+}
+  .bk .bk-publish-option:has(input:checked) .bk-publish-option-label {
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-mono-950) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-option:has(input:checked) .bk-publish-option-icon-check {
+
+    visibility: visible;
+}
+  .bk .bk-publish-option.bk-is-red .bk-publish-option-icon {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-red-normal) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-red-normal) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-option.bk-is-red:hover .bk-publish-option-icon {
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-red-light) / var(--bk-tw-bg-opacity, 1));
+}
+  .bk .bk-publish-option.bk-is-red:has(input:checked) .bk-publish-option-icon {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-red-dark) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-red-normal) / var(--bk-tw-bg-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-red-light) / var(--bk-tw-text-opacity, 1));
+
+    --bk-tw-ring-offset-shadow: var(--bk-tw-ring-inset) 0 0 0 var(--bk-tw-ring-offset-width) var(--bk-tw-ring-offset-color);
+
+    --bk-tw-ring-shadow: var(--bk-tw-ring-inset) 0 0 0 calc(4px + var(--bk-tw-ring-offset-width)) var(--bk-tw-ring-color);
+
+    box-shadow: var(--bk-tw-ring-offset-shadow), var(--bk-tw-ring-shadow), var(--bk-tw-shadow, 0 0 #0000);
+
+    --bk-tw-ring-color: rgb(var(--bk-theme-red-normal) / 0.3);
+
+    outline-style: solid;
+
+    outline-width: 1px;
+
+    outline-color: rgb(var(--bk-theme-red-dark) / 0.6);
+}
+  .bk .bk-publish-option.bk-is-yellow .bk-publish-option-icon {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-yellow-normal) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-yellow-normal) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-option.bk-is-yellow:hover .bk-publish-option-icon {
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-yellow-light) / var(--bk-tw-bg-opacity, 1));
+}
+  .bk .bk-publish-option.bk-is-yellow:has(input:checked) .bk-publish-option-icon {
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-yellow-normal) / var(--bk-tw-bg-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-yellow-dark) / var(--bk-tw-text-opacity, 1));
+
+    --bk-tw-ring-offset-shadow: var(--bk-tw-ring-inset) 0 0 0 var(--bk-tw-ring-offset-width) var(--bk-tw-ring-offset-color);
+
+    --bk-tw-ring-shadow: var(--bk-tw-ring-inset) 0 0 0 calc(4px + var(--bk-tw-ring-offset-width)) var(--bk-tw-ring-color);
+
+    box-shadow: var(--bk-tw-ring-offset-shadow), var(--bk-tw-ring-shadow), var(--bk-tw-shadow, 0 0 #0000);
+
+    --bk-tw-ring-color: rgb(var(--bk-theme-yellow-normal) / 0.3);
+
+    outline-style: solid;
+
+    outline-width: 1px;
+
+    outline-color: rgb(var(--bk-theme-yellow-dark) / 0.7);
+}
+  .bk .bk-publish-option.bk-is-lime .bk-publish-option-icon {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-lime-normal) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-lime-normal) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-option.bk-is-lime:hover .bk-publish-option-icon {
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-lime-light) / var(--bk-tw-bg-opacity, 1));
+}
+  .bk .bk-publish-option.bk-is-lime:has(input:checked) .bk-publish-option-icon {
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-lime-normal) / var(--bk-tw-bg-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(255 255 255 / var(--bk-tw-text-opacity, 1));
+
+    outline-color: rgb(var(--bk-theme-lime-normal) / 0.3);
+
+    --bk-tw-ring-offset-shadow: var(--bk-tw-ring-inset) 0 0 0 var(--bk-tw-ring-offset-width) var(--bk-tw-ring-offset-color);
+
+    --bk-tw-ring-shadow: var(--bk-tw-ring-inset) 0 0 0 calc(4px + var(--bk-tw-ring-offset-width)) var(--bk-tw-ring-color);
+
+    box-shadow: var(--bk-tw-ring-offset-shadow), var(--bk-tw-ring-shadow), var(--bk-tw-shadow, 0 0 #0000);
+
+    --bk-tw-ring-color: rgb(var(--bk-theme-lime-normal) / 0.3);
+
+    outline-style: solid;
+
+    outline-width: 1px;
+
+    outline-color: rgb(var(--bk-theme-lime-dark) / 1);
+}
+  .bk .bk-publish-option-icon {
+
+    position: relative;
+
+    display: flex;
+
+    align-items: center;
+
+    justify-content: center;
+
+    gap: 10px;
+
+    border-radius: 9999px;
+
+    border-width: 1px;
+
+    width: 60px;
+
+    height: 60px;
+}
+  .bk .bk-publish-option-icon > .bk-icon {
+
+    width: 30px;
+
+    height: 30px;
+}
+  .bk .bk-publish-option-icon > .bk-icon svg {
+
+    width: 100%;
+
+    height: 100%;
+
+    fill: currentColor;
+}
+  .bk .bk-publish-option-icon-check {
+
+    visibility: hidden;
+
+    position: absolute;
+
+    top: -1px;
+
+    right: -9px;
+
+    display: flex;
+
+    align-items: center;
+
+    justify-content: center;
+
+    width: 20px;
+
+    height: 20px;
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-mono-950) / var(--bk-tw-bg-opacity, 1));
+
+    border-radius: 9999px;
+}
+  .bk .bk-publish-option-icon-check .bk-icon svg {
+
+    width: 13px;
+
+    height: 13px;
+
+    fill: currentColor;
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(255 255 255 / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-option-label {
+
+    font-size: 18px;
+
+    line-height: 28px;
+
+    font-weight: 700;
+
+    line-height: 1 !important;
+}
+  .bk .bk-publish-option-description {
+
+    margin-top: 3px;
+
+    text-wrap: balance;
+
+    font-size: 14px;
+
+    line-height: 20px;
+
+    line-height: 1.25;
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-mono-600) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-schedule-date-wrapper {
+
+    display: flex;
+
+    align-items: stretch;
+
+    gap: 20px;
+}
+  .bk .bk-publish-schedule-date-wrapper .bk-publish-scheduled-display {
+
+    display: flex;
+
+    flex: 1 1 0%;
+
+    align-items: center;
+
+    font-size: 20px;
+
+    line-height: 28px;
+
+    font-weight: 700;
+
+    border-radius: 6px;
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-yellow-light) / var(--bk-tw-bg-opacity, 1));
+
+    padding-left: 10px;
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-yellow-dark) / var(--bk-tw-text-opacity, 1));
+
+    border-width: 1px;
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-yellow-normal) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-numeric-spacing: tabular-nums;
+
+    font-variant-numeric: var(--bk-tw-ordinal) var(--bk-tw-slashed-zero) var(--bk-tw-numeric-figure) var(--bk-tw-numeric-spacing) var(--bk-tw-numeric-fraction);
+}
+  .bk .bk-publish-schedule-date-wrapper .bk-button {
+
+    flex-shrink: 1;
+
+    white-space: nowrap;
+}
+  .bk .bk-schedule-date {
+
+    display: flex;
+
+    flex: 1 1 0%;
+
+    gap: 20px;
+}
+  .bk .bk-schedule-date-picker {
+
+    width: 300px;
+
+    flex-shrink: 0;
+}
+  .bk .bk-schedule-date-time {
+
+    flex: 1 1 0%;
+}
+  .bk .bk-schedule-date-time .bk-form-label {
+
+    margin-bottom: 5px;
+}
+  .bk .bk-schedule-date-time input[type='time'] {
+
+    width: 100%;
+
+    --bk-tw-numeric-spacing: tabular-nums;
+
+    font-variant-numeric: var(--bk-tw-ordinal) var(--bk-tw-slashed-zero) var(--bk-tw-numeric-figure) var(--bk-tw-numeric-spacing) var(--bk-tw-numeric-fraction);
+}
+  .bk .bk-schedule-date-time-input {
+
+    display: flex;
+
+    align-items: stretch;
+
+    gap: 10px;
+}
+  .bk .bk-schedule-date-time-input input[type='time'] {
+
+    flex: 1 1 0%;
+}
+  .bk .bk-schedule-date-time-input .bk-schedule-date-time-button {
+
+    flex-shrink: 0;
+
+    padding-left: 10px;
+
+    padding-right: 10px;
+}
+  .bk .bk-schedule-date-time-input .bk-schedule-date-time-button .bk-icon {
+
+    width: 15px;
+
+    height: 15px;
+}
+  .bk .bk-schedule-date-time-input .bk-schedule-date-time-button .bk-icon svg {
+
+    width: 100%;
+
+    height: 100%;
+
+    fill: currentColor;
+}
+  .bk .bk-schedule-date-formatted {
+
+    margin-bottom: 20px;
+
+    border-radius: 6px;
+
+    padding-left: 10px;
+
+    padding-right: 10px;
+
+    font-size: 18px;
+
+    line-height: 28px;
+
+    font-weight: 700;
+    /* @apply border border-mono-300; */
+    --bk-tw-bg-opacity: 1;
+    background-color: rgb(var(--bk-theme-mono-100) / var(--bk-tw-bg-opacity, 1));
+    display: flex;
+    height: 52px;
+    align-items: center;
+}
+  .bk .bk-schedule-date-info {
+
+    margin-top: 20px;
+
+    border-radius: 6px;
+
+    border-width: 1px;
+
+    border-color: rgb(var(--bk-theme-yellow-normal) / 0.6);
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-yellow-light) / var(--bk-tw-bg-opacity, 1));
+
+    padding: 10px;
+
+    font-weight: 500;
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-yellow-dark) / var(--bk-tw-text-opacity, 1));
+
+    text-wrap: pretty;
+
+    font-size: 14px;
+
+    line-height: 20px;
+}
+  .bk .bk-publish-summary {
+
+    display: flex;
+
+    align-items: center;
+
+    justify-content: space-between;
+}
+  .bk .bk-publish-summary-state,
+  .bk .bk-publish-summary-action {
+
+    position: relative;
+
+    display: flex;
+
+    align-items: center;
+
+    justify-content: center;
+
+    gap: 5px;
+}
+  .bk .bk-publish-summary-state:nth-child(1):after, .bk .bk-publish-summary-state:nth-child(2):after, .bk .bk-publish-summary-action:nth-child(1):after, .bk .bk-publish-summary-action:nth-child(2):after {
+        content: '';
+      }
+  .bk .bk-publish-summary-state:last-child {
+
+    border-radius: 9999px;
+
+    border-width: 1px;
+
+    padding-right: 10px;
+}
+  .bk .bk-publish-summary-state:last-child .bk-publish-summary-state-label {
+
+    padding-right: 5px;
+
+    font-weight: 600;
+
+    line-height: 1;
+}
+  .bk .bk-publish-summary-state:last-child svg {
+
+    width: 15px;
+
+    height: 15px;
+}
+  .bk .bk-publish-summary-state:last-child .bk-icon {
+
+    display: flex;
+
+    width: 25px;
+
+    height: 25px;
+
+    align-items: center;
+
+    justify-content: center;
+
+    border-radius: 9999px;
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(255 255 255 / var(--bk-tw-bg-opacity, 1));
+}
+  .bk .bk-publish-summary-state:last-child.bk-is-published {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-lime-normal) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-lime-normal) / var(--bk-tw-bg-opacity, 1));
+}
+  .bk .bk-publish-summary-state:last-child.bk-is-published .bk-icon svg {
+
+    fill: rgb(var(--bk-theme-lime-normal) / 1);
+}
+  .bk .bk-publish-summary-state:last-child.bk-is-published .bk-publish-summary-state-label {
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(255 255 255 / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-summary-state:last-child.bk-is-unpublished {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-red-normal) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-red-normal) / var(--bk-tw-bg-opacity, 1));
+}
+  .bk .bk-publish-summary-state:last-child.bk-is-unpublished .bk-icon svg {
+
+    fill: rgb(var(--bk-theme-red-normal) / 1);
+}
+  .bk .bk-publish-summary-state:last-child.bk-is-unpublished .bk-publish-summary-state-label {
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(255 255 255 / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-summary-state-icon,
+  .bk .bk-publish-summary-action-icon {
+
+    display: flex;
+
+    width: 25px;
+
+    height: 25px;
+
+    align-items: center;
+
+    justify-content: center;
+
+    border-radius: 9999px;
+
+    border-width: 1px;
+}
+  .bk .bk-publish-summary-state-icon .bk-icon, .bk .bk-publish-summary-action-icon .bk-icon {
+
+    width: 15px;
+
+    height: 15px;
+}
+  .bk .bk-publish-summary-state-icon .bk-icon svg, .bk .bk-publish-summary-action-icon .bk-icon svg {
+
+    width: 100%;
+
+    height: 100%;
+
+    fill: currentColor;
+}
+  .bk .bk-publish-summary-state-icon.bk-is-published {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-lime-normal) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-lime-normal) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-summary-state-icon.bk-is-unpublished {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-red-normal) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-red-normal) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-summary-state-label,
+  .bk .bk-publish-summary-action-label {
+
+    text-align: center;
+
+    font-size: 14px;
+
+    line-height: 20px;
+
+    font-weight: 500;
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-mono-700) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-summary-arrow {
+
+    display: flex;
+
+    align-items: center;
+}
+  .bk .bk-publish-summary-arrow .bk-icon {
+
+    width: 20px;
+
+    height: 20px;
+}
+  .bk .bk-publish-summary-arrow .bk-icon svg {
+
+    width: 100%;
+
+    height: 100%;
+
+    fill: rgb(var(--bk-theme-mono-700) / 1);
+}
+  .bk .bk-publish-summary-action-icon.bk-is-save {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-red-dark) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-red-normal) / var(--bk-tw-bg-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(255 255 255 / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-summary-action-icon.bk-is-scheduled {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-yellow-dark) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-yellow-normal) / var(--bk-tw-bg-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-yellow-dark) / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-publish-summary-action-icon.bk-is-publish {
+
+    --bk-tw-border-opacity: 1;
+
+    border-color: rgb(var(--bk-theme-lime-dark) / var(--bk-tw-border-opacity, 1));
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-lime-normal) / var(--bk-tw-bg-opacity, 1));
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(255 255 255 / var(--bk-tw-text-opacity, 1));
+}
+  .bk .bk-schedule-date-error {
+
+    margin-top: 20px;
+
+    border-radius: 6px;
+
+    border-width: 1px;
+
+    border-color: rgb(var(--bk-theme-red-normal) / 0.6);
+
+    --bk-tw-bg-opacity: 1;
+
+    background-color: rgb(var(--bk-theme-red-light) / var(--bk-tw-bg-opacity, 1));
+
+    padding: 10px;
+
+    font-weight: 500;
+
+    --bk-tw-text-opacity: 1;
+
+    color: rgb(var(--bk-theme-red-dark) / var(--bk-tw-text-opacity, 1));
+
+    text-wrap: pretty;
+
+    font-size: 14px;
+
+    line-height: 20px;
+}
+.bk.bk-is-publish-dialog .bk-dialog-content .bk-dialog-content-inner {
+
+    padding-bottom: 0px;
+}
+.bk.bk-is-publish-dialog .bk-dialog-footer {
+
+    margin-top: 0px;
+}
+.bk.bk-is-publish-dialog .bk-form-item {
+
+    padding-top: 20px;
+
+    padding-bottom: 20px;
+}
+.bk.bk-is-publish-dialog .bk-form-item:first-child {
+
+    padding-top: 0px;
+}
+</style>