0

Dashboard Design

Guten Tag, 

das Bild stammt von dem Ninox CRM Video.

Meine Frage wäre: wie bekommt man diese Widgets? 

Finde das Design sehr übersichtlich.

MfG 

Kevin

17 Antworten

null
    • Ninox-Professional
    • planoxpro
    • vor 1 JahrMon, December 18, 2023 at 9:48 AM UTC
    • Gemeldet - anzeigen

    Hallo Kevin, mit etwas HTML/CSS-Kenntnissen lässt sich sowas in einem Formelfeld selber bauen. Ansonsten bietet arcRider gegen Bezahlung auch fertige Design-Widgets für Ninox an:

    https://www.arc-rider.de/documentation

    • Rafael_Sanchis
    • vor 1 JahrMon, December 18, 2023 at 10:03 AM UTC
    • Gemeldet - anzeigen

    I use some similar widget

    • Rafael_Sanchis
    • vor 1 JahrMon, December 18, 2023 at 10:58 AM UTC
    • Gemeldet - anzeigen

    Maybe this Link help.

    https://forum.ninox.de/t/g9yh6s0

      • Kruna
      • vor 1 JahrMon, December 18, 2023 at 3:35 PM UTC
      • Gemeldet - anzeigen

      Hi Rafael, where do you change the color of the bar. I cant find it at all, ty :-)

      EDIT: Sorry, I should check the link first 😉

      • Rafael_Sanchis
      • vor 1 JahrMon, December 18, 2023 at 3:41 PM UTC
      • Gemeldet - anzeigen

       Hi Kruna

      progress::-webkit-progress-bar {background-color: silver; width: 100%;border-radius:.5em;}
      progress::-webkit-progress-value {background-color: rebeccapurple !important;border-radius:.5em;}
      progress::-moz-progress-bar {background-color: silver !important;}

      • Kruna
      • vor 1 JahrTue, December 19, 2023 at 9:41 AM UTC
      • Gemeldet - anzeigen

      thank you very much. :-)

      I had to add this too:

      progress {
          width: 100%;
          height: 10px;
          background:silver;
          border: thin solid silver;
          border-radius:.6em;
          accent-color:  white;
      }

      Now its perfect! :-)

      • Rafael_Sanchis
      • vor 1 JahrTue, December 19, 2023 at 9:56 AM UTC
      • Gemeldet - anzeigen

       

      • Rafael_Sanchis
      • vor 1 JahrTue, December 19, 2023 at 11:53 AM UTC
      • Gemeldet - anzeigen

       

      You know something about the arrows ? Up/Down 

      • Kruna
      • vor 1 JahrTue, December 19, 2023 at 12:23 PM UTC
      • Gemeldet - anzeigen

      what arrows up/down do you mean?

      • Rafael_Sanchis
      • vor 1 JahrTue, December 19, 2023 at 12:33 PM UTC
      • Gemeldet - anzeigen

       

      The Red on Green arrows 👍

      • Kruna
      • vor 1 JahrTue, December 19, 2023 at 2:19 PM UTC
      • Gemeldet - anzeigen

      no, unfortunately not.

      I think this was another way to use css and html boxes and maybe there it is possible to use the arrows.

    • Kev_fo
    • vor 1 JahrMon, December 18, 2023 at 12:40 PM UTC
    • Gemeldet - anzeigen

    thank you Rafael.

    Danke planox. 

    • mirko3
    • vor 1 JahrTue, December 19, 2023 at 2:59 PM UTC
    • Gemeldet - anzeigen

    A simple example is at bottom. Color and arrow change if price is changes. Other arrows are ← | → | ↔

    let price := 50;
let arrowColor := switch true do
    case price < 100:
        "style = 'color: red'>&uarr;"
    case price >= 100:
        "style = 'color: green'>&darr;"
    end;
let content := "
<style>
p{
font-size:x-large;
}
</style>
<p " +
    arrowColor +
    "</p>";
html(content)
      • Rafael_Sanchis
      • vor 1 JahrTue, December 19, 2023 at 3:10 PM UTC
      • Gemeldet - anzeigen

       Excelent gift. 👍

      • Rafael_Sanchis
      • vor 1 JahrTue, December 19, 2023 at 6:55 PM UTC
      • Gemeldet - anzeigen

       

      Hi Mirko

      One Question there are any way to separate the arrow attribues  and text comment attributes

      Thanks

      let arrowColor := switch true do
    case Value < 100:
        "style = 'color: red'>&darr; <text> project is over budget."
    case Value > 100:
        "style = 'color: green'>&uarr; <text> Project is performing well against the budget. "
    case Value = 100:
        "style = 'color: blue'>&varr; <text> project is performing on budget."
    end;
let content := "
<style>
p{
font-size:16px;
font-weight: bold;
}
</style>
<p " +
    arrowColor +
    "</p>";
html(content)
      • mirko3
      • vor 1 JahrTue, December 19, 2023 at 8:23 PM UTC
      • Gemeldet - anzeigen

       try this. It's not fancy HTML but it works.

      let Value := 110;
let pContent := switch true do
    case Value < 100:
        "style = 'color: red; font-size:x-large;'>&darr; <span style='color:black; font-size:medium;'> project is over budget.<span>"
    case Value > 100:
        "style = 'color: green; font-size:x-large;'>&uarr;<span style='color:black; font-size:medium;'> Project is performing well against the budget.<span>"
    case Value = 100:
        "style = 'color: blue; font-size:x-large;'>&varr;<span style='color:black; font-size:medium;'> project is performing on budget.<span>"
    end;
let content := "
<style>
p{
font-weight: bold;
}
</style>
<p " +
    pContent +
    "</p>";
html(content)
      • Rafael_Sanchis
      • vor 1 JahrTue, December 19, 2023 at 8:36 PM UTC
      • Gemeldet - anzeigen

      Too much better. Thanks

Anmelden, um zu antworten

Content aside

  • vor 1 JahrTue, December 19, 2023 at 8:36 PM UTCZuletzt aktiv
  • 17Antworten
  • 354Ansichten
  • 4 Folge bereits