Barra sfumata sotto l'intestazione?

[orangeandblack5]

Attualmente abbiamo impostato il CSS per darci una barra sotto l’intestazione invece dell’ombra:

.d-header {
  box-shadow: none;
  border-bottom: solid var(--my_header_box_color)
}

Se volessimo renderla una sfumatura, qual è il modo più semplice per realizzarlo invece? Possiamo far diventare sfumate altre cose, ma non questa linea.

[Don]

Ciao,

Penso che useresti mixin per questo.

Ecco un esempio:

@mixin gradient-border() {
  border-image: linear-gradient(to right, orange, black);
  border-bottom: 5px solid;
  border-image-slice: 1;
}

Quindi puoi usarlo su .d-header o dove vuoi con @include gradient-border()

.d-header {
  box-shadow: none;
  @include gradient-border();
}

[orangeandblack5]

Hai qualche idea sul motivo per cui ciò potrebbe accadere su dispositivi mobili?

[orangeandblack5]

L’utilizzo del seguente solo per dispositivi mobili ha funzionato:

    border-left: 0px solid;
    border-right: 0px solid;
    border-top: 0px solid;