[FIX] web, *: fix buttons squashing and spacing
*: calendar, google_calendar, microsoft_calendar; task-3410165 part of task-3326263 X-original-commit: b680a6ac5769bf8e02921a9548792c7696992955 Part-of: odoo/odoo#129568
This commit is contained in:
@@ -4,17 +4,17 @@
|
||||
<DatePicker position="after">
|
||||
<div id="calendar_sync_wrapper" t-if="isSystemUser">
|
||||
<div id="calendar_sync_title" class="o_calendar_sync text-center">
|
||||
<span class="text-primary fs-6">Synchronize with:</span>
|
||||
<span>Synchronize with:</span>
|
||||
</div>
|
||||
<div id="calendar_sync" class="container inline btn-group justify-content-evenly align-items-center">
|
||||
<div id="calendar_sync" class="container btn-group justify-content-center align-items-center gap-2">
|
||||
<div id="google_calendar_sync" class="o_calendar_sync" t-if="isSystemUser">
|
||||
<button type="button" id="google_sync_activate" class="btn btn-muted" t-on-click="() => this.configureCalendarProviderSync('google')">
|
||||
<b><i class='fa fa-plug'/> Google</b>
|
||||
<button type="button" id="google_sync_activate" class="btn btn-light" t-on-click="() => this.configureCalendarProviderSync('google')">
|
||||
<b><i class='fa fa-plug fa-fw'/> Google</b>
|
||||
</button>
|
||||
</div>
|
||||
<div id="microsoft_calendar_sync" class="o_calendar_sync" t-if="isSystemUser">
|
||||
<button type="button" id="microsoft_sync_activate" class="btn btn-muted" t-on-click="() => this.configureCalendarProviderSync('microsoft')">
|
||||
<b><i class='fa fa-plug'/> Outlook</b>
|
||||
<button type="button" id="microsoft_sync_activate" class="btn btn-light" t-on-click="() => this.configureCalendarProviderSync('microsoft')">
|
||||
<b><i class='fa fa-plug fa-fw'/> Outlook</b>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,17 +1,10 @@
|
||||
.o_calendar_sidebar {
|
||||
.o_google_sync_button_configured {
|
||||
color: white;
|
||||
height: 2em;
|
||||
.o_calendar_sidebar .o_google_sync_button_configured {
|
||||
|
||||
&:hover {
|
||||
#google_check {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:not(:hover) {
|
||||
#google_stop {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:hover #google_check {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:not(:hover) #google_stop {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
+6
-6
@@ -6,16 +6,16 @@
|
||||
</xpath>
|
||||
<xpath expr="//div[@id='google_calendar_sync']" position="replace">
|
||||
<div id="google_calendar_sync" class="o_calendar_sync">
|
||||
<button t-if="!model.googleIsSync" type="button" id="google_sync_pending" class="o_google_sync_button o_google_sync_pending btn btn-secondary btn" t-on-click="onGoogleSyncCalendar">
|
||||
<button t-if="!model.googleIsSync" type="button" id="google_sync_pending" class="o_google_sync_button o_google_sync_pending btn btn-secondary text-nowrap" t-on-click="onGoogleSyncCalendar">
|
||||
<b><i class='fa fa-refresh'/> Google</b>
|
||||
</button>
|
||||
<!-- class change on hover -->
|
||||
<button t-else="" type="button" id="google_sync_configured" class="me-1 o_google_sync_button o_google_sync_button_configured btn text-bg-primary" t-on-click="onStopGoogleSynchronization"
|
||||
t-on-mouseenter="(ev) => {ev.target.classList.remove('text-bg-primary');ev.target.classList.add('text-bg-danger');}"
|
||||
t-on-mouseleave="(ev) => {ev.target.classList.remove('text-bg-danger');ev.target.classList.add('text-bg-primary');}">
|
||||
<button t-else="" type="button" id="google_sync_configured" class="me-1 o_google_sync_button o_google_sync_button_configured btn btn-outline-primary" t-on-click="onStopGoogleSynchronization"
|
||||
t-on-mouseenter="(ev) => {ev.target.classList.remove('btn-outline-primary');ev.target.classList.add('btn-danger');}"
|
||||
t-on-mouseleave="(ev) => {ev.target.classList.remove('btn-danger');ev.target.classList.add('btn-outline-primary');}">
|
||||
<b>
|
||||
<i id="google_check" class='fa fa-check'/>
|
||||
<i id="google_stop" class='fa fa-times'/>
|
||||
<i id="google_check" class='fa fa-check fa-fw'/>
|
||||
<i id="google_stop" class='fa fa-times fa-fw'/>
|
||||
<span class="mx-1">Google</span>
|
||||
</b>
|
||||
</button>
|
||||
|
||||
@@ -1,20 +1,10 @@
|
||||
.o_calendar_sidebar {
|
||||
.bg-primary {
|
||||
background-color: $o-enterprise-action-color;
|
||||
}
|
||||
.o_microsoft_sync_button_configured {
|
||||
color: white;
|
||||
height: 2em;
|
||||
.o_calendar_sidebar .o_microsoft_sync_button_configured {
|
||||
|
||||
&:hover {
|
||||
#microsoft_check {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:not(:hover) {
|
||||
#microsoft_stop {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:hover #microsoft_check {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:not(:hover) #microsoft_stop {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
+6
-6
@@ -6,16 +6,16 @@
|
||||
</xpath>
|
||||
<xpath expr="//div[@id='microsoft_calendar_sync']" position="replace">
|
||||
<div id="microsoft_calendar_sync" class="o_calendar_sync">
|
||||
<button t-if="!model.microsoftIsSync" type="button" id="microsoft_sync_pending" class="o_microsoft_sync_button o_microsoft_sync_pending btn btn-secondary btn" t-on-click="onMicrosoftSyncCalendar">
|
||||
<button t-if="!model.microsoftIsSync" type="button" id="microsoft_sync_pending" class="o_microsoft_sync_button o_microsoft_sync_pending btn btn-secondary text-nowrap" t-on-click="onMicrosoftSyncCalendar">
|
||||
<b><i class='fa fa-refresh'/> Outlook</b>
|
||||
</button>
|
||||
<!-- class change on hover -->
|
||||
<button t-else="" type="button" id="microsoft_sync_configured" class="me-1 o_microsoft_sync_button o_microsoft_sync_button_configured btn text-bg-primary" t-on-click="onStopMicrosoftSynchronization"
|
||||
t-on-mouseenter="(ev) => {ev.target.classList.remove('text-bg-primary');ev.target.classList.add('text-bg-danger');}"
|
||||
t-on-mouseleave="(ev) => {ev.target.classList.remove('text-bg-danger');ev.target.classList.add('text-bg-primary');}">
|
||||
<button t-else="" type="button" id="microsoft_sync_configured" class="me-1 o_microsoft_sync_button o_microsoft_sync_button_configured btn btn-outline-primary" t-on-click="onStopMicrosoftSynchronization"
|
||||
t-on-mouseenter="(ev) => {ev.target.classList.remove('btn-outline-primary');ev.target.classList.add('text-bg-danger');}"
|
||||
t-on-mouseleave="(ev) => {ev.target.classList.remove('text-bg-danger');ev.target.classList.add('btn-outline-primary');}">
|
||||
<b>
|
||||
<i id="microsoft_check" class='fa fa-check'/>
|
||||
<i id="microsoft_stop" class='fa fa-times'/>
|
||||
<i id="microsoft_check" class='fa fa-check fa-fw'/>
|
||||
<i id="microsoft_stop" class='fa fa-times fa-fw'/>
|
||||
<span class="mx-1">Outlook</span>
|
||||
</b>
|
||||
</button>
|
||||
|
||||
@@ -34,7 +34,7 @@ $o-cw-filter-avatar-size: 20px;
|
||||
}
|
||||
// sync buttons are only displayed on calendar.event views
|
||||
.o_calendar_sync {
|
||||
padding-top: 0.5em;
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user