khanh.pndc/nextcloud-docs
1
0
Fork 0
mirror of https://github.com/nextcloud/documentation.git synced 2026-01-02 17:59:36 +07:00
Code Issues Packages Projects Releases Wiki Activity

update design foundation and add penpot links

Browse Source 
Signed-off-by: Simon L <szaimen@e.mail.de>
This commit is contained in:
Simon L
2023-05-24 15:28:53 +02:00
parent e891a1691f
commit 846b7d5ba2
1 changed files with 8 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
developer_manual/design/foundations.rst
View File

@@ -4,9 +4,13 @@ Foundations
There are several design elements that are common to all Nextcloud apps. If you are developing for a platform that has its own design specifications, for example Android, it would be a good idea to keep those in mind while designing your app.
For web apps, there is the `Vue library <https://nextcloud-vue-components.netlify.app/>`_ and the `Penpot Design Kit <https://design.penpot.app/#/view/db3839da-807b-8052-8002-576401e9a375?page-id=db3839da-807b-8052-8002-576401e9a376&section=interactions&index=0&share-id=88d87192-d205-8007-8002-8ebfad297c28>`_.
Color
-----
`Penpot Colors <https://design.penpot.app/#/view/db3839da-807b-8052-8002-576401e9a375?page-id=3f784c86-6c27-80c6-8002-6ab128f3ffe2&section=interactions&index=3&share-id=11fde340-21f4-802e-8002-8ebec1b418b7>`_
Primary color
^^^^^^^^^^^^^
@@ -129,6 +133,8 @@ While interface elements like buttons are colored differently depending on their
Typography
----------
`Penpot Typographie <https://design.penpot.app/#/view/db3839da-807b-8052-8002-576401e9a375?page-id=3f784c86-6c27-80c6-8002-6ab128f3ffe2&section=interactions&index=1&share-id=11fde340-21f4-802e-8002-8ebec1b418b7>`_
To ensure compatibility with different platforms, Nextcloud apps always use the native system font.
For legibility, make sure that the text in your content uses:
@@ -149,6 +155,8 @@ The text sizes for the different platforms are:
Icons
-----
`Penpot Icons <https://design.penpot.app/#/view/db3839da-807b-8052-8002-576401e9a375?page-id=3f784c86-6c27-80c6-8002-6ab128f3ffe2&section=interactions&index=0&share-id=11fde340-21f4-802e-8002-8ebec1b418b7>`_
.. image:: ../images/material-icons.png
:alt: Material icons