[SOLVED] Menu shaping

Answered Closed
0
0

Howdy,

I’d like to ask, if possible, if there is a way yo have the menu like this?
This is from a frakework that is outdated, the “mochaUI”.

Would it be possible to have the menu like this?

Thanks in advanced,

Attachment
menu.jpg
Share
  • You must to post comments
Filter
Sort by: Recently Active
Best Answer
0
0

Hi Jorge

You must follow this steps

1.- Create a new theme, using existing one, for example Blue-1

2.- Change to theme Graphite-3 and select the menu item

3.- Copy the section css from the Editor tab
“css”: “{\”before\”:{\”content\”:\”\”,\”display\”:\”block\”,\”position\”:\”absolute\”,\”top\”:\”0px\”,\”left\”:\”0px\”,\”width\”:\”32px\”,\”height\”:\”100%\”,\”background-color\”:\”control\”}}”

4.- Turn to your custom theme and find “menu” : in the editor tab

5. Add the css section copy in step 3 at the end of the block. like that
“menu”: {
“states”: {
“default”: {
“styles”: {
“width”: [1, 1, 1, 1],
“color”: “windowFrame”,
“backgroundColor”: “menu”,
“shadowColor”: “buttonShadow”,
“shadowLength”: [1, 1],
“shadowBlurRadius”: 15,
“css”: “{\”before\”:{\”content\”:\”\”,\”display\”:\”block\”,\”position\”:\”absolute\”,\”top\”:\”0px\”,\”left\”:\”0px\”,\”width\”:\”32px\”,\”height\”:\”100%\”,\”background-color\”:\”control\”}}”

I hope I’ve helped
Regards

 

Attachment
image.png CustomTheme.png
  • Jorge Bastos
    Hi Paul, Thank you, i’m trying to manage it myself, i’ll re-post if cant do it. With this, i’ve see that there is a “button ok”, “button alert” and so ok. But i don’t see these on the toolbox. How to access them, or put them into a form?
  • Jorge Bastos
    found it, appearancekey!!
  • Paul
    • Paul
    • Mar 31, 2020 - 1:28 pm
    excellent happy coding .:-)
  • Jorge Bastos
    Paul, I think I’m being able to handle it!! Allow me if it’s not an abuse, i want to add images, for example for my “Save” Buttons, i want to add at the left the theme icon “icon-save”, and so on, How would i achieve this?
  • Jorge Bastos
    OK i made some progress on my own, but only find on the properties “background-image”, and i can select the theme icons. But i want it to be on the left of the button, and streched, like the image i sent now. What’s the property for it? On dev time, there’s a “imagesource” that does the job
  • You must to post comments
0
0

Hi Jorge

A.- For more details about theme editor, you can get it in the online guide. Click on the yellow icon at right of version number

https://docs.wisej.com/theme-builder/

B.- For create your custom icons, I suggest that export all icons from one theme and edit it with and vector app, like inkscape

After create your icons, import them to the theme for replace that you want

You can use custom names, but be carefully in replace in other sections of the theme file were was used the prior name

C.- For setting margins of one icon, see the images adjunct

In Dev time you can’t set properties of the theme, just use the resources like icons, to assign them to a element, like a button or item menu

Regards and happy code

 

Attachment
item-Icon-marginRight.jpg item-paddingLeft.jpg
  • You must to post comments
0
0

button’s icon’s on left

Attachment
buttons_images.jpg
  • You must to post comments
0
0

Hi,

Oh i see.
Tell me, how could i copy the whole menubar from one theme to another?
I was checking for options for this and didn’t found, maybe it’s there,

  • Paul
    • Paul
    • Mar 31, 2020 - 1:33 pm
    I see that you are already doing well The way is to manually copy the elements of a theme to the custom theme you are making. One suggestion is to copy the styles of both themes and use a program to compare code, like winmerge
  • You must to post comments
0
0

If you mean the gray box next to the menu item, it’s already in our Graphite-3 theme. See attached. The color can be changed easily with the ThemeBuilder.

Attachment
image.png
  • You must to post comments
Showing 5 results