From e4f83699e04491e7827573fc1fb65f3349833c28 Mon Sep 17 00:00:00 2001 From: xevidos Date: Sat, 9 Feb 2019 16:31:40 -0500 Subject: [PATCH] Initial beta admin portal. Development depends on user interest, we may not need to switch to a separated administration vs user experience. --- admin.php | 150 ++++++++++++++++++++ admin/components/navigation/init.js | 58 ++++++++ admin/js/admin.js | 22 +++ themes/default/admin/screen.css | 204 ++++++++++++++++++++++++++++ 4 files changed, 434 insertions(+) create mode 100644 admin.php create mode 100644 admin/components/navigation/init.js create mode 100644 admin/js/admin.js create mode 100644 themes/default/admin/screen.css diff --git a/admin.php b/admin.php new file mode 100644 index 0000000..c202acb --- /dev/null +++ b/admin.php @@ -0,0 +1,150 @@ + +

+ Error, you do not have access to the administration page. +

+ + + + + + + <?php echo htmlentities( $site_name ); ?> + ' ); + } else { + + echo( '' ); + } + } + + $admin_stylesheets = array( + "admin/screen.css" + ); + + foreach( $admin_stylesheets as $sheet ) { + + if( file_exists( THEMES . "/" . $theme . "/" . $sheet ) ) { + + echo( '' ); + } else { + + echo( '' ); + } + } + ?> + + + + + + + + + + + + + + + + + + + + + +
+ ☰ +
+ +
+

testig

+
+
+ "' ); + } + } + ?> + + \ No newline at end of file diff --git a/admin/components/navigation/init.js b/admin/components/navigation/init.js new file mode 100644 index 0000000..6db97cf --- /dev/null +++ b/admin/components/navigation/init.js @@ -0,0 +1,58 @@ +( function( global, $ ) { + + // Define core + let codiad = global.codiad, + scripts = document.getElementsByTagName( 'script' ), + path = scripts[scripts.length-1].src.split( '?' )[0], + curpath = path.split( '/' ).slice( 0, -1 ).join( '/' ) + '/'; + + $( function() { + + codiad.admin.navigation.init(); + }); + + codiad.admin.navigation = { + + path: curpath, + + init() { + + this.add_listeners(); + }, + + add_listeners() { + + let _this = codiad.admin.navigation; + $( ".mobile_menu_close" ).on( "click", _this.close_nav ); + $( ".mobile_menu_trigger" ).on( "click", _this.trigger_nav ); + }, + + close_nav() { + + $( "#sidebar" ).css( "width", "0px" ); + $( ".container .content" ).off( "click", _this.close_nav ); + }, + + open_nav() { + + $( "#sidebar" ).css( "width", "250px" ); + $( ".container .content" ).on( "click", _this.close_nav ); + }, + + trigger_nav() { + + let _this = codiad.admin.navigation; + let width = $( "#sidebar" ).width(); + + $( ".content" ).html( width ) + + if( width > 0 ) { + + _this.close_nav(); + } else { + + _this.open_nav(); + } + } + }; +})( this, jQuery ); diff --git a/admin/js/admin.js b/admin/js/admin.js new file mode 100644 index 0000000..f3f570e --- /dev/null +++ b/admin/js/admin.js @@ -0,0 +1,22 @@ +( function( global, $ ) { + + // Define core + let codiad = global.codiad, + scripts = document.getElementsByTagName( 'script' ), + path = scripts[scripts.length-1].src.split( '?' )[0], + curpath = path.split( '/' ).slice( 0, -1 ).join( '/' ) + '/'; + + $( function() { + + codiad.admin.init(); + }); + + codiad.admin = { + + path: curpath, + + init: function() { + + }, + }; +})( this, jQuery ); diff --git a/themes/default/admin/screen.css b/themes/default/admin/screen.css new file mode 100644 index 0000000..d0bd4d1 --- /dev/null +++ b/themes/default/admin/screen.css @@ -0,0 +1,204 @@ +div.sidebar { + + border-right: groove; + display: block; + float: left; + height: 100%; + left: 0px; + margin: 0px 0px 0px 0px; + overflow-x: hidden; + overflow-y: scroll; + position: fixed; + top: 0px; + width: 250px; +} + +div.sidebar::-webkit-scrollbar { + + display: none; +} + +.mobile_menu_close { + + display: none; +} + +.mobile_menu_trigger { + + display: block; + float: right; + margin: 10px 10px 0 0; +} + +div.sidebar_menu { + + padding-top: 20px; + display: block; + width: auto; +} + +.sidebar_icon { + + display: inline-block; + height: 30px; + margin-right: 5px; + width: auto; + vertical-align: middle; +} + +.sidebar_option_text { + + display: inline-block; + margin: 0px; + vertical-align: middle; +} + +div.sidebar_option { + border: none; + float: none; + outline: none; + padding: 0px; + text-align: left; + white-space: normal; + width: 100%; + +} + +div.sidebar_option:hover { + + background: #555; + -webkit-transition: background .5s; /* Safari */ + transition: background .5s; +} + +a.sidebar_option { + + color: #FFFFFF; + display: block; + margin: 5px 20px 5px 20px; + padding: 10px 0px 10px 0px; + text-decoration: none; + width: 100%; +} + +.option_selected { + + background: #555; +} + +li.menu_option:hover { + + background: #555; + -webkit-transition: background 1s; /* Safari */ + transition: background 1s; +} + +section.container { + + display: block; + padding: 25px 0px 0px 22%; +} + +@media only screen and (max-width: 1080px) { + + div.dashboard_card { + + width: 90%; + } +} + +@media only screen and (max-width: 750px) { + + header { + + min-height: 50px; + right: 0px; + max-width: 100%; + } + + nav.fixed_header { + + width: 1000%; + height: 60px; + background: #292f36; + position: fixed; + } + + section.container { + + display: block; + padding: 25px 0px 0px 5%; + } + + .mobile_menu_trigger { + + display: block; + } + + .mobile_menu_close { + + border: none; + display: flex !important; + float: none; + outline: none; + padding: 0px; + text-align: left; + white-space: normal; + width: 100%; + } + + div.sidebar { + + background: #333333; + height: 100%; + left: 0; + overflow-x: hidden; + padding-top: 0px; + position: fixed; + top: 0; + transition: 0.5s; + width: 0px; + z-index: 1; + } + + div.sidebar::-webkit-scrollbar { + + display: none; + } + + div.sidebar_menu { + + padding-top: 0px; + display: block; + width: auto; + } + + a.sidebar_option { + + display: block; + margin: 0px 0px 10px 0px; + padding: 8px 8px 8px 32px; + text-decoration: none; + transition: 0.3s; + width: 80%; + } + + section.footer { + background-color: #292f36; + bottom: 0px; + display: block; + margin-left: 10px; + margin-top: 10px; + position: fixed; + right: 0px; + width: 100%; + } + +} + +@media only screen and (max-width: 500px) { + + td { + display: block; + } +} \ No newline at end of file