UI Changes for Calendar - Ray's Changes

This commit is contained in:
rulingcom 2014-01-08 17:52:16 +08:00
parent b82565fa92
commit 3fbbbbc3eb
2 changed files with 43 additions and 42 deletions

View File

@ -15,8 +15,12 @@
<button class="btn" id="today_btn">Today</button> <button class="btn" id="today_btn">Today</button>
</div> </div>
<div class="btn-group"> <div class="btn-group">
<button class="btn" id="prev_month_btn"><span class="icon-chevron-left"></span></button> <button class="btn" id="prev_month_btn">
<button class="btn" id="next_month_btn"><span class="icon-chevron-right"></span></button> <i class="icon-chevron-left"></i>
</button>
<button class="btn" id="next_month_btn">
<i class="icon-chevron-right"></i>
</button>
</div> </div>
</div> </div>
</div> </div>
@ -35,7 +39,9 @@
<button class="btn mode_switch" data-mode="agenda" >agenda</button> <button class="btn mode_switch" data-mode="agenda" >agenda</button>
</div> </div>
<div class="btn-group"> <div class="btn-group">
<button id="refresh_btn" class="btn icon-refresh"></button> <button id="refresh_btn" class="btn">
<i class="icons-cycle"></i>
</button>
</div> </div>
</div> </div>
</div> </div>

View File

@ -6,49 +6,44 @@
<%= stylesheet_link_tag "fullcalendar"%> <%= stylesheet_link_tag "fullcalendar"%>
<%= stylesheet_link_tag "calendar"%> <%= stylesheet_link_tag "calendar"%>
<div id="orbit_calendar" class="month_view"> <div id="orbit_calendar">
<div class="row-fluid cal-fn"> <div id='sec1' class="cal-fn">
<div class="span3" id='sec1'> <div class="btn-toolbar" id="navigation">
<div class="btn-toolbar" id="navigation" style="margin:0;"> <div id="calendar-nav">
<div id="calendar-nav"> <button class="btn" id="today_btn">Today</button>
<div class="btn-group"> <div class="btn-group">
<button class="btn" id="today_btn">Today</button> <button class="btn" id="prev_month_btn">
</div> <i class="icon-chevron-left"></i>
<div class="btn-group"> </button>
<button class="btn" id="prev_month_btn"><span class="icon-chevron-left"></span></button> <button class="btn" id="next_month_btn">
<button class="btn" id="next_month_btn"><span class="icon-chevron-right"></span></button> <i class="icon-chevron-right"></i>
</div> </button>
</div> </div>
</div> </div>
<div class="form-inline" id="range_selection" style="display:none;margin:0;"> </div>
</div> <div class="form-inline" id="range_selection"></div>
</div> </div>
<div class="span5" id='sec2'> <div id='sec3' class="btn-toolbar">
<h3 id="current_title" class="current_day_title"></h4> <div class="btn-group calendar_mode">
</div> <button class="btn mode_switch" data-mode="agendaDay" >day</button>
<div class="span4" id='sec3'> <button class="btn mode_switch" data-mode="agendaWeek" >week</button>
<div class="btn-toolbar" style="margin:0; text-align:right;"> <button class="btn active mode_switch" data-mode="month" >month</button>
<div class="btn-group calendar_mode"> <button class="btn mode_switch" data-mode="agenda" >agenda</button>
<button class="btn mode_switch" data-mode="agendaDay" >day</button> </div>
<button class="btn mode_switch" data-mode="agendaWeek" >week</button> <button id="refresh_btn" class="btn">
<button class="btn active mode_switch" data-mode="month" >month</button> <i class="icons-cycle"></i>
<button class="btn mode_switch" data-mode="agenda" >agenda</button> </button>
</div> </div>
<div class="btn-group"> <div id="view_holder">
<button id="refresh_btn" class="btn icon-refresh"></button> <h3 id="current_title" class="current_day_title"></h3>
</div> <div id="calendar"></div>
</div> <div id="calendar_agenda"></div>
</div> </div>
</div>
<div id="view_holder">
<div id="calendar"></div>
<div id="calendar_agenda"></div>
</div>
</div> </div>
<div id="event_quick_view" class="modal" style="width: 300px; display:none; margin:0 0 0 0;"></div> <div id="event_quick_view" class="modal" style="width: 300px; display:none; margin:0 0 0 0;"></div>
<div id="event_create_space" class="modal" style="right: 8px; bottom: 50px; left: auto; top: auto; width: 400px; margin: 0;display:none;"></div> <div id="event_create_space" class="modal" style="right: 8px; bottom: 50px; left: auto; top: auto; width: 400px; margin: 0;display:none;"></div>
<div id="calendar-loading">Loading...</div> <div id="calendar-loading">Loading...</div>
<script type="text/javascript"> <script type="text/javascript">
var calendar = new Calendar("#calendar"); var calendar = new Calendar("#calendar");
</script> </script>