|
|
@@ -11,6 +11,94 @@
|
|
|
a:hover { text-decoration:none; }
|
|
|
a:active { text-decoration:none; }
|
|
|
a:focus { text-decoration:none; }
|
|
|
+
|
|
|
+ td.even {
|
|
|
+ background-color: #C8C8C8;
|
|
|
+ }
|
|
|
+ td.odd {
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ }
|
|
|
+
|
|
|
+ tr.highlight:hover,
|
|
|
+ tr.highlight:hover td {
|
|
|
+ background-color: #F0E68C !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .container {
|
|
|
+ display: block;
|
|
|
+ position: relative;
|
|
|
+ margin: 5px;
|
|
|
+ margin-top: -7px;
|
|
|
+ padding-left: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 22px;
|
|
|
+ -webkit-user-select: none;
|
|
|
+ -moz-user-select: none;
|
|
|
+ -ms-user-select: none;
|
|
|
+ user-select: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* Hide the browser's default checkbox */
|
|
|
+ .container input {
|
|
|
+ position: absolute;
|
|
|
+ opacity: 0;
|
|
|
+ cursor: pointer;
|
|
|
+ height: 0;
|
|
|
+ width: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* Create a custom checkbox */
|
|
|
+ .checkmark {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ height: 10px;
|
|
|
+ width: 10px;
|
|
|
+ background-color: #eee;
|
|
|
+ border: 2px solid #ddd;
|
|
|
+ border-radius: 7px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* On mouse-over, add a grey background color */
|
|
|
+ .container:hover input ~ .checkmark {
|
|
|
+ background-color: #FF8C00;
|
|
|
+ border: 2px solid black;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* On mouse-over, add a grey background color */
|
|
|
+ .container:hover input:checked ~ .checkmark {
|
|
|
+ background-color: #0000CD;
|
|
|
+ border: 2px solid #0000CD;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* When the checkbox is checked, add a blue background */
|
|
|
+ .container input:checked ~ .checkmark {
|
|
|
+ background-color: #0000CD;
|
|
|
+ border: 2px solid #eee;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* Create the checkmark/indicator (hidden when not checked) */
|
|
|
+ .checkmark:after {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* Show the checkmark when checked */
|
|
|
+ .container input:checked ~ .checkmark:after {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* Style the checkmark/indicator */
|
|
|
+ .container .checkmark:after {
|
|
|
+ left: 2px;
|
|
|
+ top: 2px;
|
|
|
+ width: 2px;
|
|
|
+ height: 2px;
|
|
|
+ border: solid white;
|
|
|
+ border-width: 1px 2px 3px 2px;
|
|
|
+ border-radius: 3px;
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
<body>
|
|
|
@@ -196,7 +284,11 @@
|
|
|
|
|
|
<font size="6">
|
|
|
<a href="../index.php" title="Back to main page">
|
|
|
+<<<<<<< HEAD
|
|
|
<img style="margin-right: .5em; margin-bottom: -8px" src="../pics/katrin_logo_round.png" width="40px" height="40px">
|
|
|
+=======
|
|
|
+<img style="margin-right: 1em; padding: 5px" src="../pics/katrin_logo_round.png" width="2em" height="2em">
|
|
|
+>>>>>>> 8d26f27 (Patchpanel styling)
|
|
|
<a>
|
|
|
<b>High-Voltage Patch-Panel Configuration</b>
|
|
|
</font>
|
|
|
@@ -245,30 +337,48 @@
|
|
|
|
|
|
<tr bgcolor="#000000" height="1px"><td colspan="47"></td></tr>
|
|
|
<tr>
|
|
|
- <td bgcolor="#C8C8C8" colspan="22"><b>W E S T</b></td>
|
|
|
- <td colspan="3"><b>PATCH PANEL</b></td>
|
|
|
- <td bgcolor="#C8C8C8" colspan="22"><b>E A S T</b></td>
|
|
|
+ <th bgcolor="#C8C8C8" colspan="22"><b>W E S T</b></th>
|
|
|
+ <th colspan="3"><b>PATCH PANEL</b></th>
|
|
|
+ <th bgcolor="#C8C8C8" colspan="22"><b>E A S T</b></th>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<?php
|
|
|
- for ($id=2; $id<7; $id++) { if ($id % 2 == 1) $color = "#FFFFFF"; else $color = "#C8C8C8"; echo '<td bgcolor="' . $color . '" colspan="2">0' . $id . '</td>'; }
|
|
|
+ for ($id=2; $id<7; $id++) {
|
|
|
+ if ($id % 2 == 1) $class = "odd"; else $class = "even";
|
|
|
+ echo '<td class="highlight ' . $class . '" colspan="2">0' . $id . '</td>';
|
|
|
+ }
|
|
|
echo '<td colspan="2">07-11</td>';
|
|
|
- for ($id=12; $id<17; $id++) { if ($id % 2 == 1) $color = "#FFFFFF"; else $color = "#C8C8C8"; echo '<td bgcolor="' . $color . '" colspan="2">' . $id . '</td>'; }
|
|
|
+ for ($id=12; $id<17; $id++) {
|
|
|
+ if ($id % 2 == 1) $class = "odd"; else $class = "even";
|
|
|
+ echo '<td class="highlight ' . $class . '" colspan="2">' . $id . '</td>';
|
|
|
+ }
|
|
|
echo '<td> ADEI </td>';
|
|
|
echo '<td> CH </td>';
|
|
|
echo '<td> ADEI </td>';
|
|
|
- for ($id=2; $id<7; $id++) { if ($id % 2 == 1) $color = "#FFFFFF"; else $color = "#C8C8C8"; echo '<td bgcolor="' . $color . '" colspan="2">0' . $id . '</td>'; }
|
|
|
+ for ($id=2; $id<7; $id++) {
|
|
|
+ if ($id % 2 == 1) $class = "odd"; else $class = "even";
|
|
|
+ echo '<td class="highlight ' . $class . '" colspan="2">0' . $id . '</td>';
|
|
|
+ }
|
|
|
echo '<td colspan="2">07-11</td>';
|
|
|
- for ($id=12; $id<17; $id++) { if ($id % 2 == 1) $color = "#FFFFFF"; else $color = "#C8C8C8"; echo '<td bgcolor="' . $color . '" colspan="2">' . $id . '</td>'; }
|
|
|
+ for ($id=12; $id<17; $id++) {
|
|
|
+ if ($id % 2 == 1) $class = "odd"; else $class = "even";
|
|
|
+ echo '<td class="highlight ' . $class . '" colspan="2">' . $id . '</td>';
|
|
|
+ }
|
|
|
?>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<?php
|
|
|
- for ($id=0; $id<11; $id++) { if ($id % 2 == 1) $color = "#FFFFFF"; else $color = "#C8C8C8"; echo '<td bgcolor="' . $color . '">o</td><td bgcolor="' . $color . '">i</td>'; }
|
|
|
+ for ($id=0; $id<11; $id++) {
|
|
|
+ if ($id % 2 == 1) $class = "odd"; else $class = "even";
|
|
|
+ echo '<td class="highlight ' . $class . '">o</td><td class="highlight ' . $class . '">i</td>';
|
|
|
+ }
|
|
|
echo '<td></td>';
|
|
|
echo '<td></td>';
|
|
|
echo '<td></td>';
|
|
|
- for ($id=0; $id<11; $id++) { if ($id % 2 == 1) $color = "#FFFFFF"; else $color = "#C8C8C8"; echo '<td bgcolor="' . $color . '">o</td><td bgcolor="' . $color . '">i</td>'; }
|
|
|
+ for ($id=0; $id<11; $id++) {
|
|
|
+ if ($id % 2 == 1) $class = "odd"; else $class = "even";
|
|
|
+ echo '<td class="highlight ' . $class . '">o</td><td class="highlight ' . $class . '">i</td>';
|
|
|
+ }
|
|
|
?>
|
|
|
</tr>
|
|
|
<?php
|
|
|
@@ -278,25 +388,26 @@
|
|
|
|
|
|
$text = str_pad($ch, 2, 0, STR_PAD_LEFT);
|
|
|
|
|
|
- echo '<tr>';
|
|
|
+ echo '<tr class="highlight">';
|
|
|
|
|
|
for ($id=0; $id<22; $id++)
|
|
|
{
|
|
|
- if ($id % 4 == 2 || $id % 4 == 3) $color = "#FFFFFF"; else $color = "#C8C8C8";
|
|
|
+ //if ($id % 4 == 2 || $id % 4 == 3) $color = "#FFFFFF"; else $color = "#C8C8C8";
|
|
|
+ if ($id % 4 == 2 || $id % 4 == 3) $class = "odd"; else $class = "even";
|
|
|
|
|
|
$checked = "";
|
|
|
if ($check[$id] == $ch) $checked = 'checked="checked"';
|
|
|
- echo '<td bgcolor="' . $color . '"><input type="radio" name="' . $rings[$id] . '" value="' . $ch . '" ' . $checked . '></td>';
|
|
|
+ echo '<td class="highlight ' . $class . '"><label class="container"><input type="radio" name="' . $rings[$id] . '" value="' . $ch . '" ' . $checked . '><span class="checkmark"></span></label></td>';
|
|
|
}
|
|
|
|
|
|
$value = $adeiValue[1][$ch];
|
|
|
if ($ch == 22) $value = $adeiValue[0][0] + $adeiValue[0][1];
|
|
|
echo '<td>' . sprintf('%.0F', $value) . '</td>';
|
|
|
|
|
|
- echo '<td><b>';
|
|
|
+ echo '<th><b>';
|
|
|
if ($ch == 22) echo 'IE';
|
|
|
else echo $text;
|
|
|
- echo '</b></td>';
|
|
|
+ echo '</b></th>';
|
|
|
|
|
|
$value = $adeiValue[2][$ch];
|
|
|
if ($ch == 22) $value = $adeiValue[0][0] + $adeiValue[0][2];
|
|
|
@@ -304,11 +415,12 @@
|
|
|
|
|
|
for ($id=22; $id<44; $id++)
|
|
|
{
|
|
|
- if ($id % 4 == 0 || $id % 4 == 1) $color = "#FFFFFF"; else $color = "#C8C8C8";
|
|
|
+ //if ($id % 4 == 0 || $id % 4 == 1) $color = "#FFFFFF"; else $color = "#C8C8C8";
|
|
|
+ if ($id % 4 == 2 || $id % 4 == 3) $class = "even"; else $class = "odd";
|
|
|
|
|
|
$checked = "";
|
|
|
if ($check[$id] == $ch) $checked = 'checked="checked"';
|
|
|
- echo '<td bgcolor="' . $color . '"><input type="radio" name="' . $rings[$id] . '" value="' . $ch . '" ' . $checked . '></td>';
|
|
|
+ echo '<td class="highlight ' . $class . '"><label class="container"><input type="radio" name="' . $rings[$id] . '" value="' . $ch . '" ' . $checked . '><span class="checkmark"></span></label></td>';
|
|
|
}
|
|
|
|
|
|
echo '</tr>';
|
