Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Added style to table representation #17

Merged
merged 6 commits into from
Jan 24, 2022
Merged

Added style to table representation #17

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
c84cd17
Added style to table representation
germa89 Jan 21, 2022
1e2cbf1
v2
germa89 Jan 21, 2022
1790e77
final proposal
germa89 Jan 21, 2022
7ea4cdd
Removed align center
germa89 Jan 21, 2022
c383f03
Added centered versions of table, longtable and dataframe.
germa89 Jan 21, 2022
4619cc9
added text alignment to table-centered.
germa89 Jan 24, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
234 changes: 234 additions & 0 deletions pyansys_sphinx_theme/static/css/theme.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -179,3 +179,237 @@ p.rubric {
margin-top: 0.75em;
margin-bottom: 0.75em;
}



/*
###############
table
###############
*/

table {
germa89 marked this conversation as resolved.
Show resolved Hide resolved
width:100%;
max-width: 100%;
border-spacing: 0;
border-collapse: collapse;
overflow: hidden;
vertical-align: middle;

/* Disabling scroll bars */
overflow-y: scroll;
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* Internet Explorer 10+ */
}

tr {
background-color: white;
}

th {
background-color: rgb(255, 183, 27, 0.55);
}

tr:nth-child(odd){
background-color: white;
Andy-Grigg marked this conversation as resolved.
Show resolved Hide resolved
}

tr:nth-child(even){
background-color: rgb(255, 183, 27, 0.15);
}

/*
#####################
Table-centered
#####################
Same as table but with horizontally centered text.


Use as:

.. table::
:class: table-centered
germa89 marked this conversation as resolved.
Show resolved Hide resolved

+---------------------------+-------------------+
| | MAPDL Command |
+===========================+===================+
| **GUI commands** | * ``*ASK`` |
| +-------------------+
| ...
| ...


*/
table.table-centered {
Andy-Grigg marked this conversation as resolved.
Show resolved Hide resolved
width:100%;
max-width: 100%;
border-spacing: 0;
border-collapse: collapse;
overflow: hidden;
vertical-align: middle;
text-align: center;

/* Disabling scroll bars */
overflow-y: scroll;
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* Internet Explorer 10+ */
}

.table-centered tr {
background-color: white;
text-align: center;
}

.table-centered th {
background-color: rgb(255, 183, 27, 0.55);
text-align: center;
}

.table-centered tr:nth-child(odd){
text-align: center;
background-color: white;
}

.table-centered tr:nth-child(even){
background-color: rgb(255, 183, 27, 0.15);
text-align: center;
}


/*
###############
longtable
###############
*/

table.longtable tr:hover td {
background-color: rgb(255, 183, 27, 0.6);
}

/*
#########################
longtable-centered
#########################

Use as:


.. table::
:class: longtable-centered

+---------------------------+-------------------+
| | MAPDL Command |
+===========================+===================+
| **GUI commands** | * ``*ASK`` |
| +-------------------+
| ...
| ...

*/

table.longtable-centered {
text-align: center;
}

.longtable-centered tr {
text-align: center;
}

.longtable-centered th {
text-align: center;
}

.longtable-centered tr:nth-child(odd){
text-align: center;
}

.longtable-centered tr:nth-child(even){
text-align: center;
}

table.longtable-centered tr:hover td {
background-color: rgb(255, 183, 27, 0.6);
text-align: center;
}

/*
##############
DataFrame
##############
Not sure why the odd columns (white) are rendered gray.

I do not think we will be able to call this class.
*/

.dataframe tr{
background-color: white;
}

.dataframe tr:nth-child(odd){
background-color: white !important;
}

.dataframe tr:nth-child(even){
background-color: rgb(255, 183, 27, 0.15);
}

.dataframe tr:hover td {
background-color: rgb(255, 183, 27, 0.6);
}


/*
#########################
DataFrame-centered
#########################
Not sure why the odd columns (white) are rendered gray.

I do not think we will be able to call this class.
*/

.dataframe-centered tr{
background-color: white;
text-align: center;
}

.dataframe-centered tr:nth-child(odd){
background-color: white !important;
text-align: center;
}

.dataframe-centered tr:nth-child(even){
background-color: rgb(255, 183, 27, 0.15);
text-align: center;
}

.dataframe-centered tr:hover td {
background-color: rgb(255, 183, 27, 0.6);
text-align: center;
}

.dataframe thead th {
text-align: center;
}



/*
###############
Autosummary
###############
*/
/* .autosummary {
text-align: left;
} */

.autosummary tr:nth-child(odd){
background-color: white;
}

.autosummary tr:nth-child(even){
background-color: white;
}