Skip to content

Commit

Permalink
adjust styling
Browse files Browse the repository at this point in the history
  • Loading branch information
autarc committed Jun 1, 2013
1 parent 90c6ce4 commit 91d4f02
Show file tree
Hide file tree
Showing 4 changed files with 585 additions and 61 deletions.
Binary file added Apps.BerlinJS.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
92 changes: 31 additions & 61 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,83 +7,53 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta http-equiv="content-type" content="text/html,charset=utf-8" />

<title>:: PeerGaming ::</title>
<title>:: PeerGaming ::</title>

<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

<style>

body {

margin : 0 auto;
width : calc( 50% - 250px);

font-size : 1.6em;

background-color : #f5f5f5;
}

h2 { margin-left : 100px; }

li {

margin : 20px;
padding : 10px;
width : 250px;

border : 1px solid #333;

list-style : none;
background-color : #f2f2f2;
}


a {

text-decoration : none;

color : #3311ff;

transition : all 1sec ease-in-out;
}

a:hover{ text-decoration: underline; }

.type { margin-right : 10px; }
.data { float : right;}

</style>
<!-- includes normalize -->
<link rel="stylesheet" type="text/css" href="vendor/normalize/normalize.css">
<link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>

<h2>PeerGaming</h2>
<div class="container">

<div class="wrapper main">

<ul>
<h2>Presentations</h2>

<li>
<span class="type">Slides:</span>
<span class="data"><a href="slides/#!/pg/@1">HTML</a></span>
</li>
<figure>
<img src="Apps.BerlinJS.png" width="80%">
</figure>


<!-- <li>
<span class="type">Print:</span<
<span class="data"><a href="material/PeerGaming.pdf" download="PeerGaming.pdf">PDF</a></span>
<ul class="list">

</li>
-->
<!--
<li>
<span class="type">Record:</span>
<span class="data"><a href="material/Apps.BerlinJS.mp4">MP4</a></span>
</li>
-->
<li class="entry clear">
<span class="date">2013-05-30 (BerlinJS)</span>
<span class="links">
<a href="2013-05-30_BerlinJS/slides/#!/pg/@1">HTML</a> |
<a href="2013-05-30_BerlinJS/slides.pdf" download="2013-05-30_BerlinJS.pdf">PDF</a>
</span>
</li>
<!--
<li class="entry clear">
<span class="date">2013-XX-XX (Colloquium)</span>
<span class="links">
<a href="2013-XX-XX_Colloquium/slides/#!/pg/@1">HTML</a> |
<a href="2013-XX-XX_Colloquium/slides.pdf" download="2013-XX-XX_Colloquium.pdf">PDF</a>
</span>
</li>
-->
</ul>

</div>

</ul>
</div>

</body>
</html>
158 changes: 158 additions & 0 deletions style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,158 @@
/** global **/

html, body {

margin : 0;
padding : 0;
height : 100%;
}

ul, ol {

margin : 0;
padding : 0;
list-style: none;
}

li { list-style: none; }

a {

text-decoration : none;

color : #3311ff;

transition : all 1s ease-in-out;
}

a:hover{ border-bottom: 2px solid #20605A; }



figure > a { border-bottom: none !important; }

figure > figurecaption { color: #aaa; }


/**
* Image
*/

img {

max-width : 100%;
max-height: 100%;

height: auto !important;

border: 1px solid #000;

border-radius: 10px;
}


/** re-use */


.transition {

-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}


.container {

height: 100%;
width : 100%;
background-color: #222;


font-size : 1.6em;

/*height: 80%;*/

display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: flex;

-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;

-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
justify-content: center;


text-align: center;
}

.wrap {

position: relative;
width: 100%;
}

.wrap:before, .wrap:after {
content: "";
display: table;
}
.wrap:after {
clear: both;
}


.main {

height : 80%;
width : 50%;
background : #eee;

margin : 0 auto;

padding : 0 30px;

border : 1px solid black;
border-radius : 10px;
}



/** specific **/

.entry {

margin : 20px;
padding : 10px 0;
width : 500px;

border-top: 1px solid #333;
border-bottom: 1px solid #333;
}


.date { float : left; margin-right : 10px; }
.links { float : right;}

.list {
text-align: center;
margin: 0 auto;

width: 80%;
}

.clear:before, .clear:after {
content: "";
display: table;
}

.clear:after {
clear: both;
}
Loading

0 comments on commit 91d4f02

Please sign in to comment.