Custom Shortcodes

Love this framework and have been trying for a couple days to add some custom shortcodes and am frustrated I can’t quite get it, and am hoping someone as done this and maybe tell me where I’m going wrong.

In my theme folder, I have the structure framework-customizations->extensions->shortcodes->shortcodes->my shortcode folder

I have my config.php, options.php, static.php, static->css and img, views->views.php files and folders.

If I can get one figured out, I should be able to do them all. For example, a test shortcode:
config file:

<?php if (!defined('FW')) die('Forbidden');
$cfg = array(
    'page_builder' => array(
        'title'       => __('Message', 'fw'),
        'description' => __('Add a Message', 'fw'),
        'tab'         => __('Demo Elements', 'fw'),
    )
);

options.php:

<?php if ( ! defined( 'FW' ) ) {
	die( 'Forbidden' );
}
$options = array(
	'color'  => array(
		'label'   => __( 'Message Color', 'fw' ),
		'desc'    => __( 'Choose a color for your message', 'fw' ),
		'type'    => 'select',
		'choices' => array(
			'blue' => __('Blue', 'fw'),
			'grey' => __( 'Grey', 'fw' ),
			'green'  => __( 'Green', 'fw' ),
			'orange' => __( 'Orange', 'fw' ),
			'red'   => __( 'Red', 'fw' ),
		)
	),
	'size'  => array(
		'label'   => __( 'Message Size', 'fw' ),
		'desc'    => __( 'Choose a size for your message', 'fw' ),
		'type'    => 'select',
		'choices' => array(
			'small' => __('Small', 'fw'),
			'medium' => __( 'Medium', 'fw' ),
			'large'  => __( 'Large', 'fw' ),
			'xlarge' => __( 'Extra Large', 'fw' ),
		)
	),
	'content' => array(
		'type'  => 'textarea',
		'label' => __( 'Content', 'fw' ),
		'desc'  => __( 'Enter the desired content', 'fw' ),
	),

);

static.php – I have played around with different code for this, but something similar to:

<?php if (!defined('FW')) die('Forbidden');

// find the uri to the shortcode folder
$uri = fw_get_template_customizations_directory_uri('/extensions/shortcodes/shortcodes/messge');
wp_enqueue_style(
    'fw-shortcode-demo-shortcode',
    $uri . '/static/css/styles.css'
);

view.php:

<?php if (!defined('FW')) die( 'Forbidden' ); ?>

<?php $color_class = !empty($atts['color']) ? "wm-message-{$atts['color']}" : ''; ?>
<?php $size_class = !empty($atts['size']) ? "wm-message-{$atts['size']}" : ''; ?>
<div class="wm-message size-<?php echo $atts['size']; ?> color-<?php echo $atts['color']; ?>">
	<div class="wm-message-content">
<p><?php echo $atts['content']; ?></p>
</div>
</div>

Also my static folder with the styles and img

This is just a simple info box, and using this code I’ve been able to get the text to show up, with no size or color.

Sorry for a long post, but this is driving me crazy I can’t get it right. Can anyone possibly point me in the right direction so I can get one right to be able to do the rest.

https://ww.wp.xz.cn/plugins/unyson/