API Users, reorganize, implement fontawesome to remove SVG images

admin/css/repository-block-editor.css

@@ -0,0 +1,91 @@
+.ebg-br-wrapper .ebg-br-editmode {
+	display: initial !important;
+}
+
+.ebg-br-wrapper .ebg-br-border {
+	border: 1px solid #eee !important;
+}
+
+.ebg-br-wrapper .ebg-br-background-color {
+	background-color: whitesmoke !important;
+	color: black !important;
+}
+
+.ebg-br-wrapper .ebg-br-icon,
+.ebg-br-wrapper .ebg-br-logo.fab.fa-github {
+	color: black !important;
+}
+
+.ebg-br-wrapper .ebg-br-col-main .ebg-br-title em {
+	padding-top: 0.40em !important;
+}
+
+.ebg-br-wrapper .ebg-br-img-color-auto {
+	-webkit-filter: invert(0) !important;
+	-moz-filter: invert(0) !important;
+	-o-filter: invert(0) !important;
+	-ms-filter: invert(0) !important;
+	filter: invert(0) !important;
+}
+
+
+/*
+	CSS > Template Error
+*/
+.ebg-br-wrapper .ebg-br-template-error .ebg-br-body p {
+	margin: 0px !important;
+	padding: 0px !important;
+}
+
+.ebg-br-wrapper .ebg-br-template-error .ebg-br-body .ebg-br-title {
+	padding-bottom: 0.5em !important;
+
+}
+
+
+/*
+	CSS > Template User
+*/
+.ebg-br-wrapper .ebg-br-template-user .ebg-br-box-ul ul {
+	border: 1px solid #eee !important;
+	background-color: white !important;
+}
+
+.ebg-br-wrapper .ebg-br-template-user .ebg-br-icon.ebg-br-cfg-icon-type-source-file_svg {
+	width: 17px !important;
+}
+
+/*
+	Class button status dark Theme
+*/
+.ebg-br-wrapper .ebg-br-body {
+	padding-bottom: 40px !important;
+}
+
+.ebg-br-wrapper .egb-br-dark_theme-status {
+	position: absolute;
+	display: block;
+	right: 0;
+	bottom: 0;
+	padding-right: 0.5em;
+	padding-bottom: 0.5em;
+}
+
+.ebg-br-wrapper .egb-br-dark_theme-status .egb-br-dark_theme-status-img {
+	display: inline-block;
+	margin-right: 0.5em;
+	padding-left: calc(64px + 0.5em);
+	padding-bottom: 5px;
+	background-image: url('../images/on_off.png');
+	background-repeat: no-repeat;
+	background-size: 65px auto;
+	font-size: smaller;
+}
+
+.ebg-br-wrapper .ebg-br-cfg-dark-theme-on .egb-br-dark_theme-status .egb-br-dark_theme-status-img {
+	background-position: 0px 0px !important;
+}
+
+.ebg-br-wrapper .ebg-br-cfg-dark-theme-off .egb-br-dark_theme-status .egb-br-dark_theme-status-img {
+	background-position: 0px -35px !important;	
+}

admin/images/index.php

@@ -0,0 +1 @@
+<?php // Silence is golden

admin/index.php

@@ -0,0 +1 @@
+<?php // Silence is golden

admin/js/index.php

@@ -0,0 +1 @@
+<?php // Silence is golden

admin/js/repository-block.js

@@ -0,0 +1,126 @@
+( function (blocks, editor, components, i18n, element ) {
+
+	var el = wp.element.createElement,
+		registerBlockType = wp.blocks.registerBlockType,
+		BlockControls = wp.editor.BlockControls,
+		AlignmentToolbar = wp.editor.AlignmentToolbar,
+		MediaUpload = wp.editor.MediaUpload,
+		InspectorControls = wp.editor.InspectorControls,
+		TextControl = wp.components.TextControl,
+		ToggleControl = wp.components.ToggleControl,
+		RadioControl = wp.components.RadioControl,
+		ServerSideRender = wp.components.ServerSideRender,
+		withState = wp.compose.withState;
+
+	var github_icon = 
+		el( 'svg' , 
+			{
+			},
+			el( 	'path', 
+			{
+				'd': 'M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'
+			}
+			)
+		)
+
+	registerBlockType( 'embed-block-for-github/repository', {
+		title: i18n.__( 'GitHub Repo' ),
+		description: i18n.__( 'A block to embed a GitHub Repository.' ),
+		icon: github_icon,
+		keywords: [ i18n.__( 'github' ), i18n.__( 'repository' ), i18n.__( 'repo' ) ],
+		category: 'embed',
+		attributes: {
+			github_url: {
+				type: 'string',
+			},
+			darck_theme: {
+				type: 'boolean',
+				default: false,
+			},
+			icon_type_source: {
+				type: 'string',
+				default: 'file_svg',
+			},
+		},
+
+		edit: function ( props ) {
+			var attributes = props.attributes,
+				github_url = props.attributes.github_url,
+				darck_theme = props.attributes.darck_theme,
+				icon_type_source = props.attributes.icon_type_source;
+
+			return [
+				el( 'div', { className: 'components-block-description' },
+					el( ServerSideRender, {
+						block: 'embed-block-for-github/repository',
+						attributes: props.attributes
+					} )
+				),
+				el(
+					InspectorControls,
+					{ key: 'inspector' },
+					el(
+						components.PanelBody, {
+							title: i18n.__( 'GitHub Repository' ),
+							className: 'block-github-repository',
+							initialOpen: true
+						},
+						el(
+							TextControl, {
+								type: 'text',
+								label: i18n.__( 'Enter the URL of the GitHub Repository' ),
+								value: github_url,
+								onChange: function ( new_url ) {
+									props.setAttributes( { github_url: new_url } )
+								}
+							}
+						),
+						el (
+							components.PanelBody, {
+								title: i18n.__( 'Theme/Skin' ),
+								initialOpen: true
+							},
+						),
+						el (
+							ToggleControl, {
+								label: i18n.__( 'Is Dark Theme?' ),
+								help: darck_theme ? i18n.__( 'Light colors will be used to counteract the dark colors of themes or skins.' ) : i18n.__( 'Dark colors will be used to counteract the light colors of themes or skins.' ),
+								checked: darck_theme,
+								onChange: function ( value ) {
+									props.setAttributes( { darck_theme: value } )
+								}
+							}
+						),
+						el (
+							RadioControl, {
+								label: i18n.__( 'Source of Icon Images' ),
+								help: icon_type_source == "file_svg" ? i18n.__( 'SVG files will be used as the source of the images.' ) : i18n.__( 'Font Awesome will be used as a source for the images.' ),
+								selected: icon_type_source,
+								options: [
+									{ label: 'Image SVG', value: 'file_svg' },
+									{ label: 'Font Awesome', value: 'font_awesome' },
+								],
+								onChange: function ( value ) {
+									props.setAttributes( { icon_type_source: value } )
+								}
+							}
+						),
+
+					)
+				),			
+			]
+		},
+
+		save: function() {
+			return null;
+		},
+
+	})
+
+})(
+	window.wp.blocks,
+	window.wp.editor,
+	window.wp.components,
+	window.wp.i18n,
+	window.wp.element
+)