Quarkly UI
Menu
Creates a website navigation menu.
It is a dynamic component that shows all the project pages as a list. Another Menu feature is that all children elements are interconnected: if you restyle one menu element, all the others will be changed as well. You can also restyle only one element if needed.
Menu options:
  • Synchronizes and shows all project pages.
  • The page order in the menu is synchronized with the Pages tab.
  • You can restyle: the main wrapper component, all menu elements at once, all hyperlinks at once, the current active element, any element separately.
  • Any element of a multiple menu can be restyled at any level.
  • Several menus can be placed on the page.
  • The desired menu items can be hidden.
SocialMedia
Creates buttons links to communities or accounts in popular social networks. This component has children components, which means that if you restyle one button, the others will be altered as well. And yet, you can also restyle buttons separately.
SocialMedia options:
  • Shows links to communities or accounts in popular social networks.
  • You can restyle: the main wrapper component, all buttons at once, all icons at once, each button and icon separately.
  • Size of icons can be changed.
Formspree
Creates a form integrated with the formspree.io service. After filling out such a form, its data is sent to the formspree service and the specified email.
Formspree options:
  • Various data types can be entered in the input field: text, email, phone number, date, number, file.
  • There’s data type checker in the input field.
  • Required fields.
  • Several input fields.
  • The data is sent to the formspree service and the specified email.
Section
This is the basis for the content block. It adjusts the minimum and maximum width of the content area. The rest part of the block is filled with the background. The content area width can be fixed. These properties are set in the Props tab.
Section options:
  • The width for content within a section can be set.
  • The maximum width for content can be set.
  • The minimum width for content can be set.
GoogleMap
An interactive map by Google that allows you to show your address.
GoogleMap options:
  • The location is shown on the map.
  • You can move, zoom in and out the map.
Important! To use the whole set of options of GoogleMap, get the Google API key.
Stack and StackItem
Stack allows you to group its StackItems into a column or row with or without the transfer. You can change the paddings between StackItems in the settings.
Stack options:
  • The children elements can be grouped into a row with or without the transfer.
  • The children elements can be grouped into a column.
  • The paddings between StackItems can be changed.