Umrandung vom Text entfernen

Wie bekomme ich auf der Startseite, die Umrandung von dem Text entfernt? Wie kann ich am besten die Slider bei den Einkaufswelten verkleinern? Vielen Dank im Vorraus und schöne Ostern…

 

durch die Option beim Element: kein weiteres Styling hinzufügen.

Hier ist der Code für die panel.less , damit kannst du die Rahmen komplett entfernen in den Shopwelten

.panel {
    display: block;
    background: @panel-bg;

    &.has--shadow {
        .box-shadow(0 1px 3px 0 rgba(0, 0, 0, 0.1));
    }

    &.has--border {
        border: 0px solid @panel-border;
    }
}

 

Die Linien stören micht auch, weil eben der Text dran klebt - sofern man den Text einfach nur im Editor eingibt ohne mit html daran zu basteln.

Es verschwinden mit der Änderung allerdings noch ein paar Linien mehr, also in der Kategorieübersicht oben, bei den Slidern. Vielleicht noch an anderen Stellen, hab noch nicht alles abgesucht.

Wie wärs mal mit ein wenig CSS, also in dem Fall Padding für die Box? Dann klebt auch kein Text an der Border… :wink:

.emotion--html.panel.has--border {padding 20px;}

 

Oder wenn Du eben die Border weg haben willst:

.panel.has--border {border: none;}

 

Also damit

.panel {
    display: block;
    background: @panel-bg;

    &.has--shadow {
        .box-shadow(0 1px 3px 0 rgba(0, 0, 0, 0.1));
    }

    &.has--border {
        border: 0px solid @panel-border;
    }
}

hat es bei mir geklappt, die Border zu entfernen.

Was müsste ich daran ändern um den Abstand zu erhalten? Dein Codeschnipsel sieht etwas anders aus, als der, den ich geändert habe. Bisher habe ich das immer im html-Code des jeweiligen Feldes gemacht, aber das ist mir zu lästig und zu viel Code.

Das was Momos dir geschrieben hat ist schon ok so…, weil Du da direkt in der richtigen less Datei arbeitest. Diese wird dann später wieder kompiliert zu CSS. Ich persönlich arbeite bei sämtlichen Änderungen aber lieber mit einer eigenen CSS Datei, also das heißt ich binde eine neue CSS Datei (z.B mystyles.css) in den Shop ein und damit überschreibe ich ein paar Regeln von Shopware oder füge noch welche hinzu. Somit weiß ich immer, was ich gemacht habe und muss so nicht an den original Dateien rum fummeln.

Also ich fummele ja auch nicht an den Originaldateien rum, sondern an der abgeleiteten Datei in meinem Theme. Mit den CSS-Dateien hab ich bisher aber noch nichts gemacht. Sollte es nicht möglich sein, diese Einstellung auch in der tpl vorzunehmen? Wenn ich die Rahmenstärke dort einstellen kann, müsste man doch auch den Abstand angeben können?

Müsste so eigentlich funktionieren:

.panel {
    display: block;
    background: @panel-bg;

    &.has--shadow {
        .box-shadow(0 1px 3px 0 rgba(0, 0, 0, 0.1));
    }

    &.has--border {
        border: 0px solid @panel-border; padding: 20px;
    }
}

 

chick, klappt perfekt :slight_smile:

Na also… :slight_smile:

trotzdem hab ich es vermutlich nicht wirklich sauber gelöst. Bisher habe ich die komplette panel.less in mein Template übernommen und der all.less zugefügt, dann eben die vorgenannte Ergänzung gemacht.

Nun hab ich mal nur den Block

.panel {
    display: block;
    background: @panel-bg;

    &.has--shadow {
        .box-shadow(0 1px 3px 0 rgba(0, 0, 0, 0.1));
    }

    &.has--border {
        border: 1px solid @panel-border; padding: 20px;
    }
}

stehen lassen. Scheint auszureichen. Hoffe nur, dass es nicht anderweitig zu Ausfällen kommt, die ich jetzt gerade nicht sehe :slight_smile: