Commands

What is command?

Command is way of automate repetative tasks inside Oxygen Builder Commands in the most cases are made of two things:

1. OPERATOR - this part indicate which action

2. ARGUMENT - what action should do

Example 1: Adding class with class name of my-class

command: .my-class

operator: ' . '

argument: my-class

In Example 1 we can see command for adding one class. In Workspace dot is special character which suggest that class with followed-up name should be added to element.

Operators

All Recoda Workspace commands have operators. Imagine operators as languge between you and Oxygen. When we designed it we were heavily inspired with emmet. Our opinion is that emmet syntax is superb and industry standard so we wanted to adopt something logical, easy to write but with mind in that this is Oxygen specific so there are differences because emmet is string manipulation tool and command is Oxygen manipulation thing.

Operator	What operator does?
>	Add element
+	Add sibling element
^	Select parent (^X), where X is number of repeats
.	Add class eg. .someClassToAdd
'	Change Tag eg. 'li = set <li> custom tag eg. txt'li = add text element with custom li tag
*	Duplicate once or *X = duplicate X times
@	Rename, followed by new nicename eg. @new_name
{}	change content, {Buy it now!}
[]	add attribute, for eg. [data-theme=dark]
()	Import GitHub Gist snippet eg. (https://gist.github.com/re-co/18c7b776fbd20c6d3c1343c04792944c#file-xray-gridguide-css)
/	add stylesheet eg. /stylesheetName
|	add folder eg. |folderName

Table 1: List of command-line operators

Adding elements with commands

If you are adding elements one of following operators (>, +, or ^)should be used before element argument.

How it works?

You write some name from table an it will add Oxygen element with custom tag. Some elements has full version and shorthand version, you can use both it will do same.

Elements

In Table 2 (below) all supported elements are listed. If you want other element you can write HTML tag as argument and command-line will add DIV element with specified custom-tag in argument. (eg >aside = add div element with custom tag aside)

Command argument	Shorthand	Oxygen element	Custom tag
h1-h6		Heading element	h1-h6
p		Text block element	p
a		Text link element	a
awrap	aw	Link wrapper	a
abutton	ab	Button element	a
cb		Code block element	-
button		Button element	button
img		Image element	img
video	v	Video element	-
icon		Icon element	-
testimonial	tt	Testimonial element	-
ibox	ib	Icon box element	-
pbox	pb	Progress bar element	-
gallery	-	Gallery element	-
slider		Slider element	-
section		Section element	-
tabs		Tabs element	-
superbox		Superbox element	-
toggle	gg	Toggle elemet	-
text	txt	Text element	-
textarea		Text element	textarea
modal		Modal element	-
map		Map element	-
some-other eg. aside		Div element	some-other eg. aside

Table 2: List of command-line elements