Apps passen oft nicht zu Ihrer Marke. Sie verwenden einen anderen Stil, das Logo passt nicht ganz und die Schriftarten sehen einfach ein bisschen zu generisch aus. Eigentlich möchten Sie Ihre Apps zu einem Teil Ihrer Unternehmens-App-Landschaft machen. Aber dazu muss das Erscheinungsbild übereinstimmen. Heute veröffentlichen wir einige neue Funktionen, die Ihnen dabei helfen.
Der Mendix Themenersteller wird schnell zu einer wichtigen Funktion, die Entwicklern hilft, gut aussehende Apps zu erstellen. In den letzten Wochen haben wir an zwei neuen Funktionen für den Theme Creator gearbeitet: Logo-Import und die Google Fonts API. Das Beste daran ist, dass alles im Browser in der Vorschau angezeigt werden kann!
Logo-Import
In unserer letzten Theme Creator-Version war es möglich, Ihr Logo zu importieren, allerdings nur, um Markenfarben aus dem Logo zu extrahieren und sie im Theme Creator zu verwenden. In dieser Version sind wir noch einen Schritt weiter gegangen: Wenn Sie ein Logo hochladen, wird es direkt im Browser angezeigt und das Logo ist Teil des Theme-Pakets.
Das Logo wird im Stammordner des Theme-Pakets gespeichert. In unserem Framework befindet sich der Pfad zum Logo im _benutzerdefinierte-variablen.scss Datei. Hier finden Sie die Variable, die wir erstellt haben.
Wenn Sie das Logo aus Ihrem Theme-Paket nicht verwenden möchten, setzen Sie einfach die Variable $brand-logo auf falsch.
Google Fonts API
Der Google Fonts API hilft Ihnen, Schriftarten zu jeder Webseite hinzuzufügen. Mit der Google Fonts API können Sie beliebte Schriftarten und solche, die Ihre Marke bereits verwendet, direkt im Browser in der Vorschau anzeigen. Sie können aus den 40 beliebtesten Google-Schriftarten wählen, darunter Roboto, Open Sans und Lato. Es ist weiterhin möglich, eine normale Schriftfamilie wie Arial oder Verdana auszuwählen.
Die ausgewählte Google-Schriftart im Mendix Theme Creator finden Sie in der Hauptdatei unseres Frameworks. _benutzerdefinierte-variablen.scss. Hier finden Sie die Variable, die wir erstellt haben. Wenn Sie den Google Font nicht mehr verwenden möchten, setzen Sie einfach den Wert von $font-family-import auf falsch.
Eine letzte Funktion, die wir dem Theme Creator hinzugefügt haben, ist die Möglichkeit, die Hover-Farbe des Sidebar-Texts zu ändern. Diese Funktion wurde von der Community mehrfach gefordert.
Verbesserungen für Mendix UI Framework
Wir haben das Standard-Datagrid-Styling verbessert, indem wir standardmäßig in der Mitte die vertikale Ausrichtung für Zeilen hinzugefügt haben. Dies verbessert die Inline-Bearbeitungsoption, die Sie im Mendix Modeler ein- oder ausschalten können. Wir haben auch die Datagrid-Fußzeile standardmäßig gestaltet.
Wir haben einige Änderungen an der Formulargruppe und der Eingabe vorgenommen. Die Formulareingabe verwendet jetzt die automatische Höhe (dies wird auch verfügbar gemacht für Bootstrap 4) anstelle einer festen Höhe. Die Eingabe verwendet Polsterung, um die Höhe zu bestimmen, sodass das Etikett immer richtig ausgerichtet ist. Sie können diese Änderung im Themenersteller. Wir haben zwei Variablen für die Formulargruppe hinzugefügt: Polsterung für Ränder (links und rechts) und Rand unten für jede Formulargruppe. Alles ist in der Datei _custom-variables.scss zu finden.
Wir haben auch ein neues Navigationslayout hinzugefügt. Dieses Layout enthält eine Topleiste mit Hauptnavigation und eine Seitenleiste mit der Unternavigation. Dieses Navigationslayout ist in einem der Theming-Startpunkte verfügbar.
Rückmeldung
Geben Sie uns unbedingt Feedback unter Mendix Forum und unseren Github-Repository!