mirror/gradio
2
0
Fork 0
mirror of https://github.com/gradio-app/gradio.git synced 2025-04-18 12:50:30 +08:00
Code Issues Packages Projects Releases Wiki Activity

On Windows OS, hide gr.Dataframe scrollbars while keeping scrolling functionality (#10784)

Browse Source 
* scrollbars

* add changeset

* add changeset

* add changeset

* format

* changes

* revert

* add changeset

* revert everything

* revert

* delete changeset

* changes

* add changeset

* Changes"
push
"
;

* changes

* changes

* changes

* notebook

* maybe a simpler fix

* - add css tweaks back in
- add touch device improvement

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
Co-authored-by: Hannah <hannahblair@users.noreply.github.com>
This commit is contained in:
Abubakar Abid 2025-03-13 00:05:07 -07:00 committed by GitHub
parent 88941b655e
commit 681254453a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 54 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
.changeset/better-cooks-jam.md Normal file
View File

@ -0,0 +1,6 @@
---
"@gradio/dataframe": patch
"gradio": patch
---
feat:On Windows OS, hide `gr.Dataframe` scrollbars while keeping scrolling functionality

2
demo/matrix_transpose/run.ipynb
View File

@ -1 +1 @@
{"cells": [{"cell_type": "markdown", "id": "302934307671667531413257853548643485645", "metadata": {}, "source": ["# Gradio Demo: matrix_transpose"]}, {"cell_type": "code", "execution_count": null, "id": "272996653310673477252411125948039410165", "metadata": {}, "outputs": [], "source": ["!pip install -q gradio "]}, {"cell_type": "code", "execution_count": null, "id": "288918539441861185822528903084949547379", "metadata": {}, "outputs": [], "source": ["import numpy as np\n", "\n", "import gradio as gr\n", "\n", "def transpose(matrix):\n", " return matrix.T\n", "\n", "demo = gr.Interface(\n", " transpose,\n", " gr.Dataframe(type=\"numpy\", datatype=\"number\", row_count=5, col_count=3, show_fullscreen_button=True),\n", " \"numpy\",\n", " examples=[\n", " [np.zeros((3, 3)).tolist()],\n", " [np.ones((2, 2)).tolist()],\n", " [np.random.randint(0, 10, (3, 10)).tolist()],\n", " [np.random.randint(0, 10, (10, 3)).tolist()],\n", " [np.random.randint(0, 10, (10, 10)).tolist()],\n", " ],\n", " cache_examples=False\n", ")\n", "\n", "if __name__ == \"__main__\":\n", " demo.launch()\n"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5}
{"cells": [{"cell_type": "markdown", "id": "302934307671667531413257853548643485645", "metadata": {}, "source": ["# Gradio Demo: matrix_transpose"]}, {"cell_type": "code", "execution_count": null, "id": "272996653310673477252411125948039410165", "metadata": {}, "outputs": [], "source": ["!pip install -q gradio "]}, {"cell_type": "code", "execution_count": null, "id": "288918539441861185822528903084949547379", "metadata": {}, "outputs": [], "source": ["import numpy as np\n", "\n", "import gradio as gr\n", "\n", "def transpose(matrix):\n", " return matrix.T\n", "\n", "demo = gr.Interface(\n", " transpose,\n", " gr.Dataframe(type=\"numpy\", datatype=\"number\", row_count=5, col_count=3, show_fullscreen_button=True),\n", " \"numpy\",\n", " examples=[\n", " [np.zeros((30, 30)).tolist()],\n", " [np.ones((2, 2)).tolist()],\n", " [np.random.randint(0, 10, (3, 10)).tolist()],\n", " [np.random.randint(0, 10, (10, 3)).tolist()],\n", " [np.random.randint(0, 10, (10, 10)).tolist()],\n", " ],\n", " cache_examples=False\n", ")\n", "\n", "if __name__ == \"__main__\":\n", " demo.launch()\n"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5}

2
demo/matrix_transpose/run.py
View File

@ -10,7 +10,7 @@ demo = gr.Interface(
gr.Dataframe(type="numpy", datatype="number", row_count=5, col_count=3, show_fullscreen_button=True),
"numpy",
examples=[
[np.zeros((3, 3)).tolist()],
[np.zeros((30, 30)).tolist()],
[np.ones((2, 2)).tolist()],
[np.random.randint(0, 10, (3, 10)).tolist()],
[np.random.randint(0, 10, (10, 3)).tolist()],

48
js/dataframe/shared/VirtualTable.svelte
View File

@ -305,8 +305,7 @@
<style type="text/css">
table {
position: relative;
overflow-y: scroll;
overflow-x: scroll;
overflow: auto;
-webkit-overflow-scrolling: touch;
max-height: var(--max-height);
box-sizing: border-box;
@ -321,7 +320,52 @@
width: 100%;
scroll-snap-type: x proximity;
border-collapse: separate;
scrollbar-width: thin;
scrollbar-color: rgba(128, 128, 128, 0.5) transparent;
}
table::-webkit-scrollbar {
width: 4px;
height: 4px;
}
table::-webkit-scrollbar-track {
background: transparent;
}
table::-webkit-scrollbar-thumb {
background-color: rgba(128, 128, 128, 0.5);
border-radius: 4px;
}
table:hover {
scrollbar-color: rgba(160, 160, 160, 0.7) transparent;
}
table:hover::-webkit-scrollbar-thumb {
background-color: rgba(160, 160, 160, 0.7);
border-radius: 4px;
width: 4px;
}
@media (hover: none) {
table {
scrollbar-color: rgba(160, 160, 160, 0.7) transparent;
}
table::-webkit-scrollbar-thumb {
background-color: rgba(160, 160, 160, 0.7);
border-radius: 4px;
}
}
@media (pointer: coarse) {
table::-webkit-scrollbar {
width: 8px;
height: 8px;
}
}
table :is(thead, tfoot, tbody) {
display: table;
table-layout: fixed;