Added details view.
authorEugen Sawin <sawine@me73.com>
Mon, 15 Nov 2010 23:14:44 +0100
changeset 15057231ebef3c
parent 14 8a5e3c219670
child 16 acc31f291dd5
Added details view.
v2/style.css
v2/work.html
     1.1 --- a/v2/style.css	Mon Nov 15 00:43:59 2010 +0100
     1.2 +++ b/v2/style.css	Mon Nov 15 23:14:44 2010 +0100
     1.3 @@ -13,22 +13,12 @@
     1.4  	color:					#333;
     1.5  }
     1.6  
     1.7 -p
     1.8 -{
     1.9 -	padding-bottom: 20px;
    1.10 -}
    1.11 -
    1.12  a 
    1.13  {
    1.14  	text-decoration: none;
    1.15  	color: #aaa;
    1.16  }
    1.17  
    1.18 -.content > a
    1.19 -{
    1.20 -	color: #566;
    1.21 -}
    1.22 -
    1.23  a:hover
    1.24  {
    1.25  	color: #333;
    1.26 @@ -38,7 +28,7 @@
    1.27  {
    1.28  	border-bottom: dashed 1px #aaa; 
    1.29  	position: relative; 
    1.30 -	color: #566;
    1.31 +	color: #aaa;
    1.32  }
    1.33  
    1.34  .menu > span.link
    1.35 @@ -56,7 +46,7 @@
    1.36  {
    1.37  	border-bottom: dashed 1px #aaa;
    1.38  	position: relative:
    1.39 -	color: #566;
    1.40 +	color: #aaa;
    1.41  	text-decoration: line-through;
    1.42  }
    1.43  
    1.44 @@ -107,13 +97,13 @@
    1.45  	left: 0;
    1.46  	top: 0;
    1.47  	text-transform: none;
    1.48 +	z-index: 100;
    1.49 +	background: #fafafa;
    1.50  }
    1.51  
    1.52  .menu > a:hover .content 
    1.53  {
    1.54  	display: block;	
    1.55 -	z-index: 100;
    1.56 -	background: #fff;
    1.57  }
    1.58  
    1.59  body > .content
    1.60 @@ -140,11 +130,37 @@
    1.61  	border-bottom: 0; 
    1.62  }
    1.63  
    1.64 +body > .content .entry
    1.65 +{
    1.66 +	padding-bottom: 20px;
    1.67 +}
    1.68 +
    1.69 +body > .content .entry .details
    1.70 +{
    1.71 +	display: none;
    1.72 +	font: 12px/15px sans-serif;	
    1.73 +	width: 30%;
    1.74 +	height: 45%;
    1.75 +	color: #333;
    1.76 +	position: fixed;
    1.77 +	margin: 30px 80px;
    1.78 +	left: 50%;
    1.79 +	top: 0;
    1.80 +	text-transform: none;
    1.81 +	background: #fafafa;
    1.82 +}
    1.83 +
    1.84 +body > .content .entry:hover .details
    1.85 +{
    1.86 +	display: block;
    1.87 +}
    1.88 +
    1.89 +
    1.90  div.universe1
    1.91  {
    1.92 -	background: #fff;
    1.93 +	background: #fafafa;
    1.94  	position: absolute;
    1.95 -	width: 100%;
    1.96 +	width: 50%;
    1.97  	height: 50%;
    1.98  	left: 0;
    1.99  	top: 0;
   1.100 @@ -160,14 +176,18 @@
   1.101  
   1.102  div.universe2
   1.103  {
   1.104 -	background: #fff;
   1.105 -	position: absolute;
   1.106 +	background: #fafafa;
   1.107 +	position: fixed;
   1.108 +	margin: 30px 80px;
   1.109 +	left: 50%;
   1.110  	width: 50%;
   1.111  	height: 50%;
   1.112 -	left: 50%;
   1.113  	top: 0;
   1.114 -	text-transform: uppercase;
   1.115 -	text-align: center;
   1.116 +	font-size: 60px;
   1.117 +	font-weight: bold;
   1.118 +	letter-spacing: 0.2px;
   1.119 +	line-height: 80%;
   1.120 +	text-align: left;
   1.121  	color: #fff;
   1.122  }
   1.123  
   1.124 @@ -180,7 +200,7 @@
   1.125  
   1.126  div.universe3
   1.127  {
   1.128 -	background: #fff;
   1.129 +	background: #fafafa;
   1.130  	position: absolute;
   1.131  	width: 50%;
   1.132  	height: 50%;
   1.133 @@ -188,7 +208,7 @@
   1.134  	top: 50%;
   1.135  	text-transform: uppercase;
   1.136  	text-align: center;
   1.137 -	color: #fff;
   1.138 +	color: #fafafa;
   1.139  }
   1.140  
   1.141  div.universe3:hover
   1.142 @@ -200,7 +220,7 @@
   1.143  
   1.144  div.universe4
   1.145  {
   1.146 -	background: #fff;
   1.147 +	background: #fafafa;
   1.148  	position: absolute;
   1.149  	width: 50%;
   1.150  	height: 50%;
   1.151 @@ -208,7 +228,7 @@
   1.152  	top: 50%;
   1.153  	text-transform: uppercase;
   1.154  	text-align: center;
   1.155 -	color: #fff;
   1.156 +	color: #fafafa;
   1.157  }
   1.158  
   1.159  div.universe4:hover
     2.1 --- a/v2/work.html	Mon Nov 15 00:43:59 2010 +0100
     2.2 +++ b/v2/work.html	Mon Nov 15 23:14:44 2010 +0100
     2.3 @@ -19,29 +19,55 @@
     2.4  </head> 
     2.5  <body>
     2.6  	<div class="universe1"></div>
     2.7 +	<div class="universe2"><<<</div>
     2.8  	<div class="universe3"></div>
     2.9  	<div class="universe4"></div>
    2.10 -	<div class="content">			 
    2.11 -		<p><h3>ATC Departure Flow Manager</h3>
    2.12 -		<a href="http://www.comsoft.aero/html/atc/products/sdp/prisma.htm" class="link1">PRISMA</a> |
    2.13 -		<a href="http://www.comsoft.aero/" class="link1">COMSOFT GmbH</a><br/>
    2.14 -		Requirements Engineering<br/>
    2.15 -		Software Design &amp; Development<br/>
    2.16 -		Development of a Domain-Specific Language</p>		
    2.17 -
    2.18 -		<p><h3>Online Data Access Platform</h3>
    2.19 -		<span class="missinglink">ODAP</span> |
    2.20 -		<a href="http://www.gcaa.ae/en/" class="link1">GCAA</a><br/> 
    2.21 -		Backend Software Development<br/>
    2.22 -		On-Site System Integration<br/>
    2.23 -		User Training</p>	
    2.24 -
    2.25 -		<p><h3>Traffic Information Service - Broadcast</h3>
    2.26 -		<a href="http://www.comsoft.aero/html/atc/products/adsb/" class="link1">Quadrant</a> | 
    2.27 -		<a href="http://www.comsoft.aero/" class="link1">COMSOFT GmbH</a><br/>
    2.28 -		Embedded Systems Software Development<br/>
    2.29 -		Software Design &amp; Development<br/>
    2.30 -		System Testing		
    2.31 +	<div class="content">	
    2.32 +		<div class="entry">
    2.33 +			<h3>ATC Departure Flow Manager</h3>
    2.34 +			<a href="http://www.comsoft.aero/html/atc/products/sdp/prisma.htm" class="link1">PRISMA</a> |
    2.35 +			<a href="http://www.comsoft.aero/" class="link1">COMSOFT GmbH</a><br/>
    2.36 +			Requirements Engineering<br/>
    2.37 +			Software Design &amp; Development<br/>
    2.38 +			Development of a Domain-Specific Language
    2.39 +			<div class="details">
    2.40 +				Departure flow management is an integral part of air traffic
    2.41 +				control optimisation. Take-off time assignment must consider the
    2.42 +				projected flight route and possible occurences of airspace
    2.43 +				constraint violations.</br>
    2.44 +				To be continued...		
    2.45 +			</div>
    2.46 +		</div>		
    2.47 +		<div class="entry">
    2.48 +			<h3>Online Data Access Platform</h3>
    2.49 +			<span class="missinglink">ODAP</span> |
    2.50 +			<a href="http://www.gcaa.ae/en/" class="link1">GCAA</a><br/> 
    2.51 +			Backend Software Development<br/>
    2.52 +			On-Site System Integration<br/>
    2.53 +			User Training
    2.54 +			<div class="details">
    2.55 +				Departure flow management is an integral part of air traffic
    2.56 +				control optimisation. Take-off time  must  the
    2.57 +				projected  route and possible  of airspace
    2.58 +				constraint violations.</br>
    2.59 +				To be continued...		
    2.60 +			</div>
    2.61 +		</div>	
    2.62 +		<div class="entry">
    2.63 +			<h3>Traffic Information Service - Broadcast</h3>
    2.64 +			<a href="http://www.comsoft.aero/html/atc/products/adsb/" class="link1">Quadrant</a> | 
    2.65 +			<a href="http://www.comsoft.aero/" class="link1">COMSOFT GmbH</a><br/>
    2.66 +			Embedded Systems Software Development<br/>
    2.67 +			Software Design &amp; Development<br/>
    2.68 +			System Testing	
    2.69 +			<div class="details">
    2.70 +				Departure flow management is an integral part of air traffic
    2.71 +				control . Take-off time assignment must consider the
    2.72 +				projected flight route and  occurences of airspace
    2.73 +				constraint violations.</br>
    2.74 +				To be continued...		
    2.75 +			</div>	
    2.76 +		</div>
    2.77  	</div>			
    2.78  	<div class="menu" id="menu1">
    2.79  		<a href="index.html">Pragmatic<span>!</span>
    2.80 @@ -56,12 +82,12 @@
    2.81  		<span class="link">Work.</span><br/>
    2.82  		<a href="expertise.html">Expertise<span>.</span>
    2.83  		<div class="content">
    2.84 -			<p><h3>ATC Departure Flow Manager</h3>
    2.85 +			<div class="entry"><h3>ATC Departure Flow Manager</h3>
    2.86  			<span class="link">PRISMA</span> | 
    2.87  			<span class="link">COMSOFT GmbH</span><br/>
    2.88  			Requirements Engineering<br/>
    2.89  			Software Design &amp; Development<br/>
    2.90 -			Development of a Domain-Specific Language</p>
    2.91 +			Development of a Domain-Specific Language</div>
    2.92  		</div>
    2.93  		</a><br/>
    2.94  		<a href="recentwork.html">Service<span>.</span></a>