Smart - Bootstrap 4 Material Admin Template For School, College & University

version 1.5

Thank You

Thank you for buying Smart and supporting Redstartheme. Feel free to contact me if you have any questions.

Also, email me if you have any feature requests or advices, I'll happy to help you.

Our promise is that Pleasure will be constantly kept up to date.

Thank You.

Overview

  • Item Name : Smart University - Bootstrap Admin Template with Material Design Components
  • Item Version : v 1.5
  • created: 23/01/2018
  • latest update: 27/10/2018
  • by: RedStarTheme
  • email: redstartheme@gmail.com

Introduction #back to top

The Smart University - Bootstrap 4 Admin Templatehas been designed to reflect the values of beauty and simplicity. Smart have also Material Design components, which you can use in your application.

Smart is a lightweight and easy to use, clean and polished, resourceful and reliable, responsive HTML5 and Bootstrap 4 admin template.It works natively on mobile devices, making it an accessible way of managing your own website from wherever you are.

Folder Structure #back to top

Smart/

	Documentation/
	├── css/
	├── Fonts/
	└── Images/
	└── Js/
	└── index.html/
	
			
	Source/
	  └── assets/ 
	    └── css/
	    └── img/
	    └── js/
	    └── plugins/
	  └── dark/
	    └── css/
	    └── fonts/
	    └── .html/
	  └── light/
	    └── css/
	    └── fonts/
	    └── .html/

Installation #back to top

Smart comes with 8 different layouts like default, RTL, dark, boxed, collapse, full width, right sidebar, hover sidebar, you can choose as per your choice.

You just need to chose your desire layout folder with assets folder and paste in your location.

Custom Theme #back to top

The Smart comes with 21 different combinations themes, User can select any theme as per her/his choice.

You need to change classes for sidebar, header & logo header in body tag.

Key point in Smart is the custom theme, You cam set ANY COLOR theme of your choice. You need to change in theme-color.css file in css folder. You can set color for --sidebar-color --sidebar-font-color --logo-color --header-color value as per your choice, and add classes in body tag .custom-sidebar-color for sidebar, .logo-custom for logo header color & .header-custom for header color. Thats it !!!

Template Structure#back to top

Template Structure

This template is fully responsive and fluid layout. Following are the general structures.

Page Head   

Below code is used at the beginning of all HTML pages

							<!DOCTYPE html>
							<html lang="en">
							<head>
							    
							    
							    
							    
							    
							    Smart University | Bootstrap Responsive Admin Template
							    
							    
								<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" rel="stylesheet" type="text/css" />
								
								<link href="../assets/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css" />
								<link href="css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
								<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
								
								<link href="../assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
								
								<link rel="stylesheet" href="../assets/plugins/material/material.min.css">
								<link rel="stylesheet" href="../assets/css/material_style.css">
								
								<link href="../assets/css/theme/light/theme_style.css" rel="stylesheet" id="rt_style_components" type="text/css" />
								<link href="../assets/css/theme/light/style.css" rel="stylesheet" type="text/css" />
								<link href="../assets/css/plugins.min.css" rel="stylesheet" type="text/css" />
								<link href="../assets/css/responsive.css" rel="stylesheet" type="text/css" />
								<link href="../assets/css/theme/light/theme-color.css" rel="stylesheet" type="text/css" />
							
							 </head>

Main Structure   

Following are the markup of main structure.

                            

								
								

									...
								

								
								
 

								
								

									
									

										

											........
										

									

									
									
									

										 

											.......
										

									

									
									
									

										

										   ...... 
										

									

									
								

								
								
								

									................

Left Side

Following are the markup of left side. Which contains logo and side bar navigation.

Left Navigation Menu

Following are the markup of left navigation. All Pages can be navigate using Left Navigation Sidebar.

Quick Sidebar

In Quick sidebar chat & setting tab are available, using that you can chat with user and setting tab is used for layout related setting in application.

							 
				            

				                

				                    
				                    

				                         
				 						

				                        	

					                            

					                                
Online

					                                
    
					                                    
  • ...
					                                        
					                                        
    
					                                            
    John Deo
    
					                                            
    Spine Surgeon
    
					                                        
    
					                                    
    • 
					                                    ............
					                                

					                                
Offline

					                                
    
					                                    
  • 
					                                        
    
					                                            4
					                                        
     ...
					                                        
					                                        
    
					                                            
    Jennifer Maklen
    
					                                            
    Nurse
    
					                                            
    Last seen 01:20 AM
    
					                                        
    
					                                    
    • 
					                                    ........Offline contact.........
					                                

					                            

				                            

				                            

				                                

				                                    

				                                        
				                                            Back
				                                        
				                                    

				                                    

				                                        

				                                            
				                                            

				                                                 Kiran Patel 9:10
				                                                 could you send me menu icons ? 
				                                            

				                                        

															..........chat conversation........
				                                    

				                                    

				                                        

				                                            
				                                            

				                                                
				                                            

				                                        

				                                    

				                                

				                            

				                        

				                         
				 						 
				 						

				                            

				                                
Layout Settings

					                            

													

									                    

									                        
Sidebar Position

									                        

									                           
									                        

									                    

															........layout setting list.........										
									                

													
Account Settings

													

									                    

									                        
Notifications

									                        

									                            

									                                
									                            

									                        

									                    

									                    ........account setting toggle.........
									                

				                                    
General Settings

				                                    

									                    

									                        
Location

									                        

									                            

									                                
									                            

									                        

									                    

									                    ........general setting toggle.........

Header

Header section structure are as follows. Which contains toggle button, Language sections, and notifications.

							 
					        

					            

					                
					                
					                
									
    
										
    • 
									

					                 

					                    

					                        
					                        
					                          
					                             
					                           
					                        
					                    

					                

					                
					                
					                    
					                
					               
					                
					                

					                    
    
					                    	
					                        
  • 
					                            
					                            
      
					                                .... language selection menu..........
					                            
    
					                        
    • 
					                        
					                        
					                        
					                        
					                        
					 						
					                        
					 						
					 						
  • 
					                            
					                                
					                                 Kiran 
					                                
					                            
					                            
					                        
    • 
					                        
					                        
  • 
					                             
						                           more_vert
						                        
					                        
    •

Activate parent

To activate Parent Menu have to add class "active".

							
  •  ... 
    •

    Activate parent & sub menu

    To activate Parent Menu with Sub Menu have to add "active" class and "selected" in span.

    							
  • 
								
									
									Email
									
									
								
								
							
    •

    Material Design Template#back to top

    Require Plugins

    For use material design component you just required to add plugins in template. Followings are require plugins for material design template

    							 
							<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/>
							
						    <link rel="stylesheet" href="../assets/plugins/material/material.min.css"/>
						    <link rel="stylesheet" href="../assets/css/material_style.css"/>
						   	
						    <link rel="stylesheet" href="../assets/plugins/material-datetimepicker/bootstrap-material-datetimepicker.css" />
						    
						    
							<script src="../assets/plugins/material/material.min.js"></script/>
						    <script src="../assets/js/pages/material-select/getmdl-select.js" type="text/javascript"></script>
						    <script type="text/javascript" src="../assets/plugins/material-datetimepicker/moment-with-locales.min.js"></script>
							<script type="text/javascript" src="../assets/plugins/material-datetimepicker/bootstrap-material-datetimepicker.js"></script>
							<script type="text/javascript" src="../assets/plugins/material-datetimepicker/datetimepicker.js"></script>

    Layouts#back to top

    You can visible the top header, left side and footer fixed to its position.You can also change this from setting tab of chat panel.

    Boxed Layout

    To enable boxed layout please add class .page-boxed to body tag.

    Sidebar Collapse Layout

    To enable collapsed layout please add class .sidemenu-closed to body tag.

    Dark Theme

    To enable dark layout please add class .dark-theme to body tag.

    Horizontal Layout

    To enable horizontal layout please add class .page-full-width to body tag.

    Hover Sidebar Layout

    To enable hover sidebar layout please add class .sidemenu-hover-submenu in ui tag in sidebar .

    Right Sidebar Layout

    To enable right sidebar layout please add class .sidemenu-container-reversed in body tag.

    Fixed Header

    To enable fixed header please add class navbar-fixed-top in page-header div tag.

    								<body class="navbar-fixed-top">

    Fixed Footer

    To enable fixed footer please add class page-footer-fixed to body tag.

    CSS #back to top

    CSS files are in the css/ folder in asset folder. Smart built on Twitter Bootstrap 4 framework.

    The below code should be included in every pages in the <head> tag

    								
								<link href="../assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
								
								<link rel="stylesheet" href="../assets/plugins/material/material.min.css">
								<link rel="stylesheet" href="../assets/css/material_style.css">
								
								<link href="../assets/css/theme/light/theme_style.css" rel="stylesheet" id="rt_style_components" type="text/css" />
								<link href="../assets/css/theme/light/style.css" rel="stylesheet" type="text/css" />
								<link href="../assets/css/plugins.min.css" rel="stylesheet" type="text/css" />
								<link href="../assets/css/responsive.css" rel="stylesheet" type="text/css" />
								<link href="../assets/css/theme/light/theme-color.css" rel="stylesheet" type="text/css" />

    JavaScript#back to top

    All javascript files are in the js/ folder in assets folder.

    Following js code should be included in every page before the <body> tags.

    								
								<script src="../assets/plugins/jquery/jquery.min.js" ></script>
								<script src="../assets/plugins/popper/popper.js" ></script>
								<script src="../assets/plugins/jquery-blockui/jquery.blockui.min.js" ></script>
								<script src="../assets/plugins/jquery-slimscroll/jquery.slimscroll.js"></script>
								
								<script src="../assets/plugins/bootstrap/js/bootstrap.min.js" ></script>
								<script src="../assets/plugins/bootstrap-switch/js/bootstrap-switch.min.js" ></script>
								
								<script src="../assets/js/app.js" ></script>
								<script src="../assets/js/layout.js" ></script>
								<script src="../assets/js/theme-color.js" ></script>
								
								<script src="../assets/plugins/material/material.min.js"></script>

    New Page #back to top

    To create a new page, you can use blank_page.html And For Material Design page you can use material_blank.html which provides basic page layout which you can extend and modify further.

    Fonts #back to top

    Smart uses Poppins font from google fonts.

    								<https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" rel="stylesheet" type="text/css" />

    Credits #back to top

    Below is the list of all plugins and external resources used to power this template.

    Version History (Changelog) #back to top

    Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme.

    Changelog

    										-----------------------------------------------------------------------------------------
                                        Version 1.5 - October 27th, 2018
                                        -----------------------------------------------------------------------------------------
										-- Add RTL Full Version Template
										-- Add Export Data Table Page
										-- Add Child Row Data Table Page
										-- Minor Bug Solve
										-----------------------------------------------------------------------------------------
                                        Version 1.4 - September 18th, 2018
                                        -----------------------------------------------------------------------------------------
										-- Update bootstrap 4.1.3
										-- Change full layout menu options
										-- Date time picker bug solve
										-- Form elements bug solve
										-- Offline simple line icons
										-----------------------------------------------------------------------------------------
                                        Version 1.3 - June 16th, 2018
                                        -----------------------------------------------------------------------------------------
										 -- Update Bootstrap Version 4.0 to Bootstrap 4.1.1.
										 -- Update Jquery version 3.2.1 to 3.3.1.
										 -- Add Left Menu Scrollbar.
										 -- Data Table Width Bug Solve.
										 -- Full Screen Scroll Bug Solve.
										 -- Add new pages sign_up.html & forgot_password.html and change extra page design.
										-----------------------------------------------------------------------------------------
                                        Version 1.2 - March 24rd, 2018
                                        -----------------------------------------------------------------------------------------
										 -- Update Bootstrap Version 4 Beta to Stable Bootstrap 4.
										 -- Add new page toast notification.
										 -- Add Full Screen Window Button In Header.
										 -- Add Offline Fonts.
										 -- Chat sidebar close on esc key and focus lost.
										 -- Card Refresh Button Bug Solve.
										 -- Calendar Button Changes.
										 -- Material Date Picker Alignment Bug Solve.
										-----------------------------------------------------------------------------------------
                                        Version 1.0 - Jan 23rd, 2018
                                        -----------------------------------------------------------------------------------------
										-- Initial Release