Fix dark theme colors and remove remaining DocuSeal branding

- Fix DaisyUI theme: base-200/300 changed from bright teal (#93bec7) to
  proper dark shades (#252525/#333333) so cards and surfaces blend with
  the dark background
- Fix neutral color from teal to dark (#2a2a2a) for proper button styling
- Replace all hardcoded bg-white with bg-base-300 in SCSS and Vue components
  so form inputs, checkboxes, radios, and buttons match the dark theme
- Update start_form logo partial from DocuSeal to Disruptive Records
- Fix autocomplete dropdown background colors for dark theme

https://claude.ai/code/session_01SMJoL1Hzz3b5qqDhyD63jF
pull/580/head
Claude 2 months ago
parent 66e6775227
commit a57d46b53c
No known key found for this signature in database

@ -48,11 +48,11 @@ button[disabled] .enabled, button.btn-disabled .enabled {
}
.base-input {
@apply input input-bordered bg-white;
@apply input input-bordered bg-base-300;
}
.base-textarea {
@apply textarea textarea-bordered bg-white rounded-3xl;
@apply textarea textarea-bordered bg-base-300 rounded-3xl;
}
.base-button {
@ -60,15 +60,15 @@ button[disabled] .enabled, button.btn-disabled .enabled {
}
.white-button {
@apply btn btn-outline text-base bg-white border-2;
@apply btn btn-outline text-base bg-base-300 border-2;
}
.base-checkbox {
@apply checkbox rounded bg-white checkbox-sm no-animation;
@apply checkbox rounded bg-base-300 checkbox-sm no-animation;
}
.base-radio {
@apply radio bg-white radio-sm no-animation;
@apply radio bg-base-300 radio-sm no-animation;
}
.base-select {
@ -115,7 +115,7 @@ button[disabled] .enabled, button.btn-disabled .enabled {
}
.autocomplete {
background: white;
background: #333333;
z-index: 1000;
font: 16px/25px "-apple-system", BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
overflow: auto;
@ -132,7 +132,7 @@ button[disabled] .enabled, button.btn-disabled .enabled {
}
.autocomplete .group {
background: #eee;
background: #3a3a3a;
}
.autocomplete > div:hover:not(.group),

@ -48,7 +48,7 @@ button[disabled] .enabled, button.btn-disabled .enabled {
}
.base-textarea {
@apply textarea textarea-bordered bg-white rounded-3xl;
@apply textarea textarea-bordered bg-base-300 rounded-3xl;
}
.btn {
@ -56,7 +56,7 @@ button[disabled] .enabled, button.btn-disabled .enabled {
}
.base-input {
@apply input input-bordered bg-white;
@apply input input-bordered bg-base-300;
}
.base-button {
@ -64,15 +64,15 @@ button[disabled] .enabled, button.btn-disabled .enabled {
}
.white-button {
@apply btn btn-outline text-base bg-white border-2;
@apply btn btn-outline text-base bg-base-300 border-2;
}
.base-checkbox {
@apply checkbox rounded bg-white checkbox-sm;
@apply checkbox rounded bg-base-300 checkbox-sm;
}
.base-radio {
@apply radio bg-white radio-sm;
@apply radio bg-base-300 radio-sm;
}
.font-times {

@ -559,7 +559,7 @@
:key="step[0].uuid"
href="#"
class="inline border border-base-300 h-3 w-3 rounded-full mx-1 mt-1"
:class="{ 'bg-base-300 steps-progress-current': index === currentStep, 'bg-base-content': (index < currentStep && stepFields[index].every((f) => !f.required || ![null, undefined, ''].includes(values[f.uuid]))) || isCompleted, 'bg-white': index > currentStep }"
:class="{ 'bg-base-300 steps-progress-current': index === currentStep, 'bg-base-content': (index < currentStep && stepFields[index].every((f) => !f.required || ![null, undefined, ''].includes(values[f.uuid]))) || isCompleted, 'bg-base-200': index > currentStep }"
@click.prevent="isCompleted ? '' : [saveStep(), goToStep(index, true)]"
/>
</div>

@ -120,7 +120,7 @@
id="kba_fn"
v-model="form.fn"
type="text"
class="input input-bordered !h-10 w-full bg-white"
class="input input-bordered !h-10 w-full bg-base-300"
required
>
</div>
@ -133,7 +133,7 @@
id="kba_ln"
v-model="form.ln"
type="text"
class="input input-bordered !h-10 w-full bg-white"
class="input input-bordered !h-10 w-full bg-base-300"
required
>
</div>
@ -146,7 +146,7 @@
id="kba_addr"
v-model="form.addr"
type="text"
class="input input-bordered !h-10 w-full bg-white"
class="input input-bordered !h-10 w-full bg-base-300"
required
>
</div>
@ -159,7 +159,7 @@
id="kba_city"
v-model="form.city"
type="text"
class="input input-bordered !h-10 w-full bg-white"
class="input input-bordered !h-10 w-full bg-base-300"
required
>
</div>
@ -171,7 +171,7 @@
<select
id="kba_state"
v-model="form.state"
class="select select-bordered !h-10 min-h-[2.5rem] w-full bg-white font-normal !text-base"
class="select select-bordered !h-10 min-h-[2.5rem] w-full bg-base-300 font-normal !text-base"
required
>
<option
@ -198,7 +198,7 @@
id="kba_zip"
v-model="form.zip"
type="text"
class="input input-bordered !h-10 w-full bg-white"
class="input input-bordered !h-10 w-full bg-base-300"
required
>
</div>
@ -211,7 +211,7 @@
id="kba_phone"
v-model="form.phone"
type="text"
class="input input-bordered !h-10 w-full bg-white"
class="input input-bordered !h-10 w-full bg-base-300"
required
>
</div>
@ -224,7 +224,7 @@
id="kba_email"
v-model="form.email"
type="email"
class="input input-bordered !h-10 w-full bg-white"
class="input input-bordered !h-10 w-full bg-base-300"
required
>
</div>
@ -237,7 +237,7 @@
id="kba_dob"
v-model="form.dob"
type="date"
class="input input-bordered !h-10 md:w-full bg-white"
class="input input-bordered !h-10 md:w-full bg-base-300"
required
>
</div>
@ -250,7 +250,7 @@
id="kba_ssn"
v-model="form.ssn"
type="text"
class="input input-bordered !h-10 w-full bg-white"
class="input input-bordered !h-10 w-full bg-base-300"
required
>
</div>

@ -1,6 +1,3 @@
<a href="/" class="flex justify-center items-center">
<span class="mr-3">
<%= render 'shared/logo', width: '50px', height: '50px' %>
</span>
<h1 class="text-5xl font-bold text-center">DocuSeal</h1>
</a>
<div class="flex justify-center py-4">
<img src="https://github.com/disruptiverecords/docuseal/blob/master/dr-logo.png?raw=true" alt="Disruptive Records" class="h-8">
</div>

@ -7,13 +7,14 @@ module.exports = {
{
docuseal: {
'color-scheme': 'dark',
primary: '#97b0b4',
primary: '#93bec7',
secondary: '#97b0b4',
accent: '#adada2',
neutral: '#93bec7',
neutral: '#2a2a2a',
'neutral-content': '#ededde',
'base-100': '#1a1a1a',
'base-200': '#93bec7',
'base-300': '#93bec7',
'base-200': '#252525',
'base-300': '#333333',
'base-content': '#ededde',
'--rounded-btn': '1.9rem',
'--tab-border': '2px',

Loading…
Cancel
Save