Enterprise: Unterstützung bei der Konfiguration des Top-Level-Elements

Erstellt am 9. Nov. 2018  ·  17Kommentare  ·  Quelle: infor-design/enterprise

Bezieht sich Ihre Funktionsanfrage auf ein Problem?
Unsere Nutzung von IDS beschränkt sich auf einen Abschnitt der Seite, nicht auf den gesamten Text. Um es zu verwenden, haben wir daher darauf zurückgegriffen, viele der Komponenten, die diese Annahme treffen, zu verzweigen und Verweise auf den Körperselektor durch einen von uns angegebenen Selektor zu ersetzen.
In der Tabs-Komponente haben wir beispielsweise diese Zeile ersetzt:
menuHtml = $(``<ul id="tab-container-popupmenu" class="tab-list-spillover${shouldBeSelectable}">``).appendTo('body');
mit diesem:
menuHtml = $(``<ul id="tab-container-popupmenu" class="tab-list-spillover${shouldBeSelectable}">``).appendTo(window.$FEF_TOP_LEVEL_ELEMENT_SELECTOR);

Beschreiben Sie die gewünschte Lösung
Eine Möglichkeit, das Element der obersten Ebene zu konfigurieren, auf das IDS/Soho verwiesen wird.

Beschreiben Sie Alternativen, die Sie in Betracht gezogen haben
Abgesehen von der Weitergabelung haben wir keine. Eine weitere Alternative besteht darin, allen Komponenten ein Präfix voranzustellen, z. B. ids-grid, ids-dropdown ect. Das ist vielleicht mehr Arbeit, aber vielleicht flexibler

Zusätzlicher Kontext
Dies ist eine Anfrage des GT Nexus Front-End Framework-Teams.

[5] refactor status type type

Hilfreichster Kommentar

Sie können dieses Projekt im Auge behalten https://github.com/infor-design/enterprise-wc -> es ist noch ein weiter Weg, aber irgendwann im nächsten Jahr sollte etwas veröffentlicht werden

Alle 17 Kommentare

Ich denke, wir brauchen dies für andere Fälle, also wäre der Trick, einfach eine ids-enterprise-Top-Level-Klasse hinzuzufügen und sie erst danach kaskadieren zu lassen. Wäre eine bahnbrechende Änderung, die wir leicht abmildern können. Könnte es auch zu initialize() hinzufügen, wenn Sie das aufrufen (wenn Leute es verwenden).

Wäre es möglich, Unterstützung für Soho hinzuzufügen, um Unterstützung für das Ignorieren von Elementen hinzuzufügen?
In unserem Anwendungsfall möchten wir, dass die App nach Soho gestylt wird, aber wir brauchen eine Möglichkeit, Soho CSS anzuweisen, bestimmte Elemente und deren Nachkommen zu ignorieren

zB Elemente mit Klasse würden ignoriert

.soho-ignore

vielleicht wäre :not() Selektor hilfreich?

Ich bin mir nicht sicher, ob das einfach wäre @Fruko Ich denke, wir müssten ein ganzes zweites

Ich denke, die andere Möglichkeit, dies zu tun, besteht darin, die ids-enterprise Regel für dieses Element der obersten Ebene nicht anzuwenden, und das würde als nicht dienen.

<div class='ids-enterprise'>
   <!-- Soho / IDS stuff -->
</div>
<div class='anything-else-but-ids-enterprise'>
   <!-- Not Soho / IDS stuff -->
</div>

Danke, dass Sie sich das angeschaut haben

Cool ja genug Anwendungsfälle, um dies hinzuzufügen. Werde es demnächst prüfen. Ich denke, nur das Element der obersten Ebene zu erfordern, kann aber eine 5.0-Version bedeuten, nur um der semantischen Versionierung mit einer kleinen Anzahl von Breaking Changes zu folgen.

@tmcconechy, aber was ist mit einem ?

    <div class="accordion ids-enterprise" data-demo-set-links="true" data-options="{'allowOnePane': false}">
      <div class="accordion-header">
        <a href="#"><span>Warehouse Location</span></a>
      </div>
      <div class="accordion-pane">
        <div class="accordion-content">
          <some-component-with-own-styles></some-component-with-own-styles>
        </div>
      </div>

Wie können wir bei gegebenem Code oben sicherstellen, dass ids-enteprise css nicht mit "einige-Komponenten-mit-eigenen-Stilen?

Aus meiner Sicht ist das Hinzufügen von Root-Elementen zu Cascade CSS eine gute Idee für den Anfang, aber ich glaube, um Enterprise-CSS nutzbar zu machen, muss es eine Möglichkeit geben, es nicht mit anderen Teilen von Apps zu spielen, wenn: not selector ist keine Option, was ist mit dem Präfixieren aller ids-enterprise-Klassen mit ids-enterprise?

Ja, ich dachte darüber nach, allen Optionen ids- aber es ist eine viel größere Veränderung. Ich bin mir auch nicht sicher, ob es genau diesen Fall lösen würde, wenn wir es einfach ids-accordion-content .

Für genau diesen Fall denke ich, dass wir uns etwas einfallen lassen könnten, das jegliches Styling im Akkordeon-Inhalt negiert, aber ich denke, das wäre ein separates Thema. Und müsste dies Komponente für Komponente tun.

Ich bezweifle nur, dass es eine gute Möglichkeit gibt, eine not-ids Klasse zu erstellen, die für jede einzelne gesamte Komponente funktioniert, egal wo Sie sie platzieren. Es wird also eher von Fall zu Fall kommen.

Ich frage mich, ob ein einfacherer Reset helfen würde? Fx... ids-reset

  • würde Schriftart, Auffüllung, Rand und vielleicht noch ein paar andere Dinge zurück zum Dokumentstamm setzen?

Eine Art Reverse-Reset? Könnte in einigen Fällen helfen, aber definitiv nicht in allen?

das könnte helfen

Ok werde das mal nachschauen. Das ist nicht so schlimm, wie ich anfangs erwartet hatte.

Ich mag die Idee des Präfixes mit IDs. Eigentlich heißt es "Branding"-Konzept. Auf jeden Fall ist es eine bahnbrechende Änderung, aber es sollte der Weg sein, um in Zukunft für die CSS-Struktur von ids-enterprisd zu gehen.

Ich stimme zu, dass ich den Wert über die Bruchänderung gewichten muss.

Habe das weiter überprüft. Dies ist nicht möglich, ohne dass dem Stamm ein Präfix hinzugefügt wird. Hatte gehofft, einen Weg zu finden.
Im Next-Gen-Projekt hat alles Präfixe und ist in sich geschlossen, so dass dies kein Problem sein wird. Dies wird vorerst zurückgestellt, aber nicht geschlossen, da dies möglicherweise bei einer Hauptversion erforderlich ist

Wir haben eine Lösung in der nächsten Version 5.0, bei der jede Komponente eine Webkomponente mit gekapseltem CSS ist und das gesamte CSS einen Namensraum hat. Dies würde dieses Problem so schließen

@tmcconechy das sind tolle Neuigkeiten! Gibt es eine gute Möglichkeit zu verfolgen, wann dies allgemein verfügbar ist?

Sie können dieses Projekt im Auge behalten https://github.com/infor-design/enterprise-wc -> es ist noch ein weiter Weg, aber irgendwann im nächsten Jahr sollte etwas veröffentlicht werden

Sieht wirklich vielversprechend aus!

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen