Changeset 9211


Ignore:
Timestamp:
May 23, 2011, 5:16:36 PM (14 years ago)
Author:
dennisw
Message:

Progress on layout.

Location:
src/django_gheat/website
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • src/django_gheat/website/static/style.css

    r9210 r9211  
    1919}
    2020
    21 #header{
     21#container{
    2222  position:absolute;
    23   left:160px;
    24   right:160px;
     23  left:50%;
     24  margin-left:-400px;
    2525  top:-2px;
    26   min-width:600px;
     26  width:800px;
    2727  background-color:#FFF;
    28   border:2px solid #CC0000;
     28  border:2px solid #BA0000;
    2929  z-index:1;
    3030}
    3131
    32 #header_title{
    33   width:100%;
    34   height:26px;
     32#header{
     33  width:100%-10px;
     34  height:30px;
    3535  top:0px;
    36   background-color:#CC0000;
     36  background-color:#BA0000;
    3737  padding-left:5px;
    3838  padding-right:5px;
     39  text-align:center;
    3940}
    4041
    41 #header_content{
    42   width:100%;
     42#menu{
     43  width:100%-10px;
     44  background-color:#BA0000;
     45  padding-left:5px;
     46  padding-right:5px;
     47  text-align:center;
     48  font-size:14px;
     49  color:white;
     50}
     51
     52#info{
     53  width:100%-10px;
     54  display:none;
    4355  padding:5px;
    4456}
    4557
    4658#filters{
    47   position:absolute;
    48   left:-2px;
    49   top:100px;
    50   width:150px;
    51   background-color:#FFF;
    52   border:2px solid #CC0000;
    53   z-index:1;
    54 }
    55 
    56 #filters_title{
    57   width:140px;
    58   height:26px;
    59   top:0px;
    60   background-color:#CC0000;
    61   padding-left:5px;
    62   padding-right:5px;
    63 }
    64 
    65 #filters_content{
    66   width:140px;
     59  width:100%-10px;
     60  display:none;
    6761  padding:5px;
    6862}

  • src/django_gheat/website/templates/home.html

    r9210 r9211  
    88  <script language="javascript" type="text/javascript">
    99    function toggleDiv(div){
    10       if(document.getElementById(div + '_content').style.display != 'block'){
    11         document.getElementById(div + '_content').style.display = 'block';
     10      var show = div;
     11      var hide;
     12      if(show == 'info'){
     13        hide = 'filters';
    1214      }
    1315      else{
    14         document.getElementById(div + '_content').style.display = 'none';
     16        hide = 'info';
     17      }     
     18      if(document.getElementById(show).style.display != 'block'){
     19        document.getElementById(show).style.display = 'block';
     20        document.getElementById(hide).style.display = 'none';
     21      }
     22      else{
     23        document.getElementById(show).style.display = 'none';
     24        document.getElementById(hide).style.display = 'none';
    1525      }
    1626    }
    1727  </script>
    1828</head>
     29
     30
    1931<body onload="init()">
    2032  <div id="heatmap"></div>
    21   <div id="header">
    22     <div id="header_title">
    23       <font style="font-size:24px; color:white;" onclick="toggleDiv('header')">Stichting Wireless Leiden - Heatmap
    24       <a href="http://www.wirelessleiden.nl/" style="float: right;">wirelessleiden.nl</a></font>
     33  <div id="container">
     34    <div id="header">
     35      <font style="font-size:24px; color:white;">Stichting Wireless Leiden - Heatmap</font>
    2536    </div>
    26     <div id="header_content">
    27     test
     37    <div id="menu">
     38      <font onclick="toggleDiv('info')">Info</font>
     39      <font style="padding-left:15px;" onclick="toggleDiv('filters')">Filters</font>
    2840    </div>
    29   </div>
    30   <div id="filters">
    31     <div id="filters_title">
    32       <font style="font-size:24px; color:white;" onclick="toggleDiv('filters')">Filters</font>
     41    <div id="info">
     42       test<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />test
    3343    </div>
    34     <div id="filters_content">
     44    <div id="filters">
    3545      <form method="get" action="">
    36         User: <input type="text" id="user" name="user" size="14"/> <br />
    37         Set: <input type="text" id="dataset" name="dataset" size="14"/> <br />
    38         WirelessLeiden Node: <input type="text" id="wlnode" name="wlnode" size="14"/> <br />
    39         Encrypted: <input type="checkbox" id="enc" name="enc"/> <br />
    40         Date: <input type="text" id="date" name="date" size="14"/> <br />
    41         Colour: <input type="text" id="colour" name="colour" size="14"/> <br />
    42         Layername: <input type="text" id="lname" name="lname" size="14"/> <br />
    43         <input type="button" value="Add filter" onClick="filters()"/>
     46      <table border="0">
     47        <tr>
     48          <td>User</td>
     49          <td><input type="text" id="user" name="user" size="10"/></td>
     50          <td>WL Node</td>
     51          <td><input type="text" id="wlnode" name="wlnode" size="10"/></td>
     52          <td>Date</td>
     53          <td><input type="text" id="date" name="date" size="10"/></td>
     54          <td>Layer name</td>
     55          <td><input type="text" id="lname" name="lname" size="10"/></td>
     56        </tr>
     57        <tr>
     58          <td>Set</td>
     59          <td><input type="text" id="dataset" name="dataset" size="10"/></td>
     60          <td>Encrypted</td>
     61          <td><input type="checkbox" id="enc" name="enc"/></td>
     62          <td>Colour</td>
     63          <td><input type="text" id="colour" name="colour" size="10"/></td>
     64          <td></td>
     65          <td><input type="button" value="Add filter" onClick="filters()"/></td>
     66        </tr>
     67      </table>
    4468      </form>
    4569    </div>
    … …  
    4771</body>
    4872</html>
    49 
    50 
    51 
    52 
    53 
    54 
    55 
    56 
    57 
    58 
    59 
    60 
    61 
    62 
    63 <body>
    64 <!-- Collapsible panel, with separate CSS and JavaScript -->
    65 <div style="width:170px;">
    66   <div class="squarebox">
    67     <div class="squareboxgradientcaption" style="height:20px; cursor: pointer;" onclick="togglePannelStatus(this.nextSibling)">
    68       <div style="float: left">
    69       </div>
    70       <div style="float: right; vertical-align: middle">
    71       </div>
    72     </div>
    73     <div class="squareboxcontent">
    74     </div>
    75   </div>
    76 </div>
    77 </body>
    78 </html>
Note: See TracChangeset for help on using the changeset viewer.