Difference between revisions of "Team:Penn/Notebook"

Line 14: Line 14:
 
<div style = "text-align: center;"><img width="300px" src="https://static.igem.org/mediawiki/2014/1/1d/Timeline-header.png"></div><br>
 
<div style = "text-align: center;"><img width="300px" src="https://static.igem.org/mediawiki/2014/1/1d/Timeline-header.png"></div><br>
  
<div id="calendar">
+
<link rel="stylesheet" type="text/css"  
<div class="clasp hole-left"></div>
+
href="https://2015.igem.org/Template:YourTeamName/CSS2?action=raw&ctype=text/css" />
<div class="clasp hole-right"></div>
+
<div class="hole hole-left"></div>
+
<div class="hole hole-right"></div>
+
<div id="month">« March 2012 »</div>
+
<div id="days">
+
<table class="days">
+
<tr>
+
<td>SUN</td>
+
<td>MON</td>
+
<td>TUE</td>
+
<td>WED</td>
+
<td>THU</td>
+
<td>FRI</td>
+
<td>SAT</td>
+
</tr>
+
</table>
+
</div>
+
<table class="day">
+
<tr>
+
<td class="old-month">26</td>
+
<td class="old-month">27</td>
+
<td class="old-month">28</td>
+
<td class="old-month">29</td>
+
<td>1</td>
+
<td>2</td>
+
<td class="selected">3</td>
+
</tr>
+
<tr>
+
<td>4</td>
+
<td class="appoint">5</td>
+
<td>6</td>
+
<td>7</td>
+
<td>8</td>
+
<td>9</td>
+
<td>10</td>
+
</tr>
+
<tr>
+
<td>11</td>
+
<td>12</td>
+
<td>13</td>
+
<td>14</td>
+
<td>15</td>
+
<td>16</td>
+
<td>17</td>
+
</tr>
+
<tr>
+
<td>18</td>
+
<td>19</td>
+
<td>20</td>
+
<td>21</td>
+
<td class="appoint">22</td>
+
<td class="appoint">23</td>
+
<td>24</td>
+
</tr>
+
<tr>
+
<td>25</td>
+
<td>26</td>
+
<td>27</td>
+
<td>28</td>
+
<td>29</td>
+
<td>30</td>
+
<td>31</td>
+
</tr>
+
</table>
+
  
<style type="text/css">
+
<h2>Our Project</h2>
* {
+
<p>Here is the beginning of the page about our project.</p>
margin: 0;
+
padding: 0;
+
}
+
  
.clasp {
+
<p>Here is the end of the page about our project.</p>
background: #aaaaaa;
+
border: 1px solid #999999;
+
border-radius: 4px;
+
box-shadow: 0 -1px 5px rgba(0,0,0,0.4), inset -1px 1px 2px white;
+
display: block;
+
height: 16px;
+
position: absolute;
+
top: -5px;
+
width: 4px;
+
z-index: 2000;
+
}
+
.clasp.hole-left {
+
left: 9px;
+
}
+
.clasp.hole-right {
+
right: 9px;
+
}
+
  
.hole {
+
<script type="text/javascript" src="https://2015.igem.org/Template:YourTeamName/Javascript2?
background: #99ccff;
+
action=raw&ctype=text/javascript"></script>
border-radius: 8px;
+
</html>
box-shadow: 0 -1px 0 black, inset 0 0 20px #878787;
+
display: block;
+
height: 8px;
+
position: absolute;
+
top: 8px;
+
width: 8px;
+
}
+
 
+
.hole-left {
+
left: 8px;
+
}
+
.hole-right {
+
right: 8px;
+
}
+
 
+
#calendar {
+
background: #e4e0e7;
+
box-shadow: 0 0 20px #878787;
+
height: 208px;
+
margin: 20px auto;
+
position: relative;
+
text-align: center;
+
width: 216px;
+
}
+
 
+
#month {
+
background: linear-gradient(#bcde4b, #8bc620);
+
color: white;
+
height: 30px;
+
line-height: 30px;
+
text-shadow: 0 -1px 0 #878787;
+
width: 216px;
+
}
+
 
+
#days {
+
background: linear-gradient(#f4f4f4, #ebebeb);
+
-webkit-box-shadow: 0 1px 0 #aaaaaa;
+
}
+
 
+
table.days {
+
color: #888888;
+
font-size: 11px;
+
width: 216px;
+
}
+
 
+
table.day td, table.days td {
+
width: 30px;
+
}
+
 
+
table.day td {
+
background: #f4f0f7;
+
color: #878787;
+
height: 29px;
+
box-shadow: 0 -1px 0 white;
+
}
+
 
+
table.day td.old-month {
+
color: #aaaaaa;
+
}
+
 
+
table.day td:hover {
+
  background: #e9e9ee;
+
  cursor: pointer;
+
}
+
 
+
table.day td.selected {
+
background: linear-gradient(#bcde4b, #8bc620);
+
color: white;
+
text-shadow: 0 -1px 0 #878787;
+
}
+
 
+
table.day td.appoint {
+
border-bottom: 2px solid #99ccff;
+
}
+
</style>
+
 
</div>
 
</div>
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 00:48, 27 August 2015

University of Pennsylvania iGEM

Our Project

Here is the beginning of the page about our project.

Here is the end of the page about our project.

</div> </body> </html>