Media styling

This article describes how you can style media elements in Rocketium's editor. For other articles on styling please refer:

• Introduction to styling
• Text styling
• Shape styling

Media styling

1. Layout
   First, we have Layout (an add-on to the size and position); there are three types of changes you can carry out with Layout;
   
   
   1. You can set the position of the shape inside the element box by choosing from nine placing options (the mini diagrams explain their doing effect)
      
   2. Next, we have Fill in frame; this makes the media take up the entire size of the element box. So, if you resize the element box, the shape will adjust to 'fill' up the new profile of the element box.
      
   3. At last, we have Fit in frame; this automatically adjusts the shape to the perfect aspect ratio for any size of the element box. 
      
2. The second styling change for shapes is the Zoom and Crop options.
   
   
   1. With the Zoom feature (slide bar), you can add a numeral value to zoom into the shape. (by default, the zoom level will be set at level 1)
   2. Besides the zoom slide bar, you have the crop icon (), which allows you to crop the shape within the element box or upload a image and use
      
   1. You have the option to blur and invert the Media's color.
      
      You can either slide the bar before every option or put a numeral value to change the settings.
3. Next up, we have the Style. Here, you can change the element's color, add a border, and make changes.
   
   
   1. You can change the background color of the media in two ways.
      1. Editing the hex code
      2. Choose the color from the palette
   2. You also have the option to change the background of the text box, giving your text a unique and different appearance.
       
   3. At last, you can blur and invert the shape's color.
      
      You can either slide the bar before every option or put a numeral value to change the settings.
4. Border
   
   1. You can change the roundness of the border by putting a numeral value in the last box.
      
   2. You can customize the roundness of all borders to your preference
      

5. Ground Shadow

   You can add a ground shadow effect to images using the toggle button

   

6. Cast Shadow 

   You can add a cast shadow effect to images using the toggle button. Additionally, you can adjust the alignment, perspective, blur, and opacity of the shadow. 

   

7. Reflection

   You can add a reflection effect to images using the toggle button. Additionally, you can adjust the shadow's transparency, distance, and size.

   

8. In layer, you have the option to change the opacity of the media