doc: highlight pointed column in NIC overview table

Every cells of a driver column are painted in yellow.

The trick is to generate some empty content as a big column
above and below the pointed cell.

The position: relative attribute is used for the highlight position
but it makes the border to disappear.

The overflow: hidden attribute is used to mask the generated content
outside of the table.

The class .wy-nav-content has a background which masks the highlighting.
Setting an opacity lower than 1, creates a new stack context and let
the column highlight to be shown.

The background of odd rows was grey and opaque. It is redefined with
a transparent alpha ratio in order to see highlighting on such rows.

Signed-off-by: Thomas Monjalon <thomas.monjalon@6wind.com>
Acked-by: Ferruh Yigit <ferruh.yigit@intel.com>
Acked-by: John McNamara <john.mcnamara@intel.com>
This commit is contained in:
Thomas Monjalon 2017-02-20 17:04:14 +01:00
parent d86c9db708
commit f229692d23

View File

@ -53,8 +53,12 @@ Most of these differences are summarized below.
.. raw:: html
<style>
.wy-nav-content {
opacity: .99;
}
table#id1 {
cursor: default;
overflow: hidden;
}
table#id1 th, table#id1 td {
text-align: center;
@ -76,6 +80,24 @@ Most of these differences are summarized below.
padding-left: 1em;
text-align: left;
}
table#id1 tr:nth-child(2n-1) td {
background-color: rgba(210, 210, 210, 0.2);
}
table#id1 th:not(:first-child):hover,
table#id1 td:not(:first-child):hover {
position: relative;
}
table#id1 th:not(:first-child):hover::after,
table#id1 td:not(:first-child):hover::after {
content: '';
height: 6000px;
top: -3000px;
width: 100%;
left: 0;
position: absolute;
z-index: -1;
background-color: #ffb;
}
table#id1 tr:hover td {
background-color: #ffb;
}