From a3720c3099bd039b01e4f5f4a946b1a15b0dafa6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Cristi=C3=A1n=20Maureira-Fredes?= Date: Wed, 28 Feb 2024 15:10:18 +0100 Subject: doc: list tools with a 2 column grid Using a similar grid-approach like the main page (without icons) to present the tools per-category. For the tools that have no page, the link is not generated, so there are no broken hyperlinks. Change-Id: I1a4f43b6e86a56988b5bc53f0592c36e69e55777 Reviewed-by: Jaishree Vyas Reviewed-by: Shyamnath Premnadh Reviewed-by: Friedemann Kleint (cherry picked from commit 00ede0eb96e2fe010f39309ae283f3bcfda7459d) --- sources/pyside6/doc/_static/css/qt_style.css | 16 +++ .../pyside6/doc/gettingstarted/package_details.rst | 148 +++++++++++++++++---- sources/shiboken6/doc/_static/css/qt_style.css | 58 ++++++++ 3 files changed, 194 insertions(+), 28 deletions(-) diff --git a/sources/pyside6/doc/_static/css/qt_style.css b/sources/pyside6/doc/_static/css/qt_style.css index 3e98c8ee8..08c4646c6 100644 --- a/sources/pyside6/doc/_static/css/qt_style.css +++ b/sources/pyside6/doc/_static/css/qt_style.css @@ -82,3 +82,19 @@ code.download:hover { text-decoration: none; padding: .375rem .75rem; } + +dl[class]:not(.option-list):not(.field-list):not(.footnote):not(.glossary):not(.simple):first-child > dt { + font-size: +2.25rem; + font-weight: 700; + color: #ff00dd; +} + +.theme-toggle svg{ + width: +1.25rem; + height: +2.25rem; +} + +.sd-card-title code span { + font-size: +1rem; + color: var(--color-brand-primary); +} diff --git a/sources/pyside6/doc/gettingstarted/package_details.rst b/sources/pyside6/doc/gettingstarted/package_details.rst index 074b2233e..40276ae15 100644 --- a/sources/pyside6/doc/gettingstarted/package_details.rst +++ b/sources/pyside6/doc/gettingstarted/package_details.rst @@ -90,57 +90,149 @@ from 6.3.0, grouped by different topics: Project development ~~~~~~~~~~~~~~~~~~~ -* ``pyside6-project``, to build Qt Designer forms (``.ui`` files), - resource files (``.qrc``) and QML type files (``.qmltype``) from - a ``.pyproject`` file. +.. grid:: 2 + :gutter: 3 3 4 5 + + .. grid-item-card:: ``pyside6-project`` + + to build Qt Designer forms (``.ui`` files), resource files (``.qrc``) + and QML type files (``.qmltype``) from a ``.pyproject`` file. + Widget Development ~~~~~~~~~~~~~~~~~~ -* ``pyside6-designer``, drag-and-drop tool for designing Widget UIs (generates ``.ui`` files, - see :ref:`using_ui_files`). -* ``pyside6-uic``, to generate Python code from ``.ui`` form files. -* ``pyside6-rcc``, to generate serialized data from ``.qrc`` resources files. - Keep in mind these files can be used in other non-widget projects. +.. grid:: 2 + :gutter: 3 3 4 5 + + .. grid-item-card:: ``pyside6-designer`` + :link: pyside6-designer + :link-type: ref + + drag-and-drop tool for designing Widget UIs (generates ``.ui`` files, + see :ref:`using_ui_files`). + + .. grid-item-card:: ``pyside6-uic`` + :link: pyside6-uic + :link-type: ref + + to generate Python code from ``.ui`` form files. + + .. grid-item-card:: ``pyside6-rcc`` + :link: pyside6-rcc + :link-type: ref + + to generate serialized data from ``.qrc`` resources files. + Keep in mind these files can be used in other non-widget projects. + QML Development ~~~~~~~~~~~~~~~ -* ``pyside6-qmllint``, that verifies the syntactic validity of QML files. -* ``pyside6-qmltyperegistrar``, to read metatypes files and generate - files that contain the necessary code to register all the types marked with - relevant macros. -* ``pyside6-qmlimportscanner``, to identify the QML modules imported from a - project/QML files and dump the result as a JSON array. -* ``pyside6-qmlcachegen``, to compile QML to bytecode at compile time for bundling inside the - binary. +.. grid:: 2 + :gutter: 3 3 4 5 + + .. grid-item-card:: ``pyside6-qmllint`` + :link: pyside6-qmllint + :link-type: ref + + that verifies the syntactic validity of QML files. + + .. grid-item-card:: ``pyside6-qmlregistrar`` + :link: pyside6-qmlregistrar + :link-type: ref + + to read metatypes files and generate files that contain the necessary + code to register all the types marked with relevant macros. + + .. grid-item-card:: ``pyside6-qmlimportscanner`` + :link: pyside6-qmlimportscanner + :link-type: ref + + to identify the QML modules imported from a + project/QML files and dump the result as a JSON array. + + .. grid-item-card:: ``pyside6-qmlcachegen`` + :link: pyside6-qmlcachegen + :link-type: ref + + to compile QML to bytecode at compile time for bundling inside the + binary. Translations ~~~~~~~~~~~~ -* ``pyside6-linguist``, for translating text in applications (see :ref:`translations`). -* ``pyside6-lrelease``, to create run-time translation files for the application. -* ``pyside6-lupdate``, to synchronize source code and translations. +.. grid:: 2 + :gutter: 3 3 4 5 + + .. grid-item-card:: ``pyside6-linguist`` + :link: pyside6-linguist + :link-type: ref + + for translating text in applications (see :ref:`translations`). + + .. grid-item-card:: ``pyside6-lrelease`` + :link: pyside6-lrelease + :link-type: ref + + to create run-time translation files for the application. + + .. grid-item-card:: ``pyside6-lupdate`` + :link: pyside6-lupdate + :link-type: ref + + to synchronize source code and translations. Qt Help ~~~~~~~ -* ``pyside6-assistant``, for viewing online documentation in Qt Help file format. - Read more about the formats on the `QtHelp Framework`_ page. +.. grid:: 2 + :gutter: 3 3 4 5 + + .. grid-item-card:: ``pyside6-assistant`` + :link: pyside6-assistant + :link-type: ref + + for viewing online documentation in Qt Help file format. + Read more about the formats on the `QtHelp Framework`_ page. .. _`QtHelp Framework`: https://doc.qt.io/qt-6/qthelp-framework.html PySide Utilities ~~~~~~~~~~~~~~~~ -* ``pyside6-genpyi``, to generate Python stubs (``.pyi`` files) for Qt modules. -* ``pyside6-metaobjectdump``, a tool to print out the metatype information in - JSON to be used as input for ``qmltyperegistrar``. +.. grid:: 2 + :gutter: 3 3 4 5 + + .. grid-item-card:: ``pyside6-genpyi`` + :link: pyside6-genpyi + :link-type: ref + + to generate Python stubs (``.pyi`` files) for Qt modules. + + .. grid-item-card:: ``pyside6-metaobjectdump`` + :link: pyside6-metaobjectdump + :link-type: ref + + a tool to print out the metatype information in JSON to be used as + input for ``qmltyperegistrar``. Deployment ~~~~~~~~~~ -* :ref:`pyside6-deploy `, to deploy PySide6 applications to desktop platforms - - Linux, Windows and macOS. -* ``pyside6-android-deploy``, to deploy PySide6 application as an Android app - targeting different Android platforms - aarch64, armv7a, i686, x86_64. +.. grid:: 2 + :gutter: 3 3 4 5 + + .. grid-item-card:: ``pyside6-deploy`` + :link: pyside6-deploy + :link-type: ref + + to deploy PySide6 applications to desktop platforms - Linux, Windows + and macOS. + + .. grid-item-card:: ``pyside6-android-deploy`` + :link: pyside6-android-deploy + :link-type: ref + + to deploy PySide6 application as an Android app targeting different + Android platforms - aarch64, armv7a, i686, x86_64. diff --git a/sources/shiboken6/doc/_static/css/qt_style.css b/sources/shiboken6/doc/_static/css/qt_style.css index f174a6c52..08c4646c6 100644 --- a/sources/shiboken6/doc/_static/css/qt_style.css +++ b/sources/shiboken6/doc/_static/css/qt_style.css @@ -1,3 +1,17 @@ +.text-center { + text-align: center !important; +} + +.text-center img { + padding-top: 10px; + height: 70px !important; +} + +.cover-img img { + object-fit: cover; + height: 50%; +} + /* Tables */ .section .docutils.container td { float:left; @@ -40,3 +54,47 @@ table.docutils td ul > li { position:relative; overflow:visible } + +/* We cannot put a :download:`....` command inside + * a sphinx-design button, so we add some properties from the button + * to the download class to mimic it */ +code.download { + text-align: center; + color: var(--color-brand-primary); + display: block; + border-color: transparent; + background-color: transparent; + border: 1px solid var(--color-brand-primary) !important; + border-radius: 0.25rem; + font-size: 1rem; + font-weight: 400; + vertical-align: middle; + padding: .375rem .75rem; + user-select: none; + line-height: 1.5; + transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; +} + +code.download:hover { + color: white; + background-color: var(--color-brand-primary); + border-color: var(--color-brand-primary); + text-decoration: none; + padding: .375rem .75rem; +} + +dl[class]:not(.option-list):not(.field-list):not(.footnote):not(.glossary):not(.simple):first-child > dt { + font-size: +2.25rem; + font-weight: 700; + color: #ff00dd; +} + +.theme-toggle svg{ + width: +1.25rem; + height: +2.25rem; +} + +.sd-card-title code span { + font-size: +1rem; + color: var(--color-brand-primary); +} -- cgit v1.2.3