From 4d7a5d9e4b28e5fcb860bfdf2bcdb3dfb418e29a Mon Sep 17 00:00:00 2001 From: felix-ico <97440128+felix-ico@users.noreply.github.com> Date: Fri, 23 Feb 2024 16:33:41 +0100 Subject: [PATCH] Prepare release (#2286) --- .../color-mode-switch-addon/register.js | 6 + .../public/fonts/scale-fonts-storybook.css | 4 + .../storybook-vue/stories/Index.stories.mdx | 2 +- packages/storybook-vue/stories/Index_de.md | 72 ++++- packages/storybook-vue/stories/Index_en.md | 72 ++++- .../TelekomBrandHeader.stories.mdx | 298 ------------------ .../stories/new_release/SketchLibrary_de.md | 49 ++- .../stories/new_release/SketchLibrary_en.md | 48 ++- .../GettingStartedForDesigners_de.md | 28 +- .../GettingStartedForDesigners_en.md | 29 +- packages/storybook-vue/translations.json | 4 +- 11 files changed, 244 insertions(+), 368 deletions(-) diff --git a/packages/storybook-vue/.storybook/color-mode-switch-addon/register.js b/packages/storybook-vue/.storybook/color-mode-switch-addon/register.js index d12ca09703..9ca7f1d476 100644 --- a/packages/storybook-vue/.storybook/color-mode-switch-addon/register.js +++ b/packages/storybook-vue/.storybook/color-mode-switch-addon/register.js @@ -20,6 +20,12 @@ const inactiveBtnClassName = 'css-am1h1h'; const separatorClassName = 'css-14kbt3m'; function switchMode(mode) { + const currentURL = window.location.href; + // avoid changing the mode for following pages (we use a scale component there and it's not working properly with dark mode) + if (currentURL.includes('/new-release-sketch-library-update') || currentURL.includes('setup-info-getting-started-for-designers')) { + mode = 'light'; + } + try { const previewIframe = document.querySelector('#storybook-preview-iframe'); previewIframe.contentWindow.document.body.dataset.mode = mode; diff --git a/packages/storybook-vue/public/fonts/scale-fonts-storybook.css b/packages/storybook-vue/public/fonts/scale-fonts-storybook.css index c9e067d558..fb7e30569a 100644 --- a/packages/storybook-vue/public/fonts/scale-fonts-storybook.css +++ b/packages/storybook-vue/public/fonts/scale-fonts-storybook.css @@ -96,3 +96,7 @@ .sbdocs-ol[type='a'] { list-style-type: lower-alpha; } + +.magenta { + color: var(--telekom-color-text-and-icon-primary-standard) !important; +} \ No newline at end of file diff --git a/packages/storybook-vue/stories/Index.stories.mdx b/packages/storybook-vue/stories/Index.stories.mdx index b6c89263b6..fb653a5c84 100644 --- a/packages/storybook-vue/stories/Index.stories.mdx +++ b/packages/storybook-vue/stories/Index.stories.mdx @@ -15,7 +15,7 @@ import text_de from './Index_de.md'; : 'Wilkommen beim Scale Design System'; return ( - {alt} + {locale && ( )} diff --git a/packages/storybook-vue/stories/Index_de.md b/packages/storybook-vue/stories/Index_de.md index 157df5af6f..be729804c7 100644 --- a/packages/storybook-vue/stories/Index_de.md +++ b/packages/storybook-vue/stories/Index_de.md @@ -1,29 +1,73 @@
-### Scale ist das digitale Design System der Telekom +

Wichtige Informationen für alle Nutzer*innen von Scale!

+
+
+
+ +### Wir, das Team, das das Scale Design System entwickelt hat, möchten einige spannende Neuigkeiten mit Euch teilen. + +Nach vielen Jahren, in denen Scale von einem sehr kleinen Team aufgebaut wurde, **haben wir nun die Möglichkeit, einen großen Schritt vorwärts zu machen.** + +Gemeinsam mit unserer internen Design-System-Community haben wir bestehende Lösungen mit führenden Design Systemen verglichen und Verbesserungsmöglichkeiten identifiziert, die wir mit diesem nächsten Schritt angehen werden. Nochmals herzlichen Dank an alle, die bisher daran beteiligt waren. + +**Wir freuen uns sehr, verkünden zu können, dass wir bereits mit der Arbeit an der nächsten Evolutionsstufe des Telekom Design Systems begonnen haben. Es ist darauf ausgerichtet, alle wichtigen kundenbezogenen Produkte der DT Gruppe in Europa zu unterstützen.** + +Ja, das ist ambitioniert, aber wir sind als Team gewachsen und glauben fest daran, dass wir es schaffen können. + +Mit diesem neuen Fokus müssen wir auch die Weiterentwicklung des Scale Design Systems denen überlassen, die bereits dazu beigetragen haben, es zu entwickeln: der Open-Source-Community. Obwohl wir leider nicht mehr unterstützen und keine neuen Komponenten mehr erstellen werden: Scale existiert weiter. Veröffentliche gerne Fixes und verbessere das solide Fundament, das wir gemeinsam geschaffen haben. + +Für Interessierte, die bisher mit Scale gearbeitet haben, werden wir den Übergang zur nächsten Evolutionsstufe des Design Systems so einfach wie möglich zu machen. + +Haben wir dein Interesse geweckt? -Scale ist Teil von Brand & Design. Alle Komponenten sind markenkonform und helfen, ein kohärentes Markenerlebnis zu schaffen. +Perfekt. -### Code und Design für konsistente Produkte +Weitere Details folgen. -Das auf unserer Markenidentität basierende Designsystem hilft dir, konsistente Produkte zu entwickeln. So stärkst du die Marke Telekom. +
+ +### Was sich jetzt ändert: + +Wir werden die Scale Design-Libraries in unseren Telekom Enterprise Workspace migrieren. Danach werden deine Produktdateien von der Library getrennt sein. Alle extern gespeicherten Telekomprojekte müssen ebenfalls in den Telekom Workspace migrieren. Sobald du dies getan hast, werden die Komponenten in den Produktdateien automatisch mit der Library verknüpft sein. + +Wenn du die Libraries in deinem Draft-Ordner sichtbar haben möchtest: Klicke unter Settings auf den Link "enable libraries for all files in your drafts". Aktiviere die benötigten Libraries und du findest sie in deinem Draft-Ordner. + +
-### Barrierefreiheit „out of the box“ +### Zugang zu den Scale Figma Libraries -Die Komponenten von Scale erfüllen die technischen Anforderungen für das Level AA der Barrierefreiheit. Sie sind ebenso für kundenbezogene Produkte wie für interne Anwendungen geeignet. +**Telekom Mitarbeiter** -### Kompatibel mit den relevanten Frameworks und Design Tools +Schritt 1:
+Richte dir ein Telekom Figma Enterprise Konto ein. [So geht’s](https://seu30.gdc-dmst01.t-systems.com/confluence/display/SETOOLSBETRIEB/Figma@DT+How+to+add+User). -Die UI Libraries gibt es im Figma- und Sketchformat. Die Code Komponenten kannst du als reine Web-Komponenten oder in den Frameworks Vue, React und Angular verwenden. +Schritt 2:
+Migriere deine Arbeitsdateien von einem externen Konto in unser Telekom Figma Konto, um die Bibliothek zu nutzen und die Komponenten wieder zu verbinden. Benötigst du Hilfe, wende dich an den Telekom Figma Admin oder sende ein Ticket an den [Figma Support](https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001731233). + +Schritt 3:
+Nach der Migration der Dateien sind die enthaltenen Komponenten automatisch wieder mit der Scale Library in unserem Figma Workspace verbunden. Du kannst die Library auch wieder über das Library Panel aktivieren. + +Schritt 4:
+Lade externe Nutzer*innen zu den Dateien ein, indem du die Freigabefunktion in Figma nutzt. Externe Nutzer*innen benötigen Bearbeitungsrechte im Telekom Figma Workspace, um auf die Dateien zuzugreifen. Alle damit verbundenen Kosten werden der Projektkostenstelle in Rechnung gestellt. + +Hinweis:
+Alle internen Nutzer mit einer Telekom Figma Enterprise Lizenz können nach der Migration von Scale über den bestehenden Link auf die Datei zugreifen. + +
-### Für die beste User Experience +**Externe Nutzer\*innen** -Mit Scale sparst du Zeit – und zwar im gesamten Design- und Entwicklungsprozess: bei der Gestaltung von User Interfaces, beim Prototyping, der Design-Übergabe, der Frontend-Entwicklung und im Freigabeprozess mit Brand & Design. So bleibt mehr Zeit für spezifische Funktionen und Lösungen. +Externe Nutzer\*innen können die Scale Libraries ausschließlich mit einem Telekom Figma Enterprise Account nutzen. -### Flexibilität und Skalierbarkeit durch Design Tokens +Schritt 1:
+Migriere deine Arbeitsdateien von einem externen Konto in unser Telekom Figma Konto, um die Bibliothek zu nutzen und die Komponenten wieder zu verbinden. Benötigst du Hilfe, wende dich an den Telekom Figma Admin oder sende ein Ticket an den [Figma Support](https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001731233). -Durch die Verwendung von Design Tokens ist Scale besonders anpassungsfähig. Änderungen und Erweiterungen lassen sich schnell umsetzen. Auch weitere Themes für bspw. Drittmarken sind schnell erstellt. +Schritt 2:
+Nach der Migration deines Projektes solltest du dem Telekom Enterprise Account automatisch als Gast hinzugefügt werden. Sollte das nicht geschehen, kontaktiere deine Telekom internen Ansprechpartner im Projekt, um eine Einladung zu erhalten. Gib bitte unbedingt das Projekt an, an dem du arbeitest, und nenne den Namen eines internen Ansprechpartners. -### Für bessere Kollaboration +Schritt 3:
+Nach der Migration der Dateien sind die enthaltenen Komponenten automatisch wieder mit der Scale Library in unserem Figma Workspace verbunden. Du kannst die Library auch wieder über das Library Panel aktivieren. -Ein Designsytsem fördert die Zusammenarbeit zwischen Teams und Stakeholdern. Es schafft eine gemeinsame Grundlage, auf die alle Beteiligten gemeinsam aufbauen können. Als Designer*in oder Entwickler*in kannst du dazu beitragen, Scale zu verbessern. Schicke uns deine neuen oder verbesserten Komponenten, um sie mit deinen Kolleg\*innen in Scale zu teilen. +Hinweis:
+Alle externen Nutzer\*innen verlieren nach der Migration den Zugriff auf die Scale Libraries. Wenn du weiterhin Zugriff benötigst, kontaktiere uns , um eine Einladung zu erhalten. Gib bitte unbedingt das Projekt an, an dem du arbeitest, und nenne den Namen eines internen Ansprechpartners. diff --git a/packages/storybook-vue/stories/Index_en.md b/packages/storybook-vue/stories/Index_en.md index 921334807b..8a01213163 100644 --- a/packages/storybook-vue/stories/Index_en.md +++ b/packages/storybook-vue/stories/Index_en.md @@ -1,29 +1,73 @@
-### Scale is the Telekom Digital Design System +

Important Information for all Users of Scale!

+
+
+
+ +### We, the team, that build the Scale Design System, want to share some exciting updates with you. + +After many years, where Scale has been built by a very small team, enabling others to build their products and prototypes, **we were given the opportunity to make a huge leap on the matter.** + +In collaboration with our internal design system community, we have assessed current solutions against leading design systems, identifying areas for improvement that we aim to address with this next step. Thanks again to everyone involved so far. + +**We could not be happier to announce that we already started working on the next evolution of the Telekom Design System, planned to support all major customer related products of DT Group in Europe.** + +Yes, this is ambitious, but we grew as a team and firmly believe we can do it. Bear with us. + +**With this new focus, we also must leave the Scale Design System evolution to those who already helped to grow it: The Open-Source Community.** + +While sadly, we are not able to provide support anymore and will not build new components, keep in mind Scale is alive and all well +and can be used as is. Feel free to publish fixes and improve the solid foundation, we built. Even better, for those interested, since we are now working on a larger scale than ever before, we will try to enable an update path to the next evolution of the Design System. + +We made you curious? -Scale is a part of Brand & Design. All components are brand compliant and help create a coherent brand experience. +Perfect. -### Code and design for consistent products +Stay tuned, more details to follow. -Based on our brand identity, the Scale design system helps you develop consistent products. This is how you contribute to strengthening the Telekom brand. +
+ +### What is changing now: + +We’ll migrate the scale Figma libraries in our Telekom enterprise workspace. Afterward, your product files will be disconnected from the library. All Telekom projects stored externally have to migrate to the Telekom account as well. Once that’s done, the components will automatically link to the library. + +If you want to have the libraries visible in your draft folder: Click on the link “enable libraries for all files in your drafts” under settings. Activate the libraries you need and you will find them in your personal draft. + +
-### Accessibility out of the box +### Access to Figma libraries -Scale components meet the technical requirements for the accessibility level AA. They are just as suitable for customer-focused products as they are for internal use cases. +**Telekom employees** -### Compatible with the relevant framework and design tools +Step 1:
+Get a Telekom Enterprise account [by following these instructions](https://seu30.gdc-dmst01.t-systems.com/confluence/display/SETOOLSBETRIEB/Figma@DT+How+to+add+User). -The UI libraries are available in Figma and Sketch. You can use the code components as pure web components or in the framework for Vue, React, and Angular. +Step 2:
+Migrate your working files from an external account into our Telekom Figma account in order to utilize the library and reconnect the components. Reach out to the Telekom Figma Admin for assistance, or submit a ticket to [Figma Support](https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001731233). + +Step 3:
+After migrating the files, the components will automatically reconnect to the Scale library hosted in the Telekom Figma space. You have the option to enable the library in your files directly from the library panel. + +Step 4:
Invite external collaborators to the files using the share feature in Figma. External collaborators will require edit rights in the Telekom Figma Account to collaborate, and any associated costs will be charged to the project cost center. + +Note:
+Scale Figma link: All internal employee with a Telekom Figma Enterprise License can access the file through the existing link after Scale migration. + +
-### For the best user experience +**Externals** -Scale saves you time throughout the entire design and development process: for the design of user interfaces, prototyping, design handover, front-end development, and in the approval process with Brand & Design. This leaves more time to create specific features and functionality. +Externals can utilize the Scale library exclusively with a Telekom Figma Enterprise Account. -### Flexibility and scalability through design tokens +Step 1:
+Migrate your working files to your Telekom Figma account to utilize the library and reconnect the components. If you need assistance, contact your Telekom Figma Admin or submit a ticket to [Figma Support](https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001731233). -By including design tokens, Scale is particularly adaptable. Changes and additions can be implemented quickly. Other themes for third-party brands can also be created quickly. +Step 2:
+Obtain a guest account with the Telekom Figma Enterprise Account. Typically, after migrating your project, all collaborators in the files are automatically added as guests to Telekom. If you do not yet have access to Telekom Figma, please contact your Telekom internal project contacts to get an invitation. Be sure to mention the project you are working on and provide the name of an internal contact person you are collaborating with. -### For better collaboration +Step 3:
+After migrating the files, the components will automatically reconnect to the Scale library hosted in the Telekom Figma space. You have the option to enable the library in your files directly from the library panel. -A design system encourages collaboration between teams and stakeholders. It creates a common foundation on which everyone can build together. As a designer or developer, you can help improve Scale. Send us your new or improved components to share with your colleagues in Scale. +Note:
+Scale Figma Link: All external collaborators will not be able to access the Scale Figma library file via the existing link after migration. If you require access to the file, please get in touch with us to be invited. Please ensure to specify the project you are involved in and provide the name of an internal contact person you are collaborating with. diff --git a/packages/storybook-vue/stories/components/telekom-brand-header-navigation/TelekomBrandHeader.stories.mdx b/packages/storybook-vue/stories/components/telekom-brand-header-navigation/TelekomBrandHeader.stories.mdx index fa7ac0362f..908bad6fbd 100644 --- a/packages/storybook-vue/stories/components/telekom-brand-header-navigation/TelekomBrandHeader.stories.mdx +++ b/packages/storybook-vue/stories/components/telekom-brand-header-navigation/TelekomBrandHeader.stories.mdx @@ -315,304 +315,6 @@ scale-telekom-nav-item { ``` -## Profile Menu - -Set the profile menu's `logged-in` property to `true` or `false` to switch between the two states: - -### Logged out - - - - {TemplateProfileMenu.bind({})} - - - -#### deutsche Version - -```html - - - - - - - -``` - -#### English version - -```html - - - - - - - -``` - -### Logged in - - - - {TemplateProfileMenu.bind({})} - - - -#### deutsche Version - -```html - - - - - > - - - - -``` - -#### English version - -```html - - - - - > - - - - -``` - ## Data API (Backward compatibility) diff --git a/packages/storybook-vue/stories/new_release/SketchLibrary_de.md b/packages/storybook-vue/stories/new_release/SketchLibrary_de.md index 15b3665f4e..042b73385c 100644 --- a/packages/storybook-vue/stories/new_release/SketchLibrary_de.md +++ b/packages/storybook-vue/stories/new_release/SketchLibrary_de.md @@ -1,4 +1,12 @@ -# New: Scale Figma Libraries +# Scale Figma Libraries + + +

+ Wir migrieren die Scale Design Libraries in unser Telekom Unternehmenskonto. Dateien, die sich außerhalb unseres Kontos befinden, werden dadurch die Verbindung zur Library verlieren. Alle Telekom Projekte, die extern gespeichert sind, müssen in den Telekom Account migriert werden. Sobald das geschehen ist, werden die Komponenten automatisch mit der Bibliothek verknüpft.
Mehr erfahren +

+ + +
{alt} @@ -22,4 +30,41 @@ Jede Komponente beinhaltet eine Kurzbeschreibung und einen Link zur ausführlich ## Updates -Mit einer Pro Lizenz von Figma erhältst du sogar ganz automatisch künftige Updates. Gehe dafür in die Library zur Seite “Getting started” und hinterlasse deine E-Mail Adresse in dem dafür vorgesehenen Bereich. Wir laden dich dann zur Library ein. +Benutzer, die im Telekom Account arbeiten, erhalten regelmäßig Updates. Um auf die veröffentlichten Libraries zugreifen zu können, müssen externe Benutzer dem Telekom Account hinzugefügt werden. + +

Zugang zu den Scale Figma Libraries

+ +**Telekom Mitarbeiter** + +Schritt 1:
+Richte dir ein Telekom Figma Enterprise Konto ein. [So geht’s](https://seu30.gdc-dmst01.t-systems.com/confluence/display/SETOOLSBETRIEB/Figma@DT+How+to+add+User). + +Schritt 2:
+Migriere deine Arbeitsdateien von einem externen Konto in unser Telekom Figma Konto, um die Bibliothek zu nutzen und die Komponenten wieder zu verbinden. Benötigst du Hilfe, wende dich an den Telekom Figma Admin oder sende ein Ticket an den [Figma Support](https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001731233). + +Schritt 3:
+Nach der Migration der Dateien sind die enthaltenen Komponenten automatisch wieder mit der Scale Library in unserem Figma Workspace verbunden. Du kannst die Library auch wieder über das Library Panel aktivieren. + +Schritt 4:
+Lade externe Nutzer*innen zu den Dateien ein, indem du die Freigabefunktion in Figma nutzt. Externe Nutzer*innen benötigen Bearbeitungsrechte im Telekom Figma Workspace, um auf die Dateien zuzugreifen. Alle damit verbundenen Kosten werden der Projektkostenstelle in Rechnung gestellt. + +Hinweis:
+Alle internen Nutzer mit einer Telekom Figma Enterprise Lizenz können nach der Migration von Scale über den bestehenden Link auf die Datei zugreifen. + +
+ +**Externe Nutzer\*innen** + +Externe Nutzer\*innen können die Scale Libraries ausschließlich mit einem Telekom Figma Enterprise Account nutzen. + +Schritt 1:
+Migriere deine Arbeitsdateien von einem externen Konto in unser Telekom Figma Konto, um die Bibliothek zu nutzen und die Komponenten wieder zu verbinden. Benötigst du Hilfe, wende dich an den Telekom Figma Admin oder sende ein Ticket an den [Figma Support](https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001731233). + +Schritt 2:
+Nach der Migration deines Projektes solltest du dem Telekom Enterprise Account automatisch als Gast hinzugefügt werden. Sollte das nicht geschehen, kontaktiere deine Telekom internen Ansprechpartner im Projekt, um eine Einladung zu erhalten. Gib bitte unbedingt das Projekt an, an dem du arbeitest, und nenne den Namen eines internen Ansprechpartners. + +Schritt 3:
+Nach der Migration der Dateien sind die enthaltenen Komponenten automatisch wieder mit der Scale Library in unserem Figma Workspace verbunden. Du kannst die Library auch wieder über das Library Panel aktivieren. + +Hinweis:
+Alle externen Nutzer\*innen verlieren nach der Migration den Zugriff auf die Scale Libraries. Wenn du weiterhin Zugriff benötigst, kontaktiere uns , um eine Einladung zu erhalten. Gib bitte unbedingt das Projekt an, an dem du arbeitest, und nenne den Namen eines internen Ansprechpartners. diff --git a/packages/storybook-vue/stories/new_release/SketchLibrary_en.md b/packages/storybook-vue/stories/new_release/SketchLibrary_en.md index 0a023896e7..b91532da3a 100644 --- a/packages/storybook-vue/stories/new_release/SketchLibrary_en.md +++ b/packages/storybook-vue/stories/new_release/SketchLibrary_en.md @@ -1,4 +1,12 @@ -# New: Scale Figma Libraries +# Scale Figma Libraries + + +

+ We will migrate the scale design libraries to our Telekom enterprise account. Files outside of our account, will get disconnected . All Telekom projects stored externally have to migrate to the Telekom account. Once that's done, the components will automatically link to the library.
learn more +

+ + +
{alt} @@ -22,4 +30,40 @@ Each component includes a short description and a link to the detailed documenta ## Updates -With a Pro license from Figma, you will automatically receive future updates. To get this, go to “Getting started” in the library and leave your email address in the space provided. We will then invite you to the library. +Users working on the Telekom account will receive regular updates from the library. To access the published libraries, ensure that external users are added to the Telekom account. + +

Access to Figma libraries

+ +**Telekom employees** + +Step 1:
+Get a Telekom Enterprise account [by following these instructions](https://seu30.gdc-dmst01.t-systems.com/confluence/display/SETOOLSBETRIEB/Figma@DT+How+to+add+User). + +Step 2:
+Migrate your working files from an external account into our Telekom Figma account in order to utilize the library and reconnect the components. Reach out to the Telekom Figma Admin for assistance, or submit a ticket to [Figma Support](https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001731233). + +Step 3:
+After migrating the files, the components will automatically reconnect to the Scale library hosted in the Telekom Figma space. You have the option to enable the library in your files directly from the library panel. + +Step 4:
Invite external collaborators to the files using the share feature in Figma. External collaborators will require edit rights in the Telekom Figma Account to collaborate, and any associated costs will be charged to the project cost center. + +Note:
+Scale Figma link: All internal employee with a Telekom Figma Enterprise License can access the file through the existing link after Scale migration. + +
+ +**Externals** + +Externals can utilize the Scale library exclusively with a Telekom Figma Enterprise Account. + +Step 1:
+Migrate your working files to your Telekom Figma account to utilize the library and reconnect the components. If you need assistance, contact your Telekom Figma Admin or submit a ticket to [Figma Support](https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001731233). + +Step 2:
+Obtain a guest account with the Telekom Figma Enterprise Account. Typically, after migrating your project, all collaborators in the files are automatically added as guests to Telekom. If you do not yet have access to Telekom Figma, please contact your Telekom internal project contacts to get an invitation. Be sure to mention the project you are working on and provide the name of an internal contact person you are collaborating with. + +Step 3:
+After migrating the files, the components will automatically reconnect to the Scale library hosted in the Telekom Figma space. You have the option to enable the library in your files directly from the library panel. + +Note:
+Scale Figma Link: All external collaborators will not be able to access the Scale Figma library file via the existing link after migration. If you require access to the file, please get in touch with us to be invited. Please ensure to specify the project you are involved in and provide the name of an internal contact person you are collaborating with. diff --git a/packages/storybook-vue/stories/setup_and_info/GettingStartedForDesigners_de.md b/packages/storybook-vue/stories/setup_and_info/GettingStartedForDesigners_de.md index a2c60145fd..fcac1d86e0 100644 --- a/packages/storybook-vue/stories/setup_and_info/GettingStartedForDesigners_de.md +++ b/packages/storybook-vue/stories/setup_and_info/GettingStartedForDesigners_de.md @@ -18,16 +18,24 @@ Scale beinhaltet für Light und Dark Mode jeweils eine eigene Library. So kannst ### Figma Libraries + +

+ Wir migrieren die Scale Design Libraries in unser Telekom Unternehmenskonto. Dateien, die sich außerhalb unseres Kontos befinden, werden dadurch die Verbindung zur Library verlieren. Alle Telekom Projekte, die extern gespeichert sind, müssen in den Telekom Account migriert werden. Sobald das geschehen ist, werden die Komponenten automatisch mit der Bibliothek verknüpft.
Mehr erfahren +

+ + +
+ {alt}

Telekom Scale Components Light

Telekom Scale Components Dark

-Übrigens: Mit einer Pro Lizenz von Figma erhältst du sogar ganz automatisch künftige Updates. Gehe dafür in die Library zur Seite “Getting started” und hinterlasse deine E-Mail Adresse in dem dafür vorgesehenen Bereich. Wir laden dich dann zur Library ein. -
-### Sketch Libraries +### ⚠️ Outdated: Sketch Libraries + +Die Sketch-Bibliotheken sind nicht auf dem neuesten Stand und werden nicht weiter entwickelt. Das Design Tool der Telekom wird in Zukunft nur noch Figma sein. {alt} @@ -35,22 +43,8 @@ Scale beinhaltet für Light und Dark Mode jeweils eine eigene Library. So kannst

Telekom Scale Components (Dark)

-Wichtiger Hinweis: das aktuellste Release beinhaltet kein Update der Sketch Library. -
### Rechtliche Hinweise Die Deutsche Telekom behält sich alle Rechte an der Marke Telekom vor. Für jede Nutzung, die nicht explizit für die Telekom bestimmt ist, muss das Telekom Theme komplett ersetzt werden. - -## Designdokumentationen - -Zu jeder Komponente gibt es ausführliche Informationen zur Verwendung sowie zu den unterschiedlichen Varianten. Gehe dazu einfach in der linken Seitenleiste zur gewünschten Komponente und wähle dort die Registerkarte „Usage“ (1) aus. - -![Scale for Designers](assets/1_setup/2_scale-for-designers/storybook-Usage-tab.png) - -
- -# Dein Feedback ist willkommen! - -Mit deinem Feedback können wir Scale noch besser machen. Du kannst auch deine Designs mit uns teilen, damit alle davon profitieren können.
Du erreichst das Scale Team unter [contact@brand-design.telekom.com](mailto:contact@brand-design.telekom.com). diff --git a/packages/storybook-vue/stories/setup_and_info/GettingStartedForDesigners_en.md b/packages/storybook-vue/stories/setup_and_info/GettingStartedForDesigners_en.md index a2f68f2931..f6a5241ac2 100644 --- a/packages/storybook-vue/stories/setup_and_info/GettingStartedForDesigners_en.md +++ b/packages/storybook-vue/stories/setup_and_info/GettingStartedForDesigners_en.md @@ -19,17 +19,25 @@ Scale contains its own library for light and dark mode. This way, you can design ### Figma libraries + +

+ We will migrate the scale design libraries to our Telekom enterprise account. Files outside of our account, will get disconnected . All Telekom projects stored externally have to migrate to the Telekom account. Once that's done, the components will automatically link to the library.
learn more +

+ + +
+ {alt}

Telekom Scale Components Light

Telekom Scale Components Dark

-By the way, with a Pro license from Figma, you will automatically receive future updates. To get this, go to “Getting started” in the library and leave your email address in the space provided. We will then invite you to the library. -
-### Sketch libraries +### ⚠️ Outdated: Sketch libraries + +The Sketch libraries are not up to date and are not being further developed. The Telekom Design Tool will only be Figma in future. {alt} @@ -37,23 +45,8 @@ By the way, with a Pro license from Figma, you will automatically receive future

Telekom Scale Components (Dark)

-Important note: the latest release doesn’t include an update of the Sketch library. -
### Legal notes Deutsche Telekom reserves all rights to the Telekom brand. The Telekom theme must be completely replaced for any usage that is not explicitly intended for the Telekom. - -## Design documentation - -For each component, there is detailed information on its usage as well as on the different variants. To access this, simply go to the desired component in the left sidebar and select the Usage tab (1). - -![Scale for Designers](assets/1_setup/2_scale-for-designers/storybook-Usage-tab.png) - -
- -# Your feedback is welcome! - -With your feedback, we can make Scale even better. You can also share your designs with us so everyone can benefit from them. -Feel free to reach out to the Scale team at [contact@brand-design.telekom.com](mailto:contact@brand-design.telekom.com). diff --git a/packages/storybook-vue/translations.json b/packages/storybook-vue/translations.json index 89791f1e3c..6ec2f5ef7b 100644 --- a/packages/storybook-vue/translations.json +++ b/packages/storybook-vue/translations.json @@ -31,8 +31,8 @@ }, { "elementSelector": "#new-release-sketch-library-update--page", - "en": "New: Scale Figma Libraries", - "de": "Neu: Scale Figma Libraries" + "en": "Scale Figma Libraries", + "de": "Scale Figma Libraries" }, { "elementSelector": "#setup-info-getting-started-for-designers--page",