diff --git a/.gitignore b/.gitignore
index 87807d9..d5f19d8 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,2 @@
node_modules
package-lock.json
-dist
diff --git a/dist/contributor-orientation-tool/README.txt b/dist/contributor-orientation-tool/README.txt
new file mode 100644
index 0000000..2a99c15
--- /dev/null
+++ b/dist/contributor-orientation-tool/README.txt
@@ -0,0 +1,53 @@
+=== Contributor orientation tool ===
+
+Contributors: milana_cap, siemens82, josefreitas2, vbaimas, wpaurorautasic
+Donate link:
+Tags:
+Requires at least: 5.0
+Tested up to: 5.1
+Requires PHP: 7.0
+Stable tag: 1.1.0
+License: GPL-2.0+
+License URI: http://www.gnu.org/licenses/gpl-2.0.txt
+
+Contributor orientation tool - A WP plugin aiming to help new contributors
+
+== Description ==
+
+A WordPress plugin aiming to help new contributors decide which make team/s to contribute to or join at Contributor Day.
+
+== Installation ==
+
+This section describes how to install the plugin and get it working.
+
+1. Install the plugin trough WordpPress interface
+
+Or install it manually e.g.
+
+1. Unzip contributor-orientation-tool.zip
+2. Upload `contributor-orientation-tool` plugin folder to the `/wp-content/plugins/` directory
+3. Activate the plugin through the 'Plugins' menu in WordPress
+4. Visit plugins admin page and configure settings
+
+== Frequently Asked Questions ==
+
+== Changelog ==
+CREATED 11th February 2019
++ Version 0.0.1
+
+UPDATE 01st April 2019
++ Version 0.1.0
+- Created first fully functional prototype: Multipart form
+
+UPDATE 10th April 2019
++ Version 1.0.0
+- Added options page
+- Implemented responsive layout using new design
+- First stable version
+
+UPDATE 10th April 2019
++ Version 1.1.0
+- Added new last page desing
+- Changed team config and shortcode section rendering
+- Major change to js form logic
+- Small fixes
diff --git a/dist/contributor-orientation-tool/contributor-orientation-tool.php b/dist/contributor-orientation-tool/contributor-orientation-tool.php
new file mode 100644
index 0000000..646e997
--- /dev/null
+++ b/dist/contributor-orientation-tool/contributor-orientation-tool.php
@@ -0,0 +1,34 @@
+prefix = $prefix;
+ $this->options_name = sprintf( '%s_enabled_teams', $this->prefix );
+
+ }
+
+ /**
+ * Add hooks and define properties for options page
+ */
+ public function init_admin_form() {
+
+ $this->section_id = sprintf( '%s_options_section', $this->prefix );
+ $this->page_id = sprintf( '%s_options_page', $this->prefix );
+ $this->options_group = sprintf( '%s_options_group', $this->prefix );
+ add_action( 'admin_init', array( $this, 'register' ) );
+ add_action( sprintf( '%s_settings_page', $this->prefix ), array( $this, 'page' ) );
+
+ }
+
+ /**
+ * Options page callback
+ */
+ public function page() {
+
+ ?>
+
+
+
+
+ options_group, // Option group
+ $this->options_name, // Option name
+ array( $this, 'sanitize' ) // Sanitize
+ );
+
+ add_settings_section(
+ $this->section_id, // ID
+ esc_html__( 'Enabled WordPress org teams', 'contributor-orientation-tool' ), // Title
+ array( $this, 'section_info' ), // Callback
+ $this->page_id // Page
+ );
+
+ add_settings_field(
+ $this->options_name, // ID
+ esc_html__( 'Select teams to disable:', 'contributor-orientation-tool' ), // Title
+ array( $this, 'fields' ), // Callback
+ $this->page_id, // Page
+ $this->section_id // Section
+ );
+
+ }
+
+ /**
+ * Sanitize form fields
+ * @param array $input Contains all settings fields as array keys
+ *
+ * @return array
+ */
+ public function sanitize( $input ) {
+
+ if ( empty( $input ) ) {
+ return $input;
+ }
+
+ return array_map( 'sanitize_text_field', $input );
+ }
+
+ /**
+ * Print the Section text
+ */
+ public function section_info() {
+
+ esc_html_e( 'Use this option to disable teams that you don\'t need it the tool.', 'contributor-orientation-tool' );
+
+ }
+
+ /**
+ * Get the settings option array and print one of its values
+ */
+ public function fields() {
+
+ $values = $this->get_values();
+ $teams = Plugin::get_form_config( 'teams.php' );
+
+ foreach ( $teams as $id => $name ) {
+
+ $team = new Team( $id, $name );
+ $team_id = $team->get_id();
+
+ printf(
+ '',
+ sprintf( '%s-%s', $this->prefix, $team_id ),
+ $this->options_name,
+ $team_id,
+ $team->get_name(),
+ ! empty( $values ) && in_array( $team_id, $values ) ? ' checked="checked"' : ''
+ );
+
+ }
+
+ }
+
+ /**
+ * Return plugins options
+ * @return array
+ */
+ public function get_values() {
+
+ $values = get_option( $this->options_name );
+
+ return empty( $values ) ? array() : $values;
+
+ }
+
+
+}
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/Admin/Settings.php b/dist/contributor-orientation-tool/src/WPCOTool/Admin/Settings.php
new file mode 100644
index 0000000..f8c0399
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/Admin/Settings.php
@@ -0,0 +1,82 @@
+prefix = $prefix;
+ $this->title = esc_html__( 'Contributor orientation tool', 'contributor-orientation-tool' );
+ $this->menu_slug = sprintf(
+ '%s-%s',
+ $this->prefix,
+ '-settings'
+ );
+
+ add_action( 'admin_menu', array( $this, 'add_menu_page' ) );
+
+ }
+
+ /**
+ * Add admin submenu page
+ */
+ public function add_menu_page() {
+
+ add_options_page(
+ sprintf(
+ '%s %s',
+ $this->title,
+ esc_html__( 'settings', 'contributor-orientation-tool' )
+ ),
+ $this->title,
+ $this->capability,
+ $this->menu_slug,
+ array( $this, 'settings' )
+ );
+
+ }
+
+ /**
+ * Add settings output
+ */
+ public function settings() {
+
+ do_action( sprintf( '%s_settings_page', $this->prefix ) );
+
+ }
+
+}
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/Autoloader.php b/dist/contributor-orientation-tool/src/WPCOTool/Autoloader.php
new file mode 100644
index 0000000..84f76fc
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/Autoloader.php
@@ -0,0 +1,57 @@
+=' ) ) {
+ spl_autoload_register( array( new self(), 'autoload' ), true, $prepend );
+ } else {
+ spl_autoload_register( array( new self(), 'autoload' ) );
+ }
+ }
+
+}
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/Frontend/Question.php b/dist/contributor-orientation-tool/src/WPCOTool/Frontend/Question.php
new file mode 100644
index 0000000..4040871
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/Frontend/Question.php
@@ -0,0 +1,56 @@
+label = $label;
+ $this->teams = $teams;
+
+ }
+
+ /**
+ * Return form field label
+ * @return string
+ */
+ public function get_label() {
+
+ return $this->label;
+
+ }
+
+ /**
+ * Return teams array. Form field value
+ * @return array
+ */
+ public function get_teams() {
+
+ return $this->teams;
+
+ }
+
+}
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/Frontend/QuestionFactory.php b/dist/contributor-orientation-tool/src/WPCOTool/Frontend/QuestionFactory.php
new file mode 100644
index 0000000..ec9d534
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/Frontend/QuestionFactory.php
@@ -0,0 +1,26 @@
+version = sanitize_text_field( $version );
+ $this->prefix = $prefix;
+ $this->active_section_class = sprintf( ' %s__section--active', $this->prefix );
+ add_action( 'wp_enqueue_scripts', array( $this, 'scripts' ) );
+ add_shortcode( $this->shortcode_tag, array( $this, 'output' ) );
+
+ }
+
+ /**
+ * Html output (shortcode).
+ *
+ * @param array $atts Shortcode attributes.
+ * @param string $content Shortcode content
+ * @return string
+ */
+ public function output( $atts, $content = '' ) {
+
+ $selected_teams = $this->get_enabled_teams();
+
+ /**
+ * Output
+ */
+ return sprintf(
+ '',
+ esc_attr( $this->prefix ), // %1$s
+ implode( '', $this->get_sections( $selected_teams ) ), // %2$s
+ esc_html__( 'Submit', 'contributor-orientation-tool' ), // %3$s
+ $this->get_form_header() // %4$s
+ );
+
+ }
+
+ /**
+ * Return sections with questions for the form
+ * @param array $teams Enabled teams to parse sections
+ *
+ * @return array
+ */
+ private function get_sections( $teams ) {
+
+ if ( empty( $teams ) ) {
+
+ return array(
+ sprintf(
+ '%s
',
+ sprintf( '%s__no-teams-selected', $this->prefix ),
+ esc_html__( 'Please enable some teams form plugin options!', 'contributor-orientation-tool' )
+ )
+ );
+
+ }
+
+ /**
+ * Multipart form sections
+ */
+ $sections = $this->get_questions_sections( $teams );
+
+ /**
+ * Add teams section as final results
+ */
+ $sections[] = $this->get_teams_section( $teams );
+
+ return $sections;
+
+ }
+
+ /**
+ * Return section with teams
+ * @param array $selected_teams Array of enabled teams
+ *
+ * @return string Return section html
+ */
+ private function get_teams_section( $selected_teams ) {
+
+ $fields = array();
+ foreach ( $selected_teams as $id => $data ) {
+
+ if(
+ ! isset( $data['name'] )
+ || ! isset( $data['description'] )
+ || ! isset( $data['icon'] )
+ || ! isset( $data['url'] )
+ ) {
+ continue;
+ }
+
+ $team = new Team(
+ $id,
+ $data['name'],
+ $data['description'],
+ $data['icon'],
+ $data['url']
+ );
+
+ $fields[] = $this->get_team_checkbox_field(
+ sprintf( '%s__teams', $this->prefix ),
+ $team->get_id(),
+ $team->get_icon(),
+ $team->get_name(),
+ $team->get_description(),
+ $team->get_url()
+ );
+
+ }
+
+ return $this->get_section(
+ sprintf( '%s-section-teams', $this->prefix ),
+ esc_html__( 'Based on your answers, we recommend that you join some of teams below:', 'contributor-orientation-tool' ),
+ implode( '', $fields ),
+ '',
+ $this->get_button( $this->get_back_button_text(), true ),
+ '',
+ $this->get_form_notice()
+ );
+
+ }
+
+ /**
+ * Return sections with questions
+ * @param array $selected_teams Array of enabled teams
+ *
+ * @return array Return array of sections html
+ */
+ private function get_questions_sections( $selected_teams ) {
+
+ $section_1_key = sprintf( '%s-section-1', $this->prefix );
+
+ $form_sections = array(
+ $section_1_key => Plugin::get_form_config( 'section-1.php' ),
+ sprintf( '%s-section-2', $this->prefix ) => Plugin::get_form_config( 'section-2.php' ),
+ sprintf( '%s-section-3', $this->prefix ) => Plugin::get_form_config( 'section-3.php' )
+ );
+
+ $sections = array();
+ foreach ( $form_sections as $section_id => $section ) {
+
+ $fields = array();
+ foreach ( $section['questions'] as $key => $field ) {
+
+ if ( ! isset( $field['label'] ) || ! $field['teams'] ) {
+ continue;
+ }
+
+ $question = QuestionFactory::create( $field['label'], $field['teams'] );
+ $teams = $question->get_teams();
+
+ /**
+ * Compare if question is referring to one of selected teams and get only enabled teams
+ */
+ $enabled_teams = array_filter( $teams, function ( $team ) use ( $selected_teams ) {
+ return in_array( $team, array_keys( $selected_teams ) );
+ } );
+
+ if ( empty( $enabled_teams ) ) {
+ continue;
+ }
+
+ $fields[] = $this->get_checkbox_field(
+ $question->get_label(),
+ str_replace( '-', '_', $section_id ),
+ implode( ',', $enabled_teams ),
+ sprintf( '%s-%s', $section_id, $key )
+ );
+
+ }
+
+ $sections[] = $this->get_section(
+ $section_id,
+ $section['headline'],
+ implode( '', $fields ),
+ $this->get_button( $this->get_next_button_text(), false ),
+ $this->get_button( $this->get_back_button_text(), true ),
+ $section_id === $section_1_key ? $this->active_section_class : ''
+ );
+
+ }
+
+ return $sections;
+
+ }
+
+ /**
+ * Return section html
+ * @param string $id Section id attribute
+ * @param string $headline Section headline
+ * @param string $content Section content
+ * @param string $button_next Button html
+ * @param string $button_prev Button html
+ * @param bool $active_class If section should have active class
+ * @param string $notice Any text for notice to display in section after headline
+ *
+ * @return string
+ */
+ private function get_section( $id, $headline, $content, $button_next = '', $button_prev = '', $active_class = false, $notice = '' ) {
+
+ return sprintf(
+ '
+ %2$s
+
+ %10$s
+ %5$s%4$s
+ ',
+ esc_attr( $id ), // %1$s
+ esc_html( $headline ), // %2$s
+ $content, // %3$s
+ ! empty( $button_next ) ? wp_kses_post( $button_next ) : '', // %4$s
+ ! empty( $button_prev ) ? wp_kses_post( $button_prev ) : '', // %5$s
+ sprintf( '%s__section', $this->prefix ), // %6$s
+ $active_class, // %7$s
+ sprintf( '%s__buttons', $this->prefix ), // %8$s
+ sprintf( '%s__section-error', $this->prefix ), // %9$s
+ wp_kses_post( $notice ), // %10$s
+ sprintf( '%s__choices', $this->prefix ) // %11$s
+ );
+
+ }
+
+ /**
+ * Return button html
+ * @param string $text Button text
+ * @param bool $prev If it is previous or next button
+ *
+ * @return string
+ */
+ private function get_button( $text, $prev = false ) {
+
+ return sprintf(
+ '',
+ $prev ? esc_attr( sprintf( '%s__button-prev', $this->prefix ) ) : esc_attr( sprintf( '%s__button-next', $this->prefix ) ),
+ esc_html( $text )
+ );
+
+ }
+
+ /**
+ * Return checkbox html
+ * @param string $label Label
+ * @param string $name Input name
+ * @param string $value Input value
+ * @param string $id Input id
+ *
+ * @return string
+ */
+ private function get_checkbox_field( $label, $name, $value, $id ) {
+
+ return sprintf(
+ '',
+ esc_attr( $id ), // %1$s
+ esc_html( $label ), // %2$s
+ sanitize_text_field( $name ), // %3$s
+ esc_js( $value ), // %4$s
+ $this->get_checkbox_field_class() // %5$s
+ );
+
+ }
+
+ /**
+ * Return checkbox html
+ *
+ * @param string $name Input name
+ * @param string $value Input value
+ * @param string $team_icon
+ * @param string $team_name
+ * @param string $team_description
+ * @param string $team_url
+ *
+ * @return string
+ */
+ private function get_team_checkbox_field( $name, $value, $team_icon, $team_name, $team_description, $team_url ) {
+
+ return sprintf(
+ '',
+ esc_attr( $value ), // %1$s
+ sanitize_text_field( $name ), // %2$s
+ esc_js( $value ), // %3$s
+ $team_icon, // %4$s
+ esc_html( $team_name ), // %5$s
+ wp_kses_post( $team_description ), // %6$s
+ esc_url( $team_url ), // %7$s
+ sprintf( esc_html__( 'Learn more about %s »' ), esc_html( $team_name ) ), // %8$s
+ $this->get_checkbox_field_class() // %9$s
+ );
+
+ }
+
+ /**
+ * Return class for section input group
+ * @return string
+ */
+ private function get_checkbox_field_class() {
+
+ return sprintf( '%s__input-group', $this->prefix );
+
+ }
+
+ /**
+ * Return form header which contain form steps
+ * @return string
+ */
+ private function get_form_header() {
+
+ $number = $this->number_of_sections;
+ $steps = array();
+ for( $i = 1; $i <= $number; $i++ ) {
+
+ $steps[] = sprintf(
+ '%3$s%4$d',
+ $i === 1 ? sprintf( ' class="%s"', sprintf( '%s__steps--active', $this->prefix ) ) : '', // %1$s
+ sprintf( '%s__steps-text', $this->prefix ), // %2$s
+ esc_html__( 'Step', 'contributor-orientation-tool' ), // %3$s
+ $i // %4$d
+ );
+
+ }
+
+ return sprintf(
+ '',
+ sprintf( '%s__steps', $this->prefix ),
+ implode( $steps )
+ );
+
+ }
+
+ /**
+ * Return form notice html
+ * @return string
+ */
+ private function get_form_notice() {
+
+ return sprintf(
+ '',
+ esc_attr( sprintf( '%s__notice', $this->prefix ) ),
+ esc_html__( 'Please note that this is not Contributor Day registering form. This is just an orientation tool and results represent recommendations based on your answers. You still need to register for Contributor Day if you are planning to attend one.', 'contributor-orientation-tool' )
+ );
+
+ }
+
+ /**
+ * Get all teams from config and filter disabled teams via plugin options
+ * @return array
+ */
+ private function get_enabled_teams() {
+
+ $selected_teams = Plugin::get_form_config( 'teams.php' );
+ $options = new Options( $this->prefix );
+ $disabled_teams = $options->get_values();
+
+ if ( empty( $disabled_teams ) || ! is_array( $disabled_teams ) ) {
+ return $selected_teams;
+ }
+
+ return array_filter(
+ $selected_teams,
+ function ( $id ) use ( $disabled_teams ) {
+
+ return ! in_array( $id, $disabled_teams );
+
+ },
+ ARRAY_FILTER_USE_KEY
+ );
+
+
+ }
+
+ /**
+ * Return next button text
+ * @return string
+ */
+ private function get_next_button_text() {
+
+ return esc_html__( 'Next', 'contributor-orientation-tool' );
+
+ }
+
+ /**
+ * Return back button text
+ * @return string
+ */
+ private function get_back_button_text() {
+
+ return esc_html__( 'Go back', 'contributor-orientation-tool' );
+
+ }
+
+ /**
+ * Scripts and styles
+ *
+ * @access public
+ * @since 0.0.1
+ */
+ public function scripts() {
+
+ if ( ! is_singular( array( 'post', 'page' ) ) ) {
+ return;
+ }
+
+ /**
+ * Global $post var
+ * @param WP_Post $post
+ */
+ global $post;
+
+ if ( ! has_shortcode( $post->post_content, $this->shortcode_tag ) ) {
+ return;
+ }
+
+ $handle = sprintf( '%s-public', $this->shortcode_tag );
+
+ wp_enqueue_style(
+ $handle,
+ Plugin::assets_url( 'css/shortcode.css' ),
+ array(),
+ $this->version
+ );
+
+ wp_enqueue_script(
+ $handle,
+ Plugin::assets_url( 'js/shortcode.js' ),
+ array( 'jquery' ),
+ $this->version,
+ true
+ );
+
+ wp_localize_script(
+ $handle,
+ sprintf( '%sData', $this->prefix ),
+ array(
+ 'errorMessage' => esc_html__( 'Please select at least one answer!', 'contributor-orientation-tool' )
+ )
+ );
+ }
+
+}
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/Frontend/Team.php b/dist/contributor-orientation-tool/src/WPCOTool/Frontend/Team.php
new file mode 100644
index 0000000..f0e50e1
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/Frontend/Team.php
@@ -0,0 +1,103 @@
+id = sanitize_text_field( $id );
+ $this->name = sanitize_text_field( $name );
+ $this->description = sanitize_text_field( $description );
+ $this->icon = $icon;
+ $this->url = sanitize_text_field( $url );
+
+ }
+
+ /**
+ * Return team id
+ * @return string
+ */
+ public function get_id() {
+ return $this->id;
+ }
+
+ /**
+ * Return team name
+ * @return string
+ */
+ public function get_name() {
+ return $this->name;
+ }
+
+ /**
+ * Return team description
+ * @return string
+ */
+ public function get_description() {
+ return $this->description;
+ }
+
+ /**
+ * Return team icon
+ * @return string
+ */
+ public function get_icon() {
+ return $this->icon;
+ }
+
+ /**
+ * Return team page url on WordPress.org
+ * @return string
+ */
+ public function get_url() {
+ return $this->url;
+ }
+
+}
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/Plugin.php b/dist/contributor-orientation-tool/src/WPCOTool/Plugin.php
new file mode 100644
index 0000000..e2b45dc
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/Plugin.php
@@ -0,0 +1,180 @@
+loaded = false;
+ $this->plugin_path = plugin_dir_path( $file );
+ $this->plugin_url = plugin_dir_url( $file );
+ }
+
+ /**
+ * Checks if the plugin is loaded.
+ *
+ * @access public
+ * @since 0.0.1
+ * @return bool
+ */
+ public function is_loaded() {
+ return $this->loaded;
+ }
+
+ /**
+ * Loads the plugin into WordPress and add all needed hooks.
+ *
+ * @access public
+ * @since 0.0.1
+ */
+ public function load() {
+
+ if ( $this->is_loaded() ) {
+ return;
+ }
+
+ /*
+ * Add actions sorted via components we are adding trought plugin
+ * All hooks are going to be added via class __construct method to make plugin modular
+ */
+
+ if ( ! is_admin() ) {
+
+ /**
+ * Add shortcode
+ */
+ new Shortcode( $this->version, $this->prefix );
+
+ }
+
+ if ( is_admin() ) {
+
+ /**
+ * Add submenu page
+ */
+ new Settings( $this->prefix );
+
+ /**
+ * Add options
+ */
+ $admin_page_options = new Options( $this->prefix );
+ $admin_page_options->init_admin_form();
+
+ }
+
+
+ // Set all as loaded.
+ $this->loaded = true;
+
+ }
+
+ /**
+ * Return asset url for the plugin.
+ *
+ * @access public
+ * @since 0.0.1
+ *
+ * @param string $file File relative to assets dir
+ *
+ * @return string
+ */
+ public static function assets_url( $file ) {
+
+ return plugins_url(
+ sprintf( 'assets/%s',
+ sanitize_text_field( $file )
+ ),
+ __FILE__
+ );
+
+ }
+
+ /**
+ * Return configuration array used for form logic
+ * @param static $file Filename
+ *
+ * @return array
+ */
+ public static function get_form_config( $file ) {
+
+ return require_once plugin_dir_path( __FILE__ ) . sprintf( 'config/%s', $file );
+
+ }
+
+ /**
+ * Fired during plugin activation.
+ *
+ * @access public
+ * @since 0.0.1
+ */
+ public function activation() {
+
+ }
+}
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/assets/css/shortcode.css b/dist/contributor-orientation-tool/src/WPCOTool/assets/css/shortcode.css
new file mode 100644
index 0000000..db49e76
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/assets/css/shortcode.css
@@ -0,0 +1,300 @@
+#wpcot {
+ position: relative;
+ overflow: hidden; }
+ #wpcot .wpcot__description {
+ font-size: 0.8rem;
+ line-height: 1.1; }
+ #wpcot form {
+ position: relative;
+ width: 100%;
+ overflow: hidden;
+ border: 1px solid #8e1254;
+ font-size: 16px;
+ /* Button */
+ /* Checkbox */ }
+ #wpcot form button {
+ padding: 12px 30px;
+ line-height: 1;
+ background-color: #db0577;
+ color: #fff; }
+ #wpcot form [type="checkbox"] {
+ position: absolute;
+ left: -9999px;
+ /* checked mark aspect changes */
+ /* accessibility */ }
+ #wpcot form [type="checkbox"] + label {
+ position: relative;
+ padding-left: 1.95em;
+ cursor: pointer;
+ /* checkbox aspect */
+ /* checked mark aspect */ }
+ #wpcot form [type="checkbox"] + label::before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 1.25em;
+ height: 1.25em;
+ border: 1px solid #1b646c;
+ background-color: #fff;
+ border-radius: 0.1875rem;
+ -webkit-box-shadow: inset 0 1px 1px #1b646c;
+ box-shadow: inset 0 1px 1px #1b646c; }
+ #wpcot form [type="checkbox"] + label::after {
+ content: '\2713\0020';
+ position: absolute;
+ top: 0.03em;
+ left: 0.04em;
+ font-size: 1.7em;
+ line-height: 0.8;
+ border-radius: 0.1875rem;
+ background-color: #1b646c;
+ color: #fff;
+ -webkit-transition: all 0.2s linear;
+ transition: all 0.2s linear; }
+ #wpcot form [type="checkbox"]:not(:checked) + label::after {
+ opacity: 0;
+ -webkit-transform: scale(0);
+ transform: scale(0); }
+ #wpcot form [type="checkbox"]:checked + label::after {
+ opacity: 1;
+ -webkit-transform: scale(1);
+ transform: scale(1); }
+ #wpcot form [type="checkbox"]:checked:focus + label::before,
+ #wpcot form [type="checkbox"]:not(:checked):focus + label::before {
+ border: 2px dotted blue; }
+ #wpcot form .wpcot__steps ul {
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ border-bottom: 1px solid #8e1254;
+ overflow: hidden; }
+ #wpcot form .wpcot__steps li {
+ text-align: center;
+ width: calc((100% / 4) - 5px);
+ /* Leave some space for last section to be equal as it doesn't have ::after */
+ font-size: 1em;
+ line-height: 46px;
+ padding: 0 10px;
+ margin: 0;
+ position: relative;
+ height: 46px;
+ background-color: #fff; }
+ #wpcot form .wpcot__steps li span {
+ z-index: 3;
+ position: relative; }
+ #wpcot form .wpcot__steps li .wpcot__steps-text {
+ margin-right: 5%; }
+ @media (max-width: 767px) {
+ #wpcot form .wpcot__steps li .wpcot__steps-text {
+ display: none; } }
+ @media (max-width: 575px) {
+ #wpcot form .wpcot__steps li span:not(.wpcot__steps-text) {
+ margin-left: 5px; } }
+ #wpcot form .wpcot__steps li:last-child {
+ -webkit-box-flex: 1;
+ -ms-flex: 1;
+ flex: 1; }
+ #wpcot form .wpcot__steps li:not(:last-child)::after {
+ content: '';
+ position: absolute;
+ top: 0;
+ right: -13px;
+ height: 46px;
+ width: 46px;
+ border-width: 1px 1px 0 0;
+ border-color: #8e1254;
+ border-style: solid;
+ -webkit-transform: rotate(45deg);
+ transform: rotate(45deg);
+ background-color: inherit;
+ z-index: 2; }
+ #wpcot form .wpcot__steps li.wpcot__steps--active, #wpcot form .wpcot__steps li.wpcot__steps--active::after {
+ background-color: #8e1254;
+ color: #fff; }
+ #wpcot form .wpcot__questions {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ width: calc(100% * 4);
+ -webkit-transition: -webkit-transform 0.25s ease-in-out 0.05s;
+ transition: -webkit-transform 0.25s ease-in-out 0.05s;
+ transition: transform 0.25s ease-in-out 0.05s;
+ transition: transform 0.25s ease-in-out 0.05s, -webkit-transform 0.25s ease-in-out 0.05s;
+ min-height: 640px;
+ height: auto; }
+ #wpcot form .wpcot__no-teams-selected {
+ padding: 15px;
+ margin: 0; }
+ #wpcot form section {
+ padding: 1.5rem 1.5rem 2.5rem 1.5rem;
+ width: 100%;
+ height: inherit;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ opacity: 0;
+ visibility: hidden;
+ -webkit-transition: opacity 0s ease-in-out, visibility 0s ease-in-out;
+ transition: opacity 0s ease-in-out, visibility 0s ease-in-out;
+ /* Hide all inputs that we won't need so we can have height auto, or it will be very huge with all inputs displayed */
+ /* Set opacity for non active section */ }
+ #wpcot form section > h3 {
+ margin-bottom: 30px;
+ font-size: 1.95312em;
+ padding-right: 3em;
+ margin-top: 1.5em;
+ font-weight: 600; }
+ @media (max-width: 1024px) and (min-width: 768px) {
+ #wpcot form section > h3 {
+ font-size: 1.6em; } }
+ @media (max-width: 767px) {
+ #wpcot form section > h3 {
+ font-size: 1.4em; } }
+ #wpcot form section .wpcot__choices {
+ width: 100%;
+ position: relative; }
+ #wpcot form section .wpcot__choices > div {
+ margin-bottom: 10px; }
+ #wpcot form section .wpcot__choices > div label {
+ font-size: 1.125em;
+ line-height: 1.1;
+ font-weight: 500;
+ padding-top: 3px;
+ margin-left: 5px;
+ cursor: pointer;
+ display: block; }
+ @media (max-width: 767px) {
+ #wpcot form section .wpcot__choices > div label {
+ font-size: 1em; } }
+ #wpcot form section .wpcot__section-error.wpcot__section-error--active {
+ color: #fff;
+ background-color: #ff3838;
+ padding: 15px;
+ margin-bottom: 1em;
+ line-height: 1; }
+ #wpcot form section .wpcot__notice {
+ background-color: #e8f5f6;
+ padding: 15px;
+ margin-top: 3em;
+ margin-bottom: 3em;
+ font-size: 0.9em; }
+ #wpcot form section .wpcot__notice p {
+ margin: 0;
+ font-size: inherit; }
+ #wpcot form section .wpcot__buttons {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ margin-top: auto;
+ width: 100%; }
+ #wpcot form section .wpcot__buttons .wpcot__button-next {
+ background-color: #8e1254; }
+ #wpcot form section .wpcot__buttons .wpcot__button-prev {
+ background-color: transparent !important;
+ color: #8e1254 !important;
+ font-weight: 400;
+ text-decoration: underline;
+ border-right: 1px solid #8e1254;
+ height: auto;
+ padding: 0 15px 0 0;
+ margin-right: 15px;
+ -webkit-transition: border 0.25s ease-in-out, color 0.25s ease-in-out;
+ transition: border 0.25s ease-in-out, color 0.25s ease-in-out; }
+ #wpcot form section .wpcot__buttons .wpcot__button-prev:hover {
+ color: #db0577 !important;
+ border-right: 1px solid #db0577;
+ background-color: transparent; }
+ #wpcot form section:not(:first-of-type) .wpcot__choices > .wpcot__input-group:not(.wpcot__input-group--visible) {
+ display: none; }
+ #wpcot form section:first-of-type .wpcot__button-prev {
+ display: none; }
+ #wpcot form section:last-of-type {
+ /* Hide fake checboxes in last section */ }
+ #wpcot form section:last-of-type .wpcot__choices label {
+ padding-left: 0; }
+ #wpcot form section:last-of-type .wpcot__choices label::before, #wpcot form section:last-of-type .wpcot__choices label::after {
+ display: none; }
+ #wpcot form section:last-of-type .wpcot__button-prev {
+ margin-right: 0;
+ padding-right: 0;
+ border: none; }
+ #wpcot form section:last-of-type .wpcot__button-next {
+ display: none; }
+ #wpcot form section#wpcot-section-teams .wpcot__choices > div {
+ margin-bottom: 15px; }
+ #wpcot form section#wpcot-section-teams .wpcot__choices > div input[type="checkbox"] {
+ display: none; }
+ #wpcot form section#wpcot-section-teams .wpcot__choices > div a {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ text-decoration: none;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ font-weight: 500;
+ color: rgba(219, 5, 119, 0.65); }
+ #wpcot form section#wpcot-section-teams .wpcot__choices > div label {
+ font-size: 1.2em;
+ margin-bottom: 10px; }
+ #wpcot form section#wpcot-section-teams .wpcot__choices > div label svg {
+ width: auto;
+ height: 35px;
+ fill: #db0577;
+ margin-right: 5px; }
+ #wpcot form section#wpcot-section-teams .wpcot__choices > div > p {
+ margin: 0;
+ padding: 0;
+ font-size: 0.9em; }
+ #wpcot form section#wpcot-section-teams .wpcot__choices > div > a:last-of-type {
+ font-size: 0.9em; }
+ #wpcot form section.wpcot__section--active {
+ opacity: 1;
+ visibility: visible;
+ -webkit-transition-duration: 0.25s;
+ transition-duration: 0.25s; }
+ #wpcot form button[type="submit"] {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ display: none; }
+
+
+/*# sourceMappingURL=shortcode.css.map*/
\ No newline at end of file
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/assets/css/shortcode.css.map b/dist/contributor-orientation-tool/src/WPCOTool/assets/css/shortcode.css.map
new file mode 100644
index 0000000..d10bd53
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/assets/css/shortcode.css.map
@@ -0,0 +1 @@
+{"version":3,"sources":["webpack:///style.scss"],"names":[],"mappings":"AAAA;EACE,kBAAkB;EAClB,gBAAgB,EAAE;EAClB;IACE,iBAAiB;IACjB,gBAAgB,EAAE;EACpB;IACE,kBAAkB;IAClB,WAAW;IACX,gBAAgB;IAChB,yBAAyB;IACzB,eAAe;IACf,WAAW;IACX,aAAa,EAAE;IACf;MACE,kBAAkB;MAClB,cAAc;MACd,yBAAyB;MACzB,WAAW,EAAE;IACf;MACE,kBAAkB;MAClB,aAAa;MACb,gCAAgC;MAChC,kBAAkB,EAAE;MACpB;QACE,kBAAkB;QAClB,oBAAoB;QACpB,eAAe;QACf,oBAAoB;QACpB,wBAAwB,EAAE;QAC1B;UACE,WAAW;UACX,kBAAkB;UAClB,OAAO;UACP,MAAM;UACN,aAAa;UACb,cAAc;UACd,yBAAyB;UACzB,sBAAsB;UACtB,wBAAwB;UACxB,2CAAmC;kBAAnC,mCAAmC,EAAE;QACvC;UACE,qBAAqB;UACrB,kBAAkB;UAClB,WAAW;UACX,YAAY;UACZ,gBAAgB;UAChB,gBAAgB;UAChB,wBAAwB;UACxB,yBAAyB;UACzB,WAAW;UACX,mCAA2B;UAA3B,2BAA2B,EAAE;MACjC;QACE,UAAU;QACV,2BAAmB;gBAAnB,mBAAmB,EAAE;MACvB;QACE,UAAU;QACV,2BAAmB;gBAAnB,mBAAmB,EAAE;MACvB;;QAEE,uBAAuB,EAAE;IAC7B;MACE,SAAS;MACT,UAAU;MACV,qBAAqB;MACrB,oBAAa;MAAb,oBAAa;MAAb,aAAa;MACb,uBAA2B;UAA3B,oBAA2B;cAA3B,2BAA2B;MAC3B,0BAAoB;UAApB,uBAAoB;cAApB,oBAAoB;MACpB,gCAAgC;MAChC,gBAAgB,EAAE;IACpB;MACE,kBAAkB;MAClB,6BAA6B;MAC7B,6EAA6E;MAC7E,cAAc;MACd,iBAAiB;MACjB,eAAe;MACf,SAAS;MACT,kBAAkB;MAClB,YAAY;MACZ,sBAAsB,EAAE;MACxB;QACE,UAAU;QACV,kBAAkB,EAAE;MACtB;QACE,gBAAgB,EAAE;QAClB;UACE;YACE,aAAa,EAAE,EAAE;MACvB;QACE;UACE,gBAAgB,EAAE,EAAE;MACxB;QACE,mBAAO;YAAP,WAAO;gBAAP,OAAO,EAAE;MACX;QACE,WAAW;QACX,kBAAkB;QAClB,MAAM;QACN,YAAY;QACZ,YAAY;QACZ,WAAW;QACX,yBAAyB;QACzB,qBAAqB;QACrB,mBAAmB;QACnB,gCAAwB;gBAAxB,wBAAwB;QACxB,yBAAyB;QACzB,UAAU,EAAE;MACd;QACE,yBAAyB;QACzB,WAAW,EAAE;IACjB;MACE,oBAAa;MAAb,oBAAa;MAAb,aAAa;MACb,uBAA2B;UAA3B,oBAA2B;cAA3B,2BAA2B;MAC3B,0BAAoB;UAApB,uBAAoB;cAApB,oBAAoB;MACpB,qBAAqB;MACrB,6DAA6C;MAA7C,qDAA6C;MAA7C,6CAA6C;MAA7C,wFAA6C;MAC7C,iBAAiB;MACjB,YAAY,EAAE;IAChB;MACE,aAAa;MACb,SAAS,EAAE;IACb;MACE,oCAAoC;MACpC,WAAW;MACX,eAAe;MACf,oBAAa;MAAb,oBAAa;MAAb,aAAa;MACb,4BAAsB;MAAtB,6BAAsB;UAAtB,0BAAsB;cAAtB,sBAAsB;MACtB,uBAA2B;UAA3B,oBAA2B;cAA3B,2BAA2B;MAC3B,wBAAuB;UAAvB,qBAAuB;cAAvB,uBAAuB;MACvB,UAAU;MACV,kBAAkB;MAClB,qEAA6D;MAA7D,6DAA6D;MAC7D,qHAAqH;MACrH,uCAAuC,EAAE;MACzC;QACE,mBAAmB;QACnB,oBAAoB;QACpB,kBAAkB;QAClB,iBAAiB;QACjB,gBAAgB,EAAE;QAClB;UACE;YACE,gBAAgB,EAAE,EAAE;QACxB;UACE;YACE,gBAAgB,EAAE,EAAE;MAC1B;QACE,WAAW;QACX,kBAAkB,EAAE;QACpB;UACE,mBAAmB,EAAE;UACrB;YACE,kBAAkB;YAClB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;YAChB,eAAe;YACf,cAAc,EAAE;YAChB;cACE;gBACE,cAAc,EAAE,EAAE;MAC5B;QACE,WAAW;QACX,yBAAyB;QACzB,aAAa;QACb,kBAAkB;QAClB,cAAc,EAAE;MAClB;QACE,yBAAyB;QACzB,aAAa;QACb,eAAe;QACf,kBAAkB;QAClB,gBAAgB,EAAE;QAClB;UACE,SAAS;UACT,kBAAkB,EAAE;MACxB;QACE,oBAAa;QAAb,oBAAa;QAAb,aAAa;QACb,qBAAyB;YAAzB,kBAAyB;gBAAzB,yBAAyB;QACzB,yBAAmB;YAAnB,sBAAmB;gBAAnB,mBAAmB;QACnB,gBAAgB;QAChB,WAAW,EAAE;QACb;UACE,yBAAyB,EAAE;QAC7B;UACE,wCAAwC;UACxC,yBAAyB;UACzB,gBAAgB;UAChB,0BAA0B;UAC1B,+BAA+B;UAC/B,YAAY;UACZ,mBAAmB;UACnB,kBAAkB;UAClB,qEAA6D;UAA7D,6DAA6D,EAAE;UAC/D;YACE,yBAAyB;YACzB,+BAA+B;YAC/B,6BAA6B,EAAE;MACrC;QACE,aAAa,EAAE;MACjB;QACE,aAAa,EAAE;MACjB;QACE,wCAAwC,EAAE;QAC1C;UACE,eAAe,EAAE;UACjB;YACE,aAAa,EAAE;QACnB;UACE,eAAe;UACf,gBAAgB;UAChB,YAAY,EAAE;QAChB;UACE,aAAa,EAAE;MACnB;QACE,mBAAmB,EAAE;QACrB;UACE,aAAa,EAAE;QACjB;UACE,oBAAa;UAAb,oBAAa;UAAb,aAAa;UACb,uBAA2B;cAA3B,oBAA2B;kBAA3B,2BAA2B;UAC3B,yBAAmB;cAAnB,sBAAmB;kBAAnB,mBAAmB;UACnB,qBAAqB;UACrB,wBAAgB;kBAAhB,gBAAgB;UAChB,gBAAgB;UAChB,8BAA8B,EAAE;QAClC;UACE,gBAAgB;UAChB,mBAAmB,EAAE;UACrB;YACE,WAAW;YACX,YAAY;YACZ,aAAa;YACb,iBAAiB,EAAE;QACvB;UACE,SAAS;UACT,UAAU;UACV,gBAAgB,EAAE;QACpB;UACE,gBAAgB,EAAE;MACtB;QACE,UAAU;QACV,mBAAmB;QACnB,kCAA0B;gBAA1B,0BAA0B,EAAE;IAChC;MACE,mBAAU;UAAV,cAAU;cAAV,UAAU;MACV,aAAa,EAAE","file":"src/WPCOTool/assets/css/shortcode.css","sourcesContent":["#wpcot {\n position: relative;\n overflow: hidden; }\n #wpcot .wpcot__description {\n font-size: 0.8rem;\n line-height: 1.1; }\n #wpcot form {\n position: relative;\n width: 100%;\n overflow: hidden;\n border: 1px solid #8e1254;\n font-size: 16px;\n /* Button */\n /* Checkbox */ }\n #wpcot form button {\n padding: 12px 30px;\n line-height: 1;\n background-color: #db0577;\n color: #fff; }\n #wpcot form [type=\"checkbox\"] {\n position: absolute;\n left: -9999px;\n /* checked mark aspect changes */\n /* accessibility */ }\n #wpcot form [type=\"checkbox\"] + label {\n position: relative;\n padding-left: 1.95em;\n cursor: pointer;\n /* checkbox aspect */\n /* checked mark aspect */ }\n #wpcot form [type=\"checkbox\"] + label::before {\n content: '';\n position: absolute;\n left: 0;\n top: 0;\n width: 1.25em;\n height: 1.25em;\n border: 1px solid #1b646c;\n background-color: #fff;\n border-radius: 0.1875rem;\n box-shadow: inset 0 1px 1px #1b646c; }\n #wpcot form [type=\"checkbox\"] + label::after {\n content: '\\2713\\0020';\n position: absolute;\n top: 0.03em;\n left: 0.04em;\n font-size: 1.7em;\n line-height: 0.8;\n border-radius: 0.1875rem;\n background-color: #1b646c;\n color: #fff;\n transition: all 0.2s linear; }\n #wpcot form [type=\"checkbox\"]:not(:checked) + label::after {\n opacity: 0;\n transform: scale(0); }\n #wpcot form [type=\"checkbox\"]:checked + label::after {\n opacity: 1;\n transform: scale(1); }\n #wpcot form [type=\"checkbox\"]:checked:focus + label::before,\n #wpcot form [type=\"checkbox\"]:not(:checked):focus + label::before {\n border: 2px dotted blue; }\n #wpcot form .wpcot__steps ul {\n margin: 0;\n padding: 0;\n list-style-type: none;\n display: flex;\n justify-content: flex-start;\n align-items: stretch;\n border-bottom: 1px solid #8e1254;\n overflow: hidden; }\n #wpcot form .wpcot__steps li {\n text-align: center;\n width: calc((100% / 4) - 5px);\n /* Leave some space for last section to be equal as it doesn't have ::after */\n font-size: 1em;\n line-height: 46px;\n padding: 0 10px;\n margin: 0;\n position: relative;\n height: 46px;\n background-color: #fff; }\n #wpcot form .wpcot__steps li span {\n z-index: 3;\n position: relative; }\n #wpcot form .wpcot__steps li .wpcot__steps-text {\n margin-right: 5%; }\n @media (max-width: 767px) {\n #wpcot form .wpcot__steps li .wpcot__steps-text {\n display: none; } }\n @media (max-width: 575px) {\n #wpcot form .wpcot__steps li span:not(.wpcot__steps-text) {\n margin-left: 5px; } }\n #wpcot form .wpcot__steps li:last-child {\n flex: 1; }\n #wpcot form .wpcot__steps li:not(:last-child)::after {\n content: '';\n position: absolute;\n top: 0;\n right: -13px;\n height: 46px;\n width: 46px;\n border-width: 1px 1px 0 0;\n border-color: #8e1254;\n border-style: solid;\n transform: rotate(45deg);\n background-color: inherit;\n z-index: 2; }\n #wpcot form .wpcot__steps li.wpcot__steps--active, #wpcot form .wpcot__steps li.wpcot__steps--active::after {\n background-color: #8e1254;\n color: #fff; }\n #wpcot form .wpcot__questions {\n display: flex;\n justify-content: flex-start;\n align-items: stretch;\n width: calc(100% * 4);\n transition: transform 0.25s ease-in-out 0.05s;\n min-height: 640px;\n height: auto; }\n #wpcot form .wpcot__no-teams-selected {\n padding: 15px;\n margin: 0; }\n #wpcot form section {\n padding: 1.5rem 1.5rem 2.5rem 1.5rem;\n width: 100%;\n height: inherit;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n opacity: 0;\n visibility: hidden;\n transition: opacity 0s ease-in-out, visibility 0s ease-in-out;\n /* Hide all inputs that we won't need so we can have height auto, or it will be very huge with all inputs displayed */\n /* Set opacity for non active section */ }\n #wpcot form section > h3 {\n margin-bottom: 30px;\n font-size: 1.95312em;\n padding-right: 3em;\n margin-top: 1.5em;\n font-weight: 600; }\n @media (max-width: 1024px) and (min-width: 768px) {\n #wpcot form section > h3 {\n font-size: 1.6em; } }\n @media (max-width: 767px) {\n #wpcot form section > h3 {\n font-size: 1.4em; } }\n #wpcot form section .wpcot__choices {\n width: 100%;\n position: relative; }\n #wpcot form section .wpcot__choices > div {\n margin-bottom: 10px; }\n #wpcot form section .wpcot__choices > div label {\n font-size: 1.125em;\n line-height: 1.1;\n font-weight: 500;\n padding-top: 3px;\n margin-left: 5px;\n cursor: pointer;\n display: block; }\n @media (max-width: 767px) {\n #wpcot form section .wpcot__choices > div label {\n font-size: 1em; } }\n #wpcot form section .wpcot__section-error.wpcot__section-error--active {\n color: #fff;\n background-color: #ff3838;\n padding: 15px;\n margin-bottom: 1em;\n line-height: 1; }\n #wpcot form section .wpcot__notice {\n background-color: #e8f5f6;\n padding: 15px;\n margin-top: 3em;\n margin-bottom: 3em;\n font-size: 0.9em; }\n #wpcot form section .wpcot__notice p {\n margin: 0;\n font-size: inherit; }\n #wpcot form section .wpcot__buttons {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n margin-top: auto;\n width: 100%; }\n #wpcot form section .wpcot__buttons .wpcot__button-next {\n background-color: #8e1254; }\n #wpcot form section .wpcot__buttons .wpcot__button-prev {\n background-color: transparent !important;\n color: #8e1254 !important;\n font-weight: 400;\n text-decoration: underline;\n border-right: 1px solid #8e1254;\n height: auto;\n padding: 0 15px 0 0;\n margin-right: 15px;\n transition: border 0.25s ease-in-out, color 0.25s ease-in-out; }\n #wpcot form section .wpcot__buttons .wpcot__button-prev:hover {\n color: #db0577 !important;\n border-right: 1px solid #db0577;\n background-color: transparent; }\n #wpcot form section:not(:first-of-type) .wpcot__choices > .wpcot__input-group:not(.wpcot__input-group--visible) {\n display: none; }\n #wpcot form section:first-of-type .wpcot__button-prev {\n display: none; }\n #wpcot form section:last-of-type {\n /* Hide fake checboxes in last section */ }\n #wpcot form section:last-of-type .wpcot__choices label {\n padding-left: 0; }\n #wpcot form section:last-of-type .wpcot__choices label::before, #wpcot form section:last-of-type .wpcot__choices label::after {\n display: none; }\n #wpcot form section:last-of-type .wpcot__button-prev {\n margin-right: 0;\n padding-right: 0;\n border: none; }\n #wpcot form section:last-of-type .wpcot__button-next {\n display: none; }\n #wpcot form section#wpcot-section-teams .wpcot__choices > div {\n margin-bottom: 15px; }\n #wpcot form section#wpcot-section-teams .wpcot__choices > div input[type=\"checkbox\"] {\n display: none; }\n #wpcot form section#wpcot-section-teams .wpcot__choices > div a {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n text-decoration: none;\n box-shadow: none;\n font-weight: 500;\n color: rgba(219, 5, 119, 0.65); }\n #wpcot form section#wpcot-section-teams .wpcot__choices > div label {\n font-size: 1.2em;\n margin-bottom: 10px; }\n #wpcot form section#wpcot-section-teams .wpcot__choices > div label svg {\n width: auto;\n height: 35px;\n fill: #db0577;\n margin-right: 5px; }\n #wpcot form section#wpcot-section-teams .wpcot__choices > div > p {\n margin: 0;\n padding: 0;\n font-size: 0.9em; }\n #wpcot form section#wpcot-section-teams .wpcot__choices > div > a:last-of-type {\n font-size: 0.9em; }\n #wpcot form section.wpcot__section--active {\n opacity: 1;\n visibility: visible;\n transition-duration: 0.25s; }\n #wpcot form button[type=\"submit\"] {\n flex: none;\n display: none; }\n"],"sourceRoot":""}
\ No newline at end of file
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/assets/js/shortcode.js b/dist/contributor-orientation-tool/src/WPCOTool/assets/js/shortcode.js
new file mode 100644
index 0000000..ef04c8b
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/assets/js/shortcode.js
@@ -0,0 +1,495 @@
+/******/ (function(modules) { // webpackBootstrap
+/******/ // The module cache
+/******/ var installedModules = {};
+/******/
+/******/ // The require function
+/******/ function __webpack_require__(moduleId) {
+/******/
+/******/ // Check if module is in cache
+/******/ if(installedModules[moduleId]) {
+/******/ return installedModules[moduleId].exports;
+/******/ }
+/******/ // Create a new module (and put it into the cache)
+/******/ var module = installedModules[moduleId] = {
+/******/ i: moduleId,
+/******/ l: false,
+/******/ exports: {}
+/******/ };
+/******/
+/******/ // Execute the module function
+/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ // Flag the module as loaded
+/******/ module.l = true;
+/******/
+/******/ // Return the exports of the module
+/******/ return module.exports;
+/******/ }
+/******/
+/******/
+/******/ // expose the modules object (__webpack_modules__)
+/******/ __webpack_require__.m = modules;
+/******/
+/******/ // expose the module cache
+/******/ __webpack_require__.c = installedModules;
+/******/
+/******/ // define getter function for harmony exports
+/******/ __webpack_require__.d = function(exports, name, getter) {
+/******/ if(!__webpack_require__.o(exports, name)) {
+/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ }
+/******/ };
+/******/
+/******/ // define __esModule on exports
+/******/ __webpack_require__.r = function(exports) {
+/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ }
+/******/ Object.defineProperty(exports, '__esModule', { value: true });
+/******/ };
+/******/
+/******/ // create a fake namespace object
+/******/ // mode & 1: value is a module id, require it
+/******/ // mode & 2: merge all properties of value into the ns
+/******/ // mode & 4: return value when already ns object
+/******/ // mode & 8|1: behave like require
+/******/ __webpack_require__.t = function(value, mode) {
+/******/ if(mode & 1) value = __webpack_require__(value);
+/******/ if(mode & 8) return value;
+/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ var ns = Object.create(null);
+/******/ __webpack_require__.r(ns);
+/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ return ns;
+/******/ };
+/******/
+/******/ // getDefaultExport function for compatibility with non-harmony modules
+/******/ __webpack_require__.n = function(module) {
+/******/ var getter = module && module.__esModule ?
+/******/ function getDefault() { return module['default']; } :
+/******/ function getModuleExports() { return module; };
+/******/ __webpack_require__.d(getter, 'a', getter);
+/******/ return getter;
+/******/ };
+/******/
+/******/ // Object.prototype.hasOwnProperty.call
+/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ // __webpack_public_path__
+/******/ __webpack_require__.p = "";
+/******/
+/******/
+/******/ // Load entry module and return exports
+/******/ return __webpack_require__(__webpack_require__.s = 0);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ "./src/src/WPCOTool/assets/js/form.js":
+/*!********************************************!*\
+ !*** ./src/src/WPCOTool/assets/js/form.js ***!
+ \********************************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Form; });
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+var Form =
+/*#__PURE__*/
+function () {
+ /**
+ * Constructor
+ * @param {object} form Form jQuery object
+ */
+ function Form(form) {
+ var _this = this;
+
+ _classCallCheck(this, Form);
+
+ this.form = form;
+ this.allSectionsWrapper = this.form.find('.wpcot__questions');
+ this.sections = this.allSectionsWrapper.find('section');
+ this.sectionActiveClass = 'wpcot__section--active';
+ this.steps = this.form.find('.wpcot__steps li');
+ this.stepsActiveClass = 'wpcot__steps--active';
+ this.buttonNextClass = 'wpcot__button-next';
+ this.buttonPrevClass = 'wpcot__button-prev';
+ this.inputGroupClass = 'wpcot__input-group';
+ this.inputGroupActiveClass = 'wpcot__input-group--visible';
+ this.timeout = null;
+ /* global wpcotData */
+
+ this.errorMessage = wpcotData.errorMessage;
+ this.form.find("section .".concat(this.buttonNextClass)).on('click', function (event) {
+ return _this.next(event);
+ });
+ this.form.find("section .".concat(this.buttonPrevClass)).on('click', function (event) {
+ return _this.prev(event);
+ });
+ window.addEventListener("orientationchange", function () {
+ return _this.resize();
+ });
+ this.activateFirstSection();
+ }
+ /**
+ * On window resize center active section
+ */
+
+
+ _createClass(Form, [{
+ key: "resize",
+ value: function resize() {
+ var _this2 = this;
+
+ clearTimeout(this.timeout);
+ this.timeout = setTimeout(function () {
+ var activeSection = _this2.form.find(".".concat(_this2.sectionActiveClass));
+
+ _this2.move(activeSection.index() * activeSection.outerWidth() * -1);
+ }, 500);
+ }
+ /**
+ * Mark all inputs in first section as active.
+ * This will never change but we need it so we can move back to this section
+ */
+
+ }, {
+ key: "activateFirstSection",
+ value: function activateFirstSection() {
+ this.allSectionsWrapper.find('section:first-of-type').find(".".concat(this.inputGroupClass)).addClass(this.inputGroupActiveClass);
+ }
+ /**
+ * Return form to previous section
+ * @param {Event} event eventObject
+ * @returns {boolean}
+ */
+
+ }, {
+ key: "prev",
+ value: function prev(event) {
+ var button = jQuery(event.currentTarget);
+ var section = button.parents('section');
+ var sectionWidth = section.outerWidth();
+ var prevSection = section.prev('section');
+
+ if (prevSection.length < 1) {
+ return false;
+ }
+
+ section.find(".".concat(this.inputGroupClass)).removeClass(this.inputGroupActiveClass);
+ /**
+ * Check if we have only one result to move to next section
+ */
+
+ if (this.maybeSkipSection(prevSection, false)) {
+ return true;
+ }
+ /**
+ * Move to previous section
+ */
+
+
+ this.move((section.index() - 1) * sectionWidth * -1);
+ this.addActiveClass(prevSection);
+ return true;
+ }
+ /**
+ * Move form to next section
+ * @param {Event} event eventObject
+ * @returns {boolean}
+ */
+
+ }, {
+ key: "next",
+ value: function next(event) {
+ var button = jQuery(event.currentTarget);
+ var section = button.parents('section');
+ var sectionWidth = section.outerWidth();
+ var nextSection = section.next('section');
+ var fields = section.find('input[type="checkbox"]:checked');
+ var teams = new Set();
+ /**
+ * Collect all checked teams from input values
+ */
+
+ var _iteratorNormalCompletion = true;
+ var _didIteratorError = false;
+ var _iteratorError = undefined;
+
+ try {
+ for (var _iterator = fields[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+ var field = _step.value;
+ var values = field.value.split(',');
+ var _iteratorNormalCompletion3 = true;
+ var _didIteratorError3 = false;
+ var _iteratorError3 = undefined;
+
+ try {
+ for (var _iterator3 = values[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) {
+ var value = _step3.value;
+ teams.add(value);
+ }
+ } catch (err) {
+ _didIteratorError3 = true;
+ _iteratorError3 = err;
+ } finally {
+ try {
+ if (!_iteratorNormalCompletion3 && _iterator3.return != null) {
+ _iterator3.return();
+ }
+ } finally {
+ if (_didIteratorError3) {
+ throw _iteratorError3;
+ }
+ }
+ }
+ }
+ /**
+ * Alert to select form inputs
+ */
+
+ } catch (err) {
+ _didIteratorError = true;
+ _iteratorError = err;
+ } finally {
+ try {
+ if (!_iteratorNormalCompletion && _iterator.return != null) {
+ _iterator.return();
+ }
+ } finally {
+ if (_didIteratorError) {
+ throw _iteratorError;
+ }
+ }
+ }
+
+ if (teams.size <= 0) {
+ this.displayError(section, this.errorMessage, true);
+ return false;
+ }
+ /**
+ * If we have next section
+ */
+
+
+ if (nextSection.length < 1) {
+ return false;
+ }
+
+ this.displayError(section, '', false);
+ /**
+ * Filter next section fields
+ */
+
+ var nextSectionFields = nextSection.find('input[type="checkbox"]');
+ var _iteratorNormalCompletion2 = true;
+ var _didIteratorError2 = false;
+ var _iteratorError2 = undefined;
+
+ try {
+ for (var _iterator2 = nextSectionFields[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
+ var nextSectionField = _step2.value;
+ // Uncheck if previously checked
+ nextSectionField.checked = false;
+ var nextSectionFieldTeams = new Set(nextSectionField.value.split(','));
+ var validate = false;
+ var _iteratorNormalCompletion4 = true;
+ var _didIteratorError4 = false;
+ var _iteratorError4 = undefined;
+
+ try {
+ for (var _iterator4 = nextSectionFieldTeams[Symbol.iterator](), _step4; !(_iteratorNormalCompletion4 = (_step4 = _iterator4.next()).done); _iteratorNormalCompletion4 = true) {
+ var nextSectionFieldTeam = _step4.value;
+
+ if (teams.has(nextSectionFieldTeam)) {
+ validate = true;
+ }
+ }
+ } catch (err) {
+ _didIteratorError4 = true;
+ _iteratorError4 = err;
+ } finally {
+ try {
+ if (!_iteratorNormalCompletion4 && _iterator4.return != null) {
+ _iterator4.return();
+ }
+ } finally {
+ if (_didIteratorError4) {
+ throw _iteratorError4;
+ }
+ }
+ }
+
+ var parentField = jQuery(nextSectionField).parent(".".concat(this.inputGroupClass));
+
+ if (!validate) {
+ parentField.removeClass(this.inputGroupActiveClass);
+ } else {
+ parentField.addClass(this.inputGroupActiveClass);
+ }
+ }
+ /**
+ * Check if we have only one result to move to next section
+ */
+
+ } catch (err) {
+ _didIteratorError2 = true;
+ _iteratorError2 = err;
+ } finally {
+ try {
+ if (!_iteratorNormalCompletion2 && _iterator2.return != null) {
+ _iterator2.return();
+ }
+ } finally {
+ if (_didIteratorError2) {
+ throw _iteratorError2;
+ }
+ }
+ }
+
+ if (this.maybeSkipSection(nextSection, true)) {
+ return true;
+ }
+ /**
+ * Move to next section
+ */
+
+
+ this.move(nextSection.index() * sectionWidth * -1);
+ this.addActiveClass(nextSection);
+ }
+ /**
+ * Move to added value
+ * @param {int} value
+ */
+
+ }, {
+ key: "move",
+ value: function move(value) {
+ this.allSectionsWrapper.css({
+ '-webkit-transform': "translate(".concat(value, "px, 0)"),
+ '-moz-transform': "translate(".concat(value, "px, 0)"),
+ '-ms-transform': "translate(".concat(value, "px, 0)"),
+ '-o-transform': "translate(".concat(value, "px, 0)"),
+ 'transform': "translate(".concat(value, "px, 0)")
+ });
+ }
+ /**
+ * Check if section has only one input field, check it and move to next or prev section
+ * @param {object} section jQuery section object
+ * @param {boolean} $next If next or previous section
+ * @returns {boolean}
+ */
+
+ }, {
+ key: "maybeSkipSection",
+ value: function maybeSkipSection(section, $next) {
+ var buttonClass = $next ? this.buttonNextClass : this.buttonPrevClass;
+ var fieldsDisplayed = section.find("div.".concat(this.inputGroupActiveClass));
+
+ if (fieldsDisplayed.length <= 1 && !section.attr('id').endsWith('teams')) {
+ fieldsDisplayed.find('input[type="checkbox"]').attr('checked', 'checked');
+ section.find(".".concat(buttonClass)).trigger('click');
+ return true;
+ }
+
+ return false;
+ }
+ /**
+ * Remove active classes from all sections and steps and add it to current section
+ * @param {object} section jQuery section object
+ */
+
+ }, {
+ key: "addActiveClass",
+ value: function addActiveClass(section) {
+ this.sections.removeClass(this.sectionActiveClass);
+ section.addClass(this.sectionActiveClass);
+ this.steps.removeClass(this.stepsActiveClass);
+ this.steps.eq(section.index()).addClass(this.stepsActiveClass);
+ }
+ /**
+ * Display or remove error message for section
+ * @param {object} section jQuery section object
+ * @param {string} text
+ */
+
+ }, {
+ key: "displayError",
+ value: function displayError(section, text, active) {
+ var errorDiv = section.find('.wpcot__section-error');
+ var activeClass = 'wpcot__section-error--active';
+
+ if (active) {
+ errorDiv.addClass(activeClass);
+ } else {
+ errorDiv.removeClass(activeClass);
+ }
+
+ errorDiv.text(text);
+ }
+ }]);
+
+ return Form;
+}();
+
+
+
+/***/ }),
+
+/***/ "./src/src/WPCOTool/assets/js/main.js":
+/*!********************************************!*\
+ !*** ./src/src/WPCOTool/assets/js/main.js ***!
+ \********************************************/
+/*! no exports provided */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _form__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./form */ "./src/src/WPCOTool/assets/js/form.js");
+
+
+(function ($) {
+ "use strict";
+
+ $(window).load(function () {
+ new _form__WEBPACK_IMPORTED_MODULE_0__["default"]($('#wpcot form'));
+ });
+})(jQuery);
+
+/***/ }),
+
+/***/ "./src/src/WPCOTool/assets/scss/style.scss":
+/*!*************************************************!*\
+ !*** ./src/src/WPCOTool/assets/scss/style.scss ***!
+ \*************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+
+/***/ }),
+
+/***/ 0:
+/*!********************************************************************************************!*\
+ !*** multi ./src/src/WPCOTool/assets/js/main.js ./src/src/WPCOTool/assets/scss/style.scss ***!
+ \********************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+__webpack_require__(/*! ./src/src/WPCOTool/assets/js/main.js */"./src/src/WPCOTool/assets/js/main.js");
+module.exports = __webpack_require__(/*! ./src/src/WPCOTool/assets/scss/style.scss */"./src/src/WPCOTool/assets/scss/style.scss");
+
+
+/***/ })
+
+/******/ });
+//# sourceMappingURL=shortcode.js.map
\ No newline at end of file
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/assets/js/shortcode.js.map b/dist/contributor-orientation-tool/src/WPCOTool/assets/js/shortcode.js.map
new file mode 100644
index 0000000..46d613a
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/assets/js/shortcode.js.map
@@ -0,0 +1 @@
+{"version":3,"sources":["webpack:///webpack/bootstrap","webpack:///./src/src/WPCOTool/assets/js/form.js","webpack:///./src/src/WPCOTool/assets/js/main.js","webpack:///./src/src/WPCOTool/assets/scss/style.scss"],"names":["Form","form","allSectionsWrapper","find","sections","sectionActiveClass","steps","stepsActiveClass","buttonNextClass","buttonPrevClass","inputGroupClass","inputGroupActiveClass","timeout","errorMessage","wpcotData","on","event","next","prev","window","addEventListener","resize","activateFirstSection","clearTimeout","setTimeout","activeSection","move","index","outerWidth","addClass","button","jQuery","currentTarget","section","parents","sectionWidth","prevSection","length","removeClass","maybeSkipSection","addActiveClass","nextSection","fields","teams","Set","field","values","value","split","add","size","displayError","nextSectionFields","nextSectionField","checked","nextSectionFieldTeams","validate","nextSectionFieldTeam","has","parentField","parent","css","$next","buttonClass","fieldsDisplayed","attr","endsWith","trigger","eq","text","active","errorDiv","activeClass","$","load"],"mappings":";AAAA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA,kDAA0C,gCAAgC;AAC1E;AACA;;AAEA;AACA;AACA;AACA,gEAAwD,kBAAkB;AAC1E;AACA,yDAAiD,cAAc;AAC/D;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iDAAyC,iCAAiC;AAC1E,wHAAgH,mBAAmB,EAAE;AACrI;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;;AAGA;AACA;;;;;;;;;;;;;;;;;;;;;IClFqBA,I;;;AAEpB;;;;AAIA,gBAAYC,IAAZ,EAAkB;AAAA;;AAAA;;AACjB,SAAKA,IAAL,GAAYA,IAAZ;AACA,SAAKC,kBAAL,GAA0B,KAAKD,IAAL,CAAUE,IAAV,CAAe,mBAAf,CAA1B;AACA,SAAKC,QAAL,GAAgB,KAAKF,kBAAL,CAAwBC,IAAxB,CAA6B,SAA7B,CAAhB;AACA,SAAKE,kBAAL,GAA0B,wBAA1B;AACA,SAAKC,KAAL,GAAa,KAAKL,IAAL,CAAUE,IAAV,CAAe,kBAAf,CAAb;AACA,SAAKI,gBAAL,GAAwB,sBAAxB;AACA,SAAKC,eAAL,GAAuB,oBAAvB;AACA,SAAKC,eAAL,GAAuB,oBAAvB;AACA,SAAKC,eAAL,GAAuB,oBAAvB;AACA,SAAKC,qBAAL,GAA6B,6BAA7B;AACA,SAAKC,OAAL,GAAe,IAAf;AAEA;;AACA,SAAKC,YAAL,GAAoBC,SAAS,CAACD,YAA9B;AAEA,SAAKZ,IAAL,CAAUE,IAAV,oBAA2B,KAAKK,eAAhC,GAAmDO,EAAnD,CAAsD,OAAtD,EAA+D,UAACC,KAAD;AAAA,aAAW,KAAI,CAACC,IAAL,CAAUD,KAAV,CAAX;AAAA,KAA/D;AACA,SAAKf,IAAL,CAAUE,IAAV,oBAA2B,KAAKM,eAAhC,GAAmDM,EAAnD,CAAsD,OAAtD,EAA+D,UAACC,KAAD;AAAA,aAAW,KAAI,CAACE,IAAL,CAAUF,KAAV,CAAX;AAAA,KAA/D;AACAG,UAAM,CAACC,gBAAP,CAAwB,mBAAxB,EAA6C;AAAA,aAAM,KAAI,CAACC,MAAL,EAAN;AAAA,KAA7C;AACA,SAAKC,oBAAL;AACA;AAED;;;;;;;6BAGS;AAAA;;AAERC,kBAAY,CAAC,KAAKX,OAAN,CAAZ;AAEA,WAAKA,OAAL,GAAeY,UAAU,CAAE,YAAM;AAChC,YAAIC,aAAa,GAAG,MAAI,CAACxB,IAAL,CAAUE,IAAV,YAAmB,MAAI,CAACE,kBAAxB,EAApB;;AACA,cAAI,CAACqB,IAAL,CAAWD,aAAa,CAACE,KAAd,KAAwBF,aAAa,CAACG,UAAd,EAAzB,GAAuD,CAAC,CAAlE;AACA,OAHwB,EAGtB,GAHsB,CAAzB;AAKA;AAED;;;;;;;2CAIuB;AAEtB,WAAK1B,kBAAL,CAAwBC,IAAxB,CAA6B,uBAA7B,EAAsDA,IAAtD,YAA+D,KAAKO,eAApE,GAAuFmB,QAAvF,CAAgG,KAAKlB,qBAArG;AAEA;AAED;;;;;;;;yBAKKK,K,EAAO;AAEX,UAAIc,MAAM,GAAGC,MAAM,CAACf,KAAK,CAACgB,aAAP,CAAnB;AACA,UAAIC,OAAO,GAAGH,MAAM,CAACI,OAAP,CAAe,SAAf,CAAd;AACA,UAAIC,YAAY,GAAGF,OAAO,CAACL,UAAR,EAAnB;AACA,UAAIQ,WAAW,GAAGH,OAAO,CAACf,IAAR,CAAa,SAAb,CAAlB;;AAEA,UAAIkB,WAAW,CAACC,MAAZ,GAAqB,CAAzB,EAA4B;AAC3B,eAAO,KAAP;AACA;;AAEDJ,aAAO,CAAC9B,IAAR,YAAiB,KAAKO,eAAtB,GAAyC4B,WAAzC,CAAqD,KAAK3B,qBAA1D;AAEA;;;;AAGA,UAAK,KAAK4B,gBAAL,CAAsBH,WAAtB,EAAmC,KAAnC,CAAL,EAAiD;AAChD,eAAO,IAAP;AACA;AAED;;;;;AAGA,WAAKV,IAAL,CAAW,CAACO,OAAO,CAACN,KAAR,KAAkB,CAAnB,IAAwBQ,YAAzB,GAAyC,CAAC,CAApD;AACA,WAAKK,cAAL,CAAoBJ,WAApB;AACA,aAAO,IAAP;AAEA;AAED;;;;;;;;yBAKKpB,K,EAAO;AAEX,UAAIc,MAAM,GAAGC,MAAM,CAACf,KAAK,CAACgB,aAAP,CAAnB;AACA,UAAIC,OAAO,GAAGH,MAAM,CAACI,OAAP,CAAe,SAAf,CAAd;AACA,UAAIC,YAAY,GAAGF,OAAO,CAACL,UAAR,EAAnB;AACA,UAAIa,WAAW,GAAGR,OAAO,CAAChB,IAAR,CAAa,SAAb,CAAlB;AACA,UAAIyB,MAAM,GAAGT,OAAO,CAAC9B,IAAR,CAAa,gCAAb,CAAb;AACA,UAAIwC,KAAK,GAAG,IAAIC,GAAJ,EAAZ;AAEA;;;;AATW;AAAA;AAAA;;AAAA;AAYX,6BAAkBF,MAAlB,8HAA0B;AAAA,cAAjBG,KAAiB;AAEzB,cAAIC,MAAM,GAAGD,KAAK,CAACE,KAAN,CAAYC,KAAZ,CAAkB,GAAlB,CAAb;AAFyB;AAAA;AAAA;;AAAA;AAGzB,kCAAkBF,MAAlB,mIAA0B;AAAA,kBAAjBC,KAAiB;AACzBJ,mBAAK,CAACM,GAAN,CAAUF,KAAV;AACA;AALwB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOzB;AAED;;;;AArBW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAwBX,UAAKJ,KAAK,CAACO,IAAN,IAAc,CAAnB,EAAuB;AACtB,aAAKC,YAAL,CAAkBlB,OAAlB,EAA2B,KAAKpB,YAAhC,EAA8C,IAA9C;AACA,eAAO,KAAP;AACA;AAED;;;;;AAGA,UAAI4B,WAAW,CAACJ,MAAZ,GAAqB,CAAzB,EAA4B;AAC3B,eAAO,KAAP;AACA;;AAED,WAAKc,YAAL,CAAkBlB,OAAlB,EAA2B,EAA3B,EAA+B,KAA/B;AAEA;;;;AAGA,UAAImB,iBAAiB,GAAGX,WAAW,CAACtC,IAAZ,CAAiB,wBAAjB,CAAxB;AAzCW;AAAA;AAAA;;AAAA;AA0CX,8BAA6BiD,iBAA7B,mIAAgD;AAAA,cAAvCC,gBAAuC;AAE/C;AACAA,0BAAgB,CAACC,OAAjB,GAA2B,KAA3B;AAEA,cAAIC,qBAAqB,GAAG,IAAIX,GAAJ,CAAQS,gBAAgB,CAACN,KAAjB,CAAuBC,KAAvB,CAA6B,GAA7B,CAAR,CAA5B;AAEA,cAAIQ,QAAQ,GAAG,KAAf;AAP+C;AAAA;AAAA;;AAAA;AAQ/C,kCAAiCD,qBAAjC,mIAAwD;AAAA,kBAA/CE,oBAA+C;;AAEvD,kBAAId,KAAK,CAACe,GAAN,CAAUD,oBAAV,CAAJ,EAAqC;AACpCD,wBAAQ,GAAG,IAAX;AACA;AAED;AAd8C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAgB/C,cAAIG,WAAW,GAAG5B,MAAM,CAACsB,gBAAD,CAAN,CAAyBO,MAAzB,YAAoC,KAAKlD,eAAzC,EAAlB;;AACA,cAAK,CAAE8C,QAAP,EAAkB;AACjBG,uBAAW,CAACrB,WAAZ,CAAwB,KAAK3B,qBAA7B;AACA,WAFD,MAEO;AACNgD,uBAAW,CAAC9B,QAAZ,CAAqB,KAAKlB,qBAA1B;AACA;AAED;AAED;;;;AAnEW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAsEX,UAAK,KAAK4B,gBAAL,CAAsBE,WAAtB,EAAmC,IAAnC,CAAL,EAAgD;AAC/C,eAAO,IAAP;AACA;AAED;;;;;AAGA,WAAKf,IAAL,CAAWe,WAAW,CAACd,KAAZ,KAAsBQ,YAAvB,GAAuC,CAAC,CAAlD;AACA,WAAKK,cAAL,CAAoBC,WAApB;AAEA;AAED;;;;;;;yBAIKM,K,EAAO;AAEX,WAAK7C,kBAAL,CAAwB2D,GAAxB,CAA4B;AAC3B,iDAAkCd,KAAlC,WAD2B;AAE3B,8CAA+BA,KAA/B,WAF2B;AAG3B,6CAA8BA,KAA9B,WAH2B;AAI3B,4CAA6BA,KAA7B,WAJ2B;AAK3B,yCAA0BA,KAA1B;AAL2B,OAA5B;AAQA;AAED;;;;;;;;;qCAMiBd,O,EAAS6B,K,EAAO;AAEhC,UAAIC,WAAW,GAAGD,KAAK,GAAG,KAAKtD,eAAR,GAA0B,KAAKC,eAAtD;AAEA,UAAIuD,eAAe,GAAG/B,OAAO,CAAC9B,IAAR,eAAoB,KAAKQ,qBAAzB,EAAtB;;AACA,UAAKqD,eAAe,CAAC3B,MAAhB,IAA0B,CAA1B,IAA+B,CAAEJ,OAAO,CAACgC,IAAR,CAAa,IAAb,EAAmBC,QAAnB,CAA4B,OAA5B,CAAtC,EAA6E;AAC5EF,uBAAe,CAAC7D,IAAhB,CAAqB,wBAArB,EAA+C8D,IAA/C,CAAoD,SAApD,EAA+D,SAA/D;AACAhC,eAAO,CAAC9B,IAAR,YAAiB4D,WAAjB,GAAgCI,OAAhC,CAAwC,OAAxC;AACA,eAAO,IAAP;AACA;;AAED,aAAO,KAAP;AAEA;AAED;;;;;;;mCAIelC,O,EAAS;AAEvB,WAAK7B,QAAL,CAAckC,WAAd,CAA0B,KAAKjC,kBAA/B;AACA4B,aAAO,CAACJ,QAAR,CAAiB,KAAKxB,kBAAtB;AAEA,WAAKC,KAAL,CAAWgC,WAAX,CAAuB,KAAK/B,gBAA5B;AACA,WAAKD,KAAL,CAAW8D,EAAX,CAAcnC,OAAO,CAACN,KAAR,EAAd,EAA+BE,QAA/B,CAAwC,KAAKtB,gBAA7C;AAEA;AAED;;;;;;;;iCAKa0B,O,EAASoC,I,EAAMC,M,EAAQ;AAEnC,UAAIC,QAAQ,GAAGtC,OAAO,CAAC9B,IAAR,CAAa,uBAAb,CAAf;AACA,UAAIqE,WAAW,GAAG,8BAAlB;;AAEA,UAAIF,MAAJ,EAAY;AACXC,gBAAQ,CAAC1C,QAAT,CAAkB2C,WAAlB;AACA,OAFD,MAEO;AACND,gBAAQ,CAACjC,WAAT,CAAqBkC,WAArB;AACA;;AAEDD,cAAQ,CAACF,IAAT,CAAcA,IAAd;AAEA;;;;;;;;;;;;;;;;;;AClPF;AAAA;AAAA;;AAEA,CAAC,UAAUI,CAAV,EAAa;AAEb;;AAEAA,GAAC,CAACtD,MAAD,CAAD,CAAUuD,IAAV,CAAe,YAAY;AAE1B,QAAI1E,6CAAJ,CAASyE,CAAC,CAAC,aAAD,CAAV;AAEA,GAJD;AAMA,CAVD,EAUG1C,MAVH,E;;;;;;;;;;;ACFA,uC","file":"src/WPCOTool/assets/js/shortcode.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, { enumerable: true, get: getter });\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n \t\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n \t\t}\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// create a fake namespace object\n \t// mode & 1: value is a module id, require it\n \t// mode & 2: merge all properties of value into the ns\n \t// mode & 4: return value when already ns object\n \t// mode & 8|1: behave like require\n \t__webpack_require__.t = function(value, mode) {\n \t\tif(mode & 1) value = __webpack_require__(value);\n \t\tif(mode & 8) return value;\n \t\tif((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;\n \t\tvar ns = Object.create(null);\n \t\t__webpack_require__.r(ns);\n \t\tObject.defineProperty(ns, 'default', { enumerable: true, value: value });\n \t\tif(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));\n \t\treturn ns;\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n","export default class Form {\n\n\t/**\n\t * Constructor\n\t * @param {object} form Form jQuery object\n\t */\n\tconstructor(form) {\n\t\tthis.form = form;\n\t\tthis.allSectionsWrapper = this.form.find('.wpcot__questions');\n\t\tthis.sections = this.allSectionsWrapper.find('section');\n\t\tthis.sectionActiveClass = 'wpcot__section--active';\n\t\tthis.steps = this.form.find('.wpcot__steps li');\n\t\tthis.stepsActiveClass = 'wpcot__steps--active';\n\t\tthis.buttonNextClass = 'wpcot__button-next';\n\t\tthis.buttonPrevClass = 'wpcot__button-prev';\n\t\tthis.inputGroupClass = 'wpcot__input-group';\n\t\tthis.inputGroupActiveClass = 'wpcot__input-group--visible';\n\t\tthis.timeout = null;\n\n\t\t/* global wpcotData */\n\t\tthis.errorMessage = wpcotData.errorMessage;\n\n\t\tthis.form.find(`section .${this.buttonNextClass}`).on('click', (event) => this.next(event));\n\t\tthis.form.find(`section .${this.buttonPrevClass}`).on('click', (event) => this.prev(event));\n\t\twindow.addEventListener(\"orientationchange\", () => this.resize());\n\t\tthis.activateFirstSection();\n\t}\n\n\t/**\n\t * On window resize center active section\n\t */\n\tresize() {\n\n\t\tclearTimeout(this.timeout);\n\n\t\tthis.timeout = setTimeout( () => {\n\t\t\tlet activeSection = this.form.find(`.${this.sectionActiveClass}`);\n\t\t\tthis.move((activeSection.index() * activeSection.outerWidth()) * -1);\n\t\t}, 500);\n\n\t}\n\n\t/**\n\t * Mark all inputs in first section as active.\n\t * This will never change but we need it so we can move back to this section\n\t */\n\tactivateFirstSection() {\n\n\t\tthis.allSectionsWrapper.find('section:first-of-type').find(`.${this.inputGroupClass}`).addClass(this.inputGroupActiveClass);\n\n\t}\n\n\t/**\n\t * Return form to previous section\n\t * @param {Event} event eventObject\n\t * @returns {boolean}\n\t */\n\tprev(event) {\n\n\t\tlet button = jQuery(event.currentTarget);\n\t\tlet section = button.parents('section');\n\t\tlet sectionWidth = section.outerWidth();\n\t\tlet prevSection = section.prev('section');\n\n\t\tif (prevSection.length < 1) {\n\t\t\treturn false;\n\t\t}\n\n\t\tsection.find(`.${this.inputGroupClass}`).removeClass(this.inputGroupActiveClass);\n\n\t\t/**\n\t\t * Check if we have only one result to move to next section\n\t\t */\n\t\tif ( this.maybeSkipSection(prevSection, false) ) {\n\t\t\treturn true;\n\t\t}\n\n\t\t/**\n\t\t * Move to previous section\n\t\t */\n\t\tthis.move(((section.index() - 1) * sectionWidth) * -1);\n\t\tthis.addActiveClass(prevSection);\n\t\treturn true;\n\n\t}\n\n\t/**\n\t * Move form to next section\n\t * @param {Event} event eventObject\n\t * @returns {boolean}\n\t */\n\tnext(event) {\n\n\t\tlet button = jQuery(event.currentTarget);\n\t\tlet section = button.parents('section');\n\t\tlet sectionWidth = section.outerWidth();\n\t\tlet nextSection = section.next('section');\n\t\tlet fields = section.find('input[type=\"checkbox\"]:checked');\n\t\tlet teams = new Set();\n\n\t\t/**\n\t\t * Collect all checked teams from input values\n\t\t */\n\t\tfor (let field of fields) {\n\n\t\t\tlet values = field.value.split(',');\n\t\t\tfor (let value of values) {\n\t\t\t\tteams.add(value);\n\t\t\t}\n\n\t\t}\n\n\t\t/**\n\t\t * Alert to select form inputs\n\t\t */\n\t\tif ( teams.size <= 0 ) {\n\t\t\tthis.displayError(section, this.errorMessage, true);\n\t\t\treturn false;\n\t\t}\n\n\t\t/**\n\t\t * If we have next section\n\t\t */\n\t\tif (nextSection.length < 1) {\n\t\t\treturn false;\n\t\t}\n\n\t\tthis.displayError(section, '', false);\n\n\t\t/**\n\t\t * Filter next section fields\n\t\t */\n\t\tlet nextSectionFields = nextSection.find('input[type=\"checkbox\"]');\n\t\tfor (let nextSectionField of nextSectionFields) {\n\n\t\t\t// Uncheck if previously checked\n\t\t\tnextSectionField.checked = false;\n\n\t\t\tlet nextSectionFieldTeams = new Set(nextSectionField.value.split(','));\n\n\t\t\tlet validate = false;\n\t\t\tfor (let nextSectionFieldTeam of nextSectionFieldTeams) {\n\n\t\t\t\tif (teams.has(nextSectionFieldTeam)) {\n\t\t\t\t\tvalidate = true;\n\t\t\t\t}\n\n\t\t\t}\n\n\t\t\tlet parentField = jQuery(nextSectionField).parent(`.${this.inputGroupClass}`);\n\t\t\tif ( ! validate ) {\n\t\t\t\tparentField.removeClass(this.inputGroupActiveClass);\n\t\t\t} else {\n\t\t\t\tparentField.addClass(this.inputGroupActiveClass);\n\t\t\t}\n\n\t\t}\n\n\t\t/**\n\t\t * Check if we have only one result to move to next section\n\t\t */\n\t\tif ( this.maybeSkipSection(nextSection, true) ) {\n\t\t\treturn true;\n\t\t}\n\n\t\t/**\n\t\t * Move to next section\n\t\t */\n\t\tthis.move((nextSection.index() * sectionWidth) * -1);\n\t\tthis.addActiveClass(nextSection);\n\n\t}\n\n\t/**\n\t * Move to added value\n\t * @param {int} value\n\t */\n\tmove(value) {\n\n\t\tthis.allSectionsWrapper.css({\n\t\t\t'-webkit-transform': `translate(${value}px, 0)`,\n\t\t\t'-moz-transform': `translate(${value}px, 0)`,\n\t\t\t'-ms-transform': `translate(${value}px, 0)`,\n\t\t\t'-o-transform': `translate(${value}px, 0)`,\n\t\t\t'transform': `translate(${value}px, 0)`,\n\t\t});\n\n\t}\n\n\t/**\n\t * Check if section has only one input field, check it and move to next or prev section\n\t * @param {object} section jQuery section object\n\t * @param {boolean} $next If next or previous section\n\t * @returns {boolean}\n\t */\n\tmaybeSkipSection(section, $next) {\n\n\t\tlet buttonClass = $next ? this.buttonNextClass : this.buttonPrevClass;\n\n\t\tlet fieldsDisplayed = section.find(`div.${this.inputGroupActiveClass}`);\n\t\tif ( fieldsDisplayed.length <= 1 && ! section.attr('id').endsWith('teams') ) {\n\t\t\tfieldsDisplayed.find('input[type=\"checkbox\"]').attr('checked', 'checked');\n\t\t\tsection.find(`.${buttonClass}`).trigger('click');\n\t\t\treturn true;\n\t\t}\n\n\t\treturn false;\n\n\t}\n\n\t/**\n\t * Remove active classes from all sections and steps and add it to current section\n\t * @param {object} section jQuery section object\n\t */\n\taddActiveClass(section) {\n\n\t\tthis.sections.removeClass(this.sectionActiveClass);\n\t\tsection.addClass(this.sectionActiveClass);\n\n\t\tthis.steps.removeClass(this.stepsActiveClass);\n\t\tthis.steps.eq(section.index()).addClass(this.stepsActiveClass);\n\n\t}\n\n\t/**\n\t * Display or remove error message for section\n\t * @param {object} section jQuery section object\n\t * @param {string} text\n\t */\n\tdisplayError(section, text, active) {\n\n\t\tlet errorDiv = section.find('.wpcot__section-error');\n\t\tlet activeClass = 'wpcot__section-error--active';\n\n\t\tif (active) {\n\t\t\terrorDiv.addClass(activeClass);\n\t\t} else {\n\t\t\terrorDiv.removeClass(activeClass);\n\t\t}\n\n\t\terrorDiv.text(text);\n\n\t}\n\n}\n","import Form from './form';\n\n(function ($) {\n\n\t\"use strict\";\n\n\t$(window).load(function () {\n\n\t\tnew Form($('#wpcot form'));\n\n\t});\n\n})(jQuery);\n","// extracted by mini-css-extract-plugin"],"sourceRoot":""}
\ No newline at end of file
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/config/section-1.php b/dist/contributor-orientation-tool/src/WPCOTool/config/section-1.php
new file mode 100644
index 0000000..b5b273e
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/config/section-1.php
@@ -0,0 +1,56 @@
+ esc_html__( 'What do you do with WordPress?', 'contributor-orientation-tool' ),
+ 'questions' => array(
+ array(
+ 'label' => esc_html__( 'I\'m a developer', 'contributor-orientation-tool' ), // Form field label
+ 'teams' => array(
+ 'support',
+ 'community',
+ 'core',
+ 'meta',
+ 'themes',
+ 'plugins',
+ 'documentation',
+ 'mobile',
+ 'accessibility',
+ 'tide',
+ ) // Form field value
+ ),
+ array(
+ 'label' => esc_html__( 'I\'m a designer', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'support',
+ 'community',
+ 'documentation',
+ 'design',
+ 'mobile',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'I\'m a content creator, blogger or marketeer', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'support',
+ 'community',
+ 'polyglots',
+ 'training',
+ 'marketing',
+ 'tv',
+ 'documentation',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'I\'m a WordPress user / other', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'support',
+ 'community',
+ 'polyglots',
+ 'marketing',
+ 'documentation',
+ )
+ ),
+ )
+);
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/config/section-2.php b/dist/contributor-orientation-tool/src/WPCOTool/config/section-2.php
new file mode 100644
index 0000000..d16eef8
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/config/section-2.php
@@ -0,0 +1,90 @@
+ esc_html__( 'What are you passionate about?', 'contributor-orientation-tool' ),
+ 'questions' => array(
+ array(
+ 'label' => esc_html__( 'Web development, backend development etc.', 'contributor-orientation-tool' ), // Form field label
+ 'teams' => array(
+ 'support',
+ 'core',
+ 'themes',
+ 'plugins',
+ 'accessibility',
+ 'tide',
+ ) // Form field value
+ ),
+ array(
+ 'label' => esc_html__( 'Writing tests, support codebase for WordPress.org', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'meta',
+ 'tide',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Helping others', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'support',
+ 'training',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Mobile apps', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'mobile',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Documentation', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'core',
+ 'meta',
+ 'documentation',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Testing', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'core',
+ 'documentation',
+ 'tide',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Web design', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'design',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Content creation', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'support',
+ 'polyglots',
+ 'training',
+ 'tv',
+ 'meta',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Marketing', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'marketing',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Organising a meetup and helping the community', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'community',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Translation', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'polyglots',
+ )
+ ),
+ )
+);
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/config/section-3.php b/dist/contributor-orientation-tool/src/WPCOTool/config/section-3.php
new file mode 100644
index 0000000..cddf83a
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/config/section-3.php
@@ -0,0 +1,94 @@
+ esc_html__( 'Are these areas you have experience with or are eager to try?', 'contributor-orientation-tool' ),
+ 'questions' => array(
+ array(
+ 'label' => esc_html__( 'Q&A, helping others use programmes, support', 'contributor-orientation-tool' ), // Form field label
+ 'teams' => array(
+ 'support',
+ ) // Form field value
+ ),
+ array(
+ 'label' => esc_html__( 'Organizing events, groups, etc.', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'community',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Writing translations', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'polyglots',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Teaching others', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'training',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Marketing', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'marketing',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Photography, video recording or processing', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'tv',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Writing code, fixing bugs, writing developer documentation etc.', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'core',
+ 'meta',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Creating or editing WordPress themes', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'themes',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Creating or editing WordPress plugins', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'plugins',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Writing content, creating documentation for projects or software', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'documentation',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Web design, UX or UI design', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'design',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Mobile apps development or design', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'mobile',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Implementing accessibility standards', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'accessibility',
+ )
+ ),
+ array(
+ 'label' => esc_html__( 'Writing automated tests', 'contributor-orientation-tool' ),
+ 'teams' => array(
+ 'tide',
+ )
+ ),
+ )
+);
diff --git a/dist/contributor-orientation-tool/src/WPCOTool/config/teams.php b/dist/contributor-orientation-tool/src/WPCOTool/config/teams.php
new file mode 100644
index 0000000..f289eaf
--- /dev/null
+++ b/dist/contributor-orientation-tool/src/WPCOTool/config/teams.php
@@ -0,0 +1,96 @@
+ array(
+ 'name' => esc_html__( 'Support', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'Answering a question in the support forums or IRC is one of the easiest ways to start contributing. Everyone knows the answer to something!', 'contributor-orientation-tool' ),
+ 'icon' => '', // Team icon svg code
+ 'url' => 'https://make.wordpress.org/support/', // Url to the team WordPress.org page for the results page
+ ), // Data for the final results page, can have multiple teams in single result,
+ 'community' => array(
+ 'name' => esc_html__( 'Community', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'If you’re interested in organizing a meetup or a WordCamp, the community blog is a great place to get started. There are groups working to support events, to create outreach and training programs, and generally support the community.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/polyglots/',
+ ),
+ 'polyglots' => array(
+ 'name' => esc_html__( 'Polyglots', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'WordPress is used all over the world and in many different languages. If you’re a polyglot, help out by translating WordPress into your own language. You can also assist with creating the tools that make translations easier.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/community/',
+ ),
+ 'training' => array(
+ 'name' => esc_html__( 'Training', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The training team creates downloadable lesson plans and related materials for instructors to use in a live workshop environment. If you enjoy teaching people how to use and build stuff for WordPress, immediately stop what you’re doing and join our team!', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/training/',
+ ),
+ 'marketing' => array(
+ 'name' => esc_html__( 'Marketing', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'Our vision for the Marketing Team is to be the go-to resource for strategy and content for other WordPress teams.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/marketing/',
+ ),
+ 'tv' => array(
+ 'name' => esc_html__( 'TV', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The TV team reviews and approves every video submitted to WordPress.tv. They also help WordCamps with video post-production and are responsible for the captioning and subtitling of published videos. Reviewing videos is a great way to learn about WordPress and help the community: experience is not required to get involved.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/tv/',
+ ),
+ 'core' => array(
+ 'name' => esc_html__( 'Core', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The core team makes WordPress. Whether you’re a seasoned PHP developer or are just learning to code, we’d love to have you on board. You can write code, fix bugs, debate decisions, and help with development.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/core/',
+ ),
+ 'meta' => array(
+ 'name' => esc_html__( 'Meta', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The Meta team makes WordPress.org, provides support, and builds tools for use by all the contributor groups. If you want to help make WordPress.org better, sign up for updates from the Meta blog.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/meta/',
+ ),
+ 'themes' => array(
+ 'name' => esc_html__( 'Themes', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The Theme Review Team reviews and approves every Theme submitted to the WordPress Theme repository. Reviewing Themes sharpens your own Theme development skills. You can help out and join the discussion on the blog.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/themes/',
+ ),
+ 'plugins' => array(
+ 'name' => esc_html__( 'Plugins', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'If you are a Plugin developer, subscribe to the Plugin review team blog to keep up with the latest updates, find resources, and learn about any issues around Plugin development.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/plugins/',
+ ),
+ 'documentation' => array(
+ 'name' => esc_html__( 'Documentation', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'Good documentation lets people help themselves when they get stuck. The docs team is responsible for creating documentation and is always on the look-out for writers.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/docs/',
+ ),
+ 'design' => array(
+ 'name' => esc_html__( 'Design', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The design group is focused on the designing and developing the user interface. It’s a home for designers and UXers alike. There are regular discussions about mockups, design, and user testing.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/design/',
+ ),
+ 'mobile' => array(
+ 'name' => esc_html__( 'Mobile', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The mobile team builds the iOS and Android apps. Lend them your Java, Objective-C, or Swift skills. The team also needs designers, UX experts, and testers to give users an smooth experience on every device.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/mobile/',
+ ),
+ 'accessibility' => array(
+ 'name' => esc_html__( 'Accessibility', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The a11y group provides accessibility expertise across the project. They make sure that WordPress core and all of WordPress’ resources are accessible.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/accessibility/',
+ ),
+ 'tide' => array(
+ 'name' => esc_html__( 'Tide', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'Tide is a series of automated tests run against every plugin and theme in the directory and then displays PHP compatibility and test errors/warnings in the directory.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/tide/',
+ ),
+);
diff --git a/src/README.txt b/src/README.txt
index 8a4d43b..2a99c15 100644
--- a/src/README.txt
+++ b/src/README.txt
@@ -1,12 +1,12 @@
=== Contributor orientation tool ===
-Contributors: milana_cap, siemens82, josefreitas2, wpaurorautasic
+Contributors: milana_cap, siemens82, josefreitas2, vbaimas, wpaurorautasic
Donate link:
Tags:
Requires at least: 5.0
Tested up to: 5.1
Requires PHP: 7.0
-Stable tag: 1.0.0
+Stable tag: 1.1.0
License: GPL-2.0+
License URI: http://www.gnu.org/licenses/gpl-2.0.txt
@@ -32,6 +32,9 @@ Or install it manually e.g.
== Frequently Asked Questions ==
== Changelog ==
+CREATED 11th February 2019
++ Version 0.0.1
+
UPDATE 01st April 2019
+ Version 0.1.0
- Created first fully functional prototype: Multipart form
@@ -41,3 +44,10 @@ UPDATE 10th April 2019
- Added options page
- Implemented responsive layout using new design
- First stable version
+
+UPDATE 10th April 2019
++ Version 1.1.0
+- Added new last page desing
+- Changed team config and shortcode section rendering
+- Major change to js form logic
+- Small fixes
diff --git a/src/contributor-orientation-tool.php b/src/contributor-orientation-tool.php
index 3301962..646e997 100644
--- a/src/contributor-orientation-tool.php
+++ b/src/contributor-orientation-tool.php
@@ -3,7 +3,7 @@
* Plugin Name: Contributor orientation tool
* Plugin URI: https://github.com/wceu/contributor-orientation-tool
* Description: A WordPress plugin aiming to help new contributors decide which make team/s to contribute to or join at Contributor Day.
- * Version: 1.0.0
+ * Version: 1.1.0
* Author: Aleksandar Predic
* Author URI: https://www.acapredic.com/
* Tags: comments, spam
diff --git a/src/src/WPCOTool/Frontend/Shortcode.php b/src/src/WPCOTool/Frontend/Shortcode.php
index 087193e..20dbf6b 100644
--- a/src/src/WPCOTool/Frontend/Shortcode.php
+++ b/src/src/WPCOTool/Frontend/Shortcode.php
@@ -127,16 +127,32 @@ private function get_sections( $teams ) {
private function get_teams_section( $selected_teams ) {
$fields = array();
- foreach ( $selected_teams as $id => $name ) {
-
- $team = new Team( $id, $name );
- $team_id = $team->get_id();
+ foreach ( $selected_teams as $id => $data ) {
+
+ if(
+ ! isset( $data['name'] )
+ || ! isset( $data['description'] )
+ || ! isset( $data['icon'] )
+ || ! isset( $data['url'] )
+ ) {
+ continue;
+ }
+
+ $team = new Team(
+ $id,
+ $data['name'],
+ $data['description'],
+ $data['icon'],
+ $data['url']
+ );
- $fields[] = $this->get_checkbox_field(
- $team->get_name(),
+ $fields[] = $this->get_team_checkbox_field(
sprintf( '%s__teams', $this->prefix ),
- $team_id,
- $team_id
+ $team->get_id(),
+ $team->get_icon(),
+ $team->get_name(),
+ $team->get_description(),
+ $team->get_url()
);
}
@@ -146,7 +162,7 @@ private function get_teams_section( $selected_teams ) {
esc_html__( 'Based on your answers, we recommend that you join some of teams below:', 'contributor-orientation-tool' ),
implode( '', $fields ),
'',
- $this->get_button( esc_html__( 'Previous section', 'contributor-orientation-tool' ), true ),
+ $this->get_button( $this->get_back_button_text(), true ),
'',
$this->get_form_notice()
);
@@ -206,8 +222,8 @@ private function get_questions_sections( $selected_teams ) {
$section_id,
$section['headline'],
implode( '', $fields ),
- $this->get_button( esc_html__( 'Continue', 'contributor-orientation-tool' ), false ),
- $this->get_button( esc_html__( 'Back', 'contributor-orientation-tool' ), true ),
+ $this->get_button( $this->get_next_button_text(), false ),
+ $this->get_button( $this->get_back_button_text(), true ),
$section_id === $section_1_key ? $this->active_section_class : ''
);
@@ -234,11 +250,11 @@ private function get_section( $id, $headline, $content, $button_next = '', $butt
return sprintf(
'
%2$s
- %10$s
+ %10$s
%5$s%4$s
',
esc_attr( $id ), // %1$s
@@ -282,18 +298,63 @@ private function get_button( $text, $prev = false ) {
*
* @return string
*/
- private function get_checkbox_field( $label, $name, $value, $id = '' ) {
+ private function get_checkbox_field( $label, $name, $value, $id ) {
return sprintf(
- '',
+ '',
esc_attr( $id ), // %1$s
esc_html( $label ), // %2$s
sanitize_text_field( $name ), // %3$s
- esc_js( $value ) // %4$s
+ esc_js( $value ), // %4$s
+ $this->get_checkbox_field_class() // %5$s
);
}
+ /**
+ * Return checkbox html
+ *
+ * @param string $name Input name
+ * @param string $value Input value
+ * @param string $team_icon
+ * @param string $team_name
+ * @param string $team_description
+ * @param string $team_url
+ *
+ * @return string
+ */
+ private function get_team_checkbox_field( $name, $value, $team_icon, $team_name, $team_description, $team_url ) {
+
+ return sprintf(
+ '',
+ esc_attr( $value ), // %1$s
+ sanitize_text_field( $name ), // %2$s
+ esc_js( $value ), // %3$s
+ $team_icon, // %4$s
+ esc_html( $team_name ), // %5$s
+ wp_kses_post( $team_description ), // %6$s
+ esc_url( $team_url ), // %7$s
+ sprintf( esc_html__( 'Learn more about %s »' ), esc_html( $team_name ) ), // %8$s
+ $this->get_checkbox_field_class() // %9$s
+ );
+
+ }
+
+ /**
+ * Return class for section input group
+ * @return string
+ */
+ private function get_checkbox_field_class() {
+
+ return sprintf( '%s__input-group', $this->prefix );
+
+ }
+
/**
* Return form header which contain form steps
* @return string
@@ -363,6 +424,26 @@ function ( $id ) use ( $disabled_teams ) {
}
+ /**
+ * Return next button text
+ * @return string
+ */
+ private function get_next_button_text() {
+
+ return esc_html__( 'Next', 'contributor-orientation-tool' );
+
+ }
+
+ /**
+ * Return back button text
+ * @return string
+ */
+ private function get_back_button_text() {
+
+ return esc_html__( 'Go back', 'contributor-orientation-tool' );
+
+ }
+
/**
* Scripts and styles
*
diff --git a/src/src/WPCOTool/Frontend/Team.php b/src/src/WPCOTool/Frontend/Team.php
index 0e44d4e..f0e50e1 100644
--- a/src/src/WPCOTool/Frontend/Team.php
+++ b/src/src/WPCOTool/Frontend/Team.php
@@ -11,7 +11,7 @@
class Team {
/**
- * Team id. Usualy team name with
+ * Team id. Usually team name
* @var string
*/
private $id;
@@ -22,10 +22,41 @@ class Team {
*/
private $name;
- public function __construct( string $id, string $name ) {
+ /**
+ * Team description
+ * @var string
+ */
+ private $description;
+
+ /**
+ * Team icon (dashicons SVG code)
+ * @see https://github.com/WordPress/dashicons/tree/master/svg-min
+ * @var string
+ */
+ private $icon;
+
+ /**
+ * Url to the team page on WordPress.org
+ * @var string
+ */
+ private $url;
+
+ /**
+ * Team constructor.
+ *
+ * @param string $id Team id
+ * @param string $name Team name
+ * @param string $description Team description
+ * @param string $icon Team icon (dashicons)
+ * @param string $url Url to the team page on WordPress.org
+ */
+ public function __construct( string $id, string $name, string $description, string $icon, string $url ) {
$this->id = sanitize_text_field( $id );
$this->name = sanitize_text_field( $name );
+ $this->description = sanitize_text_field( $description );
+ $this->icon = $icon;
+ $this->url = sanitize_text_field( $url );
}
@@ -45,4 +76,28 @@ public function get_name() {
return $this->name;
}
+ /**
+ * Return team description
+ * @return string
+ */
+ public function get_description() {
+ return $this->description;
+ }
+
+ /**
+ * Return team icon
+ * @return string
+ */
+ public function get_icon() {
+ return $this->icon;
+ }
+
+ /**
+ * Return team page url on WordPress.org
+ * @return string
+ */
+ public function get_url() {
+ return $this->url;
+ }
+
}
diff --git a/src/src/WPCOTool/Plugin.php b/src/src/WPCOTool/Plugin.php
index 2887858..e2b45dc 100644
--- a/src/src/WPCOTool/Plugin.php
+++ b/src/src/WPCOTool/Plugin.php
@@ -37,7 +37,7 @@ class Plugin {
* @access public
* @var string
*/
- public $version = '1.0.0';
+ public $version = '1.1.0';
/**
* Absolute path to the directory where WordPress installed the plugin with the trailing slash
diff --git a/src/src/WPCOTool/assets/js/form.js b/src/src/WPCOTool/assets/js/form.js
index b019b5f..8c7d2cc 100644
--- a/src/src/WPCOTool/assets/js/form.js
+++ b/src/src/WPCOTool/assets/js/form.js
@@ -13,6 +13,8 @@ export default class Form {
this.stepsActiveClass = 'wpcot__steps--active';
this.buttonNextClass = 'wpcot__button-next';
this.buttonPrevClass = 'wpcot__button-prev';
+ this.inputGroupClass = 'wpcot__input-group';
+ this.inputGroupActiveClass = 'wpcot__input-group--visible';
this.timeout = null;
/* global wpcotData */
@@ -21,6 +23,7 @@ export default class Form {
this.form.find(`section .${this.buttonNextClass}`).on('click', (event) => this.next(event));
this.form.find(`section .${this.buttonPrevClass}`).on('click', (event) => this.prev(event));
window.addEventListener("orientationchange", () => this.resize());
+ this.activateFirstSection();
}
/**
@@ -37,6 +40,16 @@ export default class Form {
}
+ /**
+ * Mark all inputs in first section as active.
+ * This will never change but we need it so we can move back to this section
+ */
+ activateFirstSection() {
+
+ this.allSectionsWrapper.find('section:first-of-type').find(`.${this.inputGroupClass}`).addClass(this.inputGroupActiveClass);
+
+ }
+
/**
* Return form to previous section
* @param {Event} event eventObject
@@ -53,6 +66,8 @@ export default class Form {
return false;
}
+ section.find(`.${this.inputGroupClass}`).removeClass(this.inputGroupActiveClass);
+
/**
* Check if we have only one result to move to next section
*/
@@ -132,11 +147,11 @@ export default class Form {
}
- let parentField = jQuery(nextSectionField).parent('div');
+ let parentField = jQuery(nextSectionField).parent(`.${this.inputGroupClass}`);
if ( ! validate ) {
- parentField.hide();
+ parentField.removeClass(this.inputGroupActiveClass);
} else {
- parentField.show();
+ parentField.addClass(this.inputGroupActiveClass);
}
}
@@ -180,12 +195,11 @@ export default class Form {
*/
maybeSkipSection(section, $next) {
-
let buttonClass = $next ? this.buttonNextClass : this.buttonPrevClass;
- let fieldsDisplayed = section.find('input[type="checkbox"]:visible');
+ let fieldsDisplayed = section.find(`div.${this.inputGroupActiveClass}`);
if ( fieldsDisplayed.length <= 1 && ! section.attr('id').endsWith('teams') ) {
- fieldsDisplayed.attr('checked', 'checked');
+ fieldsDisplayed.find('input[type="checkbox"]').attr('checked', 'checked');
section.find(`.${buttonClass}`).trigger('click');
return true;
}
diff --git a/src/src/WPCOTool/assets/scss/shortcode/_shortcode.scss b/src/src/WPCOTool/assets/scss/shortcode/_shortcode.scss
index 8142000..5f26da1 100644
--- a/src/src/WPCOTool/assets/scss/shortcode/_shortcode.scss
+++ b/src/src/WPCOTool/assets/scss/shortcode/_shortcode.scss
@@ -17,7 +17,8 @@
/* Button */
button {
- padding: 5px 25px;
+ padding: 12px 30px;
+ line-height: 1;
background-color: $color__main-lite;
color: $color__white;
}
@@ -158,8 +159,9 @@
justify-content: flex-start;
align-items: stretch;
width: calc(#{$form-section__width} * 4);
- transition: transform 0.25s ease-in-out;
- height: $form-section__min-height;
+ transition: transform 0.25s ease-in-out 0.05s;
+ min-height: $form-section__min-height;
+ height: auto;
}
.wpcot__no-teams-selected {
@@ -168,13 +170,16 @@
}
section {
- padding: 1.5rem;
+ padding: 1.5rem 1.5rem 2.5rem 1.5rem;
width: $form-section__width;
height: inherit;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
+ opacity: 0;
+ visibility: hidden;
+ transition: opacity 0s ease-in-out, visibility 0s ease-in-out;
> h3 {
margin-bottom: 30px;
@@ -192,26 +197,7 @@
}
}
- .wpcot__notice {
- background-color: $background__blue-lite;
- padding: 15px;
- margin-bottom: 3em;
- font-size: 1em;
-
- @media (max-width: $brakepoint__sm-max) {
- font-size: 0.9em;
- }
-
- p {
- margin: 0;
- font-size: inherit;
- }
- }
-
.wpcot__choices {
- overflow-x: hidden;
- overflow-y: auto;
- max-height: 65%;
width: 100%;
position: relative;
@@ -242,10 +228,23 @@
line-height: 1;
}
+ .wpcot__notice {
+ background-color: $background__blue-lite;
+ padding: 15px;
+ margin-top: 3em;
+ margin-bottom: 3em;
+ font-size: 0.9em;
+
+ p {
+ margin: 0;
+ font-size: inherit;
+ }
+ }
+
.wpcot__buttons {
display: flex;
justify-content: flex-end;
- align-items: flex-end;
+ align-items: center;
margin-top: auto;
width: 100%;
@@ -254,7 +253,31 @@
}
.wpcot__button-prev {
+ background-color: transparent !important;
+ color: $color__main-dark !important;
+ font-weight: 400;
+ text-decoration: underline;
+ border-right: 1px solid $color__main-dark;
+ height: auto;
+ padding: 0 15px 0 0;
margin-right: 15px;
+ transition: border 0.25s ease-in-out, color 0.25s ease-in-out;
+
+ &:hover {
+ color: $color__main-lite !important;
+ border-right: 1px solid $color__main-lite;
+ background-color: transparent;
+ }
+ }
+ }
+
+ /* Hide all inputs that we won't need so we can have height auto, or it will be very huge with all inputs displayed */
+
+ &:not(:first-of-type) {
+ .wpcot__choices {
+ > .wpcot__input-group:not(.wpcot__input-group--visible) {
+ display: none;
+ }
}
}
@@ -268,8 +291,6 @@
/* Hide fake checboxes in last section */
.wpcot__choices {
- max-height: 55%;
-
label {
padding-left: 0;
@@ -280,17 +301,68 @@
}
}
- .wpcot__button-prev,
+ .wpcot__button-prev {
+ margin-right: 0;
+ padding-right: 0;
+ border: none;
+ }
+
.wpcot__button-next {
display: none;
}
}
wpcot-section-teams {
- input[type="checkbox"] {
- display: none;
+ .wpcot__choices {
+ > div {
+ margin-bottom: 15px;
+
+ input[type="checkbox"] {
+ display: none;
+ }
+
+ a {
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ text-decoration: none;
+ box-shadow: none;
+ font-weight: 500;
+ color: $color__main-lite-05;
+ }
+
+ label {
+ font-size: 1.2em;
+ margin-bottom: 10px;
+
+ svg {
+ width: auto;
+ height: 35px;
+ fill: $color__main-lite;
+ margin-right: 5px;
+ }
+ }
+
+ > p {
+ margin: 0;
+ padding: 0;
+ font-size: 0.9em;
+ }
+
+ > a:last-of-type {
+ font-size: 0.9em;
+ }
+ }
}
}
+
+ /* Set opacity for non active section */
+
+ &.wpcot__section--active {
+ opacity: 1;
+ visibility: visible;
+ transition-duration: 0.25s;
+ }
}
button[type="submit"] {
diff --git a/src/src/WPCOTool/assets/scss/variables/_colors.scss b/src/src/WPCOTool/assets/scss/variables/_colors.scss
index 3ce3e10..2cec1b5 100644
--- a/src/src/WPCOTool/assets/scss/variables/_colors.scss
+++ b/src/src/WPCOTool/assets/scss/variables/_colors.scss
@@ -1,5 +1,6 @@
$color__main-dark: #8e1254;
$color__main-lite: #db0577;
+$color__main-lite-05: rgba($color__main-lite, 0.65);
$color__text-secondary: #666;
$color__white: #fff;
$color__green: #1b646c;
diff --git a/src/src/WPCOTool/assets/scss/variables/_layout.scss b/src/src/WPCOTool/assets/scss/variables/_layout.scss
index c0a18c1..32dda94 100644
--- a/src/src/WPCOTool/assets/scss/variables/_layout.scss
+++ b/src/src/WPCOTool/assets/scss/variables/_layout.scss
@@ -1,4 +1,4 @@
-$form-section__min-height: 648px;
+$form-section__min-height: 640px;
$form-section__width: 100%;
$brakepoint__mac-min: 1440px;
diff --git a/src/src/WPCOTool/config/section-1.php b/src/src/WPCOTool/config/section-1.php
index 21fb663..b5b273e 100644
--- a/src/src/WPCOTool/config/section-1.php
+++ b/src/src/WPCOTool/config/section-1.php
@@ -43,7 +43,7 @@
)
),
array(
- 'label' => esc_html__( 'I\'m a WordPress user / other', 'contributor-orientation-tool' ),
+ 'label' => esc_html__( 'I\'m a WordPress user / other', 'contributor-orientation-tool' ),
'teams' => array(
'support',
'community',
diff --git a/src/src/WPCOTool/config/teams.php b/src/src/WPCOTool/config/teams.php
index 0f9a641..f289eaf 100644
--- a/src/src/WPCOTool/config/teams.php
+++ b/src/src/WPCOTool/config/teams.php
@@ -3,19 +3,94 @@
* Shortcode form teams
*/
return array(
- 'support' => esc_html__( 'Support', 'contributor-orientation-tool' ),
- 'community' => esc_html__( 'Community', 'contributor-orientation-tool' ),
- 'polyglots' => esc_html__( 'Polyglots', 'contributor-orientation-tool' ),
- 'training' => esc_html__( 'Training', 'contributor-orientation-tool' ),
- 'marketing' => esc_html__( 'Marketing', 'contributor-orientation-tool' ),
- 'tv' => esc_html__( 'TV', 'contributor-orientation-tool' ),
- 'core' => esc_html__( 'Core', 'contributor-orientation-tool' ),
- 'meta' => esc_html__( 'Meta', 'contributor-orientation-tool' ),
- 'themes' => esc_html__( 'Themes', 'contributor-orientation-tool' ),
- 'plugins' => esc_html__( 'Plugins', 'contributor-orientation-tool' ),
- 'documentation' => esc_html__( 'Documentation', 'contributor-orientation-tool' ),
- 'design' => esc_html__( 'Design', 'contributor-orientation-tool' ),
- 'mobile' => esc_html__( 'Mobile', 'contributor-orientation-tool' ),
- 'accessibility' => esc_html__( 'Accessibility', 'contributor-orientation-tool' ),
- 'tide' => esc_html__( 'Tide', 'contributor-orientation-tool' ),
+ 'support' => array(
+ 'name' => esc_html__( 'Support', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'Answering a question in the support forums or IRC is one of the easiest ways to start contributing. Everyone knows the answer to something!', 'contributor-orientation-tool' ),
+ 'icon' => '', // Team icon svg code
+ 'url' => 'https://make.wordpress.org/support/', // Url to the team WordPress.org page for the results page
+ ), // Data for the final results page, can have multiple teams in single result,
+ 'community' => array(
+ 'name' => esc_html__( 'Community', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'If you’re interested in organizing a meetup or a WordCamp, the community blog is a great place to get started. There are groups working to support events, to create outreach and training programs, and generally support the community.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/polyglots/',
+ ),
+ 'polyglots' => array(
+ 'name' => esc_html__( 'Polyglots', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'WordPress is used all over the world and in many different languages. If you’re a polyglot, help out by translating WordPress into your own language. You can also assist with creating the tools that make translations easier.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/community/',
+ ),
+ 'training' => array(
+ 'name' => esc_html__( 'Training', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The training team creates downloadable lesson plans and related materials for instructors to use in a live workshop environment. If you enjoy teaching people how to use and build stuff for WordPress, immediately stop what you’re doing and join our team!', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/training/',
+ ),
+ 'marketing' => array(
+ 'name' => esc_html__( 'Marketing', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'Our vision for the Marketing Team is to be the go-to resource for strategy and content for other WordPress teams.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/marketing/',
+ ),
+ 'tv' => array(
+ 'name' => esc_html__( 'TV', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The TV team reviews and approves every video submitted to WordPress.tv. They also help WordCamps with video post-production and are responsible for the captioning and subtitling of published videos. Reviewing videos is a great way to learn about WordPress and help the community: experience is not required to get involved.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/tv/',
+ ),
+ 'core' => array(
+ 'name' => esc_html__( 'Core', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The core team makes WordPress. Whether you’re a seasoned PHP developer or are just learning to code, we’d love to have you on board. You can write code, fix bugs, debate decisions, and help with development.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/core/',
+ ),
+ 'meta' => array(
+ 'name' => esc_html__( 'Meta', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The Meta team makes WordPress.org, provides support, and builds tools for use by all the contributor groups. If you want to help make WordPress.org better, sign up for updates from the Meta blog.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/meta/',
+ ),
+ 'themes' => array(
+ 'name' => esc_html__( 'Themes', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The Theme Review Team reviews and approves every Theme submitted to the WordPress Theme repository. Reviewing Themes sharpens your own Theme development skills. You can help out and join the discussion on the blog.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/themes/',
+ ),
+ 'plugins' => array(
+ 'name' => esc_html__( 'Plugins', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'If you are a Plugin developer, subscribe to the Plugin review team blog to keep up with the latest updates, find resources, and learn about any issues around Plugin development.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/plugins/',
+ ),
+ 'documentation' => array(
+ 'name' => esc_html__( 'Documentation', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'Good documentation lets people help themselves when they get stuck. The docs team is responsible for creating documentation and is always on the look-out for writers.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/docs/',
+ ),
+ 'design' => array(
+ 'name' => esc_html__( 'Design', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The design group is focused on the designing and developing the user interface. It’s a home for designers and UXers alike. There are regular discussions about mockups, design, and user testing.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/design/',
+ ),
+ 'mobile' => array(
+ 'name' => esc_html__( 'Mobile', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The mobile team builds the iOS and Android apps. Lend them your Java, Objective-C, or Swift skills. The team also needs designers, UX experts, and testers to give users an smooth experience on every device.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/mobile/',
+ ),
+ 'accessibility' => array(
+ 'name' => esc_html__( 'Accessibility', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'The a11y group provides accessibility expertise across the project. They make sure that WordPress core and all of WordPress’ resources are accessible.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/accessibility/',
+ ),
+ 'tide' => array(
+ 'name' => esc_html__( 'Tide', 'contributor-orientation-tool' ),
+ 'description' => esc_html__( 'Tide is a series of automated tests run against every plugin and theme in the directory and then displays PHP compatibility and test errors/warnings in the directory.', 'contributor-orientation-tool' ),
+ 'icon' => '',
+ 'url' => 'https://make.wordpress.org/tide/',
+ ),
);