Not sure if this is the right forum to post this, if not please move. I am using the following code (found on here and edited to my own tastes but can't find it again to credit the author) to move my radial bars around my tokens. #radial-menu {
--color-text-primary: #b3b3b3;
--color-bg-dark: #1c1111;
--color-text-disabled: #150d0d;
--color-element-bg: #372828;
--color-red: #f85212;
--color-green: #78ff10;
--color-blue: #0c6be7;
--color-yellow: #fc0;
--font-number: "Ruda", sans-serif;
}
#radial-menu .button {
background: var(--color-element-bg) !important;
border: 0px;
}
#radial-menu .button.button-1 {
border-radius: 0px 0px 25px 25px;
}
#radial-menu .button.button-2 {
border-radius: 25px 25px 0px 0px;
}
#radial-menu .button.button-1,
#radial-menu .button.button-2 {
box-shadow: 0px 0px 5px var(--color-text-disabled);
left: 75px;
}
#radial-menu .button.button-2 {
top: -5px;
}
#radial-menu .button.button-1 {
top: 34px;
}
#radial-menu .button.button-3,
#radial-menu .button.button-4,
#radial-menu .button.button-5 {
left: -45px;
}
#radial-menu .button.button-3 {
box-shadow: 0px 0px 5px var(--color-text-disabled),
inset 0px 0px 5px var(--color-green),
inset 0px 0px 10px var(--color-green),
inset 0px 0px 15px var(--color-green) !important;
top: 15px;
}
#radial-menu .button.button-4 {
box-shadow: 0px 0px 5px var(--color-text-disabled),
inset 0px 0px 5px var(--color-blue),
inset 0px 0px 10px var(--color-blue),
inset 0px 0px 15px var(--color-blue) !important;
top: 55px;
}
#radial-menu .button.button-5 {
box-shadow: 0px 0px 5px var(--color-text-disabled),
inset 0px 0px 5px var(--color-red),
inset 0px 0px 10px var(--color-red),
inset 0px 0px 15px var(--color-red) !important;
top: -25px;
}
#radial-menu .button div.inner {
background: none;
color: var(--color-text-primary);
font-family: var(--font-number);
font-weight: 800;
margin-top: 5px;
text-shadow: 0px 0px 5px var(--color-bg-dark),
0px 0px 2px var(--color-bg-dark), 0px 0px 2px var(--color-bg-dark);
}
#radial-menu .button.button-1 div.inner,
#radial-menu .button.button-2 div.inner {
margin-top: 2px;
}
#radial-menu .button div.inner span {
font-size: 18px !important;
}
#radial-menu .markermenu {
background: var(--color-element-bg) !important;
box-shadow: 0px 0px 5px var(--color-text-disabled);
}
#radial-menu .markermenu .markercolor,
#radial-menu .markermenu .markericon {
border: 5px;
}
#radial-menu .markermenu.open {
width: 235px;
height: 225px;
border-radius: 15px;
}
#radial-menu .markermenu .markericon.active,
#radial-menu .markermenu .markercolor.active {
outline: 2px dashed var(--color-yellow);
outline-offset: -2px;
border: 0px;
background-color: var(--color-yellow);
border-radius: 5px;
}
#radial-menu .markermenu .markercolor.dead {
color: var(--color-red);
top: -2px;
} However I can't seem to figure out how to move the text input boxes that are linked to them. I would like the text input boxes to be to the left of the relevant radial. Could anyone help me with this please?
