Visual – Components & CSS classes

Last Updated on October 26, 2024 by Neil Murray

Table of contents

Form component #

  • Form component – .Form class
    • .FormItems class
      • .Controls class
      • Notice component – .FormNotice class
      • Items component – .Items class
        • InputItem component
        • InputItemMenu component
    • .Operate class
      • Edit component – .edit class
        • Type component
      • Select component – .select class
        • SelectItem component – .cf7tagsContainer class
        • Tip component – .tipsContainer class
        • SelectItem component – .cf7skinsItemsContainer class
    • .Action class
      • Save Visual button
      • .spinner class

back to top

Notice component #

  • Notice component – .FormNotice class

back to top

Items component #

  • Items component – .Items class
    • .rst__tree – RST
      • .overflow – RST
        • .ReactVirtualized – RST
          • .ReactVirtualized_Grid__innerScrollContainer – RST
            • .rst__node – RST
              • .rst__lineBlock – RST
              • .rst__nodeContent – RST
                • style=”height: 100%;” – RST
                  • .collapseButton – RST
                  • .lineChildren – RST
                  • .rowWrapper – RST
                    • .row – RST
                      • .moveHandle – RST
                      • .rowContents – RST
                        • .rowContentsStart
                          • InputItem component
                          • .ItemIcon
                          • .ItemLabel
                        • .rowContentsEnd
                          • InputItem component
                          • .InputItemType
                          • .rowToolbar – RST
      • .resize-triggers – RST

back to top

InputItem component #

  • .rowContents – RST
    • .rowContentsStart
      • .ItemIcon
      • .ItemLabel
    • .rowContentsEnd
      • .InputItemType
      • .rowToolbar – RST
        • .toolbarButton – RST
          • .InputItemOptions
            • .fieldChangeSelect
            • .InputItemButtons
              • .InputItemButton – edit | duplicate | delete

back to top

InputItemMenu component #

  • .InputItemButton – edit | duplicate | delete | Addon options
    • rc-menu

back to top

Edit component #

  • Edit component – .edit class >> CHANGE TO .Edit
    • .attribute.label.value
      • .row
        • .option.default.control
        .range.description
    • Type component
      • .fieldChangeSelect
    • button

back to top

Control Edit component #

  • .attribute
  • .label
  • .value
  • .editOptions
    • label
  • .visualTextarea

back to top

Select component #

  • .select class >> CHANGE TO .Select
    • .select H3  >> CHANGE TO .SelectHeading
    • SelectItem component – .cf7tagsContainer class >> CHANGE TO .SelectContainer
      • .cf7tagsEven  >> CHANGE TO .SelectEven
        • .elemContainer >> CHANGE TO .SelectItemContainer
        • .node >> OK
        • .typcn
      • .cf7tagsOdd  >> CHANGE TO .SelectOdd
    • Tip component – .tipsContainer class
    • SelectItem component – .cf7skinsItemsContainer class >> CHANGE TO .SelectContainer

back to top

Further Reading: