2
0
mirror of https://github.com/frappe/books.git synced 2024-11-09 23:30:56 +00:00

incr: change scrollbar color

- actuall remove border
This commit is contained in:
18alantom 2023-02-24 13:29:11 +05:30
parent c3dae8cce2
commit b0c23a6295
2 changed files with 52 additions and 57 deletions

View File

@ -1,9 +1,6 @@
<template>
<div>
<PageHeader :title="t`Template Builder`">
<Button v-if="displayDoc" @click="showHint = true">{{
t`Show Hint`
}}</Button>
<Button v-if="displayDoc && doc?.template" @click="makePDF">
{{ t`Save as PDF` }}
</Button>
@ -180,62 +177,62 @@
</div>
</div>
<!-- Hint Modal -->
<Modal
@closemodal="() => (showHint = false)"
:open-modal="showHint"
v-if="displayDoc && hint"
>
<div class="w-form">
<!-- Hint Modal Header -->
<FormHeader
:form-title="t`Hint`"
:form-sub-title="displayDoc.schema.label"
/>
<hr />
<div class="p-4 max-h-96 overflow-auto custom-scroll">
<TemplateBuilderHint :hint="hint" />
</div>
</div>
</Modal>
<!-- Editor Modal -->
<Modal
v-if="doc"
@closemodal="() => (showEditor = false)"
:open-modal="showEditor"
>
<div>
<!-- Hint Modal Header -->
<FormHeader :form-title="t`Template Editor`" />
<hr />
<div class="p-4">
<textarea
v-if="!templateCollapsed"
style="
font-family: monospace;
white-space: pre;
overflow-wrap: normal;
resize: both;
"
:value="doc.template ?? ''"
:spellcheck="false"
cols="74"
rows="30"
class="
overflow-auto
p-2
border
rounded
text-sm text-gray-900
focus-within:bg-gray-100
outline-none
bg-gray-50
"
@change="
<div class="flex">
<!-- Hint Section Header -->
<div class="border-r" v-if="hint">
<h2 class="text-base font-semibold p-4 border-b">
{{ t`Value Keys` }}
</h2>
<div
class="overflow-auto custom-scroll p-4"
style="max-height: 80vh; width: 25vw"
>
<TemplateBuilderHint :hint="hint" />
</div>
</div>
<!-- Template Editor Section -->
<div>
<h2 class="text-base font-semibold p-4 border-b">
{{ t`Template` }}
</h2>
<div
class="overflow-auto custom-scroll p-4"
style="max-height: 80vh; max-width: 65vw"
>
<textarea
v-if="!templateCollapsed"
style="
font-family: monospace;
white-space: pre;
overflow-wrap: normal;
resize: both;
"
:value="doc.template ?? ''"
:spellcheck="false"
cols="74"
rows="31"
class="
overflow-auto
p-2
border
rounded
text-sm text-gray-900
focus-within:bg-gray-100
outline-none
bg-gray-50
"
@change="
async (e: Event) => await doc?.set('template', (e.target as HTMLTextAreaElement).value)
"
></textarea>
></textarea>
</div>
</div>
</div>
</Modal>
@ -283,7 +280,6 @@ export default defineComponent({
data() {
return {
doc: null,
showHint: false,
showEditor: false,
hint: null,
values: null,
@ -296,7 +292,6 @@ export default defineComponent({
values: null | Record<string, unknown>;
doc: PrintTemplate | null;
showEditor: boolean;
showHint: boolean;
displayDoc: PrintTemplate | null;
templateCollapsed: boolean;
helpersCollapsed: boolean;

View File

@ -133,19 +133,19 @@ input[type='number']::-webkit-inner-spin-button {
}
.custom-scroll::-webkit-scrollbar-track:vertical {
border-left: solid 1px theme('colors.gray.200');
border-left: solid 1px theme('colors.gray.100');
}
.custom-scroll::-webkit-scrollbar-track:horizontal {
border-top: solid 1px theme('colors.gray.200');
border-top: solid 1px theme('colors.gray.100');
}
.custom-scroll::-webkit-scrollbar-thumb {
background: theme('colors.gray.200');
background: theme('colors.gray.100');
}
.custom-scroll::-webkit-scrollbar-thumb:hover {
background: theme('colors.gray.400');
background: theme('colors.gray.200');
}
/*