power-flow-card-plus icon indicating copy to clipboard operation
power-flow-card-plus copied to clipboard

[SUPPORT] CSS: How can I make all lines thicker?

Open NorbNorb opened this issue 11 months ago • 1 comments

My goal: I would like to have a very clean, easy to read appearance with thicker power flow lines, all in white color. I fiddled around in the code editor with different options, for example:

card_mod:
  style: |
    ha-card {
      zoom: 1.3 !important;
      box-shadow: none !important;
      border: none !important;
    }
    .label {
      font-weight: 400 !important;
    }
    path.battery-to-grid {
      stroke: var(--battery-grid-line);
      zoom: 1.3 !important;
    }
    path {
     width: 200%;
    }

I can make the text larger. However, I cannot make the lines appear with a thicker stroke. Can someone help we with the right direction?

NorbNorb avatar Mar 14 '24 10:03 NorbNorb

You are actually really close to thicker lines, all you have to add is the stroke-width attribute to the path. For example:

    path {
     stroke-width: 3px !important;
    }

MelchMwoan avatar Mar 21 '24 12:03 MelchMwoan