Magento 2 Wie überschreibe ich den Anbieter / magento / magento2-base / lib / web / css / source / lib / _navigation.less?

9

Wie kann ich die Datei vendor / magento / magento2-base / lib / web / css / source / lib / _navigation.less in meinem benutzerdefinierten Design überschreiben ?

magento2 theme overrides core less-css Shankar Chef
quelle

Antworten:

6

1) Sie müssen _navigation.lessvon Ihrem übergeordneten Thema nach app\design\frontend\vendor\theme\web\css\source(Ihrem benutzerdefinierten Thema) kopieren und Ihr CSS nach .lib-main-navigation();und .lib-main-navigation-desktop();diesen lib-Navigationsstil überschreiben .

ODER

2) Sie können Navigationsvariablenwert in benutzerdefinierten Thema des außer Kraft setzen _theme.less,

Sie finden den Variablennamen unter lib\web\css\source\lib\variables

_navigation.less
Dipesh Rangani
quelle
1

Zusätzlich zu den Antworten von Khoa TruongDinh und Dipesh Rangani ist der übergeordnete Pfad von Khoa TruongDinh in Ordnung. Um jedoch zu verhindern, dass Magento Ihre benutzerdefinierten Stile überschreibt, müssen Ihre benutzerdefinierten Stile nach der .lib-main-navigation () hinzugefügt werden. und .lib-main-navigation-desktop (); Wie Dipesh Rangani so erwähnt hat, haben Sie in der _navigation Ihres benutzerdefinierten Themas weniger Datei:

.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {

     .lib-main-navigation();

     Your custom code here
}


.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {

    .lib-main-navigation-desktop();

    Your custom code here
}
Sorin Barnutiu
quelle
0

Dies war äußerst hilfreich. Ich habe die lib-Datei kopiert und in der Klasse .lib-main-navigation-desktop () bearbeitet, die überschrieben wurde. Wenn ich jetzt dieses Mixin zuerst lade und meine Stile nach dem Überschreiben einfüge

stephenrwc
quelle