Skip to content

Instantly share code, notes, and snippets.

@ilyakh

ilyakh/Devilry Period View

Last active December 11, 2015 08:08
Show Gist options
  • Save ilyakh/4570910 to your computer and use it in GitHub Desktop.
Save ilyakh/4570910 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Devilry Period View
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
font-family: Arial, sans;
}
.subject {
max-width: 400px;
width: 30%; /* element width */
padding: 0.2em 0.2em 0.5em 0.2em;
border: 1px solid rgb( 220, 220, 220 );
border-radius: 0.5em;
overflow: auto;
}
.subject-name {
clear: both;
padding: 0.6em 0.2em 0.2em 0.6em;
}
.active {
float: left;
width: 30%;
}
.inactive {
float: left;
width: 65%;
}
.period {
float: left;
width: 32%; /* period block width */
display: inline-block;
text-align: center;
}
.period a {
font-style: italic;
text-decoration: none;
}
.period-active {
text-align: center;
font-weight: bold;
font-size: 2em;
min-width: 100px;
padding: 0.5em 0.2em 0.5em 0.2em;
}
.period-ellipsis {
}
-->
</style>
</head>
<body>
<div class="subject">
<div class="subject-name">INF1010 - Objektorientert programmering</div>
<hr />
<div class="active">
<div class="period period-active"><a href="">V11</a></div>
</div>
<div class="inactive">
<div class="period"><a href="">v13</a></div>
<div class="period"><a href="">h12</a></div>
<div class="period"><a href="">v12</a></div>
<div class="period"><a href="">h13</a></div>
<div class="period"><a href="">v13</a></div>
<div class="period"><a href="">h12</a></div>
<div class="period"><a href="">v12</a></div>
<div class="period"><a href="">h13</a></div>
<!-- -->
<div class="period period-ellipsis"><a href="">...</a></div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment