Working on the details!

Hello guys !
I finally made it to the finish line!
But this is only a template, there is still a long and painful process of rooting with DAW.
This template is certainly not an all-encompassing masterpiece), but it is exactly what suits me! I do not need all these pop-up menus and other chips. It just takes creative time.
I ask for help.
In screenshot 2, I've highlighted what I couldn't align.
I didn't find "Triple" and "Dotted Note" in the available icons.
I had to invent
But I can't move the point down in line with the note.
Likewise, in a triplet, I can’t pull out the stick separately over the notes.
Maybe someone knows a couple of tricks?
Thank you all for your support !
Good luck !



you can use base64 images in the css field of your button.

css code for triple :

:host {
background-size:80%;
background-repeat: no-repeat;
background-position: center center;
background-image:  url('data:image/png;base64,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');
    text-transform:none;
    border:none;
    border-radius:5px;
    Font-size:125%;
}


Css code for doted

:host {
background-size: 32%;
background-repeat: no-repeat;
background-position: center center;
background-image: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHN0eWxlPSJvdmVyZmxvdzogaGlkZGVuOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgd2lkdGg9IjI5MC4yODEiIGhlaWdodD0iMjkwLjI4MSI+PHJlY3QgaWQ9ImJhY2tncm91bmRyZWN0IiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB4PSIwIiB5PSIwIiBmaWxsPSJub25lIiBzdHJva2U9Im5vbmUiLz4KCgoKCgoKCgoKCgoKCgoKCjxnIGNsYXNzPSJjdXJyZW50TGF5ZXIiIHN0eWxlPSIiPjx0aXRsZT5MYXllciAxPC90aXRsZT48ZyBpZD0iWE1MSURfOTYwXyIgY2xhc3M9InNlbGVjdGVkIiBmaWxsPSIjZGFkYWRhIiBmaWxsLW9wYWNpdHk9IjEiPgoJPHBhdGggaWQ9IlhNTElEXzk2MV8iIGQ9Ik0xNTUuNTk0LDE3My42NDVjLTYuMjM5LTIuNTY0LTEzLjExMS0zLjkyMS0yMC4zMDUtMy45MjFjLTE3LjQ1OCwwLTM1LjI2Niw3Ljc5Ni00OC44NTcsMjEuMzg4ICAgYy0yNS4zNDQsMjUuMzQzLTI4LjUxNiw2My40MDctNy4wNzIsODQuODUzYzkuMjMyLDkuMjMyLDIyLjAxNiwxNC4zMTYsMzUuOTk1LDE0LjMxNmMxNy40NTgsMCwzNS4yNjYtNy43OTYsNDguODU3LTIxLjM4OCAgIGMxMS44NDMtMTEuODQzLDE5LjMwOC0yNi44NDIsMjEuMDE4LTQyLjIzNGMwLjI0NC0yLjE5OCwwLjM1NC00LjM3OSwwLjM1NC02LjUzN2gwLjAxVjBoLTMwVjE3My42NDV6IiBmaWxsPSIjZGFkYWRhIiBmaWxsLW9wYWNpdHk9IjEiLz4KCTxjaXJjbGUgaWQ9IlhNTElEXzk2Ml8iIGN4PSIyMTAuMTQxMDA2NDY5NzI2NTYiIGN5PSIyNzUuMTE3MDA0Mzk0NTMxMjUiIHI9IjE1IiBmaWxsPSIjZGFkYWRhIiBmaWxsLW9wYWNpdHk9IjEiLz4KPC9nPjxnIGlkPSJzdmdfMSI+CjwvZz48ZyBpZD0ic3ZnXzIiPgo8L2c+PGcgaWQ9InN2Z18zIj4KPC9nPjxnIGlkPSJzdmdfNCI+CjwvZz48ZyBpZD0ic3ZnXzUiPgo8L2c+PGcgaWQ9InN2Z182Ij4KPC9nPjxnIGlkPSJzdmdfNyI+CjwvZz48ZyBpZD0ic3ZnXzgiPgo8L2c+PGcgaWQ9InN2Z185Ij4KPC9nPjxnIGlkPSJzdmdfMTAiPgo8L2c+PGcgaWQ9InN2Z18xMSI+CjwvZz48ZyBpZD0ic3ZnXzEyIj4KPC9nPjxnIGlkPSJzdmdfMTMiPgo8L2c+PGcgaWQ9InN2Z18xNCI+CjwvZz48ZyBpZD0ic3ZnXzE1Ij4KPC9nPjwvZz48L3N2Zz4=);
    text-transform:none;
    border:none;
    border-radius:5px;
    Font-size:125%;
}

here a sample of my macro window made with base64 images

... and the file
Nuendo macros.json (1.6 MB)

2 Likes

Thanks a lot, you helped me a lot!
Good luck !



Unfortunately, I found that the icon is only visible when the button is pressed!
It's weird, I have a regular base color selected and it covers everything.
Please tell me what am I doing wrong?
Thanks !

Try alphaFillOff 0.15 in style field
and alphaFillOn 0.75

1 Like

Thanks, unfortunately it didn't help.