Template talk:COVID-19 pandemic data/styles.css
Archives: 1 |
|
This page has archives. Sections older than 90 days may be automatically archived by Lowercase sigmabot III when more than 3 sections are present. |
Bug report: column header invisible + border modifying
editI used the setup this CSS page provides here for sticky headers and rows and during vertical scrolling the column headers disappear but not the sorting arrows. As well as class="sticky-row" style="height: 2em; border-bottom: 2px solid gray;"
doesn't display thicker borders. Can this be resolved? Qwerty284651 (talk) 20:17, 29 May 2024 (UTC)
- @Qwerty284651: "sticky-row" should be used once on the first row with these styles. Looks like you added the {{sticky header}} template too, but it shouldn't be used with this since they have different styles. I would just use that other template and keep it simple. If you still need the vertical scroll, that template has a "sticky-header-scroll" class that can be added. I simplified the table's usage, so it should work now. Jroberson108 (talk) 21:03, 29 May 2024 (UTC)
- Thanks. You removed the sticky row I had setup. I want to have the table inside a shorter div scroll, because it will only get longer with subsequent wins and to preserve space, I used the class=scroll container from the CSS page, but I feel, regular overflow: auto with custom style=width, maybe 30, 40 em, should do the trick. Thoughts? Qwerty284651 (talk) 21:22, 29 May 2024 (UTC)
- @Qwerty284651: I added the above mentioned "sticky-header-scroll" class for the vertical scroll. It adjusts in height based on device, so kind of like a percentage of the page height (75vh). It makes it fit on mobile and desktop. Jroberson108 (talk) 21:49, 29 May 2024 (UTC)
- What is 75vh in pt or em? Qwerty284651 (talk) 22:02, 29 May 2024 (UTC)
- @Qwerty284651: 75% of the viewport height, which the height can vary based on device. Read more here: [1] [2]. Jroberson108 (talk) 22:23, 29 May 2024 (UTC)
- Thanks for the sources. Any idea on why the markup on the line borders isn't showing? Qwerty284651 (talk) 00:12, 30 May 2024 (UTC)
- Can you add a custom param for the vh to be toggleable? I would have at 50% or even less. Qwerty284651 (talk) 00:13, 30 May 2024 (UTC)
- @Qwerty284651: I added an inline style of "50vh" to the div to override the template's style. Jroberson108 (talk) 00:26, 30 May 2024 (UTC)
- Thanks. Qwerty284651 (talk) 00:31, 30 May 2024 (UTC)
- @Qwerty284651: I added an inline style of "50vh" to the div to override the template's style. Jroberson108 (talk) 00:26, 30 May 2024 (UTC)
- @Qwerty284651: 75% of the viewport height, which the height can vary based on device. Read more here: [1] [2]. Jroberson108 (talk) 22:23, 29 May 2024 (UTC)
- What is 75vh in pt or em? Qwerty284651 (talk) 22:02, 29 May 2024 (UTC)
- @Qwerty284651: I added the above mentioned "sticky-header-scroll" class for the vertical scroll. It adjusts in height based on device, so kind of like a percentage of the page height (75vh). It makes it fit on mobile and desktop. Jroberson108 (talk) 21:49, 29 May 2024 (UTC)
- Thanks. You removed the sticky row I had setup. I want to have the table inside a shorter div scroll, because it will only get longer with subsequent wins and to preserve space, I used the class=scroll container from the CSS page, but I feel, regular overflow: auto with custom style=width, maybe 30, 40 em, should do the trick. Thoughts? Qwerty284651 (talk) 21:22, 29 May 2024 (UTC)
Stick row and sticky col class
editCan you make a sticky row template similar to {{sticky header}}? In this example, which you helped with I had to add
<templatestyles src="COVID-19 pandemic data/styles.css"/>
<div class="covid19-container" role="region" tabindex="0">
above the chart. Can the addition of templatestyles and class=covid19-container be substituted with a sticky-row template, which can the be added to the Help:Table/Advanced and further enrich tables across wiki.
Side note: can a custom param be added for sticky-col1 or 2 classes (fake row; I presume this would require javascript) that could handle col/rowspans in tables and not have them appear skewed up when vertically scrolling? See a bad example with row groups. Qwerty284651 (talk) 00:08, 4 June 2024 (UTC)