<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<form method="post" action="./Agenda2.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__LASTFOCUS" id="__LASTFOCUS" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="TYdjB3rXyaV5AdoK+8uj9R4WPwPVNy15MozU8P6E9++nApK9VQkYu7fO8hR+gzdRHSMNQ1QPVFqSN7eMNM5w2tUHV10muMWvVd3a34k2pjxV+KDdeS5pbXyb58LvmNdyj5UBXnzZZuzWDluAEfdtj3tTNVUUDVAgraCqatf4rVvsno5XL2ygyiSs8fbWFqGyToaXDuwGuKUMr0y5cBZjI514UzDaUwY5QTTvE9p9mxV8r/mgT1pCPjHIWN1HlI2+" />
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="EB6FA5F0" />
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="fW33Z98wPuCUn8VvPDfUrF3oN/QiTHwUpQhG4qfIXcd1/TFm9sIEDb5kfTj2nTGFNsutwSwV6f8Lta1oYYT6NpyjiYkB03ebfh9PWYyZRctVJCKgmkL49lxWr5E2EdxzmK8eNOxHNwswtf6myHJpPw==" />
</div>
<div id="topo">
<div class="container">
<div class="row">
<div class="col-md-6 col-ms-6 col-xs-6" id="logo-topo">
<a href="#">
<h3>
<label id="lblNombre" style="font-family: Cambria">KERLLY CAROLINA SALAVARRIA BAYONA</label>
</h3>
</a>
</div>
<div class="col-md-6" id="abre-menu-topo">
<a href="#" class="btn-collapse">
<div class="lista-collapse"></div>
<div class="lista-collapse"></div>
<div class="lista-collapse"></div>
</a>
</div>
</div>
<!--Fim da Row1 -->
<div class="col-md-12">
<ul id="menu-topo">
<li><a href="Inicio.aspx">HOME</a></li>
<li><a href="ActualizacionDatos.aspx">DATA UPDATE</a></li>
<li><a href="Inscripcion.aspx">INSCRIPTION</a></li>
<li><a href="Agenda2.aspx">CALENDAR</a></li>
<li><a href="../InicioUsuario.aspx">GET OUT</a></li>
</ul>
</div>
</div>
<!--Fim da coontainer -->
</div>
<!--Fim do topo -->
<div>
<div class="container-fluid margen1" style="padding-left:30px">
<label>CONGRESS MONTH: </label>
<select name="ctl00$ContentPlaceHolder1$cbMeses" onchange="javascript:setTimeout('__doPostBack(\'ctl00$ContentPlaceHolder1$cbMeses\',\'\')', 0)" id="ContentPlaceHolder1_cbMeses" class="selectpicker">
<option selected="selected" value="10/8/2017">AUGUST 2017</option>
</select>
</div>
<br />
<!--<h1 class="title text-center" style="margin-bottom:15px;font-size:35px;">August 2017 </h1>-->
<div class="calendar" data-toggle="calendar"><div class="row" Style="margin-top:-10px"><div class="col-xs-12 calendar-day calendar-no-current-month"><time>30</time><div class="events"></div></div><div class="col-xs-12 calendar-day calendar-no-current-month"><time>31</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>01</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>02</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>03</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>04</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>05</time><div class="events"></div></div></div><div class="row" Style="margin-top:-10px"><div class="col-xs-12 calendar-day"><time>06</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>07</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>08</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>09</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>10</time><div class="events"></div></div><div class="col-xs-12 calendar-day" Style="background-color:#afced1 "><time Style="font-weight:800">11</time><div class="events"><div class="event"><h4>DE 09H00 - 10H30</h4><div class="desc"><div>Title: Facilitating meaningful learning</div><div>Presenter: Jaime Ancajima</div><div>Room: Paris VII</div></div></div><div class="event"><h4>DE 11H30 - 13H00</h4><div class="desc"><div>Title: What is it like to flip classroom?</div><div>Presenter: Hamilton Quezada</div><div>Room: Paris VII</div></div></div><div class="event"><h4>DE 14H15 - 15H45</h4><div class="desc"><div>Title: Creating Engaging Songs worksheets Special guest: Isaac Aguilera</div><div>Presenter: Ivonne Rubio</div><div>Room: Humbolt</div></div></div></div></div><div class="col-xs-12 calendar-day" Style="background-color:#829384 "><time Style="font-weight:800">12</time><div class="events"><div class="event"><h4>DE 09H00 - 10H30</h4><div class="desc"><div>Title: Using facebook to practice writing skills</div><div>Presenter: Felix Estrella</div><div>Room: Universidad Casa Grande</div></div></div><div class="event"><h4>DE 11H30 - 13H00</h4><div class="desc"><div>Title: Dynamic Collaborative Writing: Developing Collaborative Group work within the framework of Academic Writing Process</div><div>Presenter: Beatriz Erazo</div><div>Room: Auditorium COPOL</div></div></div></div></div></div><div class="row" Style="margin-top:-10px"><div class="col-xs-12 calendar-day" Style="background-color:#bab38a "><time Style="font-weight:800">13</time><div class="events"><div class="event"><h4>DE 09H00 - 10H30</h4><div class="desc"><div>Title: Let´s have fun through small projects in the EFL classroom</div><div>Presenter: James Freeman</div><div>Room: San Marcos</div></div></div></div></div><div class="col-xs-12 calendar-day"><time>14</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>15</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>16</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>17</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>18</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>19</time><div class="events"></div></div></div><div class="row" Style="margin-top:-10px"><div class="col-xs-12 calendar-day"><time>20</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>21</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>22</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>23</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>24</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>25</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>26</time><div class="events"></div></div></div><div class="row" Style="margin-top:-10px"><div class="col-xs-12 calendar-day"><time>27</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>28</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>29</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>30</time><div class="events"></div></div><div class="col-xs-12 calendar-day"><time>31</time><div class="events"></div></div><div class="col-xs-12 calendar-day calendar-no-current-month"><time>01</time><div class="events"></div></div><div class="col-xs-12 calendar-day calendar-no-current-month"><time>02</time><div class="events"></div></div></div></div>
<!--<div class="calendar" data-toggle="calendar" style="margin-top:-70px">
<div class="row">
<div class="col-xs-12 calendar-day calendar-no-current-month">
<time><span id="ContentPlaceHolder1_lblDia1">30</span></time>
</div>
<div class="col-xs-12 calendar-day calendar-no-current-month">
<time datetime="2017-07-31">31</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2017-08-01">01</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-08-02">02</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-08-03">03</time>
<div class="events">
<div class="event">
<h4>Mid Day Dance Break - SELF CARE</h4>
<div class="desc">
<p>Take a Break and enjoy Live dance and Art from Eries own local Talent</p>
<p>Support for this program is provided in part from an Erie Arts & Culture Project Grant, made possible by community contributions to the Combined Arts & Cultural Campaign and the Erie Arts Endowment.</p>
</div>
<div class="location"><span class="glyphicon glyphicon-map-marker"></span>State St and Rt 5, Erie, Pa.</div>
<div class="datetime"><span class="glyphicon glyphicon-time"></span>12:00am - 1:00pm</div>
<div class="attending">
<img src="http://api.randomuser.me/portraits/women/54.jpg" />
<img src="http://api.randomuser.me/portraits/men/27.jpg" />
<img src="http://api.randomuser.me/portraits/men/61.jpg" />
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="6" aria-valuemin="0" aria-valuemax="134" style="width: 4.477%;">
<span class="sr-only">4.477% Filled</span>
</div>
</div>
</div>
<div class="event">
<h4>Mid Day Dance Break - SELF CARE</h4>
<div class="desc">
<p>Take a Break and enjoy Live dance and Art from Eries own local Talent</p>
<p>Support for this program is provided in part from an Erie Arts & Culture Project Grant, made possible by community contributions to the Combined Arts & Cultural Campaign and the Erie Arts Endowment.</p>
</div>
<div class="location"><span class="glyphicon glyphicon-map-marker"></span>State St and Rt 5, Erie, Pa.</div>
<div class="datetime"><span class="glyphicon glyphicon-time"></span>12:00am - 1:00pm</div>
<div class="attending">
<img src="http://api.randomuser.me/portraits/women/54.jpg" />
<img src="http://api.randomuser.me/portraits/men/27.jpg" />
<img src="http://api.randomuser.me/portraits/men/61.jpg" />
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="6" aria-valuemin="0" aria-valuemax="134" style="width: 10.477%;">
<span class="sr-only">4.477% Filled</span>
</div>
</div>
</div>
<div class="event">
<h4>Mid Day Dance Break - SELF CARE</h4>
<div class="desc">
<p>Take a Break and enjoy Live dance and Art from Eries own local Talent</p>
<p>Support for this program is provided in part from an Erie Arts & Culture Project Grant, made possible by community contributions to the Combined Arts & Cultural Campaign and the Erie Arts Endowment.</p>
</div>
<div class="location"><span class="glyphicon glyphicon-map-marker"></span>State St and Rt 5, Erie, Pa.</div>
<div class="datetime"><span class="glyphicon glyphicon-time"></span>12:00am - 1:00pm</div>
<div class="attending">
<img src="http://api.randomuser.me/portraits/women/54.jpg" />
<img src="http://api.randomuser.me/portraits/men/27.jpg" />
<img src="http://api.randomuser.me/portraits/men/61.jpg" />
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="6" aria-valuemin="0" aria-valuemax="134" style="width: 10.477%;">
<span class="sr-only">4.477% Filled</span>
</div>
</div>
</div>
<div class="event">
<h4>Mid Day Dance Break - SELF CARE</h4>
<div class="desc">
<p>Take a Break and enjoy Live dance and Art from Eries own local Talent</p>
<p>Support for this program is provided in part from an Erie Arts & Culture Project Grant, made possible by community contributions to the Combined Arts & Cultural Campaign and the Erie Arts Endowment.</p>
</div>
<div class="location"><span class="glyphicon glyphicon-map-marker"></span>State St and Rt 5, Erie, Pa.</div>
<div class="datetime"><span class="glyphicon glyphicon-time"></span>12:00am - 1:00pm</div>
<div class="attending">
<img src="http://api.randomuser.me/portraits/women/54.jpg" />
<img src="http://api.randomuser.me/portraits/men/27.jpg" />
<img src="http://api.randomuser.me/portraits/men/61.jpg" />
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="6" aria-valuemin="0" aria-valuemax="134" style="width: 10.477%;">
<span class="sr-only">4.477% Filled</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-04">04</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-05">05</time>
</div>
</div>
<div class="row">
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-06">06</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-07">07</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-08">08</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-09">09</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-10">10</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-11">11</time>
<div class="events">
<div class="event">
<h4>Local artist showing, meet and greet and feature film</h4>
<div class="desc">
<p>We will be showing local artists films on our new 16 foot movie screen with feature film last "Carnival Of Souls", come see the new BT, hang out and socialize while enjoying some local talent. FREE event, suggested $2 or $3 donation. Concessions, popcorn, soda etc available so come hungry!!</p>
<p>*This event is all ages welcomed and also handicapped accessible (side entrance ramp)</p>
<p>Featuring :</p>
<ul>
<li><a href="https://www.youtube.com/user/walrys11/videos">Jack Rys</a></li>
<li><a href="http://society6.com/wombglow">Alex Wilson</a></li>
<li><a href="http://www.erieartcompany.com/">Brad Ford</a></li>
<li><a href="http://www.youtube.com/watch?v=dkTz0EvfEiY">Carnival of Souls</a> (Trailer)</li>
</ul>
</div>
<div class="location"><span class="glyphicon glyphicon-map-marker"></span>145 West 11th Street, Erie, Pa.</div>
<div class="datetime"><span class="glyphicon glyphicon-time"></span>7:00pm - ?</div>
<div class="attending">
<img src="http://api.randomuser.me/portraits/women/31.jpg" />
<img src="http://api.randomuser.me/portraits/women/47.jpg" />
<img src="http://api.randomuser.me/portraits/women/93.jpg" />
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="43" aria-valuemin="0" aria-valuemax="368" style="width: 11.68%;">
<span class="sr-only">11.68% Filled</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-12">12</time>
</div>
</div>
<div class="row">
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-13">13</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-14">14</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-15">15</time>
<div class="events">
<div class="event">
<h4>Erie Art Museum 91st Annual Spring Show</h4>
<div class="desc">
<p>This juried, regional multi-media exhibition, open to all artists living within a 250-mile radius of Erie represents all media and showcases the most current and finest artwork created in the area.</p>
</div>
<div class="location"><span class="glyphicon glyphicon-map-marker"></span>Presque Isle State Park </div>
<div class="datetime"><span class="glyphicon glyphicon-time"></span>ALL DAY</div>
<div class="attending">
<img src="http://api.randomuser.me/portraits/men/10.jpg" />
<img src="http://api.randomuser.me/portraits/men/23.jpg" />
<img src="http://api.randomuser.me/portraits/men/66.jpg" />
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="69" aria-valuemin="0" aria-valuemax="320" style="width: 21.56%;">
<span class="sr-only">21.56% Filled</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-16">16</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-17">17</time>>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-18">18</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-19">19</time>
</div>
</div>
<div class="row">
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-20">20</time>
<div class="events">
<div class="event">
<h4>Mouse0270's 24th Birthday</h4>
<div class="desc">
<p style="text-align: center;">
Friendships are one of the few things that improve with age<br />
The family and friends of
<br />
Mouse0270
<br />
invite you to celebrate his
<br />
24th Birthday and a lifetime of good friendship
</p>
</div>
<div class="location"><span class="glyphicon glyphicon-map-marker"></span>Erie, Pa </div>
<div class="datetime"><span class="glyphicon glyphicon-time"></span>10:00pm - 2:00am </div>
<div class="attending">
<img src="https://fbcdn-sphotos-f-a.akamaihd.net/hphotos-ak-xfa1/t1.0-9/417157_4897339837183_626079670_n.jpg" />
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="1" aria-valuemin="0" aria-valuemax="336" style="width: 0.29%;">
<span class="sr-only">0.29% Filled</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-21">21</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-22">22</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-23">23</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-24">24</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-25">25</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-26">26</time>
</div>
</div>
<div class="row">
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-27">27</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-28">28</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-29">29</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-30">30</time>
</div>
<div class="col-xs-12 calendar-day">
<time datetime="2014-07-31">31</time>
</div>
<div class="col-xs-12 calendar-day calendar-no-current-month">
<time datetime="2014-08-01">01</time>
</div>
<div class="col-xs-12 calendar-day calendar-no-current-month">
<time datetime="2014-08-02">02</time>
</div>
</div>
</div>-->
<!--<p class="text-center">No this is not a working calendar. It is purely for design. You are more than welcome to make it work, I sure am!</p>-->
</div>
<!--Pie de página-->
<footer class="footer">
<div class="container-fluid">
<div class="row">
<div class="col-md-1">
<img src="../imagen/logo.jpg" class="thumbnail img-fluid img-responsive" style="width: 110px; height: 100px" />
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<div class="footer_dv">
<h4>Important</h4>
<ul>
<li class="line_rv">Register on line or at COPEI Downtown Campus, Cdla. Naval Norte Mz. 5 Solar 9.</li>
<li>Please send a copy of your deposit by bvelez@copei.edu.ec.</li>
<li>Mastercard and Visa are accepted, Institutional checks are welcome. Payable to: FUNDAEM-Banco del Pacífico: Checking Account # 278121-2.</li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-2 col-sm-2">
<div class="footer_dv">
<h4>Contact us</h4>
<p>For further information:</p>
<p>
2281375 ext. 103<br />
</p>
</div>
</div>
<div class="col-md-2 col-sm-4 paddingtop-bottom">
<div class="fb-page" data-href="https://www.facebook.com/facebook" data-tabs="timeline" data-height="300" data-small-header="false" style="margin-bottom: 15px;" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">
<div class="fb-xfbml-parse-ignore">
<blockquote cite="https://www.facebook.com/CopeiEc1"><a href="https://www.facebook.com/CopeiEc1" target="_blank">Facebook</a></blockquote>
</div>
</div>
</div>
</div>
</div>
</footer>
</form>
body {
padding: 20px 0px 200px;
}
h1.title {
font-family: 'Roboto', sans-serif;
font-weight: 900;
}
.calendar {
margin: 0px 40px;
}
.popover.calendar-event-popover {
font-family: 'Roboto', sans-serif;
font-size: 12px;
color: rgb(120, 120, 120);
border-radius: 2px;
max-width: 300px;
}
.popover.calendar-event-popover h4 {
font-size: 14px;
font-weight: 900;
}
.popover.calendar-event-popover .location,
.popover.calendar-event-popover .datetime {
font-size: 14px;
font-weight: 700;
margin-bottom: 5px;
}
.popover.calendar-event-popover .location > span,
.popover.calendar-event-popover .datetime > span {
margin-right: 10px;
}
.popover.calendar-event-popover .space,
.popover.calendar-event-popover .attending {
margin-top: 10px;
padding-bottom: 5px;
border-bottom: 1px solid rgb(160, 160, 160);
font-weight: 700;
}
.popover.calendar-event-popover .space > .pull-right,
.popover.calendar-event-popover .attending > .pull-right {
font-weight: 400;
}
.popover.calendar-event-popover .attending {
margin-top: 5px;
font-size: 18px;
padding: 0px 10px 5px;
}
.popover.calendar-event-popover .attending img {
border-radius: 50%;
width: 40px;
}
.popover.calendar-event-popover .attending span.attending-overflow {
display: inline-block;
width: 40px;
background-color: rgb(200, 200, 200);
border-radius: 50%;
padding: 8px 0px 7px;
text-align: center;
}
.popover.calendar-event-popover .attending > .pull-right {
font-size: 28px;
}
.popover.calendar-event-popover a.btn {
margin-top: 10px;
width: 100%;
border-radius: 3px;
}
[data-toggle="calendar"] > .row > .calendar-day {
font-family: 'Roboto', sans-serif;
width: 14.28571428571429%;
border: 1px solid rgb(235, 235, 235);
border-right-width: 0px;
border-bottom-width: 0px;
min-height: 120px;
}
[data-toggle="calendar"] > .row > .calendar-day.calendar-no-current-month {
color: rgb(200, 200, 200);
}
[data-toggle="calendar"] > .row > .calendar-day:last-child {
border-right-width: 1px;
}
[data-toggle="calendar"] > .row:last-child > .calendar-day {
border-bottom-width: 1px;
}
.calendar-day > time {
position: absolute;
display: block;
bottom: 0px;
left: 0px;
font-size: 12px;
font-weight: 300;
width: 100%;
padding: 10px 10px 3px 0px;
text-align: right;
}
.calendar-day > .events {
cursor: pointer;
}
.calendar-day > .events > .event h4 {
font-size: 12px;
font-weight: 700;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 3px;
}
.calendar-day > .events > .event > .desc,
.calendar-day > .events > .event > .location,
.calendar-day > .events > .event > .datetime,
.calendar-day > .events > .event > .attending {
display: none;
}
.calendar-day > .events > .event > .progress {
height: 10px;
}
$(function () {
$('[data-toggle="calendar"] > .row > .calendar-day > .events > .event').popover({
container: 'body',
content: 'Hello World',
html: true,
placement: 'bottom',
template: '<div class="popover calendar-event-popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
});
$('[data-toggle="calendar"] > .row > .calendar-day > .events > .event').on('show.bs.popover', function () {
var attending = parseInt($(this).find('div.progress>.progress-bar').attr('aria-valuenow')),
total = parseInt($(this).find('div.progress>.progress-bar').attr('aria-valuemax')),
remaining = total - attending,
displayAttending = attending - $(this).find('div.attending').children().length,
html = [
'<button type="button" class="close"><span aria-hidden="true">x</span><span class="sr-only">Close</span></button>',
'<h4>' + $(this).find('h4').text() + '</h4>',
'<div class="desc">' + $(this).find('div.desc').html() + '</div>'
].join('\n');
$(this).attr('title', $(this).find('h4').text());
$(this).attr('data-content', html);
});
$('[data-toggle="calendar"] > .row > .calendar-day > .events > .event').on('shown.bs.popover', function () {
var $popup = $(this);
$('.popover:last-child').find('.close').on('click', function(event) {
$popup.popover('hide');
});
});
});
