Permalink
Browse files

[IMP] web: mobile calendar today button alignment

Improve the User Interface of the Calendar mobile view.

- The "today" button should be aligned (both size and position) with the
view switcher icon.
- Extract mobile calendar styling into dedicated SCSS file.

Task ID: 1891955

closes #30592
  • Loading branch information...
robodoo committed Feb 11, 2019
2 parents b9902d9 + 41b8a6a commit 50a41c9f87f28149c09ec539bd6b9f9ba3e4d20a
@@ -197,25 +197,3 @@
display: none;
}
}

// Mobile rules
@include media-breakpoint-down(sm) {
.o_calendar_container {
padding: 0;
}
}
@include media-breakpoint-down(sm) {
.o_control_panel {
.o_calendar_button_today {
float: right;
> .o_calendar_text {
margin-top: 3px;
}
}
}
.o_calendar_view {
.fc-day-header {
word-spacing: 1000px; // force line break in week mode
}
}
}
@@ -0,0 +1,22 @@
@include media-breakpoint-down(sm) {
.o_calendar_container {
padding: 0;
}

.o_control_panel {
.o_calendar_button_today {
font-size: 0.7em;
line-height: 1.9em;
> .o_calendar_text {
margin-top: 3px;
}
}
}

.o_calendar_view {
.fc-day-header {
word-spacing: 1000px; // force line break in week mode
}
}

}
@@ -85,10 +85,12 @@
</t>

<t t-name="CalendarView.TodayButtonMobile">
<span class="fa-stack o_calendar_button_today">
<i class="fa fa-calendar-o fa-stack-2x" role="img" aria-label="Today" title="Today"></i>
<strong class="o_calendar_text fa-stack-1x"><t t-esc="moment().date()"/></strong>
</span>
<button class="btn btn-sm btn-link">
<span class="fa-stack o_calendar_button_today">
<i class="fa fa-calendar-o fa-stack-2x" role="img" aria-label="Today" title="Today"/>
<strong class="o_calendar_text fa-stack-1x"><t t-esc="moment().date()"/></strong>
</span>
</button>
</t>

<main t-name="CalendarView.quick_create" class="o_calendar_quick_create">
@@ -174,6 +174,7 @@
<link rel="stylesheet" type="text/scss" href="/web/static/src/scss/kanban_view.scss"/>
<link rel="stylesheet" type="text/scss" href="/web/static/src/scss/kanban_view_mobile.scss"/>
<link rel="stylesheet" type="text/scss" href="/web/static/src/scss/web_calendar.scss"/>
<link rel="stylesheet" type="text/scss" href="/web/static/src/scss/web_calendar_mobile.scss"/>
<link rel="stylesheet" type="text/scss" href="/web/static/src/scss/search_view.scss"/>
<link rel="stylesheet" type="text/scss" href="/web/static/src/scss/search_view_mobile.scss"/>
<link rel="stylesheet" type="text/scss" href="/web/static/src/scss/dropdown_menu.scss"/>

0 comments on commit 50a41c9

Please sign in to comment.