Fix arrow + spacing + styling

This commit is contained in:
DianaXWiki 2025-08-18 12:20:26 +03:00
parent 6479a14983
commit e1314c80d4
2 changed files with 29 additions and 7 deletions

View File

@ -171,16 +171,16 @@
color: @cryptpad_text_col;
border-radius: @variables_radius_L;
font-weight: normal;
.tui-full-calendar-icon:not(.tui-full-calendar-calendar-dot):not(.tui-full-calendar-dropdown-arrow):not(.tui-full-calendar-ic-checkbox):not(.fa-map-marker):not(.fa-align-left) {
.tui-full-calendar-icon:not(.tui-full-calendar-calendar-dot):not(.tui-full-calendar-dropdown-arrow):not(.tui-full-calendar-ic-checkbox):not(.fa-map-marker):not(.fa-align-left):not(.tui-full-calendar-dropdown-arrow-custom) {
display: none;
}
.tui-full-calendar-icon {
text-align:center;
flex-shrink: 0;
}
.tui-full-calendar-calendar-dot {
margin-right: 10px;
top: 0;
.tui-full-calendar-dropdown-arrow-custom i{
font-size: 14px;
color: @cryptpad_text_col;
}
.tui-full-calendar-popup-detail-item {
display: flex;
@ -241,7 +241,7 @@
margin: 0;
&:not(li):not(button) {
padding: 0;
margin-top: 5px;
margin-top: 0.5rem;
}
#tui-full-calendar-schedule-calendar {
width: 179px;
@ -278,6 +278,17 @@
width: 221px; // same as button
background-color: @cp_dropdown-bg;
color: @cp_dropdown-fg;
border-radius: 0 0 @variables_radius @variables_radius;
li.tui-full-calendar-dropdown-menu-item {
span.tui-full-calendar-content {
font-size: 14px;
}
}
}
button.tui-full-calendar-popup-section-item.btn.btn-secondary {
&[aria-expanded="true"] {
border-radius: @variables_radius @variables_radius 0 0;
}
}
.tui-full-calendar-section-state, #tui-full-calendar-schedule-private {
display: none !important;
@ -291,6 +302,7 @@
display: flex;
align-items: center;
flex-wrap: wrap;
min-height: 0; // override default tui 40px
.tui-full-calendar-section-start-date, .tui-full-calendar-section-end-date {
flex: 1;
}
@ -307,7 +319,7 @@
}
}
.CodeMirror {
margin-top: 5px;
margin-top: 0.5rem;
background: @cp_forms-bg !important;
color: @cryptpad_text_col;
border: 1px solid @cp_forms-border;

View File

@ -2203,6 +2203,7 @@ APP.recurrenceRule = {
$el.find('.tui-full-calendar-confirm').addClass('btn btn-primary').prepend(h('i.fa.fa-floppy-o', {'aria-hidden': 'true'}));
$el.find('input').attr('autocomplete', 'off');
$el.find('.tui-full-calendar-dropdown-button').addClass('btn btn-secondary');
$el.find('.tui-full-calendar-dropdown-arrow').append(h('i.fa.fa-caret-down', {'aria-hidden': 'true'})).removeClass('tui-full-calendar-dropdown-arrow').addClass('tui-full-calendar-dropdown-arrow-custom');
$el.find('.tui-full-calendar-popup-close').addClass('btn btn-cancel fa fa-times cp-calendar-close').empty();
$el.find('.tui-full-calendar-section-allday').attr('tabindex', 0);
$el.find('.cp-calendar-close').attr('tabindex',-1);
@ -2288,13 +2289,21 @@ APP.recurrenceRule = {
break;
}
};
let updateDropdownArrow = function(isOpen) {
const $icon = $dropdownButton.find('i.fa');
if (isOpen) {
$icon.removeClass('fa-caret-down').addClass('fa-caret-up');
} else {
$icon.removeClass('fa-caret-up').addClass('fa-caret-down');
}
}
$dropdownButton.on('click keydown', function (event) {
if (event.type !== 'click' && event.key !== 'Enter' && event.key !== ' ' && event.key !== 'ArrowDown' && event.key !== 'ArrowUp') {
return;
}
let isOpen = $el.find('.tui-full-calendar-open').length > 0;
toggleAriaExpanded(!isOpen);
updateDropdownArrow(!isOpen);
if (!isOpen && event.key !== 'ArrowUp') {
$dropdownMenu.find('li').first().focus();
}
@ -2306,6 +2315,7 @@ APP.recurrenceRule = {
$(document).on('click', function (event) {
if (!$(event.target).closest($dropdownButton).length) {
toggleAriaExpanded(false);
updateDropdownArrow(false);
}
});