The_Great_Archive/cryptpad
1
0
Fork 0
mirror of https://github.com/cryptpad/cryptpad.git synced 2026-09-14 11:05:41 +05:00
Code Issues Packages Projects Releases Wiki Activity

Rounded calendar UI

Browse Source
This commit is contained in:
David Benqué 2022-02-28 15:32:22 +00:00
parent b7d43eb9f4
commit bc43ec49e8
3 changed files with 53 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
www/calendar/app-calendar.less
View File

@ -2,6 +2,7 @@
@import (reference) '../../customize/src/less2/include/sidebar-layout.less';
@import (reference) '../../customize/src/less2/include/tools.less';
@import (reference) '../../customize/src/less2/include/avatar.less';
@import (reference) '../../customize/src/less2/include/variables.less';
&.cp-app-calendar {
@ -117,6 +118,7 @@
.tui-full-calendar-popup-container {
background: @cp_flatpickr-bg;
color: @cryptpad_text_col;
border-radius: @variables_radius;
.tui-full-calendar-icon:not(.tui-full-calendar-calendar-dot):not(.tui-full-calendar-dropdown-arrow):not(.tui-full-calendar-ic-checkbox) {
display: none;
}
@ -182,6 +184,11 @@
.tui-full-calendar-section-allday {
width: 100%;
height: 32px;
border-radius: @variables_radius;
.tui-full-calendar-ic-checkbox {
margin-left: 5px;
border-radius: 2px;
}
}
}
}
@ -255,7 +262,8 @@
align-items: center;
margin-bottom: 20px;
input {
width: 100px;
width: 80px;
margin-right: 5px;
}
}
}
@ -273,6 +281,26 @@
#cp-toolbar .cp-calendar-browse {
display: flex;
align-items: center;
button {
color: @cp_toolbar-fg;
border-color: @cp_toolbar-fg;
&:hover {
background-color: fade(@cp_toolbar-fg, 50%); //XXX check light theme
cursor: pointer;
}
}
}
.cp-calendar-newevent {
&:hover {
cursor: pointer;
}
}
.cp-toolbar-bottom-right button, .cp-toolbar-user button {
&:hover {
cursor: pointer;
}
}
#cp-sidebarlayout-leftside {
@ -300,7 +328,7 @@
display: flex;
align-items: center;
justify-content: center;
margin: 5px 0;
margin: 5px 0 10px 0;
&:not(:first-child) {
margin-top: 30px;
}
@ -310,12 +338,20 @@
align-items: center;
justify-content: space-between;
padding: 5px;
border-radius: @variables_radius;
background-color: @cp_sidebar-left-bg;
&:not(.cp-unclickable) {
cursor: pointer;
}
.cp-dropdown-container {
position: initial;
}
button.cp-calendar-actions {
background-color: transparent;
&:hover {
background-color: @cp_sidebar-left-bg;
}
}
&.cp-ghost {
padding: 0;
button {
@ -326,12 +362,19 @@
justify-content: space-between;
background: transparent;
border: 1px solid @cryptpad_text_col;
border-radius: @variables_radius;
padding: 5px;
height: 36px;
font: @colortheme_app-font;
align-items: center;
color: @cryptpad_text_col;
&:hover {
background: @cp_sidebar-left-active;
background-color: @cp_sidebar-left-active;
color: @cp_sidebar-left-active-fg;
border: 0px;
}
i {
margin-left: 5px;
}
}
}
@ -339,21 +382,21 @@
margin-bottom: 10px;
}
&:hover {
background: fade(@cryptpad_text_col, 10%);
background: @cp_sidebar-left-item-bg;
}
&.cp-restricted {
color: @cp_drive-header-fg;
}
.cp-calendar-icon {
width: 36px;
width: 30px;
display: inline-flex;
height: 36px;
margin: -5px;
height: 30px;
align-items: center;
justify-content: center;
border-radius: @variables_radius;
}
&.cp-active {
background: @cp_sidebar-left-active;
background-color: @cp_sidebar-left-item-bg;
.cp-calendar-inactive {
display: none;
}

2
www/calendar/inner.js
View File

@ -599,7 +599,7 @@ define([
text: '',
options: options, // Entries displayed in the menu
common: common,
buttonCls: 'btn btn-cancel fa fa-ellipsis-h small'
buttonCls: 'btn btn-default fa fa-gear small cp-calendar-actions'
};
return UIElements.createDropdown(dropdownConfig)[0];
};

1
www/common/application_config_internal.js
View File

@ -135,6 +135,7 @@ define(function() {
whiteboard: 'cptools-whiteboard',
todo: 'cptools-todo',
contacts: 'fa-address-book',
calendar: 'fa-calendar',
kanban: 'cptools-kanban',
doc: 'fa-file-word-o',
presentation: 'fa-file-powerpoint-o',