update
This commit is contained in:
39
static/admin/assets/pug/components/bookmark.pug
Normal file
39
static/admin/assets/pug/components/bookmark.pug
Normal file
@@ -0,0 +1,39 @@
|
||||
// Bookmark Start
|
||||
.bookmark.pull-right
|
||||
ul
|
||||
li
|
||||
a(href='#' data-container='body', data-bs-toggle='popover', data-placement='top', title='', data-original-title='Chat')
|
||||
i(data-feather='message-square')
|
||||
li
|
||||
a(href='#' data-container='body', data-bs-toggle='popover', data-placement='top', title='', data-original-title='Icons')
|
||||
i(data-feather='command')
|
||||
li
|
||||
a(href='#' data-container='body', data-bs-toggle='popover', data-placement='top', title='', data-original-title='Learning')
|
||||
i(data-feather='layers')
|
||||
li
|
||||
a(href='#')
|
||||
i.bookmark-search(data-feather='star')
|
||||
//- form.form-inline.search-form
|
||||
//- .form-group.form-control-search
|
||||
//- input(type='text', placeholder='Search..')
|
||||
|
||||
form(action='#', method='get').form-inline.search-form
|
||||
.form-group.form-control-search
|
||||
.Typeahead.Typeahead--twitterUsers
|
||||
.u-posRelative
|
||||
input.demo-input.Typeahead-input.form-control-plaintext.w-100(type='text' placeholder='Search..' name='q' title='')
|
||||
.spinner-border.Typeahead-spinner(role='status')
|
||||
span.sr-only Loading...
|
||||
|
||||
|
||||
.Typeahead-menu
|
||||
script.result-template(type='text/x-handlebars-template').
|
||||
<div class="ProfileCard u-cf">
|
||||
<div class="ProfileCard-avatar"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-airplay m-0"><path d="M5 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-1"></path><polygon points="12 15 17 21 7 21 12 15"></polygon></svg></div>
|
||||
<div class="ProfileCard-details">
|
||||
<div class="ProfileCard-realName">{{name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
script.empty-template(type='text/x-handlebars-template').
|
||||
<div class="EmptyMessage">Your search turned up 0 results. This most likely means the backend is down, yikes!</div>
|
||||
// Bookmark Ends
|
||||
539
static/admin/assets/pug/components/footer-files.pug
Normal file
539
static/admin/assets/pug/components/footer-files.pug
Normal file
@@ -0,0 +1,539 @@
|
||||
|
||||
|
||||
|
||||
// latest jquery
|
||||
script(src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js')
|
||||
// Bootstrap js
|
||||
if popper
|
||||
script(src='../assets/js/bootstrap/popper.min.js')
|
||||
script(src='../assets/js/bootstrap/bootstrap.bundle.min.js')
|
||||
// feather icon js
|
||||
script(src='../assets/js/icons/feather-icon/feather.min.js')
|
||||
script(src='../assets/js/icons/feather-icon/feather-icon.js')
|
||||
// scrollbar js
|
||||
if scrollbar
|
||||
script(src='../assets/js/scrollbar/simplebar.js')
|
||||
script(src='../assets/js/scrollbar/custom.js')
|
||||
|
||||
// Sidebar jquery
|
||||
script(src='../assets/js/config.js')
|
||||
|
||||
// Plugins JS start
|
||||
if sidebar
|
||||
script(src='../assets/js/sidebar-menu.js')
|
||||
if clock
|
||||
script(src='../assets/js/clock.js')
|
||||
|
||||
if ckeditor
|
||||
script(src='../assets/js/editor/ckeditor/ckeditor.js')
|
||||
script(src='../assets/js/editor/ckeditor/adapters/jquery.js')
|
||||
if page_ckeditor
|
||||
script(src='../assets/js/editor/ckeditor/styles.js')
|
||||
script(src='../assets/js/editor/ckeditor/ckeditor.custom.js')
|
||||
if isotope
|
||||
script(src='../assets/js/isotope.pkgd.js')
|
||||
if jquery_ui
|
||||
script(src='../assets/js/jquery.ui.min.js')
|
||||
if bookmark_page
|
||||
script(src='../assets/js/bookmark/jquery.validate.min.js')
|
||||
script(src='../assets/js/bookmark/custom.js')
|
||||
if aos
|
||||
script(src='../assets/js/animation/aos/aos.js')
|
||||
if page_aos
|
||||
script(src='../assets/js/animation/aos/aos-init.js')
|
||||
if tilt
|
||||
script(src='../assets/js/animation/tilt/tilt.jquery.js')
|
||||
if page_tilt
|
||||
script(src='../assets/js/animation/tilt/tilt-custom.js')
|
||||
|
||||
if page_animate
|
||||
script(src='../assets/js/animation/animate-custom.js')
|
||||
|
||||
if button_builder
|
||||
script(src='../assets/js/button-builder/colorpicker.js')
|
||||
script(src='../assets/js/button-builder/clipboard.min.js')
|
||||
script(src='../assets/js/button-builder/generator.js')
|
||||
script(src='../assets/js/button-builder/extend-1.0.js')
|
||||
|
||||
if jkanban
|
||||
script(src='../assets/js/jkanban/jkanban.js')
|
||||
script(src='../assets/js/jkanban/custom.js')
|
||||
|
||||
if dragable_ui
|
||||
//- script(src='../assets/js/jquery.ui.min.js')
|
||||
|
||||
if calendar
|
||||
script(src='../assets/js/calendar/fullcalendar.min.js')
|
||||
script(src='../assets/js/calendar/fullcalendar-custom.js')
|
||||
|
||||
if calendar_basic
|
||||
script(src="../assets/js/calendar/app.js")
|
||||
|
||||
if calendar_init
|
||||
script(src="../assets/js/calendar/inital.js")
|
||||
|
||||
if slick
|
||||
script(src='../assets/js/slick/slick.min.js')
|
||||
script(src='../assets/js/slick/slick.js')
|
||||
if (landing_slider)
|
||||
script(src='../assets/js/landing-slick.js')
|
||||
if (header_slider)
|
||||
script(src='../assets/js/header-slick.js')
|
||||
|
||||
if chartjs
|
||||
script(src='../assets/js/chart/chartjs/chart.min.js')
|
||||
|
||||
if chartist
|
||||
script(src='../assets/js/chart/chartist/chartist.js')
|
||||
script(src='../assets/js/chart/chartist/chartist-plugin-tooltip.js')
|
||||
|
||||
if page_chartist
|
||||
script(src='../assets/js/chart/chartist/chartist-custom.js')
|
||||
if morrischart
|
||||
script(src='../assets/js/chart/morris-chart/raphael.js')
|
||||
script(src='../assets/js/chart/morris-chart/morris.js')
|
||||
script(src='../assets/js/chart/morris-chart/prettify.min.js')
|
||||
if page_chartjs
|
||||
script(src='../assets/js/chart/chartjs/chart.custom.js')
|
||||
if flotchart
|
||||
script(src='../assets/js/chart/flot-chart/excanvas.js')
|
||||
script(src='../assets/js/chart/flot-chart/jquery.flot.js')
|
||||
script(src='../assets/js/chart/flot-chart/jquery.flot.time.js')
|
||||
script(src='../assets/js/chart/flot-chart/jquery.flot.categories.js')
|
||||
script(src='../assets/js/chart/flot-chart/jquery.flot.stack.js')
|
||||
script(src='../assets/js/chart/flot-chart/jquery.flot.pie.js')
|
||||
script(src='../assets/js/chart/flot-chart/jquery.flot.symbol.js')
|
||||
if page_flotchart
|
||||
script(src='../assets/js/chart/flot-chart/flot-script.js')
|
||||
if googlechart
|
||||
script(src='../assets/js/chart/google/google-chart-loader.js')
|
||||
if page_googlechart
|
||||
script(src='../assets/js/chart/google/google-chart.js')
|
||||
if knobchart
|
||||
script(src='../assets/js/chart/knob/knob.min.js')
|
||||
if page_knobchart
|
||||
script(src='../assets/js/chart/knob/knob-chart.js')
|
||||
if page_morrischart
|
||||
script(src='../assets/js/chart/morris-chart/morris-script.js')
|
||||
|
||||
if peitychart
|
||||
script(src='../assets/js/chart/peity-chart/peity.jquery.js')
|
||||
if page_peitychart
|
||||
script(src='../assets/js/chart/peity-chart/peity-custom.js')
|
||||
if sparkline
|
||||
script(src='../assets/js/chart/sparkline/sparkline.js')
|
||||
if page_sparkline
|
||||
script(src='../assets/js/chart/sparkline/sparkline-script.js')
|
||||
if apex_widget
|
||||
script(src='../assets/js/chart/apex-chart/moment.min.js')
|
||||
if apex
|
||||
script(src='../assets/js/chart/apex-chart/apex-chart.js')
|
||||
script(src='../assets/js/chart/apex-chart/stock-prices.js')
|
||||
if apexmoment
|
||||
script(src='../assets/js/chart/apex-chart/moment.min.js')
|
||||
if page_apex
|
||||
script(src='../assets/js/chart/apex-chart/chart-custom.js')
|
||||
if echart
|
||||
script(src='../assets/js/chart/echart/esl.js')
|
||||
script(src='../assets/js/chart/echart/config.js')
|
||||
if echart_pie
|
||||
script(src='../assets/js/chart/echart/pie-chart/facePrint.js')
|
||||
script(src='../assets/js/chart/echart/pie-chart/testHelper.js')
|
||||
script(src='../assets/js/chart/echart/pie-chart/custom-transition-texture.js')
|
||||
script(src='../assets/js/chart/echart/data/symbols.js')
|
||||
if page_echart
|
||||
script(src='../assets/js/chart/echart/custom.js')
|
||||
if todo
|
||||
script(src='../assets/js/todo/todo.js')
|
||||
if prism
|
||||
script(src='../assets/js/prism/prism.min.js')
|
||||
if clipboard
|
||||
script(src='../assets/js/clipboard/clipboard.min.js')
|
||||
if page_clipboard
|
||||
script(src='../assets/js/clipboard/clipboard-script.js')
|
||||
if counter
|
||||
script(src='../assets/js/counter/jquery.waypoints.min.js')
|
||||
script(src='../assets/js/counter/jquery.counterup.min.js')
|
||||
script(src='../assets/js/counter/counter-custom.js')
|
||||
if customcard
|
||||
script(src='../assets/js/custom-card/custom-card.js')
|
||||
if notify
|
||||
script(src='../assets/js/notify/bootstrap-notify.min.js')
|
||||
if icon_notify
|
||||
script(src='../assets/js/icons/icons-notify.js')
|
||||
if vector_map
|
||||
script(src='../assets/js/vector-map/jquery-jvectormap-2.0.2.min.js')
|
||||
script(src='../assets/js/vector-map/map/jquery-jvectormap-world-mill-en.js')
|
||||
script(src='../assets/js/vector-map/map/jquery-jvectormap-us-aea-en.js')
|
||||
script(src='../assets/js/vector-map/map/jquery-jvectormap-uk-mill-en.js')
|
||||
script(src='../assets/js/vector-map/map/jquery-jvectormap-au-mill.js')
|
||||
script(src='../assets/js/vector-map/map/jquery-jvectormap-chicago-mill-en.js')
|
||||
script(src='../assets/js/vector-map/map/jquery-jvectormap-in-mill.js')
|
||||
script(src='../assets/js/vector-map/map/jquery-jvectormap-asia-mill.js')
|
||||
if dashboard_default
|
||||
script(src='../assets/js/dashboard/default.js')
|
||||
script(src='../assets/js/notify/index.js')
|
||||
if datatable
|
||||
script(src='../assets/js/datatable/datatables/jquery.dataTables.min.js')
|
||||
if page_datatable
|
||||
script(src='../assets/js/datatable/datatables/datatable.custom.js')
|
||||
if datatable_extension
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.buttons.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/jszip.min.js')
|
||||
script(src="../assets/js/datatable/datatable-extension/buttons.colVis.min.js")
|
||||
script(src='../assets/js/datatable/datatable-extension/pdfmake.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/vfs_fonts.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.autoFill.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.select.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/buttons.bootstrap4.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/buttons.html5.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/buttons.print.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.bootstrap4.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.responsive.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/responsive.bootstrap4.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.keyTable.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.colReorder.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.fixedHeader.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.rowReorder.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/dataTables.scroller.min.js')
|
||||
script(src='../assets/js/datatable/datatable-extension/custom.js')
|
||||
if date_picker
|
||||
script(src='../assets/js/datepicker/date-picker/datepicker.js')
|
||||
script(src='../assets/js/datepicker/date-picker/datepicker.en.js')
|
||||
script(src='../assets/js/datepicker/date-picker/datepicker.custom.js')
|
||||
if date_rangepicker
|
||||
script(src='../assets/js/datepicker/daterange-picker/moment.min.js')
|
||||
script(src='../assets/js/datepicker/daterange-picker/daterangepicker.js')
|
||||
script(src='../assets/js/datepicker/daterange-picker/daterange-picker.custom.js')
|
||||
if date_time_picker
|
||||
script(src='../assets/js/datepicker/date-time-picker/moment.min.js')
|
||||
script(src='../assets/js/datepicker/date-time-picker/tempusdominus-bootstrap-4.min.js')
|
||||
script(src='../assets/js/datepicker/date-time-picker/datetimepicker.custom.js')
|
||||
if dragable
|
||||
script(src='../assets/js/dragable/sortable.js')
|
||||
script(src='../assets/js/dragable/sortable-custom.js')
|
||||
if ace_editor
|
||||
script(src='../assets/js/editor/ace-editor/ace.js')
|
||||
script(src='../assets/js/editor/ace-editor/ace-custom.js')
|
||||
script(src='../assets/js/editor/ace-editor/mode-css.js')
|
||||
script(src='../assets/js/editor/ace-editor/mode-html.js')
|
||||
script(src='../assets/js/editor/ace-editor/mode-javascript.js')
|
||||
script(src='../assets/js/editor/ace-editor/mode-php.js')
|
||||
script(src='../assets/js/editor/ace-editor/theme-monokai.js')
|
||||
script(src='../assets/js/editor/ace-editor/worker-css.js')
|
||||
script(src='../assets/js/editor/ace-editor/worker-html.js')
|
||||
script(src='../assets/js/editor/ace-editor/worker-javascript.js')
|
||||
script(src='../assets/js/editor/ace-editor/worker-php.js')
|
||||
if dropzone
|
||||
script(src='../assets/js/dropzone/dropzone.js')
|
||||
script(src='../assets/js/dropzone/dropzone-script.js')
|
||||
if simple_mde
|
||||
script(src='../assets/js/editor/simple-mde/simplemde.min.js')
|
||||
script(src='../assets/js/editor/simple-mde/simplemde.custom.js')
|
||||
if summernote
|
||||
script(src='../assets/js/editor/summernote/summernote.js')
|
||||
script(src='../assets/js/editor/summernote/summernote.custom.js')
|
||||
|
||||
if form_builder_2
|
||||
script(src='../assets/js/form-builder/form-builder-2/beautifyhtml.js')
|
||||
script(src='../assets/js/form-builder/form-builder-2/form-builder-2.js')
|
||||
if form_wizard
|
||||
script(src='../assets/js/form-wizard/form-wizard.js')
|
||||
if form_wizard_two
|
||||
script(src='../assets/js/form-wizard/form-wizard-two.js')
|
||||
if form_wizard_three
|
||||
script(src='../assets/js/form-wizard/form-wizard-three.js')
|
||||
script(src='../assets/js/form-wizard/jquery.backstretch.min.js')
|
||||
if form_wizard_four
|
||||
script(src='../assets/js/form-wizard/form-wizard-five.js')
|
||||
if page_feather_icon
|
||||
script(src='../assets/js/icons/feather-icon/feather-icon-clipart.js')
|
||||
if page_flag_icon
|
||||
script(src='../assets/js/icons/flag-icon-clipart.js')
|
||||
if page_icon
|
||||
script(src='../assets/js/icons/icon-clipart.js')
|
||||
if page_whether_icon
|
||||
script(src='../assets/js/icons/whether-icon-clipart.js')
|
||||
if image_cropper
|
||||
script(src='../assets/js/image-cropper/cropper.js')
|
||||
script(src='../assets/js/image-cropper/cropper-main.js')
|
||||
if jsgrid
|
||||
script(src='../assets/js/jsgrid/jsgrid.min.js')
|
||||
script(src='../assets/js/jsgrid/griddata.js')
|
||||
script(src='../assets/js/jsgrid/jsgrid.js')
|
||||
if page_notify
|
||||
script(src='../assets/js/notify/notify-script.js')
|
||||
if page_builder
|
||||
script(src='../assets/js/page-builder/jquery.grideditor.min.js')
|
||||
script(src='../assets/js/page-builder/page-builder-custom.js')
|
||||
if photo_swipe
|
||||
script(src='../assets/js/photoswipe/photoswipe.min.js')
|
||||
script(src='../assets/js/photoswipe/photoswipe-ui-default.min.js')
|
||||
script(src='../assets/js/photoswipe/photoswipe.js')
|
||||
if scrollreveal
|
||||
script(src='../assets/js/animation/scroll-reveal/scrollreveal.min.js')
|
||||
script(src='../assets/js/modernizr.js')
|
||||
if pages_crollreveal
|
||||
script(src='../assets/js/animation/scroll-reveal/reveal-custom.js')
|
||||
|
||||
if range_slider
|
||||
script(src='../assets/js/range-slider/ion.rangeSlider.min.js')
|
||||
if page_range_slider
|
||||
script(src='../assets/js/range-slider/rangeslider-script.js')
|
||||
if rating
|
||||
script(src='../assets/js/rating/jquery.barrating.js')
|
||||
script(src='../assets/js/rating/rating-script.js')
|
||||
if scrollable
|
||||
script(src='../assets/js/scrollable/perfect-scrollbar.min.js')
|
||||
script(src='../assets/js/scrollable/scrollable-custom.js')
|
||||
if sticky
|
||||
script(src='../assets/js/sticky/sticky.js')
|
||||
if sweetalert2
|
||||
script(src='../assets/js/sweet-alert/sweetalert.min.js')
|
||||
if page_sweetalert2
|
||||
script(src='../assets/js/sweet-alert/app.js')
|
||||
if timeline_1
|
||||
script(src='../assets/js/timeline/timeline-v-1/main.js')
|
||||
if timeline_2
|
||||
script(src='../assets/js/timeline/timeline-v-2/jquery.timeliny.min.js')
|
||||
script(src='../assets/js/timeline/timeline-v-2/timeline-v-2-custom.js')
|
||||
if time_picker
|
||||
script(src='../assets/js/time-picker/jquery-clockpicker.min.js')
|
||||
script(src='../assets/js/time-picker/highlight.min.js')
|
||||
script(src='../assets/js/time-picker/clockpicker.js')
|
||||
if touchspin
|
||||
script(src='../assets/js/touchspin/vendors.min.js')
|
||||
script(src='../assets/js/touchspin/touchspin.js')
|
||||
script(src='../assets/js/touchspin/input-groups.min.js')
|
||||
if owlcarousel
|
||||
script(src='../assets/js/owlcarousel/owl.carousel.js')
|
||||
if page_owlcarousel
|
||||
script(src='../assets/js/owlcarousel/owl-custom.js')
|
||||
if select2
|
||||
script(src='../assets/js/select2/select2.full.min.js')
|
||||
if page_select2
|
||||
script(src='../assets/js/select2/select2-custom.js')
|
||||
if tour
|
||||
script(src='../assets/js/tour/intro.js')
|
||||
script(src='../assets/js/tour/intro-init.js')
|
||||
if tree
|
||||
script(src='../assets/js/tree/jstree.min.js')
|
||||
script(src='../assets/js/tree/tree.js')
|
||||
if typeahead
|
||||
script(src='../assets/js/typeahead/handlebars.js')
|
||||
script(src='../assets/js/typeahead/typeahead.bundle.js')
|
||||
script(src='../assets/js/typeahead/typeahead.custom.js')
|
||||
if typeahead_search
|
||||
script(src='../assets/js/typeahead-search/handlebars.js')
|
||||
script(src='../assets/js/typeahead-search/typeahead-custom.js')
|
||||
if page_vector_map
|
||||
script(src='../assets/js/vector-map/map-vector.js')
|
||||
if chart_widget
|
||||
script(src='../assets/js/chart-widget.js')
|
||||
if comapct_menu
|
||||
script(src='../assets/js/comapct-menu.js')
|
||||
if compact_small_button
|
||||
script(src='../assets/js/compact-small-button.js')
|
||||
if countdown
|
||||
script(src='../assets/js/countdown.js')
|
||||
if dashboard_2
|
||||
script(src='../assets/js/dashboard/dashboard_2.js')
|
||||
if dashboard_3
|
||||
script(src='../assets/js/dashboard/dashboard_3.js')
|
||||
if dashboard_4
|
||||
script(src='../assets/js/dashboard/dashboard_4.js')
|
||||
if dashboard_5
|
||||
script(src='../assets/js/dashboard/dashboard_5.js')
|
||||
if ecommerce
|
||||
script(src='../assets/js/ecommerce.js')
|
||||
if email_app
|
||||
script(src='../assets/js/email-app.js')
|
||||
if form_validation_custom
|
||||
script(src='../assets/js/form-validation-custom.js')
|
||||
if contact_page
|
||||
script(src='../assets/js/bookmark/jquery.validate.min.js')
|
||||
script(src='../assets/js/contacts/custom.js')
|
||||
if task_page
|
||||
script(src='../assets/js/task/custom.js')
|
||||
if general_widget
|
||||
script(src='../assets/js/general-widget.js')
|
||||
if height_equal
|
||||
script(src='../assets/js/height-equal.js')
|
||||
if hide_on_scroll
|
||||
script(src='../assets/js/hide-on-scroll.js')
|
||||
if page_masonry
|
||||
script(src='../assets/js/masonry-gallery.js')
|
||||
if modal_animated
|
||||
script(src='../assets/js/modal-animated.js')
|
||||
if modernizr
|
||||
script(src='../assets/js/modernizr.js')
|
||||
if popover_custom
|
||||
script(src='../assets/js/popover-custom.js')
|
||||
if print
|
||||
script(src='../assets/js/print.js')
|
||||
if product_list
|
||||
script(src='../assets/js/product-list-custom.js')
|
||||
if radial_chart_tooltip
|
||||
script(src='../assets/js/radial-chart-tooltip.js')
|
||||
if support_ticket_custom
|
||||
script(src='../assets/js/support-ticket-custom.js')
|
||||
if tooltip
|
||||
script(src='../assets/js/tooltip-init.js')
|
||||
if wow
|
||||
script(src='../assets/js/animation/wow/wow.min.js')
|
||||
if page_wow
|
||||
script(src='../assets/js/animation/wow/wow-init.js')
|
||||
if internationalization
|
||||
script(src='../assets/js/internationalization/language-picker.js')
|
||||
if map_js
|
||||
script(src='../assets/js/map-js/mapsjs-core.js')
|
||||
script(src='../assets/js/map-js/mapsjs-service.js')
|
||||
script(src='../assets/js/map-js/mapsjs-ui.js')
|
||||
script(src='../assets/js/map-js/mapsjs-mapevents.js')
|
||||
script(src='../assets/js/map-js/custom.js')
|
||||
if product_tab
|
||||
script(src='../assets/js/product-tab.js')
|
||||
if login
|
||||
script(src='../assets/js/login.js')
|
||||
if landing_sticky
|
||||
script(src='../assets/js/landing_sticky.js')
|
||||
script(src='../assets/js/landing.js')
|
||||
if jarallax_libs
|
||||
script(src='../assets/js/jarallax_libs/libs.min.js')
|
||||
if scrollpy_landing
|
||||
script(src='../assets/js/scrollpy_landing.js')
|
||||
if psanimated
|
||||
script(src='../assets/js/psanimated/psanimated.min.js')
|
||||
script(src='../assets/js/psanimated/bodymovin.min.js')
|
||||
if alert
|
||||
script(src='../assets/js/alert.js')
|
||||
|
||||
if validation_modal
|
||||
script(src='../assets/js/modalpage/validation-modal.js')
|
||||
// Plugins JS Ends
|
||||
|
||||
// Theme js
|
||||
script(src='../assets/js/script.js')
|
||||
if theme_customizer
|
||||
script(src='../assets/js/theme-customizer/customizer.js')
|
||||
|
||||
if form_builder_1
|
||||
script(src='../assets/js/form-builder/form-builder-1/require.js')
|
||||
script(src='../assets/js/form-builder/form-builder-1/main-built.js')
|
||||
|
||||
|
||||
|
||||
|
||||
// Plugin used
|
||||
- var sidebar = true
|
||||
- var animate = false
|
||||
- var aos = false
|
||||
- var button_builder = false
|
||||
- var calendar = false
|
||||
- var chartist = false
|
||||
- var datatable_extension = false
|
||||
- var datatable = false
|
||||
- var date_picker = false
|
||||
- var date_rangepicker = false
|
||||
- var dropzone = false
|
||||
- var google_calendar = false
|
||||
- var image_cropper = false
|
||||
- var jsgrid = false
|
||||
- var locales_calendar = false
|
||||
- var owlcarousel = false
|
||||
- var page_builder = false
|
||||
- var photo_swipe = false
|
||||
- var print = false
|
||||
- var prism = false
|
||||
- var range_slider = false
|
||||
- var rating = false
|
||||
- var scrollable = false
|
||||
- var select2 = false
|
||||
- var simple_mde = false
|
||||
- var sticky = false
|
||||
- var summernote = false
|
||||
- var svg_icon = false
|
||||
- var sweetalert2 = false
|
||||
- var time_picker = false
|
||||
- var todo = false
|
||||
- var tour = false
|
||||
- var tree = false
|
||||
- var vector_map = false
|
||||
- var vertical_menu = false
|
||||
- var whether_icon = false
|
||||
- var page_aos = false
|
||||
- var scrollreveal = false
|
||||
- var page_scrollreveal = false
|
||||
- var tilt = false
|
||||
- var page_tilt = false
|
||||
- var wow = false
|
||||
- var page_wow = false
|
||||
- var page_animate = false
|
||||
- var page_chartist = false
|
||||
- var chartjs = false
|
||||
- var page_chartjs = false
|
||||
- var flotchart = false
|
||||
- var page_flotchart = false
|
||||
- var googlechart = false
|
||||
- var page_googlechart = false
|
||||
- var knobchart = false
|
||||
- var page_knobchart = false
|
||||
- var morrischart = false
|
||||
- var page_morrischart = false
|
||||
- var peitychart = false
|
||||
- var page_peitychart = false
|
||||
- var sparkline = false
|
||||
- var page_sparkline = false
|
||||
- var apex = false
|
||||
- var page_apex = false
|
||||
- var clipboard = false
|
||||
- var counter = false
|
||||
- var customcard = false
|
||||
- var dashboard_default = false
|
||||
- var date_time_picker = false
|
||||
- var dragable = false
|
||||
- var ace_editor = false
|
||||
- var form_builder_1 = false
|
||||
- var form_builder_2 = false
|
||||
- var form_wizard = false
|
||||
- var form_wizard_two = false
|
||||
- var form_wizard_three = false
|
||||
- var form_wizard_four = false
|
||||
- var page_feather_icon = false
|
||||
- var page_flag_icon = false
|
||||
- var page_icon = false
|
||||
- var page_whether_icon = false
|
||||
- var notify = false
|
||||
- var page_range_slider = false
|
||||
- var page_select2 = false
|
||||
- var page_sweetalert2 = false
|
||||
- var timeline_1 = false
|
||||
- var timeline_2 = false
|
||||
- var touchspin = false
|
||||
- var touchspin = false
|
||||
- var button_tooltip_custom = false
|
||||
- var chart_widget = false
|
||||
- var chat_menu = false
|
||||
- var comapct_menu = false
|
||||
- var compact_small_button = false
|
||||
- var countdown = false
|
||||
- var ecommerce = false
|
||||
- var email_app = false
|
||||
- var form_validation_custom= false
|
||||
- var fullscreen = false
|
||||
- var general_widget = false
|
||||
- var height_equal = false
|
||||
- var hide_on_scroll = false
|
||||
- var isotope = false
|
||||
- var jquery_ui = false
|
||||
- var page_masonry = false
|
||||
- var modal_animated = false
|
||||
- var modernizr = false
|
||||
- var popover_custom = false
|
||||
- var product_list = false
|
||||
- var radial_chart_tooltip = false
|
||||
- var support_ticket_custom = false
|
||||
- var tooltip = false
|
||||
- var rrule_calendar = false
|
||||
- var alert = false
|
||||
- var validation_modal = false
|
||||
23
static/admin/assets/pug/components/footer.pug
Normal file
23
static/admin/assets/pug/components/footer.pug
Normal file
@@ -0,0 +1,23 @@
|
||||
// footer start
|
||||
if footer_dark
|
||||
footer.footer.footer-dark
|
||||
.container-fluid
|
||||
.row
|
||||
.col-md-12.footer-copyright.text-center
|
||||
p.mb-0 Copyright 2022 © Cuba theme by pixelstrap
|
||||
|
||||
|
||||
else if footer_fix
|
||||
footer.footer.footer-fix
|
||||
.container-fluid
|
||||
.row
|
||||
.col-md-12.footer-copyright.text-center
|
||||
p.mb-0 Copyright 2022 © Cuba theme by pixelstrap
|
||||
|
||||
else
|
||||
footer.footer
|
||||
.container-fluid
|
||||
.row
|
||||
.col-md-12.footer-copyright.text-center
|
||||
p.mb-0 Copyright 2022 © Cuba theme by pixelstrap
|
||||
|
||||
121
static/admin/assets/pug/components/header-files.pug
Normal file
121
static/admin/assets/pug/components/header-files.pug
Normal file
@@ -0,0 +1,121 @@
|
||||
|
||||
head
|
||||
meta(http-equiv='Content-Type', content='text/html; charset=UTF-8')
|
||||
meta(http-equiv='X-UA-Compatible', content='IE=edge')
|
||||
meta(name='viewport', content='width=device-width, initial-scale=1.0')
|
||||
link(rel='icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
link(rel='shortcut icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
title Cuba - Premium Admin Template
|
||||
// Google font
|
||||
link(href='https://fonts.googleapis.com/css?family=Rubik:400,400i,500,500i,700,700i&display=swap', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900&display=swap', rel='stylesheet' )
|
||||
if landing_font
|
||||
link(rel='preconnect' href='https://fonts.googleapis.com')
|
||||
link(rel='preconnect' href='https://fonts.gstatic.com' crossorigin='')
|
||||
link(href='https://fonts.googleapis.com/css2?family=Caveat:wght@700&display=swap' rel='stylesheet')
|
||||
|
||||
|
||||
//- // Font Awesome
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/font-awesome.css')
|
||||
// ico-font
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/icofont.css')
|
||||
// Themify icon
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/themify.css')
|
||||
// Flag icon
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/flag-icon.css')
|
||||
// Feather icon
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/feather-icon.css')
|
||||
|
||||
// Plugins css start
|
||||
if landing_icon
|
||||
link(rel="icon" href="../assets/svg/landing-icons.svg")
|
||||
if slick
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/slick.css')
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/slick-theme.css')
|
||||
if ui_jquery
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/jquery-ui.css')
|
||||
if scrollbar
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/scrollbar.css')
|
||||
if jsgrid
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/jsgrid.css')
|
||||
if animate
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/animate.css')
|
||||
if aos
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/aos.css')
|
||||
if button_builder
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/button-builder.css')
|
||||
if calendar
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/calendar.css')
|
||||
if jkanban
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/jkanban.css')
|
||||
if echart
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/echart.css')
|
||||
if chartist
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/chartist.css')
|
||||
if datatable
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/datatables.css')
|
||||
if date_time_picker
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/date-time-picker.css')
|
||||
if datatable_extension
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/datatable-extension.css')
|
||||
if select2
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/select2.css')
|
||||
if date_picker
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/date-picker.css')
|
||||
if date_rangepicker
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/daterange-picker.css')
|
||||
if dropzone
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/dropzone.css')
|
||||
if image_cropper
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/image-cropper.css')
|
||||
if owlcarousel
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/owlcarousel.css')
|
||||
if page_builder
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/page-builder.css')
|
||||
if photo_swipe
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/photoswipe.css')
|
||||
if prism
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/prism.css')
|
||||
if range_slider
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/range-slider.css')
|
||||
if rating
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/rating.css')
|
||||
if scrollable
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/scrollable.css')
|
||||
if simple_mde
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/simple-mde.css')
|
||||
if sticky
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/sticky.css')
|
||||
if summernote
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/summernote.css')
|
||||
if svg_icon
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/svg-icon.css')
|
||||
if sweetalert2
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/sweetalert2.css')
|
||||
if time_picker
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/timepicker.css')
|
||||
if todo
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/todo.css')
|
||||
if tour
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/tour.css')
|
||||
if tree
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/tree.css')
|
||||
if vector_map
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/vector-map.css')
|
||||
if whether_icon
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/whether-icon.css')
|
||||
if map_js
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/mapsjs-ui.css')
|
||||
if documents
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/document.css')
|
||||
// Plugins css Ends
|
||||
|
||||
// Bootstrap css
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/bootstrap.css')
|
||||
|
||||
// App css
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/style.css')
|
||||
link#color(rel='stylesheet', href='../assets/css/color-1.css', media='screen')
|
||||
|
||||
// Responsive css
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/responsive.css')
|
||||
239
static/admin/assets/pug/components/header.pug
Normal file
239
static/admin/assets/pug/components/header.pug
Normal file
@@ -0,0 +1,239 @@
|
||||
// Page Header Start
|
||||
.page-header
|
||||
.header-wrapper.row.m-0
|
||||
form(action='#', method='get').form-inline.search-full.col
|
||||
.form-group.w-100
|
||||
.Typeahead.Typeahead--twitterUsers
|
||||
.u-posRelative
|
||||
input.demo-input.Typeahead-input.form-control-plaintext.w-100(type='text' placeholder='Search Cuba ..' name='q' title='' autofocus)
|
||||
.spinner-border.Typeahead-spinner(role='status')
|
||||
span.sr-only Loading...
|
||||
i(data-feather='x').close-search
|
||||
.Typeahead-menu
|
||||
.header-logo-wrapper.col-auto.p-0
|
||||
.logo-wrapper
|
||||
a(href='index.html')
|
||||
img.img-fluid(src='../assets/images/logo/logo.png', alt='')
|
||||
.toggle-sidebar
|
||||
i.status_toggle.middle(data-feather='align-center').sidebar-toggle
|
||||
|
||||
.left-header.col-xxl-5.col-xl-6.col-lg-5.col-md-4.col-sm-3.p-0
|
||||
.notification-slider
|
||||
div.d-flex.h-100
|
||||
img(src="../assets/images/giftools.gif" alt="gif")
|
||||
h6.mb-0.f-w-400
|
||||
span.font-primary Don't Miss Out!
|
||||
span.f-light Out new update has been release.
|
||||
i.icon-arrow-top-right.f-light
|
||||
div.d-flex.h-100
|
||||
img(src="../assets/images/giftools.gif" alt="gif")
|
||||
h6.mb-0.f-w-400
|
||||
span.f-light Something you love is now on sale!
|
||||
a.ms-1(href="https://1.envato.market/3GVzd" target="_blank") Buy now !
|
||||
|
||||
|
||||
.nav-right.col-xxl-7.col-xl-6.col-md-7.col-8.pull-right.right-header.p-0.ms-auto
|
||||
ul.nav-menus
|
||||
li.language-nav
|
||||
.translate_wrapper
|
||||
.current_lang
|
||||
.lang
|
||||
i.flag-icon.flag-icon-us
|
||||
span.lang-txt EN
|
||||
.more_lang
|
||||
.lang.selected(data-value='en')
|
||||
i.flag-icon.flag-icon-us
|
||||
span.lang-txt
|
||||
| English
|
||||
span (US)
|
||||
.lang(data-value='de')
|
||||
i.flag-icon.flag-icon-de
|
||||
span.lang-txt Deutsch
|
||||
.lang(data-value='es')
|
||||
i.flag-icon.flag-icon-es
|
||||
span.lang-txt Español
|
||||
.lang(data-value='fr')
|
||||
i.flag-icon.flag-icon-fr
|
||||
span.lang-txt Français
|
||||
.lang(data-value='pt')
|
||||
i.flag-icon.flag-icon-pt
|
||||
span.lang-txt
|
||||
| Português
|
||||
span (BR)
|
||||
.lang(data-value='cn')
|
||||
i.flag-icon.flag-icon-cn
|
||||
span.lang-txt 简体中文
|
||||
.lang(data-value='ae')
|
||||
i.flag-icon.flag-icon-ae
|
||||
span.lang-txt
|
||||
| لعربية
|
||||
span (ae)
|
||||
li
|
||||
span.header-search
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#search')
|
||||
|
||||
li.onhover-dropdown
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#star')
|
||||
.onhover-show-div.bookmark-flip
|
||||
.flip-card
|
||||
.flip-card-inner
|
||||
.front
|
||||
h6.f-18.mb-0.dropdown-title Bookmark
|
||||
ul.bookmark-dropdown
|
||||
li
|
||||
.row
|
||||
.col-4.text-center
|
||||
.bookmark-content
|
||||
.bookmark-icon
|
||||
i(data-feather='file-text')
|
||||
span Forms
|
||||
.col-4.text-center
|
||||
.bookmark-content
|
||||
.bookmark-icon
|
||||
i(data-feather='user')
|
||||
span Profile
|
||||
.col-4.text-center
|
||||
.bookmark-content
|
||||
.bookmark-icon
|
||||
i(data-feather='server')
|
||||
span Tables
|
||||
li.text-center
|
||||
a.flip-btn#flip-btn.f-w-700(href="javascript:void(0)") Add New Bookmark
|
||||
.back
|
||||
ul
|
||||
li
|
||||
.bookmark-dropdown.flip-back-content
|
||||
input(type='text' placeholder='search...')
|
||||
li
|
||||
a.f-w-700.d-block.flip-back#flip-back(href="javascript:void(0)")
|
||||
| Back
|
||||
|
||||
li
|
||||
.mode
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#moon')
|
||||
li.cart-nav.onhover-dropdown
|
||||
.cart-box
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-ecommerce')
|
||||
span.badge.rounded-pill.badge-success 2
|
||||
.cart-dropdown.onhover-show-div
|
||||
h6.f-18.mb-0.dropdown-title Cart
|
||||
ul
|
||||
li
|
||||
.media
|
||||
img.img-fluid.b-r-5.me-3.img-60(src='../assets/images/other-images/cart-img.jpg', alt='')
|
||||
.media-body
|
||||
span Furniture Chair for Home
|
||||
.qty-box
|
||||
.input-group
|
||||
span.input-group-prepend
|
||||
button.btn.quantity-left-minus(type='button' data-type='minus' data-field='')
|
||||
| -
|
||||
input.form-control.input-number(type='text' name='quantity' value='1')
|
||||
span.input-group-prepend
|
||||
button.btn.quantity-right-plus(type='button' data-type='plus' data-field='')
|
||||
| +
|
||||
|
||||
h6.font-primary $500
|
||||
.close-circle
|
||||
a.bg-danger(href='#')
|
||||
i(data-feather='x')
|
||||
li
|
||||
.media
|
||||
img.img-fluid.b-r-5.me-3.img-60(src='../assets/images/other-images/cart-img.jpg', alt='')
|
||||
.media-body
|
||||
span Furniture Chair for Home
|
||||
.qty-box
|
||||
.input-group
|
||||
span.input-group-prepend
|
||||
button.btn.quantity-left-minus(type='button' data-type='minus' data-field='')
|
||||
| -
|
||||
input.form-control.input-number(type='text' name='quantity' value='1')
|
||||
span.input-group-prepend
|
||||
button.btn.quantity-right-plus(type='button' data-type='plus' data-field='')
|
||||
| +
|
||||
|
||||
h6.font-primary $500.00
|
||||
.close-circle
|
||||
a.bg-danger(href='#')
|
||||
i(data-feather='x')
|
||||
|
||||
li.total
|
||||
h6.mb-0
|
||||
| Order Total :
|
||||
span.f-right $1000.00
|
||||
li.text-center
|
||||
a.d-block.mb-3.view-cart.f-w-700(href='cart.html')
|
||||
| Go to your cart
|
||||
a.btn.btn-primary.view-checkout(href='checkout.html')
|
||||
| Checkout
|
||||
li.onhover-dropdown
|
||||
.notification-box
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#notification')
|
||||
span.badge.rounded-pill.badge-secondary 4
|
||||
.onhover-show-div.notification-dropdown
|
||||
h6.f-18.mb-0.dropdown-title Notitications
|
||||
ul
|
||||
li.b-l-primary.border-4
|
||||
p
|
||||
| Delivery processing
|
||||
span.font-danger 10 min.
|
||||
li.b-l-success.border-4
|
||||
p
|
||||
| Order Complete
|
||||
span.font-success 1 hr
|
||||
li.b-l-secondary.border-4
|
||||
p
|
||||
| Tickets Generated
|
||||
span.font-secondary 3 hr
|
||||
li.b-l-warning.border-4
|
||||
p
|
||||
| Delivery Complete
|
||||
span.font-warning 6 hr
|
||||
li
|
||||
a.f-w-700(href="#") Check all
|
||||
li.profile-nav.onhover-dropdown.pe-0.py-0
|
||||
.media.profile-media
|
||||
img.b-r-10(src='../assets/images/dashboard/profile.png', alt='')
|
||||
.media-body
|
||||
span Emay Walter
|
||||
p.mb-0.font-roboto Admin
|
||||
i.middle.fa.fa-angle-down
|
||||
ul.profile-dropdown.onhover-show-div
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='user')
|
||||
span Account
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='mail')
|
||||
span Inbox
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='file-text')
|
||||
span Taskboard
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='settings')
|
||||
span Settings
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='log-in')
|
||||
span Log in
|
||||
|
||||
//- .d-lg-none.mobile-toggle.pull-right
|
||||
//- i(data-feather='more-horizontal')
|
||||
script.result-template(type='text/x-handlebars-template').
|
||||
<div class="ProfileCard u-cf">
|
||||
<div class="ProfileCard-avatar"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-airplay m-0"><path d="M5 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-1"></path><polygon points="12 15 17 21 7 21 12 15"></polygon></svg></div>
|
||||
<div class="ProfileCard-details">
|
||||
<div class="ProfileCard-realName">{{name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
script.empty-template(type='text/x-handlebars-template').
|
||||
<div class="EmptyMessage">Your search turned up 0 results. This most likely means the backend is down, yikes!</div>
|
||||
// Page Header Ends
|
||||
17
static/admin/assets/pug/components/landing-footer-files.pug
Normal file
17
static/admin/assets/pug/components/landing-footer-files.pug
Normal file
@@ -0,0 +1,17 @@
|
||||
// latest jquery
|
||||
script(src='../assets/js/jquery-3.5.1.min.js')
|
||||
// Bootstrap js
|
||||
script(src='../assets/js/bootstrap/bootstrap.bundle.min.js')
|
||||
// feather icon js
|
||||
script(src='../assets/js/icons/feather-icon/feather.min.js')
|
||||
script(src='../assets/js/icons/feather-icon/feather-icon.js')
|
||||
// Plugins JS start
|
||||
script(src='../assets/js/tooltip-init.js')
|
||||
script(src='../assets/js/animation/wow/wow.min.js')
|
||||
script(src='../assets/js/landing_sticky.js')
|
||||
script(src='../assets/js/landing.js')
|
||||
script(src='../assets/js/jarallax_libs/libs.min.js')
|
||||
script(src='../assets/js/slick/slick.min.js')
|
||||
script(src='../assets/js/slick/slick.js')
|
||||
script(src='../assets/js/landing-slick.js')
|
||||
// Plugins JS Ends
|
||||
32
static/admin/assets/pug/components/landing-header.pug
Normal file
32
static/admin/assets/pug/components/landing-header.pug
Normal file
@@ -0,0 +1,32 @@
|
||||
|
||||
head
|
||||
meta(http-equiv='Content-Type', content='text/html; charset=UTF-8')
|
||||
meta(http-equiv='X-UA-Compatible', content='IE=edge')
|
||||
meta(name='viewport', content='width=device-width, initial-scale=1.0')
|
||||
link(rel='icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
link(rel='shortcut icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
title Cuba - Premium Admin Template
|
||||
// Google font
|
||||
link(href='https://fonts.googleapis.com/css?family=Rubik:400,400i,500,500i,700,700i&display=swap', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900&display=swap', rel='stylesheet' )
|
||||
if landing_font
|
||||
link(rel='preconnect' href='https://fonts.googleapis.com')
|
||||
link(rel='preconnect' href='https://fonts.gstatic.com' crossorigin='')
|
||||
link(href='https://fonts.googleapis.com/css2?family=Caveat:wght@700&display=swap' rel='stylesheet')
|
||||
|
||||
|
||||
//- // Font Awesome
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/font-awesome.css')
|
||||
|
||||
link(rel="icon" href="../assets/svg/landing-icons.svg")
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/slick.css')
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/slick-theme.css')
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/animate.css')
|
||||
// Bootstrap css
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/vendors/bootstrap.css')
|
||||
|
||||
// App css
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/style.css')
|
||||
|
||||
// Responsive css
|
||||
link(rel='stylesheet', type='text/css', href='../assets/css/responsive.css')
|
||||
11
static/admin/assets/pug/components/loader.pug
Normal file
11
static/admin/assets/pug/components/loader.pug
Normal file
@@ -0,0 +1,11 @@
|
||||
|
||||
// loader starts
|
||||
.loader-wrapper
|
||||
.loader-index
|
||||
span
|
||||
svg
|
||||
defs
|
||||
filter#goo
|
||||
fegaussianblur(in='SourceGraphic' stddeviation='11' result='blur')
|
||||
fecolormatrix(in='blur' values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 19 -9' result='goo')
|
||||
// loader ends
|
||||
786
static/admin/assets/pug/components/sidebar.pug
Normal file
786
static/admin/assets/pug/components/sidebar.pug
Normal file
@@ -0,0 +1,786 @@
|
||||
- var status_toggle = (sidebar_open ? undefined : 'checked');
|
||||
// Page Sidebar Start
|
||||
.sidebar-wrapper(sidebar-layout="stroke-svg")
|
||||
div
|
||||
.logo-wrapper
|
||||
a(href='index.html')
|
||||
img.img-fluid.for-light(src='../assets/images/logo/logo.png', alt='')
|
||||
img.img-fluid.for-dark(src='../assets/images/logo/logo_dark.png', alt='')
|
||||
.back-btn
|
||||
i.fa.fa-angle-left
|
||||
.toggle-sidebar
|
||||
i.status_toggle.middle(data-feather='grid').sidebar-toggle
|
||||
.logo-icon-wrapper
|
||||
a(href="index.html")
|
||||
img.img-fluid(src='../assets/images/logo/logo-icon.png', alt='')
|
||||
|
||||
nav.sidebar-main
|
||||
.left-arrow#left-arrow
|
||||
i(data-feather='arrow-left')
|
||||
#sidebar-menu
|
||||
ul.sidebar-links#simple-bar
|
||||
li.back-btn
|
||||
a(href="index.html")
|
||||
img.img-fluid(src='../assets/images/logo/logo-icon.png', alt='')
|
||||
.mobile-back.text-end
|
||||
span Back
|
||||
i.fa.fa-angle-right.ps-2(aria-hidden='true')
|
||||
li.sidebar-main-title
|
||||
div
|
||||
h6.lan-1 General
|
||||
li.sidebar-list
|
||||
label.badge.badge-light-primary 5
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-home')
|
||||
span.lan-3 Dashboard
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='index.html').lan-4
|
||||
| Default
|
||||
li
|
||||
a(href='dashboard-02.html').lan-5 Ecommerce
|
||||
li
|
||||
a(href='dashboard-03.html') Online course
|
||||
li
|
||||
a(href='dashboard-04.html') Crypto
|
||||
li
|
||||
a(href='dashboard-05.html') Social
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-widget')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-widget')
|
||||
span.lan-6 Widgets
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='general-widget.html') General
|
||||
li
|
||||
a(href='chart-widget.html') Chart
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-layout')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-layout')
|
||||
span.lan-7 Page layout
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='box-layout.html') Boxed
|
||||
li
|
||||
a(href='layout-rtl.html') RTL
|
||||
li
|
||||
a(href='layout-dark.html') Dark Layout
|
||||
li
|
||||
a(href='hide-on-scroll.html') Hide Nav Scroll
|
||||
li
|
||||
a(href='footer-light.html') Footer Light
|
||||
li
|
||||
a(href='footer-dark.html') Footer Dark
|
||||
li
|
||||
a(href='footer-fixed.html') Footer Fixed
|
||||
|
||||
li.sidebar-main-title
|
||||
div
|
||||
h6.lan-8 Applications
|
||||
li.sidebar-list
|
||||
label.badge.badge-light-secondary New
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-project')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-project')
|
||||
span Project
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='projects.html') Project List
|
||||
li
|
||||
a(href='projectcreate.html') Create new
|
||||
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='file-manager.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-file')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-file')
|
||||
span File manager
|
||||
li.sidebar-list
|
||||
label.badge.badge-light-danger Latest
|
||||
a.sidebar-link.sidebar-title.link-nav(href='kanban.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-board')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-board')
|
||||
span kanban Board
|
||||
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-ecommerce')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-ecommerce')
|
||||
span Ecommerce
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='product.html') Product
|
||||
li
|
||||
a(href='product-page.html') Product page
|
||||
li
|
||||
a(href='list-products.html') Product list
|
||||
li
|
||||
a(href='payment-details.html') Payment Details
|
||||
li
|
||||
a(href='order-history.html') Order History
|
||||
li
|
||||
a(href='invoice-template.html') Invoice
|
||||
li
|
||||
a(href='cart.html') Cart
|
||||
li
|
||||
a(href='list-wish.html') Wishlist
|
||||
li
|
||||
a(href='checkout.html') Checkout
|
||||
li
|
||||
a(href='pricing.html') Pricing
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-email')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-email')
|
||||
span Email
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='email-application.html') Email App
|
||||
li
|
||||
a(href='email-compose.html') Email Compose
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-chat')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-chat')
|
||||
span Chat
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='chat.html') Chat App
|
||||
li
|
||||
a(href='chat-video.html') Video chat
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-user')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-user')
|
||||
span Users
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='user-profile.html') Users Profile
|
||||
li
|
||||
a(href='edit-profile.html') Users Edit
|
||||
li
|
||||
a(href='user-cards.html') Users Cards
|
||||
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='bookmark.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-bookmark')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-bookmark')
|
||||
span Bookmarks
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='contacts.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-contact')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-contact')
|
||||
span Contacts
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='task.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-task')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-task')
|
||||
span Tasks
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='calendar-basic.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-calendar')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-calender')
|
||||
span Calendar
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='social-app.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-social')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-social')
|
||||
span Social App
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='to-do.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-to-do')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-to-do')
|
||||
span To-Do
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='search.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-search')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-search')
|
||||
span Search Result
|
||||
|
||||
li.sidebar-main-title
|
||||
div
|
||||
h6 Forms & Table
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-form')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-form')
|
||||
span Forms
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| Form Controls
|
||||
span.sub-arrow
|
||||
i.fa.fa-angle-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='form-validation.html') Form Validation
|
||||
li
|
||||
a(href='base-input.html') Base Inputs
|
||||
li
|
||||
a(href='radio-checkbox-control.html') Checkbox & Radio
|
||||
li
|
||||
a(href='input-group.html') Input Groups
|
||||
li
|
||||
a(href='megaoptions.html') Mega Options
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| Form Widgets
|
||||
span.sub-arrow
|
||||
i.fa.fa-angle-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='datepicker.html') Datepicker
|
||||
li
|
||||
a(href='time-picker.html') Timepicker
|
||||
li
|
||||
a(href='datetimepicker.html') Datetimepicker
|
||||
li
|
||||
a(href='daterangepicker.html') Daterangepicker
|
||||
li
|
||||
a(href='touchspin.html') Touchspin
|
||||
li
|
||||
a(href='select2.html') Select2
|
||||
li
|
||||
a(href='switch.html') Switch
|
||||
li
|
||||
a(href='typeahead.html') Typeahead
|
||||
li
|
||||
a(href='clipboard.html') Clipboard
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| Form layout
|
||||
span.sub-arrow
|
||||
i.fa.fa-angle-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='default-form.html') Default Forms
|
||||
li
|
||||
a(href='form-wizard.html') Form Wizard 1
|
||||
li
|
||||
a(href='form-wizard-two.html') Form Wizard 2
|
||||
li
|
||||
a(href='form-wizard-three.html') Form Wizard 3
|
||||
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-table')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-table')
|
||||
span Tables
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| Bootstrap Tables
|
||||
span.sub-arrow
|
||||
i.fa.fa-angle-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='bootstrap-basic-table.html') Basic Tables
|
||||
li
|
||||
a(href='table-components.html') Table components
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| Data Tables
|
||||
span.sub-arrow
|
||||
i.fa.fa-angle-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='datatable-basic-init.html') Basic Init
|
||||
li
|
||||
a(href='datatable-API.html') API
|
||||
li
|
||||
a(href='datatable-data-source.html') Data Sources
|
||||
li
|
||||
a(href='datatable-ext-autofill.html')
|
||||
| Ex. Data Tables
|
||||
li
|
||||
a(href='jsgrid-table.html') Js Grid Table
|
||||
|
||||
|
||||
li.sidebar-main-title
|
||||
div
|
||||
h6 Components
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-ui-kits')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-ui-kits')
|
||||
span Ui Kits
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='typography.html') Typography
|
||||
li
|
||||
a(href='avatars.html') Avatars
|
||||
li
|
||||
a(href='helper-classes.html') helper classes
|
||||
li
|
||||
a(href='grid.html') Grid
|
||||
li
|
||||
a(href='tag-pills.html') Tag & pills
|
||||
li
|
||||
a(href='progress-bar.html') Progress
|
||||
li
|
||||
a(href='modal.html') Modal
|
||||
li
|
||||
a(href='alert.html') Alert
|
||||
li
|
||||
a(href='popover.html') Popover
|
||||
li
|
||||
a(href='tooltip.html') Tooltip
|
||||
li
|
||||
a(href='dropdown.html') Dropdown
|
||||
li
|
||||
a(href='according.html') Accordion
|
||||
li
|
||||
a(href='tab-bootstrap.html')
|
||||
| Tabs
|
||||
li
|
||||
a(href='list.html') Lists
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-bonus-kit')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-bonus-kit')
|
||||
span Bonus Ui
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='scrollable.html') Scrollable
|
||||
li
|
||||
a(href='tree.html') Tree view
|
||||
li
|
||||
a(href='bootstrap-notify.html') Bootstrap Notify
|
||||
li
|
||||
a(href='rating.html') Rating
|
||||
li
|
||||
a(href='dropzone.html') dropzone
|
||||
li
|
||||
a(href='tour.html') Tour
|
||||
li
|
||||
a(href='sweet-alert2.html') SweetAlert2
|
||||
li
|
||||
a(href='modal-animated.html') Animated Modal
|
||||
li
|
||||
a(href='owl-carousel.html') Owl Carousel
|
||||
li
|
||||
a(href='ribbons.html') Ribbons
|
||||
li
|
||||
a(href='pagination.html') Pagination
|
||||
li
|
||||
a(href='breadcrumb.html') Breadcrumb
|
||||
li
|
||||
a(href='range-slider.html') Range Slider
|
||||
li
|
||||
a(href='image-cropper.html') Image cropper
|
||||
li
|
||||
a(href='sticky.html') Sticky
|
||||
li
|
||||
a(href='basic-card.html') Basic Card
|
||||
li
|
||||
a(href='creative-card.html') Creative Card
|
||||
li
|
||||
a(href='tabbed-card.html') Tabbed Card
|
||||
li
|
||||
a(href='dragable-card.html') Draggable Card
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| Timeline
|
||||
span.sub-arrow
|
||||
i.fa.fa-angle-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='timeline-v-1.html') Timeline 1
|
||||
li
|
||||
a(href='timeline-v-2.html') Timeline 2
|
||||
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-builders')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-builders')
|
||||
span Builders
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='form-builder-1.html') Form Builder 1
|
||||
li
|
||||
a(href='form-builder-2.html') Form Builder 2
|
||||
li
|
||||
a(href='pagebuild.html') Page Builder
|
||||
li
|
||||
a(href='button-builder.html') Button Builder
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-animation')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-animation')
|
||||
span Animation
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='animate.html') Animate
|
||||
li
|
||||
a(href='scroll-reval.html') Scroll Reveal
|
||||
li
|
||||
a(href='AOS.html') AOS animation
|
||||
li
|
||||
a(href='tilt.html') Tilt Animation
|
||||
li
|
||||
a(href='wow.html') Wow Animation
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-icons')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-icons')
|
||||
span Icons
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='flag-icon.html') Flag icon
|
||||
li
|
||||
a(href='font-awesome.html') Fontawesome Icon
|
||||
li
|
||||
a(href='ico-icon.html') Ico Icon
|
||||
li
|
||||
a(href='themify-icon.html') Themify Icon
|
||||
li
|
||||
a(href='feather-icon.html') Feather icon
|
||||
li
|
||||
a(href='whether-icon.html') Whether Icon
|
||||
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-button')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-botton')
|
||||
span Buttons
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='buttons.html') Default Style
|
||||
li
|
||||
a(href='buttons-flat.html') Flat Style
|
||||
li
|
||||
a(href='buttons-edge.html') Edge Style
|
||||
li
|
||||
a(href='raised-button.html') Raised Style
|
||||
li
|
||||
a(href='button-group.html') Button Group
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-charts')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-charts')
|
||||
span Charts
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='echarts.html') Echarts
|
||||
li
|
||||
a(href='chart-apex.html') Apex Chart
|
||||
li
|
||||
a(href='chart-google.html') Google Chart
|
||||
li
|
||||
a(href='chart-sparkline.html') Sparkline chart
|
||||
li
|
||||
a(href='chart-flot.html') Flot Chart
|
||||
li
|
||||
a(href='chart-knob.html') Knob Chart
|
||||
li
|
||||
a(href='chart-morris.html') Morris Chart
|
||||
li
|
||||
a(href='chartjs.html') Chatjs Chart
|
||||
li
|
||||
a(href='chartist.html') Chartist Chart
|
||||
li
|
||||
a(href='chart-peity.html') Peity Chart
|
||||
|
||||
|
||||
li.sidebar-main-title
|
||||
div
|
||||
h6 Pages
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='landing-page.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-landing-page')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-landing-page')
|
||||
span Landing page
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='sample-page.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-sample-page')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-sample-page')
|
||||
span Sample page
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='internationalization.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-internationalization')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-internationalization')
|
||||
span Internationalization
|
||||
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='../starter-kit/index.html' target='_blank')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-starter-kit')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-starter-kit')
|
||||
span Starter kit
|
||||
|
||||
li.mega-menu
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-others')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-others')
|
||||
span Others
|
||||
.mega-menu-container.menu-content
|
||||
.container-fluid
|
||||
.row
|
||||
.col.mega-box
|
||||
.link-section
|
||||
.submenu-title
|
||||
h5 Error Page
|
||||
ul.submenu-content.opensubmegamenu
|
||||
li
|
||||
a(href='error-400.html') Error 400
|
||||
li
|
||||
a(href='error-401.html') Error 401
|
||||
li
|
||||
a(href='error-403.html') Error 403
|
||||
li
|
||||
a(href='error-404.html') Error 404
|
||||
li
|
||||
a(href='error-500.html') Error 500
|
||||
li
|
||||
a(href='error-503.html') Error 503
|
||||
.col.mega-box
|
||||
.link-section
|
||||
.submenu-title
|
||||
h5 Authentication
|
||||
ul.submenu-content.opensubmegamenu
|
||||
li
|
||||
a(href='login.html' target="_blank") Login Simple
|
||||
li
|
||||
a(href='login_one.html' target="_blank") Login with bg image
|
||||
li
|
||||
a(href='login_two.html' target="_blank") Login with image two
|
||||
li
|
||||
a(href='login-bs-validation.html' target="_blank") Login With validation
|
||||
li
|
||||
a(href='login-bs-tt-validation.html' target="_blank") Login with tooltip
|
||||
li
|
||||
a(href='login-sa-validation.html' target="_blank") Login with sweetalert
|
||||
|
||||
li
|
||||
a(href='sign-up.html' target="_blank") Register Simple
|
||||
li
|
||||
a(href='sign-up-one.html' target="_blank")
|
||||
| Register with Bg Image
|
||||
li
|
||||
a(href='sign-up-two.html' target="_blank") Register with image two
|
||||
li
|
||||
a(href='sign-up-wizard.html' target="_blank") Register wizard
|
||||
|
||||
|
||||
li
|
||||
a(href='unlock.html') Unlock User
|
||||
li
|
||||
a(href='forget-password.html') Forget Password
|
||||
li
|
||||
a(href='reset-password.html') Reset Password
|
||||
li
|
||||
a(href='maintenance.html') Maintenance
|
||||
.col.mega-box
|
||||
.link-section
|
||||
.submenu-title
|
||||
h5 Coming Soon
|
||||
ul.submenu-content.opensubmegamenu
|
||||
li
|
||||
a(href='comingsoon.html') Coming Simple
|
||||
li
|
||||
a(href='comingsoon-bg-video.html') Coming with Bg video
|
||||
li
|
||||
a(href='comingsoon-bg-img.html') Coming with Bg Image
|
||||
.col.mega-box
|
||||
.link-section
|
||||
.submenu-title
|
||||
h5 Email templates
|
||||
ul.submenu-content.opensubmegamenu
|
||||
li
|
||||
a(href='basic-template.html')
|
||||
| Basic Email
|
||||
li
|
||||
a(href='email-header.html')
|
||||
| Basic With Header
|
||||
li
|
||||
a(href='template-email.html')
|
||||
| Ecomerce Template
|
||||
li
|
||||
a(href='template-email-2.html')
|
||||
| Email Template 2
|
||||
li
|
||||
a(href='ecommerce-templates.html')
|
||||
| Ecommerce Email
|
||||
li
|
||||
a(href='email-order-success.html')
|
||||
| Order Success
|
||||
li.sidebar-main-title
|
||||
div
|
||||
h6 Miscellaneous
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-gallery')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-gallery')
|
||||
span Gallery
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='gallery.html') Gallery Grid
|
||||
li
|
||||
a(href='gallery-with-description.html') Gallery Grid Desc
|
||||
li
|
||||
a(href='gallery-masonry.html') Masonry Gallery
|
||||
li
|
||||
a(href='masonry-gallery-with-disc.html') Masonry with Desc
|
||||
li
|
||||
a(href='gallery-hover.html') Hover Effects
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-blog')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-blog')
|
||||
span Blog
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='blog.html') Blog Details
|
||||
li
|
||||
a(href='blog-single.html') Blog Single
|
||||
li
|
||||
a(href='add-post.html') Add Post
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='faq.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-faq')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-faq')
|
||||
span FAQ
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-job-search')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-job-search')
|
||||
span Job Search
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='job-cards-view.html') Cards view
|
||||
li
|
||||
a(href='job-list-view.html') List View
|
||||
li
|
||||
a(href='job-details.html') Job Details
|
||||
li
|
||||
a(href='job-apply.html') Apply
|
||||
|
||||
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-learning')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-learning')
|
||||
span Learning
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='learning-list-view.html') Learning List
|
||||
li
|
||||
a(href='learning-detailed.html') Detailed Course
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-maps')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-maps')
|
||||
span Maps
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='map-js.html') Maps JS
|
||||
li
|
||||
a(href='vector-map.html') Vector Maps
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-editors')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-editors')
|
||||
span Editors
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a(href='summernote.html') Summer Note
|
||||
li
|
||||
a(href='ckeditor.html') CK editor
|
||||
li
|
||||
a(href='simple-MDE.html') MDE editor
|
||||
li
|
||||
a(href='ace-code-editor.html') ACE code editor
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='knowledgebase.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-knowledgebase')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-knowledgebase')
|
||||
span Knowledgebase
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title.link-nav(href='support-ticket.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-support-tickets')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-support-tickets')
|
||||
span Support Ticket
|
||||
.right-arrow#right-arrow
|
||||
i(data-feather='arrow-right')
|
||||
// Page Sidebar Ends
|
||||
239
static/admin/assets/pug/components/starter-kit-header.pug
Normal file
239
static/admin/assets/pug/components/starter-kit-header.pug
Normal file
@@ -0,0 +1,239 @@
|
||||
// Page Header Start
|
||||
.page-header
|
||||
.header-wrapper.row.m-0
|
||||
form(action='#', method='get').form-inline.search-full.col
|
||||
.form-group.w-100
|
||||
.Typeahead.Typeahead--twitterUsers
|
||||
.u-posRelative
|
||||
input.demo-input.Typeahead-input.form-control-plaintext.w-100(type='text' placeholder='Search Cuba ..' name='q' title='' autofocus)
|
||||
.spinner-border.Typeahead-spinner(role='status')
|
||||
span.sr-only Loading...
|
||||
i(data-feather='x').close-search
|
||||
.Typeahead-menu
|
||||
.header-logo-wrapper.col-auto.p-0
|
||||
.logo-wrapper
|
||||
a(href='index.html')
|
||||
img.img-fluid(src='../assets/images/logo/logo.png', alt='')
|
||||
.toggle-sidebar
|
||||
i.status_toggle.middle(data-feather='align-center').sidebar-toggle
|
||||
|
||||
.left-header.col-xxl-5.col-xl-6.col-lg-5.col-md-4.col-sm-3.p-0
|
||||
.notification-slider
|
||||
div.d-flex.h-100
|
||||
img(src="../assets/images/giftools.gif" alt="gif")
|
||||
h6.mb-0.f-w-400
|
||||
span.font-primary Don't Miss Out!
|
||||
span.f-light Out new update has been release.
|
||||
i.icon-arrow-top-right.f-light
|
||||
div.d-flex.h-100
|
||||
img(src="../assets/images/giftools.gif" alt="gif")
|
||||
h6.mb-0.f-w-400
|
||||
span.f-light Something you love is now on sale!
|
||||
a.ms-1(href="https://1.envato.market/3GVzd" target="_blank") Buy now !
|
||||
|
||||
|
||||
.nav-right.col-xxl-7.col-xl-6.col-md-7.col-8.pull-right.right-header.p-0.ms-auto
|
||||
ul.nav-menus
|
||||
li.language-nav
|
||||
.translate_wrapper
|
||||
.current_lang
|
||||
.lang
|
||||
i.flag-icon.flag-icon-us
|
||||
span.lang-txt EN
|
||||
.more_lang
|
||||
.lang.selected(data-value='en')
|
||||
i.flag-icon.flag-icon-us
|
||||
span.lang-txt
|
||||
| English
|
||||
span (US)
|
||||
.lang(data-value='de')
|
||||
i.flag-icon.flag-icon-de
|
||||
span.lang-txt Deutsch
|
||||
.lang(data-value='es')
|
||||
i.flag-icon.flag-icon-es
|
||||
span.lang-txt Español
|
||||
.lang(data-value='fr')
|
||||
i.flag-icon.flag-icon-fr
|
||||
span.lang-txt Français
|
||||
.lang(data-value='pt')
|
||||
i.flag-icon.flag-icon-pt
|
||||
span.lang-txt
|
||||
| Português
|
||||
span (BR)
|
||||
.lang(data-value='cn')
|
||||
i.flag-icon.flag-icon-cn
|
||||
span.lang-txt 简体中文
|
||||
.lang(data-value='ae')
|
||||
i.flag-icon.flag-icon-ae
|
||||
span.lang-txt
|
||||
| لعربية
|
||||
span (ae)
|
||||
li
|
||||
span.header-search
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#search')
|
||||
|
||||
li.onhover-dropdown
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#star')
|
||||
.onhover-show-div.bookmark-flip
|
||||
.flip-card
|
||||
.flip-card-inner
|
||||
.front
|
||||
h6.f-18.mb-0.dropdown-title Bookmark
|
||||
ul.bookmark-dropdown
|
||||
li
|
||||
.row
|
||||
.col-4.text-center
|
||||
.bookmark-content
|
||||
.bookmark-icon
|
||||
i(data-feather='file-text')
|
||||
span Forms
|
||||
.col-4.text-center
|
||||
.bookmark-content
|
||||
.bookmark-icon
|
||||
i(data-feather='user')
|
||||
span Profile
|
||||
.col-4.text-center
|
||||
.bookmark-content
|
||||
.bookmark-icon
|
||||
i(data-feather='server')
|
||||
span Tables
|
||||
li.text-center
|
||||
a.flip-btn#flip-btn.f-w-700(href="javascript:void(0)") Add New Bookmark
|
||||
.back
|
||||
ul
|
||||
li
|
||||
.bookmark-dropdown.flip-back-content
|
||||
input(type='text' placeholder='search...')
|
||||
li
|
||||
a.f-w-700.d-block.flip-back#flip-back(href="javascript:void(0)")
|
||||
| Back
|
||||
|
||||
li
|
||||
.mode
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#moon')
|
||||
li.cart-nav.onhover-dropdown
|
||||
.cart-box
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-ecommerce')
|
||||
span.badge.rounded-pill.badge-success 2
|
||||
.cart-dropdown.onhover-show-div
|
||||
h6.f-18.mb-0.dropdown-title Cart
|
||||
ul
|
||||
li
|
||||
.media
|
||||
img.img-fluid.b-r-5.me-3.img-60(src='../assets/images/other-images/cart-img.jpg', alt='')
|
||||
.media-body
|
||||
span Furniture Chair for Home
|
||||
.qty-box
|
||||
.input-group
|
||||
span.input-group-prepend
|
||||
button.btn.quantity-left-minus(type='button' data-type='minus' data-field='')
|
||||
| -
|
||||
input.form-control.input-number(type='text' name='quantity' value='1')
|
||||
span.input-group-prepend
|
||||
button.btn.quantity-right-plus(type='button' data-type='plus' data-field='')
|
||||
| +
|
||||
|
||||
h6.font-primary $500
|
||||
.close-circle
|
||||
a.bg-danger(href='#')
|
||||
i(data-feather='x')
|
||||
li
|
||||
.media
|
||||
img.img-fluid.b-r-5.me-3.img-60(src='../assets/images/other-images/cart-img.jpg', alt='')
|
||||
.media-body
|
||||
span Furniture Chair for Home
|
||||
.qty-box
|
||||
.input-group
|
||||
span.input-group-prepend
|
||||
button.btn.quantity-left-minus(type='button' data-type='minus' data-field='')
|
||||
| -
|
||||
input.form-control.input-number(type='text' name='quantity' value='1')
|
||||
span.input-group-prepend
|
||||
button.btn.quantity-right-plus(type='button' data-type='plus' data-field='')
|
||||
| +
|
||||
|
||||
h6.font-primary $500.00
|
||||
.close-circle
|
||||
a.bg-danger(href='#')
|
||||
i(data-feather='x')
|
||||
|
||||
li.total
|
||||
h6.mb-0
|
||||
| Order Total :
|
||||
span.f-right $1000.00
|
||||
li.text-center
|
||||
a.d-block.mb-3.view-cart.f-w-700(href='cart.html')
|
||||
| Go to your cart
|
||||
a.btn.btn-primary.view-checkout(href='checkout.html')
|
||||
| Checkout
|
||||
li.onhover-dropdown
|
||||
.notification-box
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#notification')
|
||||
span.badge.rounded-pill.badge-secondary 4
|
||||
.onhover-show-div.notification-dropdown
|
||||
h6.f-18.mb-0.dropdown-title Notitications
|
||||
ul
|
||||
li.b-l-primary.border-4
|
||||
p
|
||||
| Delivery processing
|
||||
span.font-danger 10 min.
|
||||
li.b-l-success.border-4
|
||||
p
|
||||
| Order Complete
|
||||
span.font-success 1 hr
|
||||
li.b-l-secondary.border-4
|
||||
p
|
||||
| Tickets Generated
|
||||
span.font-secondary 3 hr
|
||||
li.b-l-warning.border-4
|
||||
p
|
||||
| Delivery Complete
|
||||
span.font-warning 6 hr
|
||||
li
|
||||
a.f-w-700(href="#") Check all
|
||||
li.profile-nav.onhover-dropdown.pe-0.py-0
|
||||
.media.profile-media
|
||||
img.b-r-10(src='../assets/images/dashboard/profile.png', alt='')
|
||||
.media-body
|
||||
span Emay Walter
|
||||
p.mb-0.font-roboto Admin
|
||||
i.middle.fa.fa-angle-down
|
||||
ul.profile-dropdown.onhover-show-div
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='user')
|
||||
span Account
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='mail')
|
||||
span Inbox
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='file-text')
|
||||
span Taskboard
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='settings')
|
||||
span Settings
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='log-in')
|
||||
span Log in
|
||||
|
||||
//- .d-lg-none.mobile-toggle.pull-right
|
||||
//- i(data-feather='more-horizontal')
|
||||
script.result-template(type='text/x-handlebars-template').
|
||||
<div class="ProfileCard u-cf">
|
||||
<div class="ProfileCard-avatar"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-airplay m-0"><path d="M5 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-1"></path><polygon points="12 15 17 21 7 21 12 15"></polygon></svg></div>
|
||||
<div class="ProfileCard-details">
|
||||
<div class="ProfileCard-realName">{{name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
script.empty-template(type='text/x-handlebars-template').
|
||||
<div class="EmptyMessage">Your search turned up 0 results. This most likely means the backend is down, yikes!</div>
|
||||
// Page Header Ends
|
||||
92
static/admin/assets/pug/components/starter-kit-sidebar.pug
Normal file
92
static/admin/assets/pug/components/starter-kit-sidebar.pug
Normal file
@@ -0,0 +1,92 @@
|
||||
// Page Sidebar Start
|
||||
- var status_toggle = (sidebar_open ? undefined : 'checked');
|
||||
.sidebar-wrapper(sidebar-layout="stroke-svg")
|
||||
div
|
||||
.logo-wrapper
|
||||
a(href='index.html')
|
||||
img.img-fluid.for-light(src='../assets/images/logo/logo.png', alt='')
|
||||
img.img-fluid.for-dark(src='../assets/images/logo/logo_dark.png', alt='')
|
||||
.back-btn
|
||||
i.fa.fa-angle-left
|
||||
.toggle-sidebar
|
||||
i.status_toggle.middle(data-feather='grid').sidebar-toggle
|
||||
.logo-icon-wrapper
|
||||
a(href="index.html")
|
||||
img.img-fluid(src='../assets/images/logo/logo-icon.png', alt='')
|
||||
|
||||
nav.sidebar-main
|
||||
.left-arrow#left-arrow
|
||||
i(data-feather='arrow-left')
|
||||
#sidebar-menu
|
||||
ul.sidebar-links#simple-bar
|
||||
li.back-btn
|
||||
.mobile-back.text-end
|
||||
span Back
|
||||
i.fa.fa-angle-right.ps-2(aria-hidden='true')
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='../theme/index.html', target='_blank')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-home')
|
||||
span Dashboard
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='#')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-starter-kit')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-starter-kit')
|
||||
span Starter kit
|
||||
ul.sidebar-submenu
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| color version
|
||||
span.sub-arrow
|
||||
i.fa.fa-chevron-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='index.html') Layout Light
|
||||
li
|
||||
a(href='layout-dark.html') Layout Dark
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| Page layout
|
||||
span.sub-arrow
|
||||
i.fa.fa-chevron-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='boxed.html') Boxed
|
||||
li
|
||||
a(href='layout-rtl.html') RTL
|
||||
li
|
||||
a(href='hide-on-scroll.html')
|
||||
span Hide menu on Scroll
|
||||
li
|
||||
a.submenu-title(href='#')
|
||||
| Footers
|
||||
span.sub-arrow
|
||||
i.fa.fa-chevron-right
|
||||
ul.nav-sub-childmenu.submenu-content
|
||||
li
|
||||
a(href='footer-light.html') Footer Light
|
||||
li
|
||||
a(href='footer-dark.html') Footer Dark
|
||||
li
|
||||
a(href='footer-fixed.html') Footer Fixed
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='https://pixelstrap.freshdesk.com/support/home', target='_blank')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-social')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-social')
|
||||
span Raise Support
|
||||
li.sidebar-list
|
||||
a.sidebar-link.sidebar-title(href='https://docs.pixelstrap.com/cuba/html/document/', target='_blank')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-form')
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#fill-form')
|
||||
span Documentation
|
||||
.right-arrow#right-arrow
|
||||
i(data-feather='arrow-right')
|
||||
// Page Sidebar Ends
|
||||
4
static/admin/assets/pug/components/taptop.pug
Normal file
4
static/admin/assets/pug/components/taptop.pug
Normal file
@@ -0,0 +1,4 @@
|
||||
// tap on top starts
|
||||
.tap-top
|
||||
i(data-feather="chevrons-up")
|
||||
// tap on tap ends
|
||||
252
static/admin/assets/pug/pages/starter-kit/boxed.pug
Normal file
252
static/admin/assets/pug/pages/starter-kit/boxed.pug
Normal file
@@ -0,0 +1,252 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var theme_customizer = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body.box-layout
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/starter-kit-header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/starter-kit-sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Box Layout
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Page layout
|
||||
li.breadcrumb-item.active Boxed
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.starter-main
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Kick start your project development !
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
|
|
||||
ul
|
||||
li
|
||||
p
|
||||
|
||||
li
|
||||
p
|
||||
|
||||
li
|
||||
p
|
||||
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 What is starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
| Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time.
|
||||
ul
|
||||
li
|
||||
p Each layout includes basic components only.
|
||||
li
|
||||
p
|
||||
| Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.
|
||||
li
|
||||
p
|
||||
| Using template engine to generate whole template quickly with your selected layout and other custom changes.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p>Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time. </p>
|
||||
| <ul>
|
||||
| <li><p>Each layout includes basic components only.</p></li>
|
||||
| <li><p>Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.</p></li>
|
||||
| <li><p>Using template engine to generate whole template quickly with your selected layout and other custom changes.</p></li>
|
||||
| </ul>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
span.f-w-600 HTML
|
||||
p
|
||||
| If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.
|
||||
p
|
||||
span.f-w-600 PUG
|
||||
p
|
||||
| To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.
|
||||
.alert.alert-primary.inverse(role='alert')
|
||||
i.icon-info-alt
|
||||
h5 Tips!
|
||||
p
|
||||
| Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p><span class="f-w-600">HTML</span></p>
|
||||
| <p>If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.</p>
|
||||
| <p><span class="f-w-600">PUG</span></p>
|
||||
| <p>To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.</p>
|
||||
| <div class="alert alert-primary inverse" role="alert">
|
||||
| <i class="icon-info-alt"></i>
|
||||
| <h5>Tips!</h5>
|
||||
| <p>Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.</p>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Card
|
||||
.card-body
|
||||
h6 HTML Ipsum Presents
|
||||
p
|
||||
strong Pellentesque habitant morbi tristique
|
||||
| senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
|
||||
| semper.
|
||||
em Aenean ultricies mi vitae est.
|
||||
| Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed,
|
||||
code commodo vitae
|
||||
| , ornare sit amet, wisi. Aenean
|
||||
| fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
|
||||
a(href='#') Donec non enim
|
||||
| in turpis pulvinar facilisis. Ut felis.
|
||||
h6 Header Level 2
|
||||
ol
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
blockquote
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada
|
||||
| tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
|
||||
h4
|
||||
| Header Level
|
||||
span 3
|
||||
ul
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
pre.
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
dl
|
||||
dt Definition list
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
dt Lorem ipsum dolor sit amet
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 With Header
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Jelly beans sugar plum cheesecake cookie oat cake soufflé. Tart lollipop carrot cake sugar plum. Marshmallow wafer tiramisu jelly beans.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 With Header & No Border
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class & without header border
|
||||
code .border-bottom-0
|
||||
| class.
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Gingerbread brownie sweet roll cheesecake chocolate cake jelly beans marzipan gummies dessert. Jelly beans sugar plum cheesecake cookie oat cake soufflé.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
241
static/admin/assets/pug/pages/starter-kit/footer-dark.pug
Normal file
241
static/admin/assets/pug/pages/starter-kit/footer-dark.pug
Normal file
@@ -0,0 +1,241 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var theme_customizer = true;
|
||||
- var footer_dark = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/starter-kit-header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/starter-kit-sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Footer Dark
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Footers
|
||||
li.breadcrumb-item.active Footer dark
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.starter-main
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Kick start your project development !
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 What is starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
| Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time.
|
||||
ul
|
||||
li
|
||||
p Each layout includes basic components only.
|
||||
li
|
||||
p
|
||||
| Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.
|
||||
li
|
||||
p
|
||||
| Using template engine to generate whole template quickly with your selected layout and other custom changes.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p>Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time. </p>
|
||||
| <ul>
|
||||
| <li><p>Each layout includes basic components only.</p></li>
|
||||
| <li><p>Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.</p></li>
|
||||
| <li><p>Using template engine to generate whole template quickly with your selected layout and other custom changes.</p></li>
|
||||
| </ul>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
span.f-w-600 HTML
|
||||
p
|
||||
| If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.
|
||||
p
|
||||
span.f-w-600 PUG
|
||||
p
|
||||
| To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.
|
||||
.alert.alert-primary.inverse(role='alert')
|
||||
i.icon-info-alt
|
||||
h5 Tips!
|
||||
p
|
||||
| Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p><span class="f-w-600">HTML</span></p>
|
||||
| <p>If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.</p>
|
||||
| <p><span class="f-w-600">PUG</span></p>
|
||||
| <p>To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.</p>
|
||||
| <div class="alert alert-primary inverse" role="alert">
|
||||
| <i class="icon-info-alt"></i>
|
||||
| <h5>Tips!</h5>
|
||||
| <p>Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.</p>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Card
|
||||
.card-body
|
||||
h6 HTML Ipsum Presents
|
||||
p
|
||||
strong Pellentesque habitant morbi tristique
|
||||
| senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
|
||||
| semper.
|
||||
em Aenean ultricies mi vitae est.
|
||||
| Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed,
|
||||
code commodo vitae
|
||||
| , ornare sit amet, wisi. Aenean
|
||||
| fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
|
||||
a(href='#') Donec non enim
|
||||
| in turpis pulvinar facilisis. Ut felis.
|
||||
h6 Header Level 2
|
||||
ol
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
blockquote
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada
|
||||
| tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
|
||||
h4
|
||||
| Header Level
|
||||
span 3
|
||||
ul
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
pre.
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
dl
|
||||
dt Definition list
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
dt Lorem ipsum dolor sit amet
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 With Header
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Jelly beans sugar plum cheesecake cookie oat cake soufflé. Tart lollipop carrot cake sugar plum. Marshmallow wafer tiramisu jelly beans.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 With Header & No Border
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class & without header border
|
||||
code .border-bottom-0
|
||||
| class.
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Gingerbread brownie sweet roll cheesecake chocolate cake jelly beans marzipan gummies dessert. Jelly beans sugar plum cheesecake cookie oat cake soufflé.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
239
static/admin/assets/pug/pages/starter-kit/footer-fixed.pug
Normal file
239
static/admin/assets/pug/pages/starter-kit/footer-fixed.pug
Normal file
@@ -0,0 +1,239 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
-var footer_fix = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var theme_customizer = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/starter-kit-header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu.starter-kit-fix
|
||||
include ../../components/starter-kit-sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Footer Fix
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Footers
|
||||
li.breadcrumb-item.active Footer fix
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.starter-main
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Kick start your project development !
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 What is starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
| Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time.
|
||||
ul
|
||||
li
|
||||
p Each layout includes basic components only.
|
||||
li
|
||||
p
|
||||
| Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.
|
||||
li
|
||||
p
|
||||
| Using template engine to generate whole template quickly with your selected layout and other custom changes.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p>Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time. </p>
|
||||
| <ul>
|
||||
| <li><p>Each layout includes basic components only.</p></li>
|
||||
| <li><p>Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.</p></li>
|
||||
| <li><p>Using template engine to generate whole template quickly with your selected layout and other custom changes.</p></li>
|
||||
| </ul>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
span.f-w-600 HTML
|
||||
p
|
||||
| If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.
|
||||
p
|
||||
span.f-w-600 PUG
|
||||
p
|
||||
| To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.
|
||||
.alert.alert-primary.inverse(role='alert')
|
||||
i.icon-info-alt
|
||||
h5 Tips!
|
||||
p
|
||||
| Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p><span class="f-w-600">HTML</span></p>
|
||||
| <p>If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.</p>
|
||||
| <p><span class="f-w-600">PUG</span></p>
|
||||
| <p>To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.</p>
|
||||
| <div class="alert alert-primary inverse" role="alert">
|
||||
| <i class="icon-info-alt"></i>
|
||||
| <h5>Tips!</h5>
|
||||
| <p>Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.</p>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Card
|
||||
.card-body
|
||||
h6 HTML Ipsum Presents
|
||||
p
|
||||
strong Pellentesque habitant morbi tristique
|
||||
| senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
|
||||
| semper.
|
||||
em Aenean ultricies mi vitae est.
|
||||
| Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed,
|
||||
code commodo vitae
|
||||
| , ornare sit amet, wisi. Aenean
|
||||
| fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
|
||||
a(href='#') Donec non enim
|
||||
| in turpis pulvinar facilisis. Ut felis.
|
||||
h6 Header Level 2
|
||||
ol
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
blockquote
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada
|
||||
| tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
|
||||
h4
|
||||
| Header Level
|
||||
span 3
|
||||
ul
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
pre.
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
dl
|
||||
dt Definition list
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
dt Lorem ipsum dolor sit amet
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 With Header
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Jelly beans sugar plum cheesecake cookie oat cake soufflé. Tart lollipop carrot cake sugar plum. Marshmallow wafer tiramisu jelly beans.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 With Header & No Border
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class & without header border
|
||||
code .border-bottom-0
|
||||
| class.
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Gingerbread brownie sweet roll cheesecake chocolate cake jelly beans marzipan gummies dessert. Jelly beans sugar plum cheesecake cookie oat cake soufflé.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
238
static/admin/assets/pug/pages/starter-kit/footer-light.pug
Normal file
238
static/admin/assets/pug/pages/starter-kit/footer-light.pug
Normal file
@@ -0,0 +1,238 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var theme_customizer = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/starter-kit-header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/starter-kit-sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Footer Light
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Footers
|
||||
li.breadcrumb-item.active Footer light
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.starter-main
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Kick start your project development !
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 What is starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
| Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time.
|
||||
ul
|
||||
li
|
||||
p Each layout includes basic components only.
|
||||
li
|
||||
p
|
||||
| Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.
|
||||
li
|
||||
p
|
||||
| Using template engine to generate whole template quickly with your selected layout and other custom changes.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p>Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time. </p>
|
||||
| <ul>
|
||||
| <li><p>Each layout includes basic components only.</p></li>
|
||||
| <li><p>Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.</p></li>
|
||||
| <li><p>Using template engine to generate whole template quickly with your selected layout and other custom changes.</p></li>
|
||||
| </ul>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
span.f-w-600 HTML
|
||||
p
|
||||
| If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.
|
||||
p
|
||||
span.f-w-600 PUG
|
||||
p
|
||||
| To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.
|
||||
.alert.alert-primary.inverse(role='alert')
|
||||
i.icon-info-alt
|
||||
h5 Tips!
|
||||
p
|
||||
| Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p><span class="f-w-600">HTML</span></p>
|
||||
| <p>If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.</p>
|
||||
| <p><span class="f-w-600">PUG</span></p>
|
||||
| <p>To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.</p>
|
||||
| <div class="alert alert-primary inverse" role="alert">
|
||||
| <i class="icon-info-alt"></i>
|
||||
| <h5>Tips!</h5>
|
||||
| <p>Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.</p>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Card
|
||||
.card-body
|
||||
h6 HTML Ipsum Presents
|
||||
p
|
||||
strong Pellentesque habitant morbi tristique
|
||||
| senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
|
||||
| semper.
|
||||
em Aenean ultricies mi vitae est.
|
||||
| Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed,
|
||||
code commodo vitae
|
||||
| , ornare sit amet, wisi. Aenean
|
||||
| fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
|
||||
a(href='#') Donec non enim
|
||||
| in turpis pulvinar facilisis. Ut felis.
|
||||
h6 Header Level 2
|
||||
ol
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
blockquote
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada
|
||||
| tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
|
||||
h4
|
||||
| Header Level
|
||||
span 3
|
||||
ul
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
pre.
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
dl
|
||||
dt Definition list
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
dt Lorem ipsum dolor sit amet
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 With Header
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Jelly beans sugar plum cheesecake cookie oat cake soufflé. Tart lollipop carrot cake sugar plum. Marshmallow wafer tiramisu jelly beans.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 With Header & No Border
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class & without header border
|
||||
code .border-bottom-0
|
||||
| class.
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Gingerbread brownie sweet roll cheesecake chocolate cake jelly beans marzipan gummies dessert. Jelly beans sugar plum cheesecake cookie oat cake soufflé.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
239
static/admin/assets/pug/pages/starter-kit/hide-on-scroll.pug
Normal file
239
static/admin/assets/pug/pages/starter-kit/hide-on-scroll.pug
Normal file
@@ -0,0 +1,239 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var theme_customizer = true;
|
||||
- var hide_on_scroll = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/starter-kit-header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/starter-kit-sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Hide Menu On Scroll
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Home
|
||||
li.breadcrumb-item.active Hide Menu On Scroll
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.starter-main
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Kick start your project development !
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 What is starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
| Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time.
|
||||
ul
|
||||
li
|
||||
p Each layout includes basic components only.
|
||||
li
|
||||
p
|
||||
| Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.
|
||||
li
|
||||
p
|
||||
| Using template engine to generate whole template quickly with your selected layout and other custom changes.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p>Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time. </p>
|
||||
| <ul>
|
||||
| <li><p>Each layout includes basic components only.</p></li>
|
||||
| <li><p>Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.</p></li>
|
||||
| <li><p>Using template engine to generate whole template quickly with your selected layout and other custom changes.</p></li>
|
||||
| </ul>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
span.f-w-600 HTML
|
||||
p
|
||||
| If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.
|
||||
p
|
||||
span.f-w-600 PUG
|
||||
p
|
||||
| To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.
|
||||
.alert.alert-primary.inverse(role='alert')
|
||||
i.icon-info-alt
|
||||
h5 Tips!
|
||||
p
|
||||
| Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p><span class="f-w-600">HTML</span></p>
|
||||
| <p>If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.</p>
|
||||
| <p><span class="f-w-600">PUG</span></p>
|
||||
| <p>To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.</p>
|
||||
| <div class="alert alert-primary inverse" role="alert">
|
||||
| <i class="icon-info-alt"></i>
|
||||
| <h5>Tips!</h5>
|
||||
| <p>Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.</p>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Card
|
||||
.card-body
|
||||
h6 HTML Ipsum Presents
|
||||
p
|
||||
strong Pellentesque habitant morbi tristique
|
||||
| senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
|
||||
| semper.
|
||||
em Aenean ultricies mi vitae est.
|
||||
| Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed,
|
||||
code commodo vitae
|
||||
| , ornare sit amet, wisi. Aenean
|
||||
| fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
|
||||
a(href='#') Donec non enim
|
||||
| in turpis pulvinar facilisis. Ut felis.
|
||||
h6 Header Level 2
|
||||
ol
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
blockquote
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada
|
||||
| tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
|
||||
h4
|
||||
| Header Level
|
||||
span 3
|
||||
ul
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
pre.
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
dl
|
||||
dt Definition list
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
dt Lorem ipsum dolor sit amet
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 With Header
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Jelly beans sugar plum cheesecake cookie oat cake soufflé. Tart lollipop carrot cake sugar plum. Marshmallow wafer tiramisu jelly beans.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 With Header & No Border
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class & without header border
|
||||
code .border-bottom-0
|
||||
| class.
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Gingerbread brownie sweet roll cheesecake chocolate cake jelly beans marzipan gummies dessert. Jelly beans sugar plum cheesecake cookie oat cake soufflé.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
241
static/admin/assets/pug/pages/starter-kit/index.pug
Normal file
241
static/admin/assets/pug/pages/starter-kit/index.pug
Normal file
@@ -0,0 +1,241 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var theme_customizer = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/starter-kit-header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/starter-kit-sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Layout Light
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Color version
|
||||
li.breadcrumb-item.active Layout light
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.starter-main
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Kick start your project development !
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
|
||||
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 What is starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
| Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time.
|
||||
ul
|
||||
li
|
||||
p Each layout includes basic components only.
|
||||
li
|
||||
p
|
||||
| Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.
|
||||
li
|
||||
p
|
||||
| Using template engine to generate whole template quickly with your selected layout and other custom changes.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p>Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time. </p>
|
||||
| <ul>
|
||||
| <li><p>Each layout includes basic components only.</p></li>
|
||||
| <li><p>Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.</p></li>
|
||||
| <li><p>Using template engine to generate whole template quickly with your selected layout and other custom changes.</p></li>
|
||||
| </ul>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
span.f-w-600 HTML
|
||||
p
|
||||
| If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.
|
||||
p
|
||||
span.f-w-600 PUG
|
||||
p
|
||||
| To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.
|
||||
.alert.alert-primary.inverse(role='alert')
|
||||
i.icon-info-alt
|
||||
h5 Tips!
|
||||
p
|
||||
| Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p><span class="f-w-600">HTML</span></p>
|
||||
| <p>If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.</p>
|
||||
| <p><span class="f-w-600">PUG</span></p>
|
||||
| <p>To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.</p>
|
||||
| <div class="alert alert-primary inverse" role="alert">
|
||||
| <i class="icon-info-alt"></i>
|
||||
| <h5>Tips!</h5>
|
||||
| <p>Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.</p>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Card
|
||||
.card-body
|
||||
h6 HTML Ipsum Presents
|
||||
p
|
||||
strong Pellentesque habitant morbi tristique
|
||||
| senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
|
||||
| semper.
|
||||
em Aenean ultricies mi vitae est.
|
||||
| Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed,
|
||||
code commodo vitae
|
||||
| , ornare sit amet, wisi. Aenean
|
||||
| fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
|
||||
a(href='#') Donec non enim
|
||||
| in turpis pulvinar facilisis. Ut felis.
|
||||
h6 Header Level 2
|
||||
ol
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
.figure.d-block
|
||||
blockquote.blockquote
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada
|
||||
| tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
|
||||
h4
|
||||
| Header Level
|
||||
span 3
|
||||
ul
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
pre.
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
dl
|
||||
dt Definition list
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
dt Lorem ipsum dolor sit amet
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 With Header
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Jelly beans sugar plum cheesecake cookie oat cake soufflé. Tart lollipop carrot cake sugar plum. Marshmallow wafer tiramisu jelly beans.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 With Header & No Border
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class & without header border
|
||||
code .border-bottom-0
|
||||
| class.
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Gingerbread brownie sweet roll cheesecake chocolate cake jelly beans marzipan gummies dessert. Jelly beans sugar plum cheesecake cookie oat cake soufflé.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
238
static/admin/assets/pug/pages/starter-kit/layout-dark.pug
Normal file
238
static/admin/assets/pug/pages/starter-kit/layout-dark.pug
Normal file
@@ -0,0 +1,238 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var theme_customizer = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body.dark-only
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/starter-kit-header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/starter-kit-sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Layout dark
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Color version
|
||||
li.breadcrumb-item.active Layout dark
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.starter-main
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Kick start your project development !
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 What is starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
| Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time.
|
||||
ul
|
||||
li
|
||||
p Each layout includes basic components only.
|
||||
li
|
||||
p
|
||||
| Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.
|
||||
li
|
||||
p
|
||||
| Using template engine to generate whole template quickly with your selected layout and other custom changes.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p>Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time. </p>
|
||||
| <ul>
|
||||
| <li><p>Each layout includes basic components only.</p></li>
|
||||
| <li><p>Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.</p></li>
|
||||
| <li><p>Using template engine to generate whole template quickly with your selected layout and other custom changes.</p></li>
|
||||
| </ul>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
span.f-w-600 HTML
|
||||
p
|
||||
| If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.
|
||||
p
|
||||
span.f-w-600 PUG
|
||||
p
|
||||
| To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.
|
||||
.alert.alert-primary.inverse(role='alert')
|
||||
i.icon-info-alt
|
||||
h5 Tips!
|
||||
p
|
||||
| Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p><span class="f-w-600">HTML</span></p>
|
||||
| <p>If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.</p>
|
||||
| <p><span class="f-w-600">PUG</span></p>
|
||||
| <p>To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.</p>
|
||||
| <div class="alert alert-primary inverse" role="alert">
|
||||
| <i class="icon-info-alt"></i>
|
||||
| <h5>Tips!</h5>
|
||||
| <p>Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.</p>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Card
|
||||
.card-body
|
||||
h6 HTML Ipsum Presents
|
||||
p
|
||||
strong Pellentesque habitant morbi tristique
|
||||
| senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
|
||||
| semper.
|
||||
em Aenean ultricies mi vitae est.
|
||||
| Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed,
|
||||
code commodo vitae
|
||||
| , ornare sit amet, wisi. Aenean
|
||||
| fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
|
||||
a(href='#') Donec non enim
|
||||
| in turpis pulvinar facilisis. Ut felis.
|
||||
h6 Header Level 2
|
||||
ol
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
.figure.d-block
|
||||
blockquote.blockquote
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada
|
||||
| tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
|
||||
h4
|
||||
| Header Level
|
||||
span 3
|
||||
ul
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
pre.
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
dl
|
||||
dt Definition list
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
dt Lorem ipsum dolor sit amet
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 With Header
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Jelly beans sugar plum cheesecake cookie oat cake soufflé. Tart lollipop carrot cake sugar plum. Marshmallow wafer tiramisu jelly beans.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 With Header & No Border
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class & without header border
|
||||
code .border-bottom-0
|
||||
| class.
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Gingerbread brownie sweet roll cheesecake chocolate cake jelly beans marzipan gummies dessert. Jelly beans sugar plum cheesecake cookie oat cake soufflé.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
237
static/admin/assets/pug/pages/starter-kit/layout-rtl.pug
Normal file
237
static/admin/assets/pug/pages/starter-kit/layout-rtl.pug
Normal file
@@ -0,0 +1,237 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var theme_customizer = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en' , dir='rtl')
|
||||
include ../../components/header-files
|
||||
body.rtl
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/starter-kit-header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/starter-kit-sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Layout RTL
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Page layout
|
||||
li.breadcrumb-item.active RTL
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.starter-main
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Kick start your project development !
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 What is starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
| Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time.
|
||||
ul
|
||||
li
|
||||
p Each layout includes basic components only.
|
||||
li
|
||||
p
|
||||
| Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.
|
||||
li
|
||||
p
|
||||
| Using template engine to generate whole template quickly with your selected layout and other custom changes.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p>Starter kit is a set of pages with different layouts, useful for your next project to start development process from scratch with no time. </p>
|
||||
| <ul>
|
||||
| <li><p>Each layout includes basic components only.</p></li>
|
||||
| <li><p>Select your choice of layout from starter kit, customize it with optional changes like colors and branding, add required dependency only.</p></li>
|
||||
| <li><p>Using template engine to generate whole template quickly with your selected layout and other custom changes.</p></li>
|
||||
| </ul>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use starter kit ?
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p
|
||||
span.f-w-600 HTML
|
||||
p
|
||||
| If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.
|
||||
p
|
||||
span.f-w-600 PUG
|
||||
p
|
||||
| To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.
|
||||
.alert.alert-primary.inverse(role='alert')
|
||||
i.icon-info-alt
|
||||
h5 Tips!
|
||||
p
|
||||
| Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p><span class="f-w-600">HTML</span></p>
|
||||
| <p>If you know just HTML, select your choice of layout from starter kit folder, customize it with optional changes like colors and branding, add required dependency only.</p>
|
||||
| <p><span class="f-w-600">PUG</span></p>
|
||||
| <p>To use PUG it required node.js and basic knowledge of using it. Using PUG as template engine to generate whole template quickly with your selected layout and other custom changes. To getting start with PUG usage & template generating process please refer template documentation.</p>
|
||||
| <div class="alert alert-primary inverse" role="alert">
|
||||
| <i class="icon-info-alt"></i>
|
||||
| <h5>Tips!</h5>
|
||||
| <p>Hideable navbar option is available for fixed navbar with static navigation only. Works in top and bottom positions, single and multiple navbars.</p>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Card
|
||||
.card-body
|
||||
h6 HTML Ipsum Presents
|
||||
p
|
||||
strong Pellentesque habitant morbi tristique
|
||||
| senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
|
||||
| semper.
|
||||
em Aenean ultricies mi vitae est.
|
||||
| Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed,
|
||||
code commodo vitae
|
||||
| , ornare sit amet, wisi. Aenean
|
||||
| fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
|
||||
a(href='#') Donec non enim
|
||||
| in turpis pulvinar facilisis. Ut felis.
|
||||
h6 Header Level 2
|
||||
ol
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
blockquote
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada
|
||||
| tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.
|
||||
h4
|
||||
| Header Level
|
||||
span 3
|
||||
ul
|
||||
li Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
||||
li Aliquam tincidunt mauris eu risus.
|
||||
pre.
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
dl
|
||||
dt Definition list
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
dt Lorem ipsum dolor sit amet
|
||||
dd
|
||||
| Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 With Header
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Jelly beans sugar plum cheesecake cookie oat cake soufflé. Tart lollipop carrot cake sugar plum. Marshmallow wafer tiramisu jelly beans.
|
||||
.col-md-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 With Header & No Border
|
||||
.card-body
|
||||
h5 Content title
|
||||
p
|
||||
| Add a heading to card with
|
||||
code .card-header
|
||||
| class & without header border
|
||||
code .border-bottom-0
|
||||
| class.
|
||||
p
|
||||
| You may also include any <h1>-<h6> with a
|
||||
code .card-header
|
||||
| &
|
||||
code .card-title
|
||||
| class to add heading.
|
||||
p
|
||||
| Gingerbread brownie sweet roll cheesecake chocolate cake jelly beans marzipan gummies dessert. Jelly beans sugar plum cheesecake cookie oat cake soufflé.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
396
static/admin/assets/pug/pages/theme/AOS.pug
Normal file
396
static/admin/assets/pug/pages/theme/AOS.pug
Normal file
@@ -0,0 +1,396 @@
|
||||
- var theme_customizer = true;
|
||||
- var photo_swipe = true;
|
||||
- var isotope = true;
|
||||
- var aos = true;
|
||||
- var page_aos = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| AOS Animation
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Animation
|
||||
li.breadcrumb-item.active AOS Animation
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 AOS Example animation
|
||||
.card-body
|
||||
#aniimated-thumbnials.row.gallery.grid.my-gallery
|
||||
figure.grid-item.col-sm-3(data-aos='fade-down')
|
||||
a(href='../assets/images/big-masonry/1.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/1.jpg', alt='Image description')
|
||||
figcaption Image caption 1
|
||||
figure.grid-item.col-sm-3(data-aos='zoom-out-down')
|
||||
a(href='../assets/images/big-masonry/2.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/2.jpg', alt='Image description')
|
||||
figcaption Image caption 2
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/3.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/3.jpg', alt='Image description')
|
||||
figcaption Image caption 3
|
||||
figure.grid-item.col-sm-3(data-aos='fade-up')
|
||||
a(href='../assets/images/big-masonry/4.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/4.jpg', alt='Image description')
|
||||
figcaption Image caption 4
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/5.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/5.jpg', alt='Image description')
|
||||
figcaption Image caption 5
|
||||
figure.grid-item.col-sm-3(data-aos='fade-up')
|
||||
a(href='../assets/images/big-masonry/6.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/6.jpg', alt='Image description')
|
||||
figcaption Image caption 6
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/7.jpg', data-size='11600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/7.jpg', alt='Image description')
|
||||
figcaption Image caption 7
|
||||
figure.grid-item.col-sm-3(data-aos='fade-up')
|
||||
a(href='../assets/images/big-masonry/8.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/8.jpg', alt='Image description')
|
||||
figcaption Image caption 8
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/9.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/9.jpg', alt='Image description')
|
||||
figcaption Image caption 9
|
||||
figure.grid-item.col-sm-3(data-aos='fade-up')
|
||||
a(href='../assets/images/big-masonry/10.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/10.jpg', alt='Image description')
|
||||
figcaption Image caption 10
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/11.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/11.jpg', alt='Image description')
|
||||
figcaption Image caption 11
|
||||
figure.grid-item.col-sm-3(data-aos='fade-up')
|
||||
a(href='../assets/images/big-masonry/12.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/12.jpg', alt='Image description')
|
||||
figcaption Image caption 12
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/14.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/14.jpg', alt='Image description')
|
||||
figcaption Image caption 13
|
||||
figure.grid-item.col-sm-3(data-aos='flip-left')
|
||||
a(href='../assets/images/big-masonry/15.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/15.jpg', alt='Image description')
|
||||
figcaption Image caption 14
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/13.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/13.jpg', alt='Image description')
|
||||
figcaption Image caption 15
|
||||
figure.grid-item.col-sm-3(data-aos='zoom-out')
|
||||
a(href='../assets/images/big-masonry/4.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/4.jpg', alt='Image description')
|
||||
figcaption Image caption 16
|
||||
figure.grid-item.col-sm-3(data-aos='flip-right')
|
||||
a(href='../assets/images/big-masonry/5.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/5.jpg', alt='Image description')
|
||||
figcaption Image caption 17
|
||||
figure.grid-item.col-sm-3(data-aos='zoom-out')
|
||||
a(href='../assets/images/big-masonry/6.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/6.jpg', alt='Image description')
|
||||
figcaption Image caption 18
|
||||
figure.grid-item.col-sm-3(data-aos='zoom-out-up')
|
||||
a(href='../assets/images/big-masonry/7.jpg', data-size='11600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/7.jpg', alt='Image description')
|
||||
figcaption Image caption 19
|
||||
figure.grid-item.col-sm-3(data-aos='zoom-out-down')
|
||||
a(href='../assets/images/big-masonry/8.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/8.jpg', alt='Image description')
|
||||
figcaption Image caption 20
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/9.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/9.jpg', alt='Image description')
|
||||
figcaption Image caption 21
|
||||
figure.grid-item.col-sm-3(data-aos='slide-up')
|
||||
a(href='../assets/images/big-masonry/10.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/10.jpg', alt='Image description')
|
||||
figcaption Image caption 22
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/9.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/9.jpg', alt='Image description')
|
||||
figcaption Image caption 23
|
||||
figure.grid-item.col-sm-3(data-aos='fade-up')
|
||||
a(href='../assets/images/big-masonry/10.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/10.jpg', alt='Image description')
|
||||
figcaption Image caption 24
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/11.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/11.jpg', alt='Image description')
|
||||
figcaption Image caption 25
|
||||
figure.grid-item.col-sm-3(data-aos='fade-up')
|
||||
a(href='../assets/images/big-masonry/12.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/12.jpg', alt='Image description')
|
||||
figcaption Image caption 26
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/14.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/14.jpg', alt='Image description')
|
||||
figcaption Image caption 27
|
||||
figure.grid-item.col-sm-3(data-aos='flip-left')
|
||||
a(href='../assets/images/big-masonry/15.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/15.jpg', alt='Image description')
|
||||
figcaption Image caption 28
|
||||
figure.grid-item.col-sm-3(data-aos='flip-down')
|
||||
a(href='../assets/images/big-masonry/13.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/13.jpg', alt='Image description')
|
||||
figcaption Image caption 29
|
||||
figure.grid-item.col-sm-3(data-aos='zoom-out')
|
||||
a(href='../assets/images/big-masonry/4.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/4.jpg', alt='Image description')
|
||||
figcaption Image caption 30
|
||||
figure.grid-item.col-sm-3(data-aos='flip-right')
|
||||
a(href='../assets/images/big-masonry/5.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/5.jpg', alt='Image description')
|
||||
figcaption Image caption 31
|
||||
figure.grid-item.col-sm-3(data-aos='zoom-out')
|
||||
a(href='../assets/images/big-masonry/6.jpg', data-size='1600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/6.jpg', alt='Image description')
|
||||
figcaption Image caption 32
|
||||
figure.grid-item.col-sm-3(data-aos='zoom-out-up')
|
||||
a(href='../assets/images/big-masonry/7.jpg', data-size='11600x950')
|
||||
img.img-thumbnail(src='../assets/images/masonry/7.jpg', alt='Image description')
|
||||
figcaption Image caption 33
|
||||
// Root element of PhotoSwipe. Must have class pswp.
|
||||
.pswp(tabindex='-1', role='dialog', aria-hidden='true')
|
||||
//
|
||||
Background of PhotoSwipe.
|
||||
It's a separate element, as animating opacity is faster than rgba().
|
||||
.pswp__bg
|
||||
// Slides wrapper with overflow:hidden.
|
||||
.pswp__scroll-wrap
|
||||
// Container that holds slides. PhotoSwipe keeps only 3 slides in DOM to save memory.
|
||||
// don't modify these 3 pswp__item elements, data is added later on.
|
||||
.pswp__container
|
||||
.pswp__item
|
||||
.pswp__item
|
||||
.pswp__item
|
||||
// Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed.
|
||||
.pswp__ui.pswp__ui--hidden
|
||||
.pswp__top-bar
|
||||
// Controls are self-explanatory. Order can be changed.
|
||||
.pswp__counter
|
||||
button.pswp__button.pswp__button--close(title='Close (Esc)')
|
||||
button.pswp__button.pswp__button--share(title='Share')
|
||||
button.pswp__button.pswp__button--fs(title='Toggle fullscreen')
|
||||
button.pswp__button.pswp__button--zoom(title='Zoom in/out')
|
||||
// Preloader demo https://codepen.io/dimsemenov/pen/yyBWoR
|
||||
// element will get class pswp__preloader--active when preloader is running
|
||||
.pswp__preloader
|
||||
.pswp__preloader__icn
|
||||
.pswp__preloader__cut
|
||||
.pswp__preloader__donut
|
||||
.pswp__share-modal.pswp__share-modal--hidden.pswp__single-tap
|
||||
.pswp__share-tooltip
|
||||
button.pswp__button.pswp__button--arrow--left(title='Previous (arrow left)')
|
||||
button.pswp__button.pswp__button--arrow--right(title='Next (arrow right)')
|
||||
.pswp__caption
|
||||
.pswp__caption__center
|
||||
.card
|
||||
.card-header
|
||||
h5 Init AOS
|
||||
.card-body
|
||||
div
|
||||
span.comment
|
||||
| // The Below Function is example of how to initlize reveal
|
||||
.line
|
||||
span
|
||||
| <script>
|
||||
span
|
||||
br
|
||||
code AOS.init();
|
||||
br
|
||||
span <
|
||||
| /script
|
||||
span >
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use it?
|
||||
span
|
||||
| All you have to do is to add
|
||||
code data-aos
|
||||
| attribute to html element, like so:
|
||||
.card-body
|
||||
.txt-primary
|
||||
span <
|
||||
| div data-aos="animation_name"
|
||||
span >
|
||||
.card
|
||||
.card-header
|
||||
h5 Advanced settings
|
||||
span
|
||||
| These settings can be set both on certain elements, or as default while initializing script (in options object without
|
||||
code data- part).
|
||||
.card-body.table-responsive
|
||||
table.table.table-bordered.table-striped
|
||||
thead
|
||||
tr
|
||||
th Attribute
|
||||
th Description
|
||||
th Example value
|
||||
th Default value
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
em
|
||||
code data-aos-offset
|
||||
td Change offset to trigger animations sooner or later (px)
|
||||
td 200
|
||||
td 120
|
||||
tr
|
||||
td
|
||||
em
|
||||
code data-aos-duration
|
||||
td *Duration of animation (ms)
|
||||
td 600
|
||||
td 400
|
||||
tr
|
||||
td
|
||||
em
|
||||
code data-aos-easing
|
||||
td Choose timing function to ease elements in different ways
|
||||
td ease-in-sine
|
||||
td ease
|
||||
tr
|
||||
td
|
||||
em
|
||||
code data-aos-delay
|
||||
td Delay animation (ms)
|
||||
td 300
|
||||
td 0
|
||||
tr
|
||||
td
|
||||
em
|
||||
code data-aos-anchor
|
||||
td
|
||||
| Anchor element, whose offset will be counted to trigger animation instead of actual elements offset
|
||||
td #selector
|
||||
td null
|
||||
tr
|
||||
td
|
||||
em
|
||||
code data-aos-anchor-placement
|
||||
td
|
||||
| Anchor placement - which one position of element on the screen should trigger animation
|
||||
td top-center
|
||||
td top-bottom
|
||||
tr
|
||||
td
|
||||
em
|
||||
code data-aos-once
|
||||
td
|
||||
| Choose wheter animation should fire once, or every time you scroll up/down to element
|
||||
td true
|
||||
td false
|
||||
.card
|
||||
.card-header
|
||||
h5 Animation
|
||||
span There are serveral predefined animations you can use already:
|
||||
.card-body
|
||||
ul.line
|
||||
li
|
||||
h5 Fade animations:
|
||||
ul.ps-4.mb-4.list-circle
|
||||
li fade
|
||||
li fade-up
|
||||
li fade-down
|
||||
li fade-left
|
||||
li fade-right
|
||||
li fade-up-right
|
||||
li fade-up-left
|
||||
li fade-down-right
|
||||
li fade-down-left
|
||||
li
|
||||
h5 Flip animations:
|
||||
ul.ps-4.mb-4.list-circle
|
||||
li flip-up
|
||||
li flip-down
|
||||
li flip-left
|
||||
li flip-right
|
||||
li
|
||||
h5 Slide animations:
|
||||
ul.ps-4.mb-4.list-circle
|
||||
li slide-up
|
||||
li slide-down
|
||||
li slide-left
|
||||
li slide-right
|
||||
li
|
||||
h5 Zoom animations:
|
||||
ul.ps-4.list-circle
|
||||
li zoom-in
|
||||
li zoom-in-up
|
||||
li zoom-in-down
|
||||
li zoom-in-left
|
||||
li zoom-in-right
|
||||
li zoom-out
|
||||
li zoom-out-up
|
||||
li zoom-out-down
|
||||
li zoom-out-left
|
||||
li zoom-out-right
|
||||
.card
|
||||
.card-header
|
||||
h5 Anchor placement:
|
||||
.card-body
|
||||
ul.ps-4.list-circle.line
|
||||
li top-bottom
|
||||
li top-center
|
||||
li top-top
|
||||
li center-bottom
|
||||
li center-center
|
||||
li center-top
|
||||
li bottom-bottom
|
||||
li bottom-center
|
||||
li bottom-top
|
||||
.card
|
||||
.card-header
|
||||
h5 Easing functions:
|
||||
.card-body
|
||||
ul.ps-4.list-circle.line
|
||||
li linear
|
||||
li ease
|
||||
li ease-in
|
||||
li ease-out
|
||||
li ease-in-out
|
||||
li ease-in-back
|
||||
li ease-out-back
|
||||
li ease-in-out-back
|
||||
li ease-in-sine
|
||||
li ease-out-sine
|
||||
li ease-in-out-sine
|
||||
li ease-in-quad
|
||||
li ease-out-quad
|
||||
li ease-in-out-quad
|
||||
li ease-in-cubic
|
||||
li ease-out-cubic
|
||||
li ease-in-out-cubic
|
||||
li ease-in-quart
|
||||
li ease-out-quart
|
||||
li ease-in-out-quart
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
641
static/admin/assets/pug/pages/theme/according.pug
Normal file
641
static/admin/assets/pug/pages/theme/according.pug
Normal file
@@ -0,0 +1,641 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var height_equal = true;
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h4
|
||||
| Accordion
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Ui Kits
|
||||
li.breadcrumb-item.active Accordion
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Simple Accordion
|
||||
p.f-m-light.mt-1
|
||||
| Click the accordions below to expand/collapse the accordion content.
|
||||
| Use the
|
||||
code .accordion
|
||||
| .
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
#accordionExample.accordion.dark-accordion
|
||||
.accordion-item
|
||||
h2#headingOne.accordion-header
|
||||
button.accordion-button.collapsed.accordion-light-primary.txt-primary.active(type='button' data-bs-toggle='collapse' data-bs-target='#collapseOne' aria-expanded='true' aria-controls='collapseOne')
|
||||
| What do web designers do?
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#collapseOne.accordion-collapse.collapse.show(aria-labelledby='headingOne' data-bs-parent='#accordionExample')
|
||||
.accordion-body
|
||||
p
|
||||
| Web design
|
||||
em.txt-danger identifies the goals
|
||||
| of a website or webpage and promotes accessibility for all potential users. This process involves organizing content and images across a series of pages and integrating applications and other interactive elements.
|
||||
.accordion-item
|
||||
h2#headingTwo.accordion-header
|
||||
button.accordion-button.collapsed.accordion-light-primary.txt-primary.active(type='button' data-bs-toggle='collapse' data-bs-target='#collapseTwo' aria-expanded='false' aria-controls='collapseTwo')
|
||||
| What is the use of web design?
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#collapseTwo.accordion-collapse.collapse(aria-labelledby='headingTwo' data-bs-parent='#accordionExample')
|
||||
.accordion-body
|
||||
p
|
||||
strong Search engine optimization:
|
||||
| Search engine optimization (SEO) is a method for improving the chances for a website to be found by search engines. Web design codes information in a way that search engines can read it. It can boost business because the site shows up on the top search result pages, helping people to find it.
|
||||
br
|
||||
br
|
||||
strong Mobile responsiveness:
|
||||
| Mobile responsiveness is the feature of a website that allows it to display on a mobile device and adapt its layout and proportions to be legible. Web design ensures sites are easy to view and navigate from mobile devices. When a website is well-designed and mobile-responsive, customers can reach the business with ease.
|
||||
br
|
||||
br
|
||||
strong Improved sales:
|
||||
| Increasing the number of items sold or acquiring more active customers are objectives of a compelling website. As web design reaches targeted customers and search engines, it helps the business make conversions on their site and improve its sales.
|
||||
.accordion-item
|
||||
h2#headingThree.accordion-header
|
||||
button.accordion-button.collapsed.accordion-light-primary.txt-primary.active(type='button' data-bs-toggle='collapse' data-bs-target='#collapseThree' aria-expanded='false' aria-controls='collapseThree')
|
||||
| What are the elements of web design?
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#collapseThree.accordion-collapse.collapse(aria-labelledby='headingThree' data-bs-parent='#accordionExample')
|
||||
.accordion-body
|
||||
p
|
||||
| The web design process allows designers to adjust to any preferences and provide effective solutions. There are many standard components of every web design, including:
|
||||
br
|
||||
|--> Layout
|
||||
br
|
||||
|--> Images
|
||||
br
|
||||
|--> Visual hierarchy
|
||||
br
|
||||
|--> Color scheme
|
||||
br
|
||||
|--> Typography
|
||||
br
|
||||
|--> Navigation
|
||||
br
|
||||
|--> Readability
|
||||
br
|
||||
|--> Content
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#according', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#according
|
||||
| <!--You can use .accordion-collapse with .show class then show accordions.-->
|
||||
| <div class="accordion" id="accordionExample">
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="headingOne">
|
||||
| <button class="accordion-button collapsed accordion-light-primary txt-primary active" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">What do web designers do?<i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse show" id="collapseOne" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
||||
| <div class="accordion-body">
|
||||
| <p>
|
||||
| Web design<em class="txt-danger"> identifies the goals</em> of a website or webpage and promotes accessibility for all potential users. This process involves organizing content and images across a series of pages and integrating applications and other interactive elements.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="headingTwo">
|
||||
| <button class="accordion-button collapsed accordion-light-secondary txt-secondary active" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">What is the use of web design?<i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="collapseTwo" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
|
||||
| <div class="accordion-body">
|
||||
| <p> <strong> Search engine optimization: </strong> Search engine optimization (SEO) is a method for improving the chances for a website to be found by search engines. Web design codes information in a way that search engines can read it. It can boost business because the site shows up on the top search result pages, helping people to find it.<br><br><strong> Mobile responsiveness:</strong> Mobile responsiveness is the feature of a website that allows it to display on a mobile device and adapt its layout and proportions to be legible. Web design ensures sites are easy to view and navigate from mobile devices. When a website is well-designed and mobile-responsive, customers can reach the business with ease.<br><br><strong> Improved sales:</strong>Increasing the number of items sold or acquiring more active customers are objectives of a compelling website. As web design reaches targeted customers and search engines, it helps the business make conversions on their site and improve its sales.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="headingThree">
|
||||
| <button class="accordion-button collapsed accordion-light-warning txt-warning active" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">What are the elements of web design?<i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="collapseThree" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
|
||||
| <div class="accordion-body">
|
||||
| <p>
|
||||
| The web design process allows designers to adjust to any preferences and provide effective solutions. There are many standard components of every web design, including:<br>--> Layout<br>--> Images<br>--> Visual hierarchy<br>--> Color scheme<br>--> Typography<br>--> Navigation<br>--> Readability<br>--> Content</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
.col-sm-12.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Flush Accordion
|
||||
p.f-m-light.mt-1
|
||||
| Add
|
||||
code .accordion-flush
|
||||
| to remove the default
|
||||
code background-color
|
||||
| , some borders, and some rounded corners to render accordions edge-to-edge with their parent container.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
#accordionFlushExample.accordion.accordion-flush.dark-accordion
|
||||
.accordion-item
|
||||
h2#flush-headingOne.accordion-header
|
||||
button.accordion-button.collapsed.txt-success.accordion-light-success.active(type='button' data-bs-toggle='collapse' data-bs-target='#flush-collapseOne' aria-expanded='false' aria-controls='flush-collapseOne')
|
||||
| What is bootstrap?
|
||||
#flush-collapseOne.accordion-collapse.collapse.show(aria-labelledby='flush-headingOne' data-bs-parent='#accordionFlushExample')
|
||||
.accordion-body
|
||||
p
|
||||
| --> Bootstrap is the most popular HTML, CSS and JavaScript framework for developing a responsive and mobile friendly website.
|
||||
br
|
||||
| --> It is absolutely free to download and use.
|
||||
.accordion-item
|
||||
h2#flush-headingTwo.accordion-header
|
||||
button.accordion-button.collapsed.txt-success.accordion-light-success(type='button' data-bs-toggle='collapse' data-bs-target='#flush-collapseTwo' aria-expanded='false' aria-controls='flush-collapseTwo')
|
||||
| Why Should You Use Bootstrap?
|
||||
#flush-collapseTwo.accordion-collapse.collapse(aria-labelledby='flush-headingTwo' data-bs-parent='#accordionFlushExample')
|
||||
.accordion-body
|
||||
p
|
||||
| First and foremost, Bootstrap is easy to learn. Due to its popularity, plenty of tutorials and online forums are available to help you get started.
|
||||
br
|
||||
|One of the reasons why Bootstrap is so popular among web developers and web designers is that it has a simple file structure. Its files are compiled for easy access, and it only requires basic knowledge of HTML, CSS, and JS to modify them.
|
||||
br
|
||||
| You can also use themes for popular content management systems as learning tools. For example, most WordPress themes were developed using Bootstrap, which any beginner web developer can access.
|
||||
br
|
||||
|To increase the site's page load time, Bootstrap minifies the CSS and JavaScript files. Additionally, Bootstrap maintains consistency across the syntax between websites and developers, which is ideal for team-based projects.
|
||||
.accordion-item
|
||||
h2#flush-headingThree.accordion-header
|
||||
button.accordion-button.collapsed.txt-success.accordion-light-success(type='button' data-bs-toggle='collapse' data-bs-target='#flush-collapseThree' aria-expanded='false' aria-controls='flush-collapseThree')
|
||||
| Bootstrap Image System
|
||||
#flush-collapseThree.accordion-collapse.collapse(aria-labelledby='flush-headingThree' data-bs-parent='#accordionFlushExample')
|
||||
.accordion-body
|
||||
p
|
||||
| Bootstrap handles the image display and responsiveness with its predefined HTML and CSS rules.
|
||||
br
|
||||
| Adding the .img-responsive class will automatically resize images based on the users' screen size. This will benefit your website’s performance, as reducing image sizes is part of the site optimization process.
|
||||
br
|
||||
| Bootstrap also provides additional classes like .img-circle and .img-rounded, which help to modify the images' shape.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#flush-according', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#flush-according
|
||||
| <!--You can use .accordion-collapse with .show class then show accordions.-->
|
||||
| <div class="accordion accordion-flush" id="accordionFlushExample">
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="flush-headingOne">
|
||||
| <button class="accordion-button collapsed txt-success accordion-light-success active" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">What is bootstrap?</button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse show" id="flush-collapseOne" aria-labelledby="flush-headingOne" data-bs-parent="#accordionFlushExample">
|
||||
| <div class="accordion-body">
|
||||
| <p>
|
||||
| --> Bootstrap is the most popular HTML, CSS and JavaScript framework for developing a responsive and mobile friendly website.<br>--> It is absolutely free to download and use.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="flush-headingTwo">
|
||||
| <button class="accordion-button collapsed txt-danger accordion-light-danger" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseTwo" aria-expanded="false" aria-controls="flush-collapseTwo">Why Should You Use Bootstrap?</button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="flush-collapseTwo" aria-labelledby="flush-headingTwo" data-bs-parent="#accordionFlushExample">
|
||||
| <div class="accordion-body">
|
||||
| <p>First and foremost, Bootstrap is easy to learn. Due to its popularity, plenty of tutorials and online forums are available to help you get started.<br>One of the reasons why Bootstrap is so popular among web developers and web designers is that it has a simple file structure. Its files are compiled for easy access, and it only requires basic knowledge of HTML, CSS, and JS to modify them.<br>You can also use themes for popular content management systems as learning tools. For example, most WordPress themes were developed using Bootstrap, which any beginner web developer can access. <br>To increase the site's page load time, Bootstrap minifies the CSS and JavaScript files. Additionally, Bootstrap maintains consistency across the syntax between websites and developers, which is ideal for team-based projects.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="flush-headingThree">
|
||||
| <button class="accordion-button collapsed txt-primary accordion-light-primary" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseThree" aria-expanded="false" aria-controls="flush-collapseThree">Bootstrap Image System</button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="flush-collapseThree" aria-labelledby="flush-headingThree" data-bs-parent="#accordionFlushExample">
|
||||
| <div class="accordion-body">
|
||||
| <p>
|
||||
| Bootstrap handles the image display and responsiveness with its predefined HTML and CSS rules.<br>Adding the .img-responsive class will automatically resize images based on the users' screen size. This will benefit your website’s performance, as reducing image sizes is part of the site optimization process.<br>Bootstrap also provides additional classes like .img-circle and .img-rounded, which help to modify the images' shape.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h4 Multiple Collapse Accordion
|
||||
p.f-m-light.mt-1
|
||||
| A
|
||||
code <button>
|
||||
| or
|
||||
code <a>
|
||||
| can show and hide multiple elements by referencing them with a selector in its href or data-bs-target attribute.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
.common-flex
|
||||
a.btn.btn-primary(data-bs-toggle='collapse' href='#multiCollapseExample1' role='button' aria-expanded='false' aria-controls='multiCollapseExample1') Toggle first element
|
||||
button.btn.btn-warning(type='button' data-bs-toggle='collapse' data-bs-target='#multiCollapseExample2' aria-expanded='false' aria-controls='multiCollapseExample2') Toggle second element
|
||||
button.btn.btn-success(type='button' data-bs-toggle='collapse' data-bs-target='.multi-collapse' aria-expanded='false' aria-controls='multiCollapseExample1 multiCollapseExample2') Toggle both elements
|
||||
.row.d-flex
|
||||
.col-xl-6
|
||||
#multiCollapseExample1.collapse.multi-collapse.dark-accordion
|
||||
.card.card-body.mt-3.mb-0.collapse-wrapper.accordion-light-primary
|
||||
| The collapse JavaScript plugin is used to show and hide content. Buttons or anchors are used as triggers that are mapped to specific elements you toggle. Collapsing an element will animate the height from it's current value to 0. Given how CSS handles animations, you cannot use padding on a .collapse element. Instead, use the class as an independent wrapping element.
|
||||
.col-xl-6
|
||||
#multiCollapseExample2.collapse.multi-collapse.dark-accordion
|
||||
.card.card-body.mt-3.mb-0.collapse-wrapper.accordion-light-warning
|
||||
| This is the first item's accordion body. It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#multiple-according', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#multiple-according
|
||||
| <!--You can use .accordion-collapse with .show class then show accordions.-->
|
||||
| <div class="common-flex"><a class="btn btn-primary" data-bs-toggle="collapse" href="#multiCollapseExample1" role="button" aria-expanded="false" aria-controls="multiCollapseExample1">Toggle first element</a>
|
||||
| <button class="btn btn-warning" type="button" data-bs-toggle="collapse" data-bs-target="#multiCollapseExample2" aria-expanded="false" aria-controls="multiCollapseExample2">Toggle second element</button>
|
||||
| <button class="btn btn-success" type="button" data-bs-toggle="collapse" data-bs-target=".multi-collapse" aria-expanded="false" aria-controls="multiCollapseExample1 multiCollapseExample2">Toggle both elements</button>
|
||||
| </div>
|
||||
| <div class="row d-flex">
|
||||
| <div class="col-xl-6">
|
||||
| <div class="collapse multi-collapse" id="multiCollapseExample1">
|
||||
| <div class="card card-body mt-3 mb-0 collapse-wrapper accordion-light-primary">The collapse JavaScript plugin is used to show and hide content. Buttons or anchors are used as triggers that are mapped to specific elements you toggle. Collapsing an element will animate the height from it's current value to 0. Given how CSS handles animations, you cannot use padding on a .collapse element. Instead, use the class as an independent wrapping element.</div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="col-xl-6">
|
||||
| <div class="collapse multi-collapse" id="multiCollapseExample2">
|
||||
| <div class="card card-body mt-3 mb-0 collapse-wrapper accordion-light-warning">This is the first item's accordion body. It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables.</div>
|
||||
| </div>
|
||||
.col-xl-6.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h4 With Icons Accordion
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .accordion
|
||||
| &
|
||||
code feather icons
|
||||
| through change look icons accordion.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body.accordion-border
|
||||
#accordionPanelsStayOpenExample.accordion.dark-accordion
|
||||
.accordion-item
|
||||
h2#panelsStayOpen-headingOne.accordion-header
|
||||
button.accordion-button.collapsed.gap-2.accordion-light-secondary.active.txt-secondary(type='button' data-bs-toggle='collapse' data-bs-target='#panelsStayOpen-collapseOne' aria-expanded='false' aria-controls='panelsStayOpen-collapseOne')
|
||||
i.svg-wrapper(data-feather='bell')
|
||||
| Keep in touch
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#panelsStayOpen-collapseOne.accordion-collapse.collapse(aria-labelledby='panelsStayOpen-headingOne')
|
||||
.accordion-body
|
||||
p
|
||||
em.txt-danger " This page might not behave as expected because Windows Internet Explorer isn't configured to load unsigned ActiveX controls."
|
||||
| or "Allow this page to install an unsigned ActiveX Control? Doing so from untrusted sources may harm your computer." (Both phrased as conditions that may cause future problems.)
|
||||
.accordion-item
|
||||
h2#panelsStayOpen-headingTwo.accordion-header
|
||||
button.accordion-button.collapsed.gap-2.accordion-light-secondary.active.txt-secondary(type='button' data-bs-toggle='collapse' data-bs-target='#panelsStayOpen-collapseTwo' aria-expanded='false' aria-controls='panelsStayOpen-collapseTwo')
|
||||
i.svg-wrapper(data-feather='message-circle')
|
||||
| Chats with others
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#panelsStayOpen-collapseTwo.accordion-collapse.collapse(aria-labelledby='panelsStayOpen-headingTwo')
|
||||
.accordion-body
|
||||
p
|
||||
| You get the same features in Chat and Chat in Gmail, but the integrated Gmail experience provides a central location to communicate with friends, family, or coworkers between emails.
|
||||
br
|
||||
strong Chat:
|
||||
| Use when you prefer a dedicated chat experience and don't mind switching between different apps.
|
||||
.accordion-item
|
||||
h2#panelsStayOpen-headingThree.accordion-header
|
||||
button.accordion-button.collapsed.gap-2.accordion-light-secondary.active.txt-secondary(type='button' data-bs-toggle='collapse' data-bs-target='#panelsStayOpen-collapseThree' aria-expanded='false' aria-controls='panelsStayOpen-collapseThree')
|
||||
i.svg-wrapper(data-feather='check-square')
|
||||
| Right way to code
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#panelsStayOpen-collapseThree.accordion-collapse.collapse(aria-labelledby='panelsStayOpen-headingThree')
|
||||
.accordion-body
|
||||
p
|
||||
| 1) Decide on the indentation and keep it that way.
|
||||
br
|
||||
| 2) Make comments.
|
||||
br
|
||||
| 3) Consistent name scheme.
|
||||
br
|
||||
| 4) Don't repeat code.
|
||||
br
|
||||
| 5) Avoid writing long code lines.
|
||||
br
|
||||
| 6) Break down a big task into smaller chunks.
|
||||
br
|
||||
| 7) Organize your program into smaller files.
|
||||
br
|
||||
| 8) Write clever code that is also readable.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#icons-according', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#icons-according
|
||||
| <!--You can use .accordion-collapse with .show class then show accordions.-->
|
||||
| <div class="accordion" id="accordionPanelsStayOpenExample">
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="panelsStayOpen-headingOne">
|
||||
| <button class="accordion-button collapsed gap-2 accordion-light-primary active txt-primary" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseOne" aria-expanded="false" aria-controls="panelsStayOpen-collapseOne"><i class="svg-wrapper" data-feather="bell"></i>Keep in touch<i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="panelsStayOpen-collapseOne" aria-labelledby="panelsStayOpen-headingOne">
|
||||
| <div class="accordion-body">
|
||||
| <p> <em class="txt-danger"> " This page might not behave as expected because Windows Internet Explorer isn't configured to load unsigned ActiveX controls."</em> or "Allow this page to install an unsigned ActiveX Control? Doing so from untrusted sources may harm your computer." (Both phrased as conditions that may cause future problems.)</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="panelsStayOpen-headingTwo">
|
||||
| <button class="accordion-button collapsed gap-2 accordion-light-warning active txt-warning" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseTwo" aria-expanded="false" aria-controls="panelsStayOpen-collapseTwo"><i class="svg-wrapper" data-feather="message-circle"></i>Chats with others<i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="panelsStayOpen-collapseTwo" aria-labelledby="panelsStayOpen-headingTwo">
|
||||
| <div class="accordion-body">
|
||||
| <p>
|
||||
| You get the same features in Chat and Chat in Gmail, but the integrated Gmail experience provides a central location to communicate with friends, family, or coworkers between emails.<br><strong> Chat:</strong> Use when you prefer a dedicated chat experience and don't mind switching between different apps.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="accordion-item">
|
||||
| <h2 class="accordion-header" id="panelsStayOpen-headingThree">
|
||||
| <button class="accordion-button collapsed gap-2 accordion-light-secondary active txt-secondary" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseThree" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree"><i class="svg-wrapper" data-feather="check-square"></i>Right way to code <i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="panelsStayOpen-collapseThree" aria-labelledby="panelsStayOpen-headingThree">
|
||||
| <div class="accordion-body">
|
||||
| <p>
|
||||
| 1) Decide on the indentation and keep it that way.<br>2) Make comments.<br>3) Consistent name scheme.<br>4) Don't repeat code.<br>5) Avoid writing long code lines.<br>6) Break down a big task into smaller chunks.<br>7) Organize your program into smaller files.<br>8) Write clever code that is also readable.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
.col-xl-6.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h4 Left Side Bordered Accordion
|
||||
p.f-m-light.mt-1
|
||||
| make custom
|
||||
code .accordion-wrapper
|
||||
| class use to bring border-left side.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
#accordionExample.accordion.dark-accordion
|
||||
.accordion-item.accordion-wrapper
|
||||
h2#headingOne.accordion-header
|
||||
button.accordion-button.collapsed.accordion-light-primary.txt-primary(type='button' data-bs-toggle='collapse' data-bs-target='#left-collapseOne' aria-expanded='true' aria-controls='left-collapseOne')
|
||||
| What do web designers do?
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#left-collapseOne.accordion-collapse.collapse(aria-labelledby='headingOne' data-bs-parent='#accordionExample')
|
||||
.accordion-body
|
||||
p
|
||||
| Web design
|
||||
em.txt-danger identifies the goals
|
||||
| of a website or webpage and promotes accessibility for all potential users. This process involves organizing content and images across a series of pages and integrating applications and other interactive elements.
|
||||
.accordion-item.accordion-wrapper
|
||||
h2#headingTwo.accordion-header
|
||||
button.accordion-button.collapsed.accordion-light-primary.txt-primary(type='button' data-bs-toggle='collapse' data-bs-target='#left-collapseTwo' aria-expanded='false' aria-controls='left-collapseTwo')
|
||||
| What is the use of web design?
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#left-collapseTwo.accordion-collapse.collapse(aria-labelledby='headingTwo' data-bs-parent='#accordionExample')
|
||||
.accordion-body
|
||||
p
|
||||
strong Search engine optimization:
|
||||
| Search engine optimization (SEO) is a method for improving the chances for a website to be found by search engines. Web design codes information in a way that search engines can read it. It can boost business because the site shows up on the top search result pages, helping people to find it.
|
||||
br
|
||||
br
|
||||
strong Mobile responsiveness:
|
||||
| Mobile responsiveness is the feature of a website that allows it to display on a mobile device and adapt its layout and proportions to be legible. Web design ensures sites are easy to view and navigate from mobile devices. When a website is well-designed and mobile-responsive, customers can reach the business with ease.
|
||||
br
|
||||
br
|
||||
strong Improved sales:
|
||||
| Increasing the number of items sold or acquiring more active customers are objectives of a compelling website. As web design reaches targeted customers and search engines, it helps the business make conversions on their site and improve its sales.
|
||||
.accordion-item.accordion-wrapper
|
||||
h2#headingThree.accordion-header
|
||||
button.accordion-button.collapsed.accordion-light-primary.txt-primary(type='button' data-bs-toggle='collapse' data-bs-target='#left-collapseThree' aria-expanded='false' aria-controls='left-collapseThree')
|
||||
| What are the elements of web design?
|
||||
i.svg-color(data-feather='chevron-down')
|
||||
#left-collapseThree.accordion-collapse.collapse(aria-labelledby='headingThree' data-bs-parent='#accordionExample')
|
||||
.accordion-body
|
||||
p
|
||||
| The web design process allows designers to adjust to any preferences and provide effective solutions. There are many standard components of every web design, including:
|
||||
br
|
||||
|--> Layout
|
||||
br
|
||||
|--> Images
|
||||
br
|
||||
|--> Visual hierarchy
|
||||
br
|
||||
|--> Color scheme
|
||||
br
|
||||
|--> Typography
|
||||
br
|
||||
|--> Navigation
|
||||
br
|
||||
|--> Readability
|
||||
br
|
||||
|--> Content
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#left-according', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#left-according
|
||||
| <!--You can use .accordion-collapse with .show class then show accordions.-->
|
||||
| <div class="accordion" id="accordionExample">
|
||||
| <div class="accordion-item accordion-wrapper">
|
||||
| <h2 class="accordion-header" id="headingOne">
|
||||
| <button class="accordion-button collapsed accordion-light-primary txt-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">What do web designers do?<i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="collapseOne" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
||||
| <div class="accordion-body">
|
||||
| <p>
|
||||
| Web design<em class="txt-danger"> identifies the goals</em> of a website or webpage and promotes accessibility for all potential users. This process involves organizing content and images across a series of pages and integrating applications and other interactive elements.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="accordion-item accordion-wrapper">
|
||||
| <h2 class="accordion-header" id="headingTwo">
|
||||
| <button class="accordion-button collapsed accordion-light-primary txt-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">What is the use of web design?<i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="collapseTwo" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
|
||||
| <div class="accordion-body">
|
||||
| <p> <strong> Search engine optimization: </strong> Search engine optimization (SEO) is a method for improving the chances for a website to be found by search engines. Web design codes information in a way that search engines can read it. It can boost business because the site shows up on the top search result pages, helping people to find it.<br><br><strong> Mobile responsiveness:</strong> Mobile responsiveness is the feature of a website that allows it to display on a mobile device and adapt its layout and proportions to be legible. Web design ensures sites are easy to view and navigate from mobile devices. When a website is well-designed and mobile-responsive, customers can reach the business with ease.<br><br><strong> Improved sales:</strong>Increasing the number of items sold or acquiring more active customers are objectives of a compelling website. As web design reaches targeted customers and search engines, it helps the business make conversions on their site and improve its sales.</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <div class="accordion-item accordion-wrapper">
|
||||
| <h2 class="accordion-header" id="headingThree">
|
||||
| <button class="accordion-button collapsed accordion-light-primary txt-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">What are the elements of web design?<i class="svg-color" data-feather="chevron-down"></i></button>
|
||||
| </h2>
|
||||
| <div class="accordion-collapse collapse" id="collapseThree" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
|
||||
| <div class="accordion-body">
|
||||
| <p>
|
||||
| The web design process allows designers to adjust to any preferences and provide effective solutions. There are many standard components of every web design, including:<br>--> Layout<br>--> Images<br>--> Visual hierarchy<br>--> Color scheme<br>--> Typography<br>--> Navigation<br>--> Readability<br>--> Content</p>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
.col-md-6.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h4 Horizontal Accordion
|
||||
p.f-m-light.mt-1
|
||||
| Add the
|
||||
code .collapse-horizontal
|
||||
| modifier class to transition the width instead of height and set a width on the immediate child element.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
.common-flex
|
||||
button.btn.btn-secondary(type='button' data-bs-toggle='collapse' data-bs-target='#collapseWidthExample' aria-expanded='false' aria-controls='collapseWidthExample')
|
||||
| Toggle width collapse
|
||||
.row
|
||||
.col-sm-5
|
||||
#collapseWidthExample.collapse.collapse-horizontal.mt-3
|
||||
.card.card-body.bg-secondary-light.accordion-h-space.mb-0
|
||||
| The collapse plugin also supports horizontal collapsing. Add the .collapse-horizontal modifier class to transition the width instead of height and set a width on the immediate child element. Feel free to write your own custom Sass, use inline styles, or use our width utilities.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#horizontal-according', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#horizontal-according
|
||||
| <!--You can use .accordion-collapse with .show class then show accordions.-->
|
||||
| <div class="common-flex">
|
||||
| <button class="btn btn-secondary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWidthExample" aria-expanded="false" aria-controls="collapseWidthExample">Toggle width collapse</button>
|
||||
| </div>
|
||||
| <div class="row">
|
||||
| <div class="col-sm-5">
|
||||
| <div class="collapse collapse-horizontal mt-3" id="collapseWidthExample">
|
||||
| <div class="card card-body bg-secondary-light accordion-h-space mb-0">The collapse plugin also supports horizontal collapsing. Add the .collapse-horizontal modifier class to transition the width instead of height and set a width on the immediate child element. Feel free to write your own custom Sass, use inline styles, or use our width utilities.</div>
|
||||
| </div>
|
||||
| </div>
|
||||
.col-md-6.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h4 Collapse Accordion
|
||||
p.f-m-light.mt-1
|
||||
| you can also use a link with the href attribute
|
||||
code (and a role="button").
|
||||
| In both cases, the
|
||||
code data-bs-toggle="collapse"
|
||||
| is required.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p.common-flex
|
||||
a.btn.btn-dark(data-bs-toggle='collapse' href='#collapseExample' role='button' aria-expanded='false' aria-controls='collapseExample')
|
||||
| Link with href
|
||||
button.btn.btn-dark(type='button' data-bs-toggle='collapse' data-bs-target='#collapseExample' aria-expanded='false' aria-controls='collapseExample')
|
||||
| Button with data-bs-target
|
||||
#collapseExample.collapse.btn-dark
|
||||
.card.card-body.mb-0.dark-accordion
|
||||
| Some placeholder content for the collapse component. This panel is hidden by default but revealed when the user activates the relevant trigger.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#collapse-according', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#collapse-according
|
||||
| <!--You can use .accordion-collapse with .show class then show accordions.-->
|
||||
| <p class="common-flex"><a class="btn btn-dark" data-bs-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">Link with href</a>
|
||||
| <button class="btn btn-dark" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">Button with data-bs-target</button>
|
||||
| </p>
|
||||
| <div class="collapse btn-dark" id="collapseExample">
|
||||
| <div class="card card-body mb-0">Some placeholder content for the collapse component. This panel is hidden by default but revealed when the user activates the relevant trigger.</div>
|
||||
| </div>
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
151
static/admin/assets/pug/pages/theme/ace-code-editor.pug
Normal file
151
static/admin/assets/pug/pages/theme/ace-code-editor.pug
Normal file
@@ -0,0 +1,151 @@
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
- var ace_editor = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| ACE Code Editor
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Editors
|
||||
li.breadcrumb-item.active ACE Code Editor
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Javascript Mode
|
||||
.card-body
|
||||
#editor.ace-editor
|
||||
| /* Sample JavaScript edit source */
|
||||
| // Define a module
|
||||
| var app = angular.module('app', ['ui.bootstrap']);
|
||||
| // Define a conroller.
|
||||
| app.controller('GrokController', ['$scope', '$filter',
|
||||
| function($scope, $filter) {
|
||||
| $scope.today = function() {
|
||||
| $scope.dt = new Date();
|
||||
| };
|
||||
| $scope.today();
|
||||
| $scope.isOpened = false;
|
||||
| $scope.open = function($event) {
|
||||
| $event.preventDefault();
|
||||
| $event.stopPropagation();
|
||||
| $scope.isOpened = true;
|
||||
| };
|
||||
| }]);
|
||||
| /* End of sample edit source */
|
||||
.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Html Mode
|
||||
.card-body
|
||||
#html-editor.ace-editor
|
||||
| <!--Page header start-->
|
||||
| <div class="page-header">
|
||||
| <div class="row">
|
||||
| <div class="col-xl-6">
|
||||
| <h3>Ace Text editor</h3>
|
||||
| </div>
|
||||
| <div class="col-xl-6">
|
||||
| <ol class="breadcrumb pull-right">
|
||||
| <li class="breadcrumb-item">
|
||||
a(href='#')
|
||||
i.fa.fa-home
|
||||
| </li>
|
||||
| <li class="breadcrumb-item">Editor </li>
|
||||
| <li class="breadcrumb-item active">Ace Text editor</li>
|
||||
| </ol>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <!--Page header end-->
|
||||
.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 css Mode
|
||||
.card-body
|
||||
#css-editor.ace-editor
|
||||
| .text-layer
|
||||
| {
|
||||
| font: 12px Monaco, "Courier New", monospace;
|
||||
| font-size: 3vmin;
|
||||
| cursor: text;
|
||||
| }
|
||||
| .blinker {
|
||||
| animation: blink 1s linear infinite alternate;
|
||||
| }
|
||||
| @keyframes blink {
|
||||
| 0%, 40% {
|
||||
| opacity: 1
|
||||
| }
|
||||
| 40.5%, 100% {
|
||||
| opacity: 1
|
||||
| }
|
||||
| }
|
||||
| @document url(http://c9.io/), url-prefix(http://ace.c9.io/build/),
|
||||
| domain(c9.io), regexp("https:.*") /**/
|
||||
| {
|
||||
| /**/
|
||||
| img[title]:before
|
||||
| {
|
||||
| content: attr(title) "\AImage \retrieved from" attr(src); /**/
|
||||
| white-space: pre;
|
||||
| display: block;
|
||||
| background: url(asdasd); "err
|
||||
| }
|
||||
| }
|
||||
| @viewport {
|
||||
| min-zoom: 1;
|
||||
| max-zoom: 200%;
|
||||
| user-zoom: fixed;
|
||||
| }
|
||||
.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 php Mode
|
||||
.card-body
|
||||
#php-editor.ace-editor
|
||||
| <?php
|
||||
| function nfact($n) {
|
||||
| if ($n == 0) {
|
||||
| return 1;
|
||||
| }
|
||||
| else {
|
||||
| return $n * nfact($n - 1);
|
||||
| }
|
||||
| }
|
||||
| echo "\n\nPlease enter a whole number ... ";
|
||||
| $num = trim(fgets(STDIN));
|
||||
| // ===== PROCESS - Determing the factorial of the input number =====
|
||||
| $output = "\n\nFactorial " . $num . " = " . nfact($num) . "\n\n";
|
||||
| echo $output;
|
||||
| ?>
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
90
static/admin/assets/pug/pages/theme/add-post.pug
Normal file
90
static/admin/assets/pug/pages/theme/add-post.pug
Normal file
@@ -0,0 +1,90 @@
|
||||
- var theme_customizer = true;
|
||||
- var form_validation_custom= true;
|
||||
- var select2 = true;
|
||||
- var page_select2 = true;
|
||||
- var dropzone = true;
|
||||
- var ckeditor = true;
|
||||
- var email_app = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Add Post
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Blog
|
||||
li.breadcrumb-item.active Add Post
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Post Edit
|
||||
.card-body.add-post
|
||||
form.row.needs-validation(novalidate='')
|
||||
.col-sm-12
|
||||
.mb-3
|
||||
label(for='validationCustom01') Title:
|
||||
input#validationCustom01.form-control(type='text', placeholder='Post Title', required='')
|
||||
.valid-feedback
|
||||
| Looks good!
|
||||
.mb-3
|
||||
label Type:
|
||||
.m-checkbox-inline
|
||||
label(for='edo-ani')
|
||||
input#edo-ani.radio_animated(type='radio', name='rdo-ani', checked='')
|
||||
| Text
|
||||
label(for='edo-ani1')
|
||||
input#edo-ani1.radio_animated(type='radio', name='rdo-ani')
|
||||
| Image
|
||||
label(for='edo-ani2')
|
||||
input#edo-ani2.radio_animated(type='radio', name='rdo-ani', checked='')
|
||||
| Audio
|
||||
label(for='edo-ani3')
|
||||
input#edo-ani3.radio_animated(type='radio', name='rdo-ani')
|
||||
| Video
|
||||
.mb-3
|
||||
.col-form-label Category:
|
||||
select.js-example-placeholder-multiple.col-sm-12(multiple='multiple')
|
||||
option(value='AL') Lifestyle
|
||||
option(value='WY') Travel
|
||||
.email-wrapper
|
||||
.theme-form
|
||||
.mb-3
|
||||
label Content:
|
||||
textarea#text-box(name='text-box', cols='10', rows='2')
|
||||
|
||||
form#singleFileUpload.dropzone(action='/upload.php')
|
||||
.m-0.dz-message.needsclick
|
||||
i.icon-cloud-up
|
||||
h6.mb-0 Drop files here or click to upload.
|
||||
.btn-showcase.text-end
|
||||
button.btn.btn-primary(type='submit') Post
|
||||
input.btn.btn-light(type='reset', value='Discard')
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
287
static/admin/assets/pug/pages/theme/alert.pug
Normal file
287
static/admin/assets/pug/pages/theme/alert.pug
Normal file
@@ -0,0 +1,287 @@
|
||||
- var theme_customizer = true;
|
||||
- var height_equal = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var alert = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h4
|
||||
| Alert
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Ui Kits
|
||||
li.breadcrumb-item.active Alert
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header
|
||||
h4 Link Color In Dark Theme
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .alert-link
|
||||
| utility class to quickly provide matching colored links within any alert
|
||||
.card-body
|
||||
.row
|
||||
.col-xl-6
|
||||
p.mb-0 Primary Alert
|
||||
.alert.alert-primary.dark(role='alert')
|
||||
p
|
||||
| This is a
|
||||
a.alert-link.text-white(href='#') primary alert
|
||||
| with an example link.Check it out.
|
||||
p.mb-0 Secondary Alert
|
||||
.alert.alert-secondary.dark(role='alert')
|
||||
p
|
||||
| This is a
|
||||
a.alert-link.text-white(href='#') secondary alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Success Alert
|
||||
.alert.alert-success.dark(role='alert')
|
||||
p
|
||||
| This is a
|
||||
a.alert-link.text-white(href='#') success alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Info Alert
|
||||
.alert.alert-info.dark(role='alert')
|
||||
p
|
||||
| This is a
|
||||
a.alert-link.text-white(href='#') info alert
|
||||
| with an example link. Check it out.
|
||||
.col-xl-6
|
||||
p.mb-0 Warning Alert
|
||||
.alert.alert-warning.dark(role='alert')
|
||||
p
|
||||
| This is a
|
||||
a.alert-link.text-white(href='#') warning alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Danger Alert
|
||||
.alert.alert-danger.dark(role='alert')
|
||||
p
|
||||
| This is a
|
||||
a.alert-link.text-white(href='#') danger alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Light Alert
|
||||
.alert.alert-light.dark(role='alert')
|
||||
p
|
||||
| This is a
|
||||
a.alert-link(href='#') light alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Dark Alert
|
||||
.alert.alert-dark.dark(role='alert')
|
||||
p
|
||||
| This is a
|
||||
a.alert-link.text-white(href='#') dark alert
|
||||
| with an example link. Check it out.
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header
|
||||
h4 Link Color In Light Theme
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .alert-link
|
||||
| utility class to quickly provide matching colored links within any alert
|
||||
.card-body
|
||||
.row
|
||||
.col-xl-6
|
||||
p.mb-0 Primary Light Alert
|
||||
.alert.alert-light-primary(role='alert')
|
||||
p.txt-primary
|
||||
| This is a
|
||||
a.alert-link.txt-primary(href='#') primary alert
|
||||
| with an example link.Check it out.
|
||||
p.mb-0 Secondary Light Alert
|
||||
.alert.alert-light-secondary(role='alert')
|
||||
p.txt-secondary
|
||||
| This is a
|
||||
a.alert-link.txt-secondary(href='#') secondary alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Success Light Alert
|
||||
.alert.alert-light-success(role='alert')
|
||||
.txt-success
|
||||
| This is a
|
||||
a.alert-link.txt-success(href='#') success alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Info Light Alert
|
||||
.alert.alert-light-info(role='alert')
|
||||
.txt-info
|
||||
| This is a
|
||||
a.alert-link.txt-info(href='#') info alert
|
||||
| with an example link. Check it out.
|
||||
.col-xl-6
|
||||
p.mb-0 Warning Light Alert
|
||||
.alert.alert-light-warning(role='alert')
|
||||
p.txt-warning
|
||||
| This is a
|
||||
a.alert-link.txt-warning(href='#') warning alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Danger Light Alert
|
||||
.alert.alert-light-danger(role='alert')
|
||||
p.txt-danger
|
||||
| This is a
|
||||
a.alert-link.txt-danger(href='#') danger alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 White Light Alert
|
||||
.alert.alert-light-light(role='alert')
|
||||
p.txt-dark
|
||||
| This is a
|
||||
a.alert-link.txt-dark(href='#') light alert
|
||||
| with an example link. Check it out.
|
||||
p.mb-0 Dark Light Alert
|
||||
.alert.alert-light-dark(role='alert')
|
||||
p.txt-dark
|
||||
| This is a
|
||||
a.alert-link.txt-dark(href='#') dark alert
|
||||
| with an example link. Check it out.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h4 Outline Dark And Light Alerts
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .border-*
|
||||
| utility class to quickly provide matching border and border-width within any alert.
|
||||
.card-body
|
||||
.alert.txt-primary.border-primary.alert-dismissible.fade.show(role='alert')
|
||||
i(data-feather='clock')
|
||||
p
|
||||
|One of
|
||||
strong YouTube's
|
||||
| most crucial ranking factors is Watch Time.
|
||||
button.btn-close(type='button', data-bs-dismiss='alert', aria-label='Close')
|
||||
.alert.txt-success.border-success.outline-2x.alert-dismissible.fade.show.alert-icons(role='alert')
|
||||
i(data-feather='thumbs-up')
|
||||
p
|
||||
b Well done!
|
||||
| You successfully read this important message.
|
||||
button.btn-close(type='button', data-bs-dismiss='alert', aria-label='Close')
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h4 Alerts With Icons and Text Actions
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .dismiss-text
|
||||
| class to add dismiss text instead of icon
|
||||
.card-body.dark-txt
|
||||
.alert.border-warning.alert-dismissible.fade.show.p-0(role='alert')
|
||||
.alert-arrow.bg-warning
|
||||
i.icon-timer
|
||||
p
|
||||
| Your time Over after
|
||||
strong.txt-dark 5
|
||||
| minute
|
||||
button.p-0.border-0.me-2.ms-auto(type='button' data-bs-dismiss='alert' aria-label='Close')
|
||||
span.bg-warning.text-black.px-3.py-1(aria-hidden='true') Check
|
||||
.alert.border-danger.alert-dismissible.fade.show.p-0.mb-0(role='alert')
|
||||
.alert-arrow.bg-danger
|
||||
i.icon-heart
|
||||
p
|
||||
| Oh snap! Change a few things up
|
||||
strong.txt-dark Notification check
|
||||
button.p-0.border-0.me-2.ms-auto(type='button' data-bs-dismiss='alert' aria-label='Close')
|
||||
span.bg-danger.text-white.px-3.py-1(aria-hidden='true') Alert
|
||||
.col-sm-12.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Dismissing Dark Alerts
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .alert-dismissible
|
||||
| utility class to quickly remove the alerts.
|
||||
.card-body
|
||||
.alert.alert-secondary.dark.alert-dismissible.fade.show(role='alert')
|
||||
i(data-feather='heart')
|
||||
p Check your update! You should check in on some of those fields below.
|
||||
button.btn-close(type='button', data-bs-dismiss='alert', aria-label='Close')
|
||||
.col-sm-12.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Dismissing Light Alerts
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .alert-dismissible
|
||||
| utility class to quickly remove the alerts.
|
||||
.card-body
|
||||
.alert.alert-warning.alert-dismissible.fade.show(role='alert')
|
||||
i(data-feather='bell')
|
||||
p Hidden content You should check in on some of those fields below.
|
||||
button.btn-close(type='button', data-bs-dismiss='alert', aria-label='Close')
|
||||
.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Live Alert
|
||||
p.f-m-light.mt-1
|
||||
| Click the button below to show an alert,then dismiss it with the built-in close button.
|
||||
.card-body.live-dark
|
||||
#liveAlertPlaceholder
|
||||
button#liveAlertBtn.btn.btn-dark(type='button') Show live alert
|
||||
.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Left Border Alert
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .border-left-wrapper
|
||||
| to change border-left radius.
|
||||
.card-body.live-dark
|
||||
.alert.alert-light-dark.light.alert-dismissible.fade.show.text-dark.border-left-wrapper(role='alert')
|
||||
i(data-feather='help-circle')
|
||||
p You can check in on some of those fields below.
|
||||
button.btn-close(type='button', data-bs-dismiss='alert', aria-label='Close')
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h4 Additional content
|
||||
p.f-m-light.mt-1
|
||||
| Use the
|
||||
code .alert
|
||||
| utility class to quickly provide additional content within any alerts.
|
||||
.card-body.dark-alert
|
||||
.alert.alert-light-primary(role='alert')
|
||||
h5.alert-heading.pb-2.txt-primary Please! Check your notifications
|
||||
p
|
||||
| The duty of notification is imposed upon the head of the family, and also upon the medical practitioner who may be in attendance on the patient.
|
||||
hr
|
||||
p.mb-0
|
||||
| The emergency notification system is free and is available in all 50 states.
|
||||
.alert.alert-light-secondary(role='alert')
|
||||
h5.alert-heading.pb-2.txt-secondary Something went wrong! Please, chrome update.
|
||||
p
|
||||
| The duty of notification is imposed upon the head of the family, and also upon the medical practitioner who may be in attendance on the patient.
|
||||
hr
|
||||
p.mb-0
|
||||
| Whenever you need to, be sure to use margin utilities to keep things nice and tidy.
|
||||
.alert.alert-light-success(role='alert')
|
||||
h5.alert-heading.pb-2.txt-success Please! Hidden cameras were not installed.
|
||||
p
|
||||
| Due to increasingly accessible technology, hidden cameras have grown in popularity among regular people in recent years.
|
||||
hr
|
||||
p.mb-0
|
||||
| Consider moving clocks and plush animals from your area if you think they may be concealing cameras because they are both portable items.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
226
static/admin/assets/pug/pages/theme/animate.pug
Normal file
226
static/admin/assets/pug/pages/theme/animate.pug
Normal file
@@ -0,0 +1,226 @@
|
||||
- var animate = true;
|
||||
- var page_animate = true;
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Animate
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Animation
|
||||
li.breadcrumb-item.active Animate
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-body
|
||||
.row
|
||||
.col-xl-6.col-md-8.offset-xl-3.offset-md-2
|
||||
#animation-box
|
||||
.card
|
||||
.animate-widget
|
||||
div
|
||||
img.img-fluid(src='../assets/images/banner/3.jpg', alt='')
|
||||
.text-center.p-25
|
||||
p.text-muted.mb-0
|
||||
| Denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings
|
||||
form.theme-form.text-center
|
||||
.mb-3
|
||||
select.form-select.input.input--dropdown.js-animations
|
||||
optgroup(label='Attention Seekers')
|
||||
option(value='bounce') bounce
|
||||
option(value='flash') flash
|
||||
option(value='pulse') pulse
|
||||
option(value='rubberBand') rubberBand
|
||||
option(value='shake') shake
|
||||
option(value='swing') swing
|
||||
option(value='tada') tada
|
||||
option(value='wobble') wobble
|
||||
option(value='jello') jello
|
||||
optgroup(label='Bouncing Entrances')
|
||||
option(value='bounceIn') bounceIn
|
||||
option(value='bounceInDown') bounceInDown
|
||||
option(value='bounceInLeft') bounceInLeft
|
||||
option(value='bounceInRight') bounceInRight
|
||||
option(value='bounceInUp') bounceInUp
|
||||
optgroup(label='Bouncing Exits')
|
||||
option(value='bounceOut') bounceOut
|
||||
option(value='bounceOutDown') bounceOutDown
|
||||
option(value='bounceOutLeft') bounceOutLeft
|
||||
option(value='bounceOutRight') bounceOutRight
|
||||
option(value='bounceOutUp') bounceOutUp
|
||||
optgroup(label='Fading Entrances')
|
||||
option(value='fadeIn') fadeIn
|
||||
option(value='fadeInDown') fadeInDown
|
||||
option(value='fadeInDownBig') fadeInDownBig
|
||||
option(value='fadeInLeft') fadeInLeft
|
||||
option(value='fadeInLeftBig') fadeInLeftBig
|
||||
option(value='fadeInRight') fadeInRight
|
||||
option(value='fadeInRightBig') fadeInRightBig
|
||||
option(value='fadeInUp') fadeInUp
|
||||
option(value='fadeInUpBig') fadeInUpBig
|
||||
optgroup(label='Fading Exits')
|
||||
option(value='fadeOut') fadeOut
|
||||
option(value='fadeOutDown') fadeOutDown
|
||||
option(value='fadeOutDownBig') fadeOutDownBig
|
||||
option(value='fadeOutLeft') fadeOutLeft
|
||||
option(value='fadeOutLeftBig') fadeOutLeftBig
|
||||
option(value='fadeOutRight') fadeOutRight
|
||||
option(value='fadeOutRightBig') fadeOutRightBig
|
||||
option(value='fadeOutUp') fadeOutUp
|
||||
option(value='fadeOutUpBig') fadeOutUpBig
|
||||
optgroup(label='Flippers')
|
||||
option(value='flip') flip
|
||||
option(value='flipInX') flipInX
|
||||
option(value='flipInY') flipInY
|
||||
option(value='flipOutX') flipOutX
|
||||
option(value='flipOutY') flipOutY
|
||||
optgroup(label='Lightspeed')
|
||||
option(value='lightSpeedIn') lightSpeedIn
|
||||
option(value='lightSpeedOut') lightSpeedOut
|
||||
optgroup(label='Rotating Entrances')
|
||||
option(value='rotateIn') rotateIn
|
||||
option(value='rotateInDownLeft') rotateInDownLeft
|
||||
option(value='rotateInDownRight') rotateInDownRight
|
||||
option(value='rotateInUpLeft') rotateInUpLeft
|
||||
option(value='rotateInUpRight') rotateInUpRight
|
||||
optgroup(label='Rotating Exits')
|
||||
option(value='rotateOut') rotateOut
|
||||
option(value='rotateOutDownLeft') rotateOutDownLeft
|
||||
option(value='rotateOutDownRight') rotateOutDownRight
|
||||
option(value='rotateOutUpLeft') rotateOutUpLeft
|
||||
option(value='rotateOutUpRight') rotateOutUpRight
|
||||
optgroup(label='Sliding Entrances')
|
||||
option(value='slideInUp') slideInUp
|
||||
option(value='slideInDown') slideInDown
|
||||
option(value='slideInLeft') slideInLeft
|
||||
option(value='slideInRight') slideInRight
|
||||
optgroup(label='Sliding Exits')
|
||||
option(value='slideOutUp') slideOutUp
|
||||
option(value='slideOutDown') slideOutDown
|
||||
option(value='slideOutLeft') slideOutLeft
|
||||
option(value='slideOutRight') slideOutRight
|
||||
optgroup(label='Zoom Entrances')
|
||||
option(value='zoomIn') zoomIn
|
||||
option(value='zoomInDown') zoomInDown
|
||||
option(value='zoomInLeft') zoomInLeft
|
||||
option(value='zoomInRight') zoomInRight
|
||||
option(value='zoomInUp') zoomInUp
|
||||
optgroup(label='Zoom Exits')
|
||||
option(value='zoomOut') zoomOut
|
||||
option(value='zoomOutDown') zoomOutDown
|
||||
option(value='zoomOutLeft') zoomOutLeft
|
||||
option(value='zoomOutRight') zoomOutRight
|
||||
option(value='zoomOutUp') zoomOutUp
|
||||
optgroup(label='Specials')
|
||||
option(value='hinge') hinge
|
||||
option(value='jackInTheBox') jackInTheBox
|
||||
option(value='rollIn') rollIn
|
||||
option(value='rollOut') rollOut
|
||||
button.js-triggeraNimation.btn.btn-primary Animate it
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 How to use it?
|
||||
span
|
||||
| All you have to do is to add animation name class attribute to html element, like :
|
||||
code Fade
|
||||
.card-body.options
|
||||
div flash
|
||||
div pulse
|
||||
div rubberBand
|
||||
div shake
|
||||
div swing
|
||||
div tada
|
||||
div wobble
|
||||
div jello
|
||||
div bounceIn
|
||||
div bounceInDown
|
||||
div bounceInLeft
|
||||
div bounceInRight
|
||||
div bounceInUp
|
||||
div bounceOut
|
||||
div bounceOutDown
|
||||
div bounceOutLeft
|
||||
div bounceOutRight
|
||||
div bounceOutUp
|
||||
div bounceOut
|
||||
div bounceOutDown
|
||||
div bounceOutLeft
|
||||
div bounceOutRight
|
||||
div bounceOutUp
|
||||
div fadeOut
|
||||
div fadeOutDown
|
||||
div fadeOutDownBig
|
||||
div fadeOutLeft
|
||||
div fadeOutLeftBig
|
||||
div fadeOutRight
|
||||
div fadeOutRightBig
|
||||
div fadeOutUp
|
||||
div fadeOutUpBig
|
||||
div flip
|
||||
div flipInX
|
||||
div flipInY
|
||||
div flipOutX
|
||||
div flipOutY
|
||||
div lightSpeedIn
|
||||
div lightSpeedOut
|
||||
div rotateIn
|
||||
div rotateInDownLeft
|
||||
div rotateInDownRight
|
||||
div rotateInUpLeft
|
||||
div rotateInUpRight
|
||||
div rotateOut
|
||||
div rotateOutDownLeft
|
||||
div rotateOutDownRight
|
||||
div rotateOutUpLeft
|
||||
div rotateOutUpRight
|
||||
div slideInUp
|
||||
div slideInDown
|
||||
div slideInLeft
|
||||
div slideInRight
|
||||
div slideOutUp
|
||||
div slideOutDown
|
||||
div slideOutLeft
|
||||
div slideOutRight
|
||||
div zoomIn
|
||||
div zoomInDown
|
||||
div zoomInLeft
|
||||
div zoomInRight
|
||||
div zoomInUp
|
||||
div zoomOut
|
||||
div zoomOutDown
|
||||
div zoomOutLeft
|
||||
div zoomOutRight
|
||||
div zoomOutUp
|
||||
div hinge
|
||||
div jackInTheBox
|
||||
div rollIn
|
||||
div rollOut
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
352
static/admin/assets/pug/pages/theme/avatars.pug
Normal file
352
static/admin/assets/pug/pages/theme/avatars.pug
Normal file
@@ -0,0 +1,352 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var height_equal = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h4
|
||||
| Avatars
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Ui Kits
|
||||
li.breadcrumb-item.active Avatars
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.user-profile
|
||||
.row
|
||||
.col-xl-4.col-md-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4.mb-0 Sizes
|
||||
p.mb-0.mt-1
|
||||
| You can change the size of avatar using
|
||||
code .img- * (70/80/90/100)
|
||||
| class.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body.avatar-showcase
|
||||
.avatars
|
||||
div.avatar
|
||||
img.img-100.rounded-circle(src='../assets/images/avtar/3.jpg', alt='#')
|
||||
div.avatar
|
||||
img.img-90.rounded-circle(src='../assets/images/avtar/4.jpg', alt='#')
|
||||
div.avatar
|
||||
img.img-80.rounded-circle(src='../assets/images/avtar/7.jpg', alt='#')
|
||||
div.avatar
|
||||
img.img-70.rounded-circle(src='../assets/images/avtar/11.jpg', alt='#')
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#avatar-size', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#avatar-size
|
||||
| <!--You can use img-* class through change the size of avatar (70/80/90/100).-->
|
||||
|<div class="avatar">
|
||||
|<img class="img-100 rounded-circle" src="../assets/images/avtar/3.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar">
|
||||
|<img class="img-90 rounded-circle" src="../assets/images/avtar/4.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar">
|
||||
|<img class="img-80 rounded-circle" src="../assets/images/avtar/7.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar">
|
||||
|<img class="img-70 rounded-circle" src="../assets/images/avtar/11.jpg" alt="#">
|
||||
|</div>
|
||||
.col-xl-4.col-md-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4.mb-0 Status Indicator
|
||||
p.mb-0.mt-1
|
||||
| Using
|
||||
code .status-* (online/offline/dnd)
|
||||
| class you can set the status of avatar.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body.avatar-showcase
|
||||
.avatars
|
||||
div.avatar
|
||||
img.img-100.rounded-circle(src='../assets/images/user/1.jpg', alt='#')
|
||||
.status.status-online
|
||||
div.avatar
|
||||
img.img-90.rounded-circle(src='../assets/images/avtar/16.jpg', alt='#')
|
||||
.status.status-dnd
|
||||
div.avatar
|
||||
img.img-80.rounded-circle(src='../assets/images/avtar/7.jpg', alt='#')
|
||||
.status.status-offline
|
||||
div.avatar
|
||||
img.img-70.rounded-circle(src='../assets/images/avtar/3.jpg', alt='#')
|
||||
.status.status-online
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#avatar-indicator', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#avatar-indicator
|
||||
|<!-- You can use status-* class through the set status (online/offline/dnd). -->
|
||||
|<div class="avatar">
|
||||
|<img class="img-100 rounded-circle" src="../assets/images/user/1.jpg" alt="#">
|
||||
|<div class="status status-online"></div>
|
||||
|</div>
|
||||
|<div class="avatar">
|
||||
|<img class="img-90 rounded-circle" src="../assets/images/avtar/16.jpg" alt="#">
|
||||
|<div class="status status-dnd"></div>
|
||||
|</div>
|
||||
|<div class="avatar"><img class="img-80 rounded-circle" src="../assets/images/avtar/7.jpg" alt="#">
|
||||
|<div class="status status-offline"></div>
|
||||
|</div>
|
||||
|<div class="avatar"><img class="img-70 rounded-circle" src="../assets/images/avtar/3.jpg" alt="#">
|
||||
|<div class="status status-online"></div>
|
||||
|</div>
|
||||
.col-xl-4.col-md-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Shapes
|
||||
p.mb-0.mt-1
|
||||
| Using the
|
||||
code .b-r-* (8/30/35/25)
|
||||
| class you can set the shapes of avatar.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body.avatar-showcase
|
||||
.avatars
|
||||
div.avatar
|
||||
img.img-100.b-r-8(src='../assets/images/avtar/4.jpg', alt='#')
|
||||
div.avatar
|
||||
img.img-90.b-r-30(src='../assets/images/avtar/16.jpg', alt='#')
|
||||
div.avatar
|
||||
img.img-80.b-r-35(src='../assets/images/avtar/3.jpg', alt='#')
|
||||
div.avatar
|
||||
img.img-70.rounded-circle(src='../assets/images/avtar/11.jpg', alt='#')
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#avatar-shapes', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#avatar-shapes
|
||||
|<!-- Give the shape to avatar using .b-r-* class. (8/25/30/35). -->
|
||||
|<div class="avatar">
|
||||
|<img class="img-100 b-r-8" src="../assets/images/avtar/4.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar">
|
||||
|<img class="img-90 b-r-30" src="../assets/images/avtar/16.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar">
|
||||
|<img class="img-80 b-r-35" src="../assets/images/avtar/3.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar">
|
||||
|<img class="img-70 rounded-circle" src="../assets/images/avtar/11.jpg" alt="#">
|
||||
|</div>
|
||||
.col-md-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Ratio
|
||||
p.mb-0.mt-1
|
||||
| Give the shape to avatar using
|
||||
code .ratio
|
||||
| and
|
||||
code img-* (50/70/80/90/100)
|
||||
| class.
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body.avatar-showcase
|
||||
.avatars
|
||||
div.avatar.ratio
|
||||
img.b-r-8.img-100(src='../assets/images/avtar/11.jpg', alt='#')
|
||||
div.avatar.ratio
|
||||
img.b-r-8.img-90(src='../assets/images/avtar/4.jpg', alt='#')
|
||||
div.avatar.ratio
|
||||
img.b-r-8.img-80(src='../assets/images/user/1.jpg', alt='#')
|
||||
div.avatar.ratio
|
||||
img.b-r-8.img-70(src='../assets/images/avtar/16.jpg', alt='#')
|
||||
div.avatar.ratio
|
||||
img.b-r-8.img-50(src='../assets/images/avtar/7.jpg', alt='#')
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#avatar-ratio', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#avatar-ratio
|
||||
|<!-- You can use b-r-* class through the set status (100/90/80/70/50). -->
|
||||
|<div class="avatars">
|
||||
|<div class="avatar ratio">
|
||||
|<img class="b-r-8 img-100" src="../assets/images/avtar/11.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar ratio">
|
||||
|<img class="b-r-8 img-90" src="../assets/images/avtar/4.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar ratio">
|
||||
|<img class="b-r-8 img-80" src="../assets/images/user/1.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar ratio">
|
||||
|<img class="b-r-8 img-70" src="../assets/images/avtar/16.jpg" alt="#">
|
||||
|</div>
|
||||
|<div class="avatar ratio">
|
||||
|<img class="b-r-8 img-50" src="../assets/images/avtar/7.jpg" alt="#">
|
||||
|</div>
|
||||
.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h4 Grouping
|
||||
p.mb-0.mt-1
|
||||
| You can set the group of avatars like
|
||||
code .img-* (40/50/60/80/100)
|
||||
| and
|
||||
code .b-r-* (8/30/35)
|
||||
| .
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body.avatar-showcase
|
||||
.avatars
|
||||
.customers.d-inline-block.avatar-group
|
||||
ul
|
||||
li.d-inline-block
|
||||
img.img-100.b-r-8(src='../assets/images/avtar/4.jpg', alt='#')
|
||||
li.d-inline-block
|
||||
img.img-80.b-r-30(src='../assets/images/avtar/16.jpg', alt='#')
|
||||
li.d-inline-block
|
||||
img.img-50.b-r-35(src='../assets/images/avtar/3.jpg', alt='#')
|
||||
.customers.d-inline-block.avatar-group
|
||||
ul
|
||||
li.d-inline-block
|
||||
img.img-60.rounded-circle(src='../assets/images/avtar/16.jpg', alt='#')
|
||||
li.d-inline-block
|
||||
img.b-r-8.img-80(src='../assets/images/user/1.jpg', alt='#')
|
||||
li.d-inline-block
|
||||
img.img-60.rounded-circle(src='../assets/images/avtar/16.jpg', alt='#')
|
||||
.customers.d-inline-block.avatar-group
|
||||
ul
|
||||
li.d-inline-block
|
||||
img.img-40.rounded-circle(src='../assets/images/user/3.jpg', alt='')
|
||||
li.d-inline-block
|
||||
img.img-40.rounded-circle(src='../assets/images/user/5.jpg', alt='')
|
||||
li.d-inline-block
|
||||
img.img-40.rounded-circle(src='../assets/images/user/1.jpg', alt='')
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#avatar-grouping', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#avatar-grouping
|
||||
|<!-- You can set the group of avatars use img-* and .b-r-* class (40/50/60/80/100) and (8/30/35). -->
|
||||
|<div class="customers d-inline-block avatar-group">
|
||||
|<ul>
|
||||
|<li class="d-inline-block">
|
||||
|<img class="img-100 b-r-8" src="../assets/images/avtar/4.jpg" alt="#">
|
||||
|</li>
|
||||
|<li class="d-inline-block">
|
||||
|<img class="img-80 b-r-30" src="../assets/images/avtar/16.jpg" alt="#">
|
||||
|</li>
|
||||
|<li class="d-inline-block">
|
||||
|</li><img class="img-50 b-r-35" src="../assets/images/avtar/3.jpg" alt="#">
|
||||
|</ul>
|
||||
|</div>
|
||||
|<div class="customers d-inline-block avatar-group">
|
||||
|<ul>
|
||||
|<li class="d-inline-block">
|
||||
|<img class="img-60 rounded-circle" src="../assets/images/avtar/16.jpg" alt="#">
|
||||
|</li>
|
||||
|<li class="d-inline-block">
|
||||
|<img class="b-r-8 img-80" src="../assets/images/user/1.jpg" alt="#">
|
||||
|</li>
|
||||
|<li class="d-inline-block">
|
||||
|<img class="img-60 rounded-circle" src="../assets/images/avtar/16.jpg" alt="#">
|
||||
|</li>
|
||||
|</ul>
|
||||
|</div>
|
||||
|<div class="customers d-inline-block avatar-group">
|
||||
|<ul>
|
||||
|<li class="d-inline-block">
|
||||
|<img class="img-40 rounded-circle" src="../assets/images/user/3.jpg" alt="">
|
||||
|</li>
|
||||
|<li class="d-inline-block">
|
||||
|<img class="img-40 rounded-circle" src="../assets/images/user/5.jpg" alt="">
|
||||
|</li>
|
||||
|<li class="d-inline-block">
|
||||
|<img class="img-40 rounded-circle" src="../assets/images/user/1.jpg" alt="">
|
||||
|</li>
|
||||
|</ul>
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
412
static/admin/assets/pug/pages/theme/base-input.pug
Normal file
412
static/admin/assets/pug/pages/theme/base-input.pug
Normal file
@@ -0,0 +1,412 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Base inputs
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Form Controls
|
||||
li.breadcrumb-item.active Base inputs
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Basic form control
|
||||
form.form.theme-form
|
||||
.card-body
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlInput1') Email address
|
||||
input#exampleFormControlInput1.form-control(type='email', placeholder='name@example.com')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleInputPassword2') Password
|
||||
input#exampleInputPassword2.form-control(type='password', placeholder='Password')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect9') Example select
|
||||
select#exampleFormControlSelect9.form-select.digits
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect3') Example multiple select
|
||||
select#exampleFormControlSelect3.form-select.digits(multiple='')
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
div
|
||||
label.form-label(for='exampleFormControlTextarea4') Example textarea
|
||||
textarea#exampleFormControlTextarea4.form-control(rows='3')
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary(type='submit') Submit
|
||||
input.btn.btn-light(type='reset', value='Cancel')
|
||||
.card
|
||||
.card-header
|
||||
h5 Basic HTML input control
|
||||
form.form.theme-form
|
||||
.card-body
|
||||
.row
|
||||
.col
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Simple Input
|
||||
.col-sm-9
|
||||
input.form-control(type='text')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Placeholder
|
||||
.col-sm-9
|
||||
input.form-control(type='text', placeholder='Type your title in Placeholder')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Password
|
||||
.col-sm-9
|
||||
input.form-control(type='password', placeholder='Password input')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Number
|
||||
.col-sm-9
|
||||
input.form-control.digits(type='number', placeholder='Number')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Telephone
|
||||
.col-sm-9
|
||||
input.form-control.m-input.digits(type='tel', value='91-(999)-999-999')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label URL
|
||||
.col-sm-9
|
||||
input.form-control(type='url', value='https://getbootstrap.com')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Date and time
|
||||
.col-sm-9
|
||||
input#example-datetime-local-input.form-control.digits(type='datetime-local', value='2018-01-19T18:45:00')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Date
|
||||
.col-sm-9
|
||||
input.form-control.digits(type='date', value='2018-01-01')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Month
|
||||
.col-sm-9
|
||||
input.form-control.digits(type='month', value='2018-01')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Week
|
||||
.col-sm-9
|
||||
input.form-control.digits(type='week', value='2018-W09')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Time
|
||||
.col-sm-9
|
||||
input.form-control.digits(type='time', value='21:45:00')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label.pt-0 Color picker
|
||||
.col-sm-9
|
||||
input.form-control.form-control-color(type='color', value='#563d7c')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label
|
||||
| Maximum
|
||||
| Length
|
||||
.col-sm-9
|
||||
input.form-control(type='text', placeholder='Content must be in 6 characters', maxlength='6')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label.pt-0 Static Text
|
||||
.col-sm-9
|
||||
.form-control-static
|
||||
| Hello !... This is
|
||||
| static text
|
||||
.row
|
||||
label.col-sm-3.col-form-label Textarea
|
||||
.col-sm-9
|
||||
textarea.form-control(rows='5', cols='5', placeholder='Default textarea')
|
||||
.card-footer.text-end
|
||||
.col-sm-9.offset-sm-3
|
||||
button.btn.btn-primary(type='submit') Submit
|
||||
input.btn.btn-light(type='reset', value='Cancel')
|
||||
.card
|
||||
.card-header
|
||||
h5 Edges input style
|
||||
form.form.theme-form
|
||||
.card-body
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlInput5') Email address
|
||||
input#exampleFormControlInput5.form-control.btn-pill(type='email', placeholder='name@example.com')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleInputPassword6') Password
|
||||
input#exampleInputPassword6.form-control.btn-pill(type='password', placeholder='Password')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect7') Example select
|
||||
select#exampleFormControlSelect7.form-select.btn-pill.digits
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect8') Example multiple select
|
||||
select#exampleFormControlSelect8.form-select.btn-pill.p-l-45.digits(multiple='')
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
div
|
||||
label.form-label(for='exampleFormControlTextarea9') Example textarea
|
||||
textarea#exampleFormControlTextarea9.form-control.btn-pill(rows='3')
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary(type='submit') Submit
|
||||
input.btn.btn-light(type='reset', value='Cancel')
|
||||
.card
|
||||
.card-header
|
||||
h5 Flat input style
|
||||
form.form.theme-form
|
||||
.card-body
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlInput10') Email address
|
||||
input#exampleFormControlInput10.form-control.btn-square(type='email', placeholder='name@example.com')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleInputPassword11') Password
|
||||
input#exampleInputPassword11.form-control.btn-square(type='password', placeholder='Password')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect12') Example select
|
||||
select#exampleFormControlSelect12.form-select.btn-square.digits
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect13') Example multiple select
|
||||
select#exampleFormControlSelect13.form-select.btn-square.digits(multiple='')
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
div
|
||||
label.form-label(for='exampleFormControlTextarea14') Example textarea
|
||||
textarea#exampleFormControlTextarea14.form-control.btn-square(rows='3')
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary(type='submit') Submit
|
||||
input.btn.btn-light(type='reset', value='Cancel')
|
||||
.card
|
||||
.card-header
|
||||
h5 Raise input style
|
||||
form.form.theme-form
|
||||
.card-body
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlInput15') Email address
|
||||
input#exampleFormControlInput15.form-control.input-air-primary(type='email', placeholder='name@example.com')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleInputPassword16') Password
|
||||
input#exampleInputPassword16.form-control.input-air-primary(type='password', placeholder='Password')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect17') Example select
|
||||
select#exampleFormControlSelect17.form-select.input-air-primary.digits
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect18') Example multiple select
|
||||
select#exampleFormControlSelect18.form-select.input-air-primary.digits(multiple='')
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
div
|
||||
label.form-label(for='exampleFormControlTextarea19') Example textarea
|
||||
textarea#exampleFormControlTextarea19.form-control.input-air-primary(rows='3')
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary(type='submit') Submit
|
||||
input.btn.btn-light(type='reset', value='Cancel')
|
||||
.card
|
||||
.card-header
|
||||
h5 Solid input style
|
||||
form.form.theme-form
|
||||
.card-body
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlInput20') Email address
|
||||
input#exampleFormControlInput20.form-control(type='email', placeholder='name@example.com')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleInputPassword21') Password
|
||||
input#exampleInputPassword21.form-control(type='password', placeholder='Password')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleInputPassword22') Disabled
|
||||
input#exampleInputPassword22.form-control(type='text', disabled='', placeholder='Disabled')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect23') Example select
|
||||
select#exampleFormControlSelect23.form-select.digits
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect24') Example multiple select
|
||||
select#exampleFormControlSelect24.form-select.digits(multiple='')
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
div
|
||||
label.form-label(for='exampleFormControlTextarea25') Example textarea
|
||||
textarea#exampleFormControlTextarea25.form-control(rows='3')
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary(type='submit') Submit
|
||||
input.btn.btn-light(type='reset', value='Cancel')
|
||||
.card
|
||||
.card-header
|
||||
h5 Input sizing
|
||||
form.form.theme-form
|
||||
.card-body
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='colFormLabelSm26') Large input
|
||||
input#colFormLabelSm26.form-control.form-control-lg(type='text', placeholder='col-form-label-lg')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleInputPassword27') Default input
|
||||
input#exampleInputPassword27.form-control(type='text', placeholder='form-control')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='colFormLabelSm28') Small input
|
||||
input#colFormLabelSm28.form-control.form-control-sm(type='text', placeholder='col-form-label-sm')
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect29') Large select
|
||||
select#exampleFormControlSelect29.form-select.form-control-lg.digits
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
.mb-3
|
||||
label.form-label(for='exampleFormControlSelect30') Default select
|
||||
select#exampleFormControlSelect30.form-select.digits
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.row
|
||||
.col
|
||||
div
|
||||
label.form-label(for='exampleFormControlSelect31') Small select
|
||||
select#exampleFormControlSelect31.form-select.form-control-sm.digits
|
||||
option 1
|
||||
option 2
|
||||
option 3
|
||||
option 4
|
||||
option 5
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary(type='submit') Submit
|
||||
input.btn.btn-light(type='reset', value='Cancel')
|
||||
.card
|
||||
.card-header
|
||||
h5 Custom controls
|
||||
form.form.theme-form
|
||||
.card-body
|
||||
.row
|
||||
.col
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label Upload File
|
||||
.col-sm-9
|
||||
input.form-control(type='file')
|
||||
.row
|
||||
.col
|
||||
.row
|
||||
label.col-sm-3.col-form-label Custom select
|
||||
.col-sm-9
|
||||
select.custom-select.form-select
|
||||
option(selected='') Open this select menu
|
||||
option(value='1') One
|
||||
option(value='2') Two
|
||||
option(value='3') Three
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary(type='submit') Submit
|
||||
input.btn.btn-light(type='reset', value='Cancel')
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
191
static/admin/assets/pug/pages/theme/basic-card.pug
Normal file
191
static/admin/assets/pug/pages/theme/basic-card.pug
Normal file
@@ -0,0 +1,191 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var height_equal = true;
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Basic Card
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Bonus Ui
|
||||
li.breadcrumb-item.active Basic Card
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Basic Card
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p class="mb-0"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. </p>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12.col-xl-6
|
||||
.card.b-r-0
|
||||
.card-header
|
||||
h5 Flat Card
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <p class="mb-0"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. </p>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.col-sm-12.col-xl-6
|
||||
.card.shadow-none.border
|
||||
.card-header
|
||||
h5 Without shadow Card
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
i.icofont.icofont-truck.me-2
|
||||
| Icon in Heading
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h5 Card sub Title
|
||||
span
|
||||
| Using the
|
||||
a(href='#') card
|
||||
| component, you can extend the default collapse behavior to create an accordion.
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h5 Card With Footer
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the the industry's standard dummy text ever.
|
||||
.card-footer
|
||||
h6.mb-0 Card Footer
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.bg-primary
|
||||
h5.text-white Primary Color Card
|
||||
.card-body.bg-primary
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the.
|
||||
.card-footer.bg-primary
|
||||
h6.mb-0 Card Footer
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.bg-secondary
|
||||
h5.text-white Secondary Color Card
|
||||
.card-body.bg-secondary
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the.
|
||||
.card-footer.bg-secondary
|
||||
h6.mb-0.text-white Card Footer
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.bg-success
|
||||
h5.text-white Success color Card
|
||||
.card-body.bg-success
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the.
|
||||
.card-footer.bg-success
|
||||
h6.mb-0 Card Footer
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.bg-primary
|
||||
h5.text-white Primary Color Header
|
||||
.card-body
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the.
|
||||
.card-footer
|
||||
h6.mb-0 Card Footer
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Primary Color Body
|
||||
.card-body.bg-primary
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the.
|
||||
.card-footer
|
||||
h6.mb-0 Card Footer
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Primary Color Footer
|
||||
.card-body
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the.
|
||||
.card-footer.bg-primary
|
||||
h6.mb-0 Card Footer
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
66
static/admin/assets/pug/pages/theme/basic-template.pug
Normal file
66
static/admin/assets/pug/pages/theme/basic-template.pug
Normal file
@@ -0,0 +1,66 @@
|
||||
doctype html
|
||||
html(lang='en')
|
||||
head
|
||||
meta(http-equiv='Content-Type', content='text/html; charset=UTF-8')
|
||||
meta(http-equiv='X-UA-Compatible', content='IE=edge')
|
||||
meta(name='viewport', content='width=device-width, initial-scale=1.0')
|
||||
link(rel='icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
link(rel='shortcut icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
title Cuba - Premium Admin Template
|
||||
link(href='https://fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700,800,900', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i', rel='stylesheet')
|
||||
style(type='text/css').
|
||||
body{
|
||||
width: 650px;
|
||||
font-family: work-Sans, sans-serif;
|
||||
background-color: #f6f7fb;
|
||||
display: block;
|
||||
}
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
span {
|
||||
font-size: 14px;
|
||||
}
|
||||
p {
|
||||
font-size: 13px;
|
||||
line-height: 1.7;
|
||||
letter-spacing: 0.7px;
|
||||
margin-top: 0;
|
||||
}
|
||||
.text-center{
|
||||
text-align: center
|
||||
}
|
||||
body(style='margin: 30px auto;')
|
||||
table(style='width: 100%')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
table(style='background-color: #f6f7fb; width: 100%')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
table(style='width: 650px; margin: 0 auto; margin-bottom: 30px')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/other-images/logo-login.png', alt='')
|
||||
td(style='text-align: right; color:#999')
|
||||
span Some Description
|
||||
table(style='width: 650px; margin: 0 auto; background-color: #fff; border-radius: 8px')
|
||||
tbody
|
||||
tr
|
||||
td(style='padding: 30px')
|
||||
p Hi There,
|
||||
p Sometimes you just want to send a simple HTML email with a simple design and clear call to action.
|
||||
.text-center
|
||||
a(href='#' style='padding: 10px; background-color: #7366ff; color: #fff; display: inline-block; border-radius: 4px; margin-bottom: 18px') Call To Action
|
||||
p This is a really simple email template. It's sole purpose is to get the recipient to click the button with no distractions.
|
||||
p(style='margin-bottom: 0') Good luck! Hope it works.
|
||||
table(style='width: 650px; margin: 0 auto; margin-top: 30px')
|
||||
tbody
|
||||
tr(style='text-align: center')
|
||||
td
|
||||
p(style='color: #999; margin-bottom: 0') 333 Woodland Rd. Baldwinsville, NY 13027
|
||||
|
||||
158
static/admin/assets/pug/pages/theme/blog-single.pug
Normal file
158
static/admin/assets/pug/pages/theme/blog-single.pug
Normal file
@@ -0,0 +1,158 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Blog Single
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Blog
|
||||
li.breadcrumb-item.active Blog Single
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.blog-single
|
||||
.blog-box.blog-details
|
||||
img.img-fluid.w-100(src='../assets/images/blog/blog-single.jpg', alt='blog-main')
|
||||
.blog-details
|
||||
ul.blog-social
|
||||
li 25 July 2018
|
||||
li
|
||||
i.icofont.icofont-user
|
||||
| Mark
|
||||
span Jecno
|
||||
li
|
||||
i.icofont.icofont-thumbs-up
|
||||
| 02
|
||||
span Hits
|
||||
li
|
||||
i.icofont.icofont-ui-chat
|
||||
| 598 Comments
|
||||
h4
|
||||
| All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the
|
||||
| Internet.
|
||||
.single-blog-content-top
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
||||
p
|
||||
| It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like
|
||||
section.comment-box
|
||||
h4 Comment
|
||||
hr
|
||||
ul
|
||||
li
|
||||
.media.align-self-center
|
||||
img.align-self-center(src='../assets/images/blog/comment.jpg', alt='Generic placeholder image')
|
||||
.media-body
|
||||
.row
|
||||
.col-md-4
|
||||
h6.mt-0
|
||||
| Jolio Mark
|
||||
span ( Designer )
|
||||
.col-md-8
|
||||
ul.comment-social.float-start.float-md-end
|
||||
li
|
||||
i.icofont.icofont-thumbs-up
|
||||
| 02 Hits
|
||||
li
|
||||
i.icofont.icofont-ui-chat
|
||||
| 598 Comments
|
||||
p
|
||||
| There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.
|
||||
li
|
||||
ul
|
||||
li
|
||||
.media
|
||||
img.align-self-center(src='../assets/images/blog/9.jpg', alt='Generic placeholder image')
|
||||
.media-body
|
||||
.row
|
||||
.col-xl-12
|
||||
h6.mt-0
|
||||
| Jolio Mark
|
||||
span ( Designer )
|
||||
p
|
||||
| There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.
|
||||
li
|
||||
.media
|
||||
img.align-self-center(src='../assets/images/blog/4.jpg', alt='Generic placeholder image')
|
||||
.media-body
|
||||
.row
|
||||
.col-md-4
|
||||
h6.mt-0
|
||||
| Jolio Mark
|
||||
span ( Designer )
|
||||
.col-md-8
|
||||
ul.comment-social.float-start.float-md-end
|
||||
li
|
||||
i.icofont.icofont-thumbs-up
|
||||
| 02 Hits
|
||||
li
|
||||
i.icofont.icofont-ui-chat
|
||||
| 598 Comments
|
||||
p
|
||||
| There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.
|
||||
li
|
||||
.media
|
||||
img.align-self-center(src='../assets/images/blog/12.png', alt='Generic placeholder image')
|
||||
.media-body
|
||||
.row
|
||||
.col-md-4
|
||||
h6.mt-0
|
||||
| Jolio Mark
|
||||
span ( Designer )
|
||||
.col-md-8
|
||||
ul.comment-social.float-start.float-md-end
|
||||
li
|
||||
i.icofont.icofont-thumbs-up
|
||||
| 02 Hits
|
||||
li
|
||||
i.icofont.icofont-ui-chat
|
||||
| 598 Comments
|
||||
p
|
||||
| There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.
|
||||
li
|
||||
.media
|
||||
img.align-self-center(src='../assets/images/blog/14.png', alt='Generic placeholder image')
|
||||
.media-body
|
||||
.row
|
||||
.col-md-4
|
||||
h6.mt-0
|
||||
| Jolio Mark
|
||||
span ( Designer )
|
||||
.col-md-8
|
||||
ul.comment-social.float-start.float-md-end
|
||||
li
|
||||
i.icofont.icofont-thumbs-up
|
||||
| 02 Hits
|
||||
li
|
||||
i.icofont.icofont-ui-chat
|
||||
| 598 Comments
|
||||
p
|
||||
| There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
135
static/admin/assets/pug/pages/theme/blog.pug
Normal file
135
static/admin/assets/pug/pages/theme/blog.pug
Normal file
@@ -0,0 +1,135 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Blog Details
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Blog
|
||||
li.breadcrumb-item.active Blog Details
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-6.set-col-12.box-col-12
|
||||
.card
|
||||
.blog-box.blog-shadow
|
||||
img.img-fluid(src='../assets/images/blog/blog.jpg', alt='')
|
||||
.blog-details
|
||||
p 25 July 2018
|
||||
h4 Accusamus et iusto odio dignissimos ducimus qui blanditiis.
|
||||
ul.blog-social
|
||||
li
|
||||
i.icofont.icofont-user
|
||||
| Mark Jecno
|
||||
li
|
||||
i.icofont.icofont-thumbs-up
|
||||
| 02 Hits
|
||||
li
|
||||
i.icofont.icofont-ui-chat
|
||||
| 598 Comments
|
||||
.col-xl-6.set-col-12.box-col-12
|
||||
.card
|
||||
.blog-box.blog-list.row
|
||||
.col-sm-5
|
||||
img.img-fluid.sm-100-w(src='../assets/images/blog/blog-2.jpg', alt='')
|
||||
.col-sm-7
|
||||
.blog-details
|
||||
.blog-date
|
||||
span 02
|
||||
| January 2018
|
||||
h6 Perspiciatis unde omnis iste natus
|
||||
.blog-bottom-content
|
||||
ul.blog-social
|
||||
li by: Admin
|
||||
li 0 Hits
|
||||
hr
|
||||
p.mt-0
|
||||
| inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit.
|
||||
.card
|
||||
.blog-box.blog-list.row
|
||||
.col-sm-5
|
||||
img.img-fluid.sm-100-w(src='../assets/images/blog/blog-3.jpg', alt='')
|
||||
.col-sm-7
|
||||
.blog-details
|
||||
.blog-date
|
||||
span 03
|
||||
| January 2018
|
||||
h6 Perspiciatis unde omnis iste natus
|
||||
.blog-bottom-content
|
||||
ul.blog-social
|
||||
li by: Admin
|
||||
li 02 Hits
|
||||
hr
|
||||
p.mt-0
|
||||
| inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit.
|
||||
.col-md-6.col-xxl-3.box-col-6
|
||||
.card
|
||||
.blog-box.blog-grid.text-center
|
||||
img.img-fluid.top-radius-blog(src='../assets/images/blog/blog-5.jpg', alt='')
|
||||
.blog-details-main
|
||||
ul.blog-social
|
||||
li 9 April 2018
|
||||
li by: Admin
|
||||
li 0 Hits
|
||||
hr
|
||||
h6.blog-bottom-details Perspiciatis unde omnis iste natus error sit.Dummy text
|
||||
.col-md-6.col-xxl-3.box-col-6
|
||||
.card
|
||||
.blog-box.blog-grid.text-center
|
||||
img.img-fluid.top-radius-blog(src='../assets/images/blog/blog-6.jpg', alt='')
|
||||
.blog-details-main
|
||||
ul.blog-social
|
||||
li 9 April 2018
|
||||
li by: Admin
|
||||
li 0 Hits
|
||||
hr
|
||||
h6.blog-bottom-details Perspiciatis unde omnis iste natus error sit.Dummy text
|
||||
.col-md-6.col-xxl-3.box-col-6
|
||||
.card
|
||||
.blog-box.blog-grid.text-center
|
||||
img.img-fluid.top-radius-blog(src='../assets/images/blog/blog-5.jpg', alt='')
|
||||
.blog-details-main
|
||||
ul.blog-social
|
||||
li 9 April 2018
|
||||
li by: Admin
|
||||
li 0 Hits
|
||||
hr
|
||||
h6.blog-bottom-details Perspiciatis unde omnis iste natus error sit.Dummy text
|
||||
.col-md-6.col-xxl-3.box-col-6
|
||||
.card
|
||||
.blog-box.blog-grid.text-center
|
||||
img.img-fluid.top-radius-blog(src='../assets/images/blog/blog-6.jpg', alt='')
|
||||
.blog-details-main
|
||||
ul.blog-social
|
||||
li 9 April 2018
|
||||
li by: Admin
|
||||
li 0 Hits
|
||||
hr
|
||||
h6.blog-bottom-details Perspiciatis unde omnis iste natus error sit.Dummy text
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
711
static/admin/assets/pug/pages/theme/bookmark.pug
Normal file
711
static/admin/assets/pug/pages/theme/bookmark.pug
Normal file
@@ -0,0 +1,711 @@
|
||||
- var theme_customizer = true;
|
||||
- var select2 = true;
|
||||
- var page_select2 = true;
|
||||
- var form_validation_custom= true;
|
||||
- var bookmark_page = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Bookmarks
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Apps
|
||||
li.breadcrumb-item.active Bookmarks
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.email-wrap.bookmark-wrap
|
||||
.row
|
||||
.col-xl-3.box-col-6
|
||||
.md-sidebar
|
||||
a.btn.btn-primary.md-sidebar-toggle(href='javascript:void(0)') bookmark filter
|
||||
.md-sidebar-aside.job-left-aside.custom-scrollbar
|
||||
.email-left-aside
|
||||
.card
|
||||
.card-body
|
||||
.email-app-sidebar.left-bookmark
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6.f-w-600 MARK JENCO
|
||||
p Markjecno@gmail.com
|
||||
ul.nav.main-menu(role='tablist')
|
||||
li.nav-item
|
||||
button.badge-light-primary.btn-block.btn-mail.w-100(type='button', data-bs-toggle='modal', data-bs-target='#exampleModal')
|
||||
i.me-2(data-feather='bookmark')
|
||||
| New Bookmark
|
||||
li.nav-item
|
||||
span.main-title
|
||||
| Views
|
||||
li
|
||||
a#pills-created-tab(data-bs-toggle='pill', href='#pills-created', role='tab', aria-controls='pills-created', aria-selected='true')
|
||||
span.title
|
||||
| Created by me
|
||||
li
|
||||
a#pills-favourites-tab.show(data-bs-toggle='pill', href='#pills-favourites', role='tab', aria-controls='pills-favourites', aria-selected='false')
|
||||
span.title
|
||||
| Favourites
|
||||
li
|
||||
a#pills-shared-tab.show(data-bs-toggle='pill', href='#pills-shared', role='tab', aria-controls='pills-shared', aria-selected='false')
|
||||
span.title
|
||||
| Shared with me
|
||||
li
|
||||
a#pills-bookmark-tab.show(data-bs-toggle='pill', href='#pills-bookmark', role='tab', aria-controls='pills-bookmark', aria-selected='false')
|
||||
span.title
|
||||
| My bookmark
|
||||
li
|
||||
hr
|
||||
li
|
||||
span.main-title
|
||||
| Tags
|
||||
span.pull-right
|
||||
a(href='#', data-bs-toggle='modal', data-bs-target='#createtag')
|
||||
i(data-feather='plus-circle')
|
||||
li
|
||||
a#pills-notification-tab.show(data-bs-toggle='pill', href='#pills-notification', role='tab', aria-controls='pills-notification', aria-selected='false')
|
||||
span.title
|
||||
| notification
|
||||
li
|
||||
a#pills-newsletter-tab.show(data-bs-toggle='pill', href='#pills-newsletter', role='tab', aria-controls='pills-newsletter', aria-selected='false')
|
||||
span.title
|
||||
| Newsletter
|
||||
li
|
||||
a#pills-business-tab.show(data-bs-toggle='pill', href='#pills-business', role='tab', aria-controls='pills-business-tab', aria-selected='false')
|
||||
span.title
|
||||
| Business
|
||||
li
|
||||
a#pills-holidays-tab.show(data-bs-toggle='pill', href='#pills-holidays', role='tab', aria-controls='pills-holidays-tab', aria-selected='false')
|
||||
span.title
|
||||
| Holidays
|
||||
li
|
||||
a#pills-important-tab.show(data-bs-toggle='pill', href='#pills-important', role='tab', aria-controls='pills-important-tab', aria-selected='false')
|
||||
span.title
|
||||
| Important
|
||||
li
|
||||
a#pills-orgenization-tab.show(data-bs-toggle='pill', href='#pills-orgenization', role='tab', aria-controls='pills-orgenization-tab', aria-selected='false')
|
||||
span.title
|
||||
| Orgenization
|
||||
.col-xl-9.col-md-12.box-col-12
|
||||
.email-right-aside.bookmark-tabcontent
|
||||
.card.email-body.radius-left
|
||||
.ps-0
|
||||
.tab-content
|
||||
#pills-created.tab-pane.fade.active.show(role='tabpanel', aria-labelledby='pills-created-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 Created by me
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='javascript:void(0)')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='javascript:void(0)')
|
||||
i(data-feather='list')
|
||||
.card-body.pb-0
|
||||
.details-bookmark.text-center
|
||||
.row#bookmarkData
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/01.jpg', alt='')
|
||||
.favourite-icon.favourite_0(onclick='setFavourite(0)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_0 Admin Template
|
||||
p.weburl_0 http://admin.pixelstrap.com//ltr/landing-page.html
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(0)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_0 is beautifully crafted, clean and modern designed admin theme with 6 different demos and light - dark versions.
|
||||
span.collection_0 General
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/02.jpg', alt='')
|
||||
.favourite-icon.favourite_1(onclick='setFavourite(1)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_1 Universal Template
|
||||
p.weburl_1 https://angular.pixelstrap.com/universal/landing
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(1)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_1 Universal is beautifully crafted, clean and modern designed admin theme
|
||||
span.collection_1 General
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/03.jpg', alt='')
|
||||
.favourite-icon.favourite_2(onclick='setFavourite(2)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_2 Angular Theme
|
||||
p.weburl_2 https://angular.pixelstrap.com/cuba/landing
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(2)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
|
||||
span.collection_2 Fs
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/04.jpg', alt='')
|
||||
.favourite-icon.favourite_3(onclick='setFavourite(3)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_3 Multikart Admin
|
||||
p.weburl_3 http://themes.pixelstrap.com/multikart/back-end/index.html
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(3)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_3 Multikart Admin is modern designed admin theme
|
||||
span.collection_3 General
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/05.jpg', alt='')
|
||||
.favourite-icon.favourite_4(onclick='setFavourite(4)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_4 Ecommerece theme
|
||||
p.weburl_4 http://themes.pixelstrap.com/multikart
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(4)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_4 Multikart HTML template is an apparently simple but highly functional tempalate designed for creating a flourisahing online business.
|
||||
span.collection_4 General
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/06.jpg', alt='')
|
||||
.favourite-icon.favourite_5(onclick='setFavourite(5)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_5 Tovo app landing page
|
||||
p.weburl_5 http://vue.pixelstrap.com/tovo/home-one
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(5)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_5 Amazing Landing Page With Easy Customization
|
||||
span.collection_5 Fs
|
||||
#pills-favourites.fade.tab-pane(role='tabpanel', aria-labelledby='pills-favourites-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 Favourites
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
.row#favouriteData
|
||||
.no-favourite
|
||||
span No Bookmarks Found.
|
||||
#pills-shared.fade.tab-pane(role='tabpanel', aria-labelledby='pills-shared-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 Shared with me
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
span No Bookmarks Found.
|
||||
#pills-bookmark.fade.tab-pane(role='tabpanel', aria-labelledby='pills-bookmark-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 My bookmark
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
.row#bookmarkData1
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/07.jpg', alt='')
|
||||
.favourite-icon.favourite_0(onclick='setFavourite(0)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_0 Admin Template
|
||||
p.weburl_0 http://admin.pixelstrap.com/Cuba/ltr/landing-page.html
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(0)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_
|
||||
span.collection_0 General
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/07.jpg', alt='')
|
||||
.favourite-icon.favourite_1(onclick='setFavourite(1)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_1 Universal Template
|
||||
p.weburl_1 https://angular.pixelstrap.com/universal/landing
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(1)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_1 Universal is beautifully crafted, clean and modern designed admin theme
|
||||
span.collection_1 General
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/07.jpg', alt='')
|
||||
.favourite-icon.favourite_2(onclick='setFavourite(2)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_2 Angular Theme
|
||||
p.weburl_2 https://angular.pixelstrap.com/cuba/landing
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(2)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
|
||||
span.collection_2 Fs
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/07.jpg', alt='')
|
||||
.favourite-icon.favourite_3(onclick='setFavourite(3)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_3 Multikart Admin
|
||||
p.weburl_3 http://themes.pixelstrap.com/multikart/back-end/index.html
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(3)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_3 Multikart Admin is modern designed admin theme
|
||||
span.collection_3 General
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/07.jpg', alt='')
|
||||
.favourite-icon.favourite_4(onclick='setFavourite(4)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_4 Ecommerece theme
|
||||
p.weburl_4 http://themes.pixelstrap.com/multikart
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(4)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_4 Multikart HTML template is an apparently simple but highly functional tempalate designed for creating a flourisahing online business.
|
||||
span.collection_4 General
|
||||
.col-xxl-3.col-md-4.col-ed-4
|
||||
.card.card-with-border.bookmark-card.o-hidden
|
||||
.details-website
|
||||
img.img-fluid(src='../assets/images/lightgallry/07.jpg', alt='')
|
||||
.favourite-icon.favourite_5(onclick='setFavourite(5)')
|
||||
a(href='#')
|
||||
i.fa.fa-star
|
||||
.desciption-data
|
||||
.title-bookmark
|
||||
h6.title_5 Tovo app landing page
|
||||
p.weburl_5 http://vue.pixelstrap.com/tovo/home-one
|
||||
.hover-block
|
||||
ul
|
||||
li
|
||||
a(href='', onclick='editBookmark(5)', data-bs-toggle='modal', data-bs-target='#edit-bookmark')
|
||||
i(data-feather='edit-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='link')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='share-2')
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='trash-2')
|
||||
li.pull-right.text-end
|
||||
a(href='#')
|
||||
i(data-feather='tag')
|
||||
.content-general
|
||||
p.desc_5 Amazing Landing Page With Easy Customization
|
||||
span.collection_5 Fs
|
||||
#pills-notification.fade.tab-pane(role='tabpanel', aria-labelledby='pills-notification-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 notification
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
span No Bookmarks Found.
|
||||
#pills-newsletter.fade.tab-pane(role='tabpanel', aria-labelledby='pills-newsletter-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 Newsletter
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
span No Bookmarks Found.
|
||||
#pills-business.fade.tab-pane(role='tabpanel', aria-labelledby='pills-business-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 Business
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
span No Bookmarks Found.
|
||||
#pills-holidays.fade.tab-pane(role='tabpanel', aria-labelledby='pills-holidays-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 Holidays
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
span No Bookmarks Found.
|
||||
#pills-important.fade.tab-pane(role='tabpanel', aria-labelledby='pills-important-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 Important
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
span No Bookmarks Found.
|
||||
#pills-orgenization.fade.tab-pane(role='tabpanel', aria-labelledby='pills-orgenization-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h6.mb-0 Orgenization
|
||||
ul
|
||||
li
|
||||
a.grid-bookmark-view(href='#')
|
||||
i(data-feather='grid')
|
||||
li
|
||||
a.list-layout-view(href='#')
|
||||
i(data-feather='list')
|
||||
.card-body
|
||||
.details-bookmark.text-center
|
||||
span No Bookmarks Found.
|
||||
#edit-bookmark.modal.fade.modal-bookmark(tabindex='-1', role='dialog' aria-hidden='true')
|
||||
.modal-dialog.modal-lg(role='document')
|
||||
.modal-content
|
||||
.modal-header
|
||||
h5.modal-title Edit Bookmark
|
||||
button.btn-close(type='button', data-bs-dismiss='modal', aria-label='Close')
|
||||
.modal-body
|
||||
form.form-bookmark.needs-validation(novalidate='')
|
||||
.row.g-2
|
||||
.mb-3.mt-0.col-md-12
|
||||
label Web Url
|
||||
input.form-control#editurl(type='text', required='', autocomplete='off', value='http://admin.pixelstrap.com/Cuba/ltr/landing-page.html')
|
||||
.mb-3.mt-0.col-md-12
|
||||
label Title
|
||||
input.form-control#edittitle(type='text', required='', autocomplete='off', value='Admin Template')
|
||||
.mb-3.mt-0.col-md-12
|
||||
label Description
|
||||
textarea.form-control#editdesc(required='', autocomplete='off')
|
||||
|
||||
.mb-3.mt-0.col-md-6
|
||||
label Group
|
||||
select.js-example-basic-single
|
||||
option(value='AL') My Bookmarks
|
||||
.mb-3.mt-0.col-md-6
|
||||
label Collection
|
||||
select.js-example-disabled-results
|
||||
option(value='general') General
|
||||
option(value='fs') fs
|
||||
button.btn.btn-secondary(type='button') Save
|
||||
button.btn.btn-primary(type='button', data-bs-dismiss='modal') Cancel
|
||||
#createtag.modal.fade.modal-bookmark(tabindex='-1', role='dialog', aria-hidden='true')
|
||||
.modal-dialog.modal-lg(role='document')
|
||||
.modal-content
|
||||
.modal-header
|
||||
h5.modal-title Create Tag
|
||||
button.btn-close(type='button', data-bs-dismiss='modal', aria-label='Close')
|
||||
.modal-body
|
||||
form.form-bookmark.needs-validation(novalidate='')
|
||||
.row.g-2
|
||||
.mb-3.mt-0.col-md-12
|
||||
label Tag Name
|
||||
input.form-control(type='text', required='', autocomplete='off')
|
||||
.mb-3.mt-0.col-md-12
|
||||
label Tag color
|
||||
input.form-color.d-block(type='color', value='#563d7c')
|
||||
button.btn.btn-secondary(type='button') Save
|
||||
button.btn.btn-primary(type='button', data-bs-dismiss='modal') Cancel
|
||||
#exampleModal.modal.fade.modal-bookmark(tabindex='-1', role='dialog', aria-labelledby='exampleModalLabel', aria-hidden='true')
|
||||
.modal-dialog.modal-lg(role='document')
|
||||
.modal-content
|
||||
.modal-header
|
||||
h5#exampleModalLabel.modal-title Add Bookmark
|
||||
button.btn-close(type='button', data-bs-dismiss='modal', aria-label='Close')
|
||||
.modal-body
|
||||
form.form-bookmark#bookmark-form.needs-validation(novalidate='')
|
||||
.row.g-2
|
||||
.mb-3.mt-0.col-md-12
|
||||
label(for='bm-weburl') Web Url
|
||||
input#bm-weburl.form-control(type='text', required='', autocomplete='off')
|
||||
.mb-3.mt-0.col-md-12
|
||||
label(for='bm-title') Title
|
||||
input#bm-title.form-control(type='text', required='', autocomplete='off')
|
||||
.mb-3.mt-0.col-md-12
|
||||
label Description
|
||||
textarea#bm-desc.form-control(required='', autocomplete='off')
|
||||
.mb-3.mt-0.col-md-6
|
||||
label Group
|
||||
select.js-example-basic-single#bm-group
|
||||
option(value='bookmark') My Bookmarks
|
||||
.mb-3.mt-0.col-md-6
|
||||
label Collection
|
||||
select.js-example-disabled-results#bm-collection
|
||||
option(value='general') General
|
||||
option(value='fs') fs
|
||||
input#index_var(type='hidden', value='6' )
|
||||
button#Bookmark.btn.btn-secondary(onclick='submitBookMark()', type='submit') Save
|
||||
button.btn.btn-primary(type='button', data-bs-dismiss='modal') Cancel
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
736
static/admin/assets/pug/pages/theme/bootstrap-basic-table.pug
Normal file
736
static/admin/assets/pug/pages/theme/bootstrap-basic-table.pug
Normal file
@@ -0,0 +1,736 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
include ../../components/loader
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Bootstrap Basic Tables
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Bootstrap Tables
|
||||
li.breadcrumb-item.active Bootstrap Basic Tables
|
||||
// Container-fluid starts
|
||||
.container-fluid.basic_table
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Basic Table With Border Bottom Color
|
||||
span
|
||||
| Use a class
|
||||
code table
|
||||
| to any table, and
|
||||
code .border-bottom-*
|
||||
| class for Border bottom color
|
||||
.table-responsive
|
||||
table.table
|
||||
thead
|
||||
tr.border-bottom-primary
|
||||
th(scope='col') Id
|
||||
th(scope='col') First Name
|
||||
th(scope='col') Last Name
|
||||
th(scope='col') Username
|
||||
th(scope='col') Designation
|
||||
th(scope='col') Company
|
||||
th(scope='col') Language
|
||||
th(scope='col') Country
|
||||
tbody
|
||||
tr.border-bottom-secondary
|
||||
th(scope='row') 1
|
||||
td
|
||||
img.img-30.me-2(src="../assets/images/user/1.jpg", alt="profile")
|
||||
| Ram Jacob
|
||||
td Wolfe
|
||||
td RamJacob@twitter
|
||||
td Developer
|
||||
td Apple Inc.
|
||||
td
|
||||
span.badge.badge-light-danger Php
|
||||
td IND
|
||||
tr.border-bottom-success
|
||||
th(scope='row') 2
|
||||
td
|
||||
img.img-30.me-2(src="../assets/images/user/2.jpg", alt="profile")
|
||||
| John Deo
|
||||
td Gummer
|
||||
td JohnDeo@twitter
|
||||
td Designer
|
||||
td Hewlett packard
|
||||
td
|
||||
span.badge.badge-light-primary Html
|
||||
td US
|
||||
tr.border-bottom-info
|
||||
th(scope='row') 3
|
||||
td
|
||||
img.img-30.me-2(src="../assets/images/user/3.jpg", alt="profile")
|
||||
| Elana John
|
||||
td Cazale
|
||||
td ElanaJohn@twitter
|
||||
td Designer
|
||||
td Microsoft
|
||||
td
|
||||
span.badge.badge-light-danger Pug
|
||||
td UK
|
||||
tr.border-bottom-warning
|
||||
th(scope='row') 4
|
||||
td
|
||||
img.img-30.me-2(src="../assets/images/user/7.jpg", alt="")
|
||||
| Meryl Streep
|
||||
td Roberts
|
||||
td MerylStreep@twitter
|
||||
td Developer
|
||||
td Tata Ltd.
|
||||
td
|
||||
span.badge.badge-light-success React
|
||||
td IDN
|
||||
tr.border-bottom-danger
|
||||
th(scope='row') 5
|
||||
td
|
||||
img.img-30.me-2(src="../assets/images/user/2.png", alt="")
|
||||
| Emma Stone
|
||||
td Stone
|
||||
td EmmaStone@twitter
|
||||
td Developer
|
||||
td Wipro Ltd.
|
||||
td
|
||||
span.badge.badge-light-primary Vue
|
||||
td IRN
|
||||
tr.border-bottom-light
|
||||
th(scope='row') 6
|
||||
td
|
||||
img.img-30.me-2(src="../assets/images/user/3.png", alt="")
|
||||
| Eliana Jons
|
||||
td Jons
|
||||
td ElianaJons@twitter
|
||||
td Developer
|
||||
td Info Ltd.
|
||||
td
|
||||
span.badge.badge-light-success Vue
|
||||
td IRN
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Inverse Table
|
||||
span
|
||||
| Use a class
|
||||
code table-inverse
|
||||
| inside table element.
|
||||
.table-responsive
|
||||
table.table.table-inverse
|
||||
thead
|
||||
tr.border-bottom-light
|
||||
th(scope='col') Id
|
||||
th(scope='col') First Name
|
||||
th(scope='col') Last Name
|
||||
th(scope='col') Office
|
||||
th(scope='col') Position
|
||||
th(scope='col') Salary
|
||||
th(scope='col') Join Date
|
||||
th(scope='col') Age
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Stephan
|
||||
td Laiten
|
||||
td Tokyo
|
||||
td Accountant
|
||||
td $2100.00
|
||||
td 21/01/2022
|
||||
td 20
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Fay
|
||||
td Van Damme
|
||||
td London
|
||||
td CEO
|
||||
td $1420.00
|
||||
td 14/02/2022
|
||||
td 22
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td Brevin
|
||||
td Oleveria
|
||||
td New York
|
||||
td Software Engineer
|
||||
td $1340.00
|
||||
td 04/06/2022
|
||||
td 18
|
||||
tr
|
||||
th(scope='row') 4
|
||||
td Regina
|
||||
td Ottandy
|
||||
td France
|
||||
td Pre-sale Support
|
||||
td $3400.00
|
||||
td 10/08/2022
|
||||
td 25
|
||||
tr
|
||||
th(scope='row') 5
|
||||
td Vani
|
||||
td Shah
|
||||
td Los Angeles
|
||||
td Senior Developer
|
||||
td $3500.00
|
||||
td 23/07/2022
|
||||
td 28
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Hoverable Rows With Horizontal Border
|
||||
span
|
||||
| Hoverable row use a class
|
||||
code table-hover
|
||||
| and for Horizontal border use a class
|
||||
code .table-border-horizontal
|
||||
| , Solid border Use a class
|
||||
code .border-solid .table
|
||||
| class.
|
||||
.table-responsive.signal-table
|
||||
table.table.table-hover
|
||||
thead
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') Status
|
||||
th(scope='col') Signal Name
|
||||
th(scope='col') Security
|
||||
th(scope='col') Stage
|
||||
th(scope='col') Schedule
|
||||
th(scope='col') Team Lead
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td.d-flex.align-items-center
|
||||
i.bg-light-success.font-success(data-feather="alert-triangle")
|
||||
span.font-success No Signal
|
||||
td Astrid: NE Shared managed
|
||||
td Medium
|
||||
td Triaged
|
||||
td 0.33
|
||||
td Chase Nguyen
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td.d-flex.align-items-center
|
||||
i.bg-light-danger.font-danger(data-feather="alert-triangle")
|
||||
span.font-danger Offline
|
||||
td Cosmo: prod shared ares
|
||||
td Huge
|
||||
td Triaged
|
||||
td 0.39
|
||||
td Brie Furman
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td.d-flex.align-items-center
|
||||
i.bg-light-primary.font-primary(data-feather="alert-circle")
|
||||
span.font-primary Online
|
||||
td Phoenix: prod shared lyra-lists
|
||||
td Minor
|
||||
td No Triaged
|
||||
td 3.12
|
||||
td Jeremy Lake
|
||||
tr
|
||||
th(scope='row') 4
|
||||
td.d-flex.align-items-center
|
||||
i.bg-light-success.font-success(data-feather="check-circle")
|
||||
span.font-success No Signal
|
||||
td Astrid: NE Shared managed
|
||||
td Negligible
|
||||
td Triaged
|
||||
td 13.18
|
||||
td Angelica Howards
|
||||
tr
|
||||
th(scope='row') 5
|
||||
td.d-flex.align-items-center
|
||||
i.bg-light-danger.font-danger(data-feather="check-circle")
|
||||
span.font-danger Online
|
||||
td Astrid: NE Shared managed
|
||||
td Medium
|
||||
td No Triaged
|
||||
td 5.33
|
||||
td Diane Okuma
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Inverse Table with Primary background
|
||||
span
|
||||
| Use a class
|
||||
code .bg-info, .bg-success, .bg-warning and .bg-danger classes.
|
||||
| with light text on dark backgrounds inside table element.
|
||||
br
|
||||
| To set the light background color use .bg-[color] class where [color] is the value of your selected color from stack color palette. So for teal color background class will be .bg-teal
|
||||
.table-responsive
|
||||
table.table.table-striped.bg-primary
|
||||
thead.tbl-strip-thad-bdr
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') First Name
|
||||
th(scope='col') Last Name
|
||||
th(scope='col') Company
|
||||
th(scope='col') Credit Volume
|
||||
th(scope='col') Username
|
||||
th(scope='col') Role
|
||||
th(scope='col') Country
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Ram Jacob
|
||||
td Wolfe
|
||||
td Apple Inc.
|
||||
td $3500.00
|
||||
td RamJacob@twitter
|
||||
td Developer
|
||||
td IND
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td John Deo
|
||||
td Gummer
|
||||
td Hewlett packard
|
||||
td $2400.00
|
||||
td JohnDeo@twitter
|
||||
td Designer
|
||||
td US
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td Elana John
|
||||
td Wolfe
|
||||
td Microsoft
|
||||
td $2560.00
|
||||
td ElanaJohn@twitter
|
||||
td Designer
|
||||
td UK
|
||||
tr
|
||||
th(scope='row') 4
|
||||
td Meryl Streep
|
||||
td Roberts
|
||||
td Tata Ltd.
|
||||
td $1870.00
|
||||
td MerylStreep@twitter
|
||||
td Developer
|
||||
td IND
|
||||
tr
|
||||
th(scope='row') 5
|
||||
td Emma Stone
|
||||
td Stone
|
||||
td Wipro Ltd.
|
||||
td $4580.00
|
||||
td EmmaStone@twitter
|
||||
td Developer
|
||||
td IRN
|
||||
tr
|
||||
th(scope='row') 6
|
||||
td Eliana Jons
|
||||
td Jons
|
||||
td Info Ltd.
|
||||
td $4580.00
|
||||
td ElianaJons@twitter
|
||||
td Developer
|
||||
td IRN
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Caption
|
||||
span
|
||||
| A
|
||||
code <caption>
|
||||
| functions like a heading for a table. It helps users with screen readers to find a table and understand what it’s about and decide if they want to read it.
|
||||
.card-block.row
|
||||
.col-sm-12.col-lg-12.col-xl-12
|
||||
.table-responsive
|
||||
table.table
|
||||
caption List of users
|
||||
thead
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') Employee Name
|
||||
th(scope='col') Email
|
||||
th(scope='col') Experience
|
||||
th(scope='col') Sex
|
||||
th(scope='col') Contact No.
|
||||
th(scope='col') Age
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Elana Robbert
|
||||
td ElanaRob@gmail.com
|
||||
td 1 Year
|
||||
td Male
|
||||
td +91 9789887777
|
||||
td 28
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Stiphen Deo
|
||||
td Stiphen@yahoo.com
|
||||
td 6 Month
|
||||
td Female
|
||||
td +91 9874563210
|
||||
td 22
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td Genelia Ottre
|
||||
td Genelia@gmail.com
|
||||
td 2 Days
|
||||
td Male
|
||||
td +91 8794562135
|
||||
td 24
|
||||
.col-sm-6
|
||||
.card
|
||||
.card-header
|
||||
h3 Table head options
|
||||
span
|
||||
| Similar to tables , use the modifier classes
|
||||
code .table-[color]
|
||||
| to make
|
||||
code thead
|
||||
| appear in any color.
|
||||
.card-block.row
|
||||
.col-sm-12.col-lg-12.col-xl-12
|
||||
.table-responsive
|
||||
table.table
|
||||
thead.table-dark
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') First Name
|
||||
th(scope='col') Last Name
|
||||
th(scope='col') Username
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Mark
|
||||
td Otto
|
||||
td @mdo
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Jacob
|
||||
td Thornton
|
||||
td @fat
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td Larry
|
||||
td the Bird
|
||||
td @twitter
|
||||
.col-sm-6
|
||||
.card
|
||||
.card-header
|
||||
h3 Striped Row with Inverse Table
|
||||
span
|
||||
| Use
|
||||
code .table-striped
|
||||
| to add zebra-striping to any table row within the
|
||||
code
|
||||
| . This styling doesn't work in IE8 and below as :nth-child CSS selector isn't supported.
|
||||
.card-block.row
|
||||
.col-sm-12.col-lg-12.col-xl-12
|
||||
.table-responsive
|
||||
table.table.table-inverse.table-striped
|
||||
thead
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') Dessert
|
||||
th(scope='col') Calories
|
||||
th(scope='col') Fat
|
||||
th(scope='col') Price
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td KitKat
|
||||
td 518
|
||||
td 26
|
||||
td 20
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Donut
|
||||
td 452
|
||||
td 25
|
||||
td 80
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td Eclair
|
||||
td 262
|
||||
td 16
|
||||
td 10
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Breckpoint Specific
|
||||
span
|
||||
| Use
|
||||
code .table-responsive"❴-sm|-md|-lg|-xl|-xxl❵"
|
||||
| functions like a heading for a table. It helps users with screen readers to find a table and understand what it’s about and decide if they want to read it.
|
||||
.card-block.row
|
||||
.col-sm-12.col-lg-12.col-xl-12
|
||||
.table-responsive
|
||||
table.table.table-responsive-sm
|
||||
thead
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') Name
|
||||
th(scope='col') Order Id
|
||||
th(scope='col') Price
|
||||
th(scope='col') Quantity
|
||||
th(scope='col') Total
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Iphone X Grey
|
||||
td C12345
|
||||
td $12550
|
||||
td 1
|
||||
td $12550
|
||||
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Titan Watch
|
||||
td A14725
|
||||
td $120
|
||||
td 2
|
||||
td $250
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td Apple Airpods
|
||||
td B54213
|
||||
td $210
|
||||
td 1
|
||||
td $210
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Responsive Tables With Light Background
|
||||
span
|
||||
| A
|
||||
code .table-responsive , .table-light
|
||||
| inside table element.
|
||||
.card-block.row
|
||||
.col-sm-12.col-lg-12.col-xl-12
|
||||
.table-responsive
|
||||
table.table.table-light
|
||||
thead
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') Task
|
||||
th(scope='col') Email
|
||||
th(scope='col') Phone
|
||||
th(scope='col') Assign
|
||||
th(scope='col') Date
|
||||
th(scope='col') Price
|
||||
th(scope='col') Status
|
||||
th(scope='col') Progress
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Web Development
|
||||
td Pixel@efo.com
|
||||
td +91 7874226671
|
||||
td Mark Jecno
|
||||
td 12/07/2022
|
||||
td $2315.00
|
||||
td.font-danger Pending
|
||||
td 75%
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Graphic Design
|
||||
td Strap@google.com
|
||||
td +91 8347855785
|
||||
td Elana John
|
||||
td 23/08/2022
|
||||
td $4125.00
|
||||
td.font-danger Pending
|
||||
td 45%
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td WordPress
|
||||
td Pixelstrap@gmail.com
|
||||
td +91 635609347
|
||||
td John Deo
|
||||
td 15/04/2022
|
||||
td $6123.00
|
||||
td.font-success Done
|
||||
td 100%
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Sizing Tables
|
||||
span
|
||||
| Example of Extra large table, Add
|
||||
code .table-xl
|
||||
| class to the
|
||||
code .table
|
||||
| , Large table Add
|
||||
code .table-lg
|
||||
| , Default table Add
|
||||
code .table-de
|
||||
| , Small table Add
|
||||
code .table-sm
|
||||
| , Extra Small table Add
|
||||
code .table-xs
|
||||
| to create a table.
|
||||
.card-block.row
|
||||
.col-sm-12.col-lg-12.col-xl-12
|
||||
.table-responsive
|
||||
table.table.table-lg
|
||||
thead
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') Employee Name
|
||||
th(scope='col') Date
|
||||
th(scope='col') Status
|
||||
th(scope='col') Hours
|
||||
th(scope='col') Performance
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Mark Jecno
|
||||
td 22/08/2022
|
||||
td.font-danger On leave
|
||||
td 0
|
||||
td 29/30
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Elana Robbert
|
||||
td 21/08/2022
|
||||
td.font-success Present
|
||||
td 10
|
||||
td 30/30
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td John Deo
|
||||
td 18/08/2022
|
||||
td.font-danger On leave
|
||||
td 8
|
||||
td 28/30
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Custom Table Color With Hover And Stripped
|
||||
span
|
||||
| Use class
|
||||
code table-hover, table-striped table-*table-info,table-success,table-success,table-info,table-danger,table-primary,table-secondary,table-light,table-active
|
||||
| inside table element.
|
||||
.table-responsive
|
||||
table.table.table-striped.bg-primary.hover
|
||||
thead.tbl-strip-thad-bdr
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') Film Title
|
||||
th(scope='col') Released
|
||||
th(scope='col') Studio
|
||||
th(scope='col') Budget
|
||||
th(scope='col') Domestic Gross
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Frozen
|
||||
td 2013
|
||||
td Disney
|
||||
td $150,000,000
|
||||
td $400,953,009
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Minions
|
||||
td 2015
|
||||
td Universal
|
||||
td $74,000,000
|
||||
td $336,045,770
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td Zootopia
|
||||
td 2016
|
||||
td Disney
|
||||
td $150,000,000
|
||||
td $341,268,248
|
||||
tr
|
||||
th(scope='row') 4
|
||||
td Finding Dory
|
||||
td 2016
|
||||
td Disney Pixar
|
||||
td $175,000,000
|
||||
td $486,295,561
|
||||
tr
|
||||
th(scope='row') 5
|
||||
td Toy Story 3
|
||||
td 2010
|
||||
td Disney Pixar
|
||||
td $200,000,000
|
||||
td $415,004,880
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h3 Dashed Border
|
||||
span
|
||||
| Dashed border use class
|
||||
code .table-dashed
|
||||
| , for Dotted border use class
|
||||
code .table-dotted
|
||||
| , for Double border use class
|
||||
code .table-Double
|
||||
.card-block.row
|
||||
.col-sm-12.col-lg-12.col-xl-12
|
||||
.table-responsive
|
||||
table.table.table-dashed
|
||||
thead
|
||||
tr
|
||||
th(scope='col') Id
|
||||
th(scope='col') Classname
|
||||
th(scope='col') Type
|
||||
th(scope='col') Hours
|
||||
th(scope='col') Trainer
|
||||
th(scope='col') Spots
|
||||
tbody
|
||||
tr
|
||||
th(scope='row') 1
|
||||
td Crit Cardio
|
||||
td Gym
|
||||
td 9:00 AM - 11:00 AM
|
||||
td Aaron Chapman
|
||||
td 10
|
||||
tr
|
||||
th(scope='row') 2
|
||||
td Zumba Dance
|
||||
td Dance
|
||||
td 8:00 AM - 9:00 AM
|
||||
td Donna Wilson
|
||||
td 12
|
||||
tr
|
||||
th(scope='row') 3
|
||||
td Like a butterfly
|
||||
td Boxing
|
||||
td 9:00 AM - 10:00 AM
|
||||
td Randy Porter
|
||||
td 13
|
||||
tr
|
||||
th(scope='row') 4
|
||||
td Pilates Reformer
|
||||
td Gym
|
||||
td 7:00 AM - 8:30 AM
|
||||
td Aaron Chapman
|
||||
td 15
|
||||
tr
|
||||
th(scope='row') 5
|
||||
td Mind & Body
|
||||
td Yoga
|
||||
td 8:00 AM - 9:00 AM
|
||||
td Adam Stewart
|
||||
td 20
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
354
static/admin/assets/pug/pages/theme/bootstrap-notify.pug
Normal file
354
static/admin/assets/pug/pages/theme/bootstrap-notify.pug
Normal file
@@ -0,0 +1,354 @@
|
||||
- var theme_customizer = true;
|
||||
- var notify = true;
|
||||
- var page_notify = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Bootstrap Notify
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Bonus Ui
|
||||
li.breadcrumb-item.active Bootstrap Notify
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Bootstrap Notify
|
||||
span lorem ipsum dolor sit amet, consectetur adipisicing elit
|
||||
.card-body
|
||||
.m-portlet__body
|
||||
.row
|
||||
.col-xl-5
|
||||
form.theme-form.sm-form
|
||||
.mb-3
|
||||
.row
|
||||
label.col-xl-2.col-sm-12.col-md-12.col-form-label Placement
|
||||
.col-xl-4.col-sm-12.col-md-12.mb-md-4.mb-2
|
||||
select.form-select#bootstrap-notify-placement-from.form-control
|
||||
option(value='top') Top
|
||||
option(value='bottom') Bottom
|
||||
.col-xl-4.col-md-12.col-sm-12.mb-4
|
||||
select.form-select#bootstrap-notify-placement-align.form-control
|
||||
option(value='left') Left
|
||||
option(value='right', select.form-selected='') Right
|
||||
option(value='center') Center
|
||||
.row
|
||||
label.col-xl-2.col-sm-12.col-md-12.col-form-label Animation
|
||||
.col-xl-4.col-md-12.col-sm-12.mb-md-4.mb-2
|
||||
select.form-select#bootstrap-notify-enter.form-control
|
||||
optgroup(label='Attention Seekers')
|
||||
option(value='bounce') bounce
|
||||
option(value='flash') flash
|
||||
option(value='pulse') pulse
|
||||
option(value='rubberBand') rubberBand
|
||||
option(value='shake') shake
|
||||
option(value='swing') swing
|
||||
option(value='tada') tada
|
||||
option(value='wobble') wobble
|
||||
option(value='jello') jello
|
||||
optgroup(label='Bouncing Entrances')
|
||||
option(value='bounceIn') bounceIn
|
||||
option(value='bounceInDown') bounceInDown
|
||||
option(value='bounceInLeft') bounceInLeft
|
||||
option(value='bounceInRight') bounceInRight
|
||||
option(value='bounceInUp') bounceInUp
|
||||
optgroup(label='Bouncing Exits')
|
||||
option(value='bounceOut') bounceOut
|
||||
option(value='bounceOutDown') bounceOutDown
|
||||
option(value='bounceOutLeft') bounceOutLeft
|
||||
option(value='bounceOutRight') bounceOutRight
|
||||
option(value='bounceOutUp') bounceOutUp
|
||||
optgroup(label='Fading Entrances')
|
||||
option(value='fadeIn') fadeIn
|
||||
option(value='fadeInDown') fadeInDown
|
||||
option(value='fadeInDownBig') fadeInDownBig
|
||||
option(value='fadeInLeft') fadeInLeft
|
||||
option(value='fadeInLeftBig') fadeInLeftBig
|
||||
option(value='fadeInRight') fadeInRight
|
||||
option(value='fadeInRightBig') fadeInRightBig
|
||||
option(value='fadeInUp') fadeInUp
|
||||
option(value='fadeInUpBig') fadeInUpBig
|
||||
optgroup(label='Fading Exits')
|
||||
option(value='fadeOut') fadeOut
|
||||
option(value='fadeOutDown') fadeOutDown
|
||||
option(value='fadeOutDownBig') fadeOutDownBig
|
||||
option(value='fadeOutLeft') fadeOutLeft
|
||||
option(value='fadeOutLeftBig') fadeOutLeftBig
|
||||
option(value='fadeOutRight') fadeOutRight
|
||||
option(value='fadeOutRightBig') fadeOutRightBig
|
||||
option(value='fadeOutUp') fadeOutUp
|
||||
option(value='fadeOutUpBig') fadeOutUpBig
|
||||
optgroup(label='Flippers')
|
||||
option(value='flip') flip
|
||||
option(value='flipInX') flipInX
|
||||
option(value='flipInY') flipInY
|
||||
option(value='flipOutX') flipOutX
|
||||
option(value='flipOutY') flipOutY
|
||||
optgroup(label='Lightspeed')
|
||||
option(value='lightSpeedIn') lightSpeedIn
|
||||
option(value='lightSpeedOut') lightSpeedOut
|
||||
optgroup(label='Rotating Entrances')
|
||||
option(value='rotateIn') rotateIn
|
||||
option(value='rotateInDownLeft') rotateInDownLeft
|
||||
option(value='rotateInDownRight') rotateInDownRight
|
||||
option(value='rotateInUpLeft') rotateInUpLeft
|
||||
option(value='rotateInUpRight') rotateInUpRight
|
||||
optgroup(label='Rotating Exits')
|
||||
option(value='rotateOut') rotateOut
|
||||
option(value='rotateOutDownLeft') rotateOutDownLeft
|
||||
option(value='rotateOutDownRight') rotateOutDownRight
|
||||
option(value='rotateOutUpLeft') rotateOutUpLeft
|
||||
option(value='rotateOutUpRight') rotateOutUpRight
|
||||
optgroup(label='Sliding Entrances')
|
||||
option(value='slideInUp') slideInUp
|
||||
option(value='slideInDown') slideInDown
|
||||
option(value='slideInLeft') slideInLeft
|
||||
option(value='slideInRight') slideInRight
|
||||
optgroup(label='Sliding Exits')
|
||||
option(value='slideOutUp') slideOutUp
|
||||
option(value='slideOutDown') slideOutDown
|
||||
option(value='slideOutLeft') slideOutLeft
|
||||
option(value='slideOutRight') slideOutRight
|
||||
optgroup(label='Zoom Entrances')
|
||||
option(value='zoomIn') zoomIn
|
||||
option(value='zoomInDown') zoomInDown
|
||||
option(value='zoomInLeft') zoomInLeft
|
||||
option(value='zoomInRight') zoomInRight
|
||||
option(value='zoomInUp') zoomInUp
|
||||
optgroup(label='Zoom Exits')
|
||||
option(value='zoomOut') zoomOut
|
||||
option(value='zoomOutDown') zoomOutDown
|
||||
option(value='zoomOutLeft') zoomOutLeft
|
||||
option(value='zoomOutRight') zoomOutRight
|
||||
option(value='zoomOutUp') zoomOutUp
|
||||
optgroup(label='Specials')
|
||||
option(value='hinge') hinge
|
||||
option(value='rollIn') rollIn
|
||||
option(value='rollOut') rollOut
|
||||
.col-xl-4.col-md-12.col-sm-12.mb-4
|
||||
select.form-select#bootstrap-notify-exit.form-control
|
||||
optgroup(label='Attention Seekers')
|
||||
option(value='bounce') bounce
|
||||
option(value='flash') flash
|
||||
option(value='pulse') pulse
|
||||
option(value='rubberBand') rubberBand
|
||||
option(value='shake') shake
|
||||
option(value='swing') swing
|
||||
option(value='tada') tada
|
||||
option(value='wobble') wobble
|
||||
option(value='jello') jello
|
||||
optgroup(label='Bouncing Entrances')
|
||||
option(value='bounceIn') bounceIn
|
||||
option(value='bounceInDown') bounceInDown
|
||||
option(value='bounceInLeft') bounceInLeft
|
||||
option(value='bounceInRight') bounceInRight
|
||||
option(value='bounceInUp') bounceInUp
|
||||
optgroup(label='Bouncing Exits')
|
||||
option(value='bounceOut') bounceOut
|
||||
option(value='bounceOutDown') bounceOutDown
|
||||
option(value='bounceOutLeft') bounceOutLeft
|
||||
option(value='bounceOutRight') bounceOutRight
|
||||
option(value='bounceOutUp') bounceOutUp
|
||||
optgroup(label='Fading Entrances')
|
||||
option(value='fadeIn') fadeIn
|
||||
option(value='fadeInDown') fadeInDown
|
||||
option(value='fadeInDownBig') fadeInDownBig
|
||||
option(value='fadeInLeft') fadeInLeft
|
||||
option(value='fadeInLeftBig') fadeInLeftBig
|
||||
option(value='fadeInRight') fadeInRight
|
||||
option(value='fadeInRightBig') fadeInRightBig
|
||||
option(value='fadeInUp') fadeInUp
|
||||
option(value='fadeInUpBig') fadeInUpBig
|
||||
optgroup(label='Fading Exits')
|
||||
option(value='fadeOut') fadeOut
|
||||
option(value='fadeOutDown') fadeOutDown
|
||||
option(value='fadeOutDownBig') fadeOutDownBig
|
||||
option(value='fadeOutLeft') fadeOutLeft
|
||||
option(value='fadeOutLeftBig') fadeOutLeftBig
|
||||
option(value='fadeOutRight') fadeOutRight
|
||||
option(value='fadeOutRightBig') fadeOutRightBig
|
||||
option(value='fadeOutUp') fadeOutUp
|
||||
option(value='fadeOutUpBig') fadeOutUpBig
|
||||
optgroup(label='Flippers')
|
||||
option(value='flip') flip
|
||||
option(value='flipInX') flipInX
|
||||
option(value='flipInY') flipInY
|
||||
option(value='flipOutX') flipOutX
|
||||
option(value='flipOutY') flipOutY
|
||||
optgroup(label='Lightspeed')
|
||||
option(value='lightSpeedIn') lightSpeedIn
|
||||
option(value='lightSpeedOut') lightSpeedOut
|
||||
optgroup(label='Rotating Entrances')
|
||||
option(value='rotateIn') rotateIn
|
||||
option(value='rotateInDownLeft') rotateInDownLeft
|
||||
option(value='rotateInDownRight') rotateInDownRight
|
||||
option(value='rotateInUpLeft') rotateInUpLeft
|
||||
option(value='rotateInUpRight') rotateInUpRight
|
||||
optgroup(label='Rotating Exits')
|
||||
option(value='rotateOut') rotateOut
|
||||
option(value='rotateOutDownLeft') rotateOutDownLeft
|
||||
option(value='rotateOutDownRight') rotateOutDownRight
|
||||
option(value='rotateOutUpLeft') rotateOutUpLeft
|
||||
option(value='rotateOutUpRight') rotateOutUpRight
|
||||
optgroup(label='Sliding Entrances')
|
||||
option(value='slideInUp') slideInUp
|
||||
option(value='slideInDown') slideInDown
|
||||
option(value='slideInLeft') slideInLeft
|
||||
option(value='slideInRight') slideInRight
|
||||
optgroup(label='Sliding Exits')
|
||||
option(value='slideOutUp') slideOutUp
|
||||
option(value='slideOutDown') slideOutDown
|
||||
option(value='slideOutLeft') slideOutLeft
|
||||
option(value='slideOutRight') slideOutRight
|
||||
optgroup(label='Zoom Entrances')
|
||||
option(value='zoomIn') zoomIn
|
||||
option(value='zoomInDown') zoomInDown
|
||||
option(value='zoomInLeft') zoomInLeft
|
||||
option(value='zoomInRight') zoomInRight
|
||||
option(value='zoomInUp') zoomInUp
|
||||
optgroup(label='Zoom Exits')
|
||||
option(value='zoomOut') zoomOut
|
||||
option(value='zoomOutDown') zoomOutDown
|
||||
option(value='zoomOutLeft') zoomOutLeft
|
||||
option(value='zoomOutRight') zoomOutRight
|
||||
option(value='zoomOutUp') zoomOutUp
|
||||
optgroup(label='Specials')
|
||||
option(value='hinge') hinge
|
||||
option(value='rollIn') rollIn
|
||||
option(value='rollOut') rollOut
|
||||
.row
|
||||
label.col-xl-2.col-sm-12.col-md-12.col-form-label Icon
|
||||
.col-xl-4.col-md-12.col-sm-12.mb-4
|
||||
select.form-select#bootstrap-notify-icon.form-control
|
||||
option(value='') None
|
||||
option(value='fa fa-check-square') fa fa-check-square
|
||||
option(value='fa fa-warning') fa fa-warning
|
||||
option(value='fa fa-cloud-download') fa fa-cloud-download
|
||||
option(value='fa fa-unlock-alt') fa fa-unlock-alt
|
||||
option(value='fa fa-spin fa-circle-o-notch') fa fa-spin fa-circle-o-notch
|
||||
option(value='fa fa-spin fa-refresh') fa fa-spin fa-refresh
|
||||
.row
|
||||
.mb-3.row
|
||||
.row
|
||||
.col-xl-6
|
||||
.mb-3.row
|
||||
label.col-sm-4.col-6.col-form-label URL Clickable
|
||||
.col-sm-8.col-6
|
||||
.media-body.text-start.icon-state
|
||||
label.switch
|
||||
input#bootstrap-notify-url(type='checkbox')
|
||||
span.switch-state
|
||||
.mb-3.row
|
||||
label.col-sm-4.col-6.col-form-label Allow dismiss
|
||||
.col-sm-8.col-6
|
||||
.media-body.text-start.icon-state
|
||||
label.switch
|
||||
input#bootstrap-notify-dismiss(type='checkbox')
|
||||
span.switch-state
|
||||
.mb-3.row
|
||||
label.col-sm-4.col-6.col-form-label Pause on hover
|
||||
.col-sm-8.col-6
|
||||
.media-body.text-start.icon-state
|
||||
label.switch
|
||||
input#bootstrap-notify-pause(type='checkbox')
|
||||
span.switch-state
|
||||
.mb-3.row
|
||||
label.col-sm-4.col-6.col-form-label Newest on top
|
||||
.col-sm-8.col-6
|
||||
.media-body.text-start.icon-state
|
||||
label.switch
|
||||
input#bootstrap-notify-top(type='checkbox')
|
||||
span.switch-state
|
||||
.mb-3.row
|
||||
label.col-sm-4.col-6.col-form-label Show Title
|
||||
.col-sm-8.col-6
|
||||
.media-body.text-start.icon-state
|
||||
label.switch
|
||||
input#bootstrap-notify-title(type='checkbox')
|
||||
span.switch-state
|
||||
.mb-3.row
|
||||
label.col-sm-4.col-6.col-form-label Show Progress
|
||||
.col-sm-8.col-6
|
||||
.media-body.text-start.icon-state
|
||||
label.switch
|
||||
input#bootstrap-notify-progress(type='checkbox')
|
||||
span.switch-state
|
||||
.col-xl-6.theme-form.sm-form
|
||||
.mb-3.row
|
||||
label.col-form-label.col-lg-3.col-sm-12 Spacing
|
||||
.col-lg-4.col-md-9.col-sm-12
|
||||
input#bootstrap-notify-spacing.form-control.digits(type='number', value='10')
|
||||
.mb-3.row
|
||||
label.col-form-label.col-lg-3.col-sm-12 Offset X
|
||||
.col-lg-4.col-md-9.col-sm-12
|
||||
input#bootstrap-notify-offset-x.form-control.digits(type='number', value='30')
|
||||
.mb-3.row
|
||||
label.col-form-label.col-lg-3.col-sm-12 Offset Y
|
||||
.col-lg-4.col-md-9.col-sm-12
|
||||
input#bootstrap-notify-offset-y.form-control.digits(type='number', value='30')
|
||||
.mb-3.row
|
||||
label.col-form-label.col-lg-3.col-sm-12 Delay
|
||||
.col-lg-4.col-md-9.col-sm-12
|
||||
input#bootstrap-notify-delay.form-control.digits(type='number', value='1000')
|
||||
.mb-3.row
|
||||
label.col-form-label.col-lg-3.col-sm-12 Timer
|
||||
.col-lg-4.col-md-9.col-sm-12
|
||||
input#bootstrap-notify-timer.form-control.digits(type='number', value='2000')
|
||||
.mb-3.row
|
||||
label.col-form-label.col-lg-3.col-sm-12 Z-Index
|
||||
.col-lg-4.col-md-9.col-sm-12
|
||||
input#bootstrap-notify-z-index.form-control.digits(type='number', value='10000')
|
||||
.mb-3.row
|
||||
label.col-form-label.col-lg-3.col-sm-12 State
|
||||
.col-lg-4.col-md-9.col-sm-12
|
||||
select.form-select#bootstrap-notify-state.form-control.height-35
|
||||
option(value='primary') Primary
|
||||
option(value='secondary') Secondary
|
||||
option(value='success') Success
|
||||
option(value='info') Info
|
||||
option(value='warning') Warning
|
||||
option(value='danger') Danger
|
||||
option(value='light') light
|
||||
option(value='dark') dark
|
||||
.card-footer
|
||||
.col-sm-12
|
||||
button#bootstrap-notify-gen-btn.btn.btn-primary Display Notify
|
||||
button.btn.btn-light(type='reset') Reset
|
||||
.card
|
||||
.card-body
|
||||
.row
|
||||
.col-sm-12
|
||||
h5 Example Of How To Use Bootstrap Notify
|
||||
span
|
||||
| Click Display Notify button to show different notify demo's & display script of different Notify demo below
|
||||
pre.mb-0
|
||||
code#notify-code-show
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
81
static/admin/assets/pug/pages/theme/box-layout.pug
Normal file
81
static/admin/assets/pug/pages/theme/box-layout.pug
Normal file
@@ -0,0 +1,81 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body.box-layout
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper.box-layout
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Box Layout
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Page Layout
|
||||
li.breadcrumb-item.active Box Layout
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card.alert.alert-primary(role='alert')
|
||||
h4.alert-heading Tip!
|
||||
p
|
||||
| Add class="box-layout" attribute to get this layout. The boxed layout is helpful when working on
|
||||
| large screens because it prevents the site from stretching very wide.
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Title
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
span Start creating your amazing application!
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <div class="card-body">
|
||||
| <span>Start creating your amazing application!
|
||||
| </span>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card-footer
|
||||
h6.mb-0 Card Footer
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
131
static/admin/assets/pug/pages/theme/breadcrumb.pug
Normal file
131
static/admin/assets/pug/pages/theme/breadcrumb.pug
Normal file
@@ -0,0 +1,131 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Breadcrumb
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Bonus Ui
|
||||
li.breadcrumb-item.active Breadcrumb
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
// default breadcrumb start
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Default bootstrap breadcrumb
|
||||
span
|
||||
| use class
|
||||
code .breadcrumb to ol
|
||||
.card-body
|
||||
ol.breadcrumb.bg-white.p-t-0.p-l-0
|
||||
li.breadcrumb-item.active Home
|
||||
ol.breadcrumb.bg-white.p-l-0
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.active Library
|
||||
ol.breadcrumb.bg-white.p-l-0
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Library
|
||||
li.breadcrumb-item.active Data
|
||||
ol.breadcrumb.bg-white.m-b-0.p-b-0.p-l-0
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)')
|
||||
i.fa.fa-home
|
||||
li.breadcrumb-item Library
|
||||
li.breadcrumb-item.active Data
|
||||
// default breadcrumb ends
|
||||
// Nav breadcrumb start
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Nav breadcrumb
|
||||
span
|
||||
| use class
|
||||
code .breadcrumb to nav
|
||||
| similar to navigation
|
||||
.card-body
|
||||
nav.breadcrumb
|
||||
a.breadcrumb-item(href='javascript:void(0)') Home
|
||||
a.breadcrumb-item(href='javascript:void(0)') Library
|
||||
span.breadcrumb-item.active Bootstrap
|
||||
nav.breadcrumb.breadcrumb-icon
|
||||
a.breadcrumb-item(href='javascript:void(0)') Home
|
||||
a.breadcrumb-item(href='javascript:void(0)') Library
|
||||
span.breadcrumb-item.active Bootstrap
|
||||
nav.breadcrumb.breadcrumb-no-divider.mb-0
|
||||
a.breadcrumb-item(href='javascript:void(0)') Home
|
||||
a.breadcrumb-item(href='javascript:void(0)') Library
|
||||
span.breadcrumb-item.active Bootstrap
|
||||
// Nav breadcrumb ends
|
||||
// colored navigation start
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Colored breadcrumb
|
||||
span
|
||||
| use class
|
||||
code .breadcrumb-colored .bg-primary
|
||||
.card-body
|
||||
ol.breadcrumb.breadcrumb-colored.m-b-30.bg-primary
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.active Library
|
||||
ol.breadcrumb.breadcrumb-colored.m-b-30.bg-secondary
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.active Library
|
||||
ol.breadcrumb.breadcrumb-colored.m-b-30.bg-success
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.active Library
|
||||
ol.breadcrumb.breadcrumb-colored.m-b-30.bg-info
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.active Library
|
||||
ol.breadcrumb.breadcrumb-colored.m-b-30.bg-warning
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.active Library
|
||||
ol.breadcrumb.breadcrumb-colored.m-b-30.bg-danger
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.active Library
|
||||
ol.breadcrumb.breadcrumb-colored.m-b-30.bg-light
|
||||
li.breadcrumb-item
|
||||
a.txt-dark(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.txt-dark.active Library
|
||||
ol.breadcrumb.breadcrumb-colored.m-b-0.bg-dark
|
||||
li.breadcrumb-item
|
||||
a(href='javascript:void(0)') Home
|
||||
li.breadcrumb-item.active Library
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
5426
static/admin/assets/pug/pages/theme/button-builder.pug
Normal file
5426
static/admin/assets/pug/pages/theme/button-builder.pug
Normal file
File diff suppressed because it is too large
Load Diff
745
static/admin/assets/pug/pages/theme/button-group.pug
Normal file
745
static/admin/assets/pug/pages/theme/button-group.pug
Normal file
@@ -0,0 +1,745 @@
|
||||
- var height_equal = true;
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Button Group
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Buttons
|
||||
li.breadcrumb-item.active Button Group
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Basic button group
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-primary(type='button') Left
|
||||
button.btn.btn-primary(type='button') Middle
|
||||
button.btn.btn-primary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-secondary(type='button') Left
|
||||
button.btn.btn-secondary(type='button') Middle
|
||||
button.btn.btn-secondary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-success(type='button') Left
|
||||
button.btn.btn-success(type='button') Middle
|
||||
button.btn.btn-success(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-info(type='button') Left
|
||||
button.btn.btn-info(type='button') Middle
|
||||
button.btn.btn-info(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-warning(type='button') Left
|
||||
button.btn.btn-warning(type='button') Middle
|
||||
button.btn.btn-warning(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-danger(type='button') Left
|
||||
button.btn.btn-danger(type='button') Middle
|
||||
button.btn.btn-danger(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-light(type='button') Left
|
||||
button.btn.btn-light(type='button') Middle
|
||||
button.btn.btn-light(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-dark(type='button') Left
|
||||
button.btn.btn-dark(type='button') Middle
|
||||
button.btn.btn-dark(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Edges button group
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-primary(type='button') Left
|
||||
button.btn.btn-primary(type='button') Middle
|
||||
button.btn.btn-primary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-secondary(type='button') Left
|
||||
button.btn.btn-secondary(type='button') Middle
|
||||
button.btn.btn-secondary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-success(type='button') Left
|
||||
button.btn.btn-success(type='button') Middle
|
||||
button.btn.btn-success(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-info(type='button') Left
|
||||
button.btn.btn-info(type='button') Middle
|
||||
button.btn.btn-info(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-warning(type='button') Left
|
||||
button.btn.btn-warning(type='button') Middle
|
||||
button.btn.btn-warning(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-danger(type='button') Left
|
||||
button.btn.btn-danger(type='button') Middle
|
||||
button.btn.btn-danger(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-light(type='button') Left
|
||||
button.btn.btn-light(type='button') Middle
|
||||
button.btn.btn-light(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-dark(type='button') Left
|
||||
button.btn.btn-dark(type='button') Middle
|
||||
button.btn.btn-dark(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Flat button group
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-primary(type='button') Left
|
||||
button.btn.btn-primary(type='button') Middle
|
||||
button.btn.btn-primary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-secondary(type='button') Left
|
||||
button.btn.btn-secondary(type='button') Middle
|
||||
button.btn.btn-secondary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-success(type='button') Left
|
||||
button.btn.btn-success(type='button') Middle
|
||||
button.btn.btn-success(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-info(type='button') Left
|
||||
button.btn.btn-info(type='button') Middle
|
||||
button.btn.btn-info(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-dark(type='button') Left
|
||||
button.btn.btn-dark(type='button') Middle
|
||||
button.btn.btn-dark(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-warning(type='button') Left
|
||||
button.btn.btn-warning(type='button') Middle
|
||||
button.btn.btn-warning(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-danger(type='button') Left
|
||||
button.btn.btn-danger(type='button') Middle
|
||||
button.btn.btn-danger(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-light(type='button') Left
|
||||
button.btn.btn-light(type='button') Middle
|
||||
button.btn.btn-light(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-dark(type='button') Left
|
||||
button.btn.btn-dark(type='button') Middle
|
||||
button.btn.btn-dark(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 large Button group
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-primary.btn-lg(type='button') Left
|
||||
button.btn.btn-primary.btn-lg(type='button') Middle
|
||||
button.btn.btn-primary.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-secondary.btn-lg(type='button') Left
|
||||
button.btn.btn-secondary.btn-lg(type='button') Middle
|
||||
button.btn.btn-secondary.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-success.btn-lg(type='button') Left
|
||||
button.btn.btn-success.btn-lg(type='button') Middle
|
||||
button.btn.btn-success.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-info.btn-lg(type='button') Left
|
||||
button.btn.btn-info.btn-lg(type='button') Middle
|
||||
button.btn.btn-info.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-warning.btn-lg(type='button') Left
|
||||
button.btn.btn-warning.btn-lg(type='button') Middle
|
||||
button.btn.btn-warning.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-danger.btn-lg(type='button') Left
|
||||
button.btn.btn-danger.btn-lg(type='button') Middle
|
||||
button.btn.btn-danger.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-light.btn-lg(type='button') Left
|
||||
button.btn.btn-light.btn-lg(type='button') Middle
|
||||
button.btn.btn-light.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4.button-group-mb-sm
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-dark.btn-lg(type='button') Left
|
||||
button.btn.btn-dark.btn-lg(type='button') Middle
|
||||
button.btn.btn-dark.btn-lg(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 large Edges Button group
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-primary.btn-lg(type='button') Left
|
||||
button.btn.btn-primary.btn-lg(type='button') Middle
|
||||
button.btn.btn-primary.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-secondary.btn-lg(type='button') Left
|
||||
button.btn.btn-secondary.btn-lg(type='button') Middle
|
||||
button.btn.btn-secondary.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-success.btn-lg(type='button') Left
|
||||
button.btn.btn-success.btn-lg(type='button') Middle
|
||||
button.btn.btn-success.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-info.btn-lg(type='button') Left
|
||||
button.btn.btn-info.btn-lg(type='button') Middle
|
||||
button.btn.btn-info.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-warning.btn-lg(type='button') Left
|
||||
button.btn.btn-warning.btn-lg(type='button') Middle
|
||||
button.btn.btn-warning.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-danger.btn-lg(type='button') Left
|
||||
button.btn.btn-danger.btn-lg(type='button') Middle
|
||||
button.btn.btn-danger.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-light.btn-lg(type='button') Left
|
||||
button.btn.btn-light.btn-lg(type='button') Middle
|
||||
button.btn.btn-light.btn-lg(type='button') Right
|
||||
.col-md-6.col-sm-12.col-xxl-4.button-group-mb-sm
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-dark.btn-lg(type='button') Left
|
||||
button.btn.btn-dark.btn-lg(type='button') Middle
|
||||
button.btn.btn-dark.btn-lg(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Outline Custom button group
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-primary(type='button') Left
|
||||
button.btn.btn-primary(type='button') Middle
|
||||
button.btn.btn-outline-primary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-secondary(type='button') Left
|
||||
button.btn.btn-secondary(type='button') Middle
|
||||
button.btn.btn-outline-secondary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-success(type='button') Left
|
||||
button.btn.btn-success(type='button') Middle
|
||||
button.btn.btn-outline-success(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-info(type='button') Left
|
||||
button.btn.btn-info(type='button') Middle
|
||||
button.btn.btn-outline-info(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-warning(type='button') Left
|
||||
button.btn.btn-warning(type='button') Middle
|
||||
button.btn.btn-outline-warning(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-danger(type='button') Left
|
||||
button.btn.btn-danger(type='button') Middle
|
||||
button.btn.btn-outline-danger(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Left
|
||||
button.btn.btn-light(type='button') Middle
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-dark(type='button') Left
|
||||
button.btn.btn-dark(type='button') Middle
|
||||
button.btn.btn-outline-dark(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Outline custom button group
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-primary(type='button') Left
|
||||
button.btn.btn-outline-primary(type='button') Middle
|
||||
button.btn.btn-primary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-secondary(type='button') Left
|
||||
button.btn.btn-outline-secondary(type='button') Middle
|
||||
button.btn.btn-secondary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-success(type='button') Left
|
||||
button.btn.btn-outline-success(type='button') Middle
|
||||
button.btn.btn-success(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-info(type='button') Left
|
||||
button.btn.btn-outline-info(type='button') Middle
|
||||
button.btn.btn-info(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-warning(type='button') Left
|
||||
button.btn.btn-outline-warning(type='button') Middle
|
||||
button.btn.btn-warning(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-danger(type='button') Left
|
||||
button.btn.btn-outline-danger(type='button') Middle
|
||||
button.btn.btn-danger(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-light(type='button') Left
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Middle
|
||||
button.btn.btn-light(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-dark(type='button') Left
|
||||
button.btn.btn-outline-dark(type='button') Middle
|
||||
button.btn.btn-dark(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Outline button group
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-primary(type='button') Left
|
||||
button.btn.btn-outline-primary(type='button') Middle
|
||||
button.btn.btn-outline-primary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-secondary(type='button') Left
|
||||
button.btn.btn-outline-secondary(type='button') Middle
|
||||
button.btn.btn-outline-secondary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-success(type='button') Left
|
||||
button.btn.btn-outline-success(type='button') Middle
|
||||
button.btn.btn-outline-success(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-info(type='button') Left
|
||||
button.btn.btn-outline-info(type='button') Middle
|
||||
button.btn.btn-outline-info(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-warning(type='button') Left
|
||||
button.btn.btn-outline-warning(type='button') Middle
|
||||
button.btn.btn-outline-warning(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-danger(type='button') Left
|
||||
button.btn.btn-outline-danger(type='button') Middle
|
||||
button.btn.btn-outline-danger(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Left
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Middle
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-dark(type='button') Left
|
||||
button.btn.btn-outline-dark(type='button') Middle
|
||||
button.btn.btn-outline-dark(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Outline Edges button
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-primary(type='button') Left
|
||||
button.btn.btn-outline-primary(type='button') Middle
|
||||
button.btn.btn-outline-primary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-secondary(type='button') Left
|
||||
button.btn.btn-outline-secondary(type='button') Middle
|
||||
button.btn.btn-outline-secondary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-success(type='button') Left
|
||||
button.btn.btn-outline-success(type='button') Middle
|
||||
button.btn.btn-outline-success(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-info(type='button') Left
|
||||
button.btn.btn-outline-info(type='button') Middle
|
||||
button.btn.btn-outline-info(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-warning(type='button') Left
|
||||
button.btn.btn-outline-warning(type='button') Middle
|
||||
button.btn.btn-outline-warning(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-danger(type='button') Left
|
||||
button.btn.btn-outline-danger(type='button') Middle
|
||||
button.btn.btn-outline-danger(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Left
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Middle
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group.btn-group-pill(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-dark(type='button') Left
|
||||
button.btn.btn-outline-dark(type='button') Middle
|
||||
button.btn.btn-outline-dark(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Outline flat button
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-primary(type='button') Left
|
||||
button.btn.btn-outline-primary(type='button') Middle
|
||||
button.btn.btn-outline-primary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-secondary(type='button') Left
|
||||
button.btn.btn-outline-secondary(type='button') Middle
|
||||
button.btn.btn-outline-secondary(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-success(type='button') Left
|
||||
button.btn.btn-outline-success(type='button') Middle
|
||||
button.btn.btn-outline-success(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-info(type='button') Left
|
||||
button.btn.btn-outline-info(type='button') Middle
|
||||
button.btn.btn-outline-info(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-warning(type='button') Left
|
||||
button.btn.btn-outline-warning(type='button') Middle
|
||||
button.btn.btn-outline-warning(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-danger(type='button') Left
|
||||
button.btn.btn-outline-danger(type='button') Middle
|
||||
button.btn.btn-outline-danger(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Left
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Middle
|
||||
button.btn.btn-outline-light.txt-dark(type='button') Right
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group.btn-group-square(role='group', aria-label='Basic example')
|
||||
button.btn.btn-outline-dark(type='button') Left
|
||||
button.btn.btn-outline-dark(type='button') Middle
|
||||
button.btn.btn-outline-dark(type='button') Right
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Radio button group
|
||||
span
|
||||
| Add
|
||||
code .active
|
||||
| for active state and
|
||||
code .disabled
|
||||
| class or
|
||||
code disabled="disabled"
|
||||
| attribute
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-radio
|
||||
.btn-group(data-bs-toggle='buttons')
|
||||
div.btn.btn-primary
|
||||
.radio.radio-primary
|
||||
input#radio7(type='radio', name='radio1', value='option1')
|
||||
label(for='radio7') Option 1
|
||||
div.btn.btn-primary.active
|
||||
.radio.radio-primary
|
||||
input#radio8(type='radio', name='radio1', value='option1', checked='')
|
||||
label(for='radio8') Option 2
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-radio
|
||||
.btn-group(data-bs-toggle='buttons')
|
||||
div.btn.btn-secondary
|
||||
.radio.radio-secondary
|
||||
input#radio11(type='radio', name='radio2', value='option1')
|
||||
label(for='radio11') Option 1
|
||||
div.btn.btn-secondary.active
|
||||
.radio.radio-secondary
|
||||
input#radio12(type='radio', name='radio2', value='option1', checked='')
|
||||
label(for='radio12') Option 2
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-radio
|
||||
.btn-group(data-bs-toggle='buttons')
|
||||
div.btn.btn-success
|
||||
.radio.radio-success
|
||||
input#radio13(type='radio', name='radio3', value='option1')
|
||||
label(for='radio13') Option 1
|
||||
div.btn.btn-success.active
|
||||
.radio.radio-success
|
||||
input#radio14(type='radio', name='radio3', value='option1', checked='')
|
||||
label(for='radio14') Option 2
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-radio
|
||||
.btn-group(data-bs-toggle='buttons')
|
||||
div.btn.btn-info
|
||||
.radio.radio-info
|
||||
input#radio15(type='radio', name='radio4', value='option1')
|
||||
label(for='radio15') Option 1
|
||||
div.btn.btn-info.active
|
||||
.radio.radio-info
|
||||
input#radio16(type='radio', name='radio4', value='option1', checked='')
|
||||
label(for='radio16') Option 2
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-radio
|
||||
.btn-group(data-bs-toggle='buttons')
|
||||
div.btn.btn-warning
|
||||
.radio.radio-warning
|
||||
input#radio17(type='radio', name='radio5', value='option1')
|
||||
label(for='radio17') Option 1
|
||||
div.btn.btn-warning.active
|
||||
.radio.radio-warning
|
||||
input#radio18(type='radio', name='radio5', value='option1', checked='')
|
||||
label(for='radio18') Option 2
|
||||
.col-xxl-4.col-md-6.col-sm-12
|
||||
.btn-radio
|
||||
.btn-group(data-bs-toggle='buttons')
|
||||
div.btn.btn-danger
|
||||
.radio.radio-danger
|
||||
input#radio20(type='radio', name='radio6', value='option1')
|
||||
label(for='radio20') Option 1
|
||||
div.btn.btn-danger.active
|
||||
.radio.radio-danger
|
||||
input#radio22(type='radio', name='radio6', value='option1', checked='')
|
||||
label(for='radio22') Option 2
|
||||
.col-xxl-4.col-md-6.col-sm-12.button-group-mb-sm
|
||||
.btn-radio
|
||||
.btn-group(data-bs-toggle='buttons')
|
||||
div.btn.btn-light.txt-dark
|
||||
.radio.radio-light
|
||||
input#radio23(type='radio', name='radio7', value='option1')
|
||||
label(for='radio23') Option 1
|
||||
div.btn.btn-light.active.txt-dark
|
||||
.radio.radio-light
|
||||
input#radio24(type='radio', name='radio7', value='option1', checked='')
|
||||
label(for='radio24') Option 2
|
||||
.col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Check Box button group
|
||||
span
|
||||
| Add
|
||||
code .active
|
||||
| for active state and
|
||||
code .disabled
|
||||
| class or
|
||||
code disabled="disabled"
|
||||
| attribute
|
||||
.card-body.btn-group-showcase
|
||||
.row
|
||||
.col-xl-6.col-sm-12
|
||||
.btn-group.btn-option(data-bs-toggle='buttons')
|
||||
div.btn.btn-primary
|
||||
.checkbox.checkbox-primary
|
||||
input#checkbox-primary-1(type='checkbox')
|
||||
label(for='checkbox-primary-1') Option 1
|
||||
div.btn.btn-primary
|
||||
.checkbox.checkbox-primary
|
||||
input#checkbox-primary-2(type='checkbox')
|
||||
label(for='checkbox-primary-2') Option 2
|
||||
.col-xl-6.col-sm-12
|
||||
.btn-group.btn-option(data-bs-toggle='buttons')
|
||||
div.btn.btn-secondary
|
||||
.checkbox.checkbox-secondary
|
||||
input#checkbox-primary-3(type='checkbox')
|
||||
label(for='checkbox-primary-3') Option 1
|
||||
div.btn.btn-secondary
|
||||
.checkbox.checkbox-secondary
|
||||
input#checkbox-primary-4(type='checkbox')
|
||||
label(for='checkbox-primary-4') Option 2
|
||||
.col-xl-6.col-sm-12
|
||||
.btn-group.btn-option(data-bs-toggle='buttons')
|
||||
div.btn.btn-success
|
||||
.checkbox.checkbox-success
|
||||
input#checkbox-primary-5(type='checkbox')
|
||||
label(for='checkbox-primary-5') Option 1
|
||||
div.btn.btn-success
|
||||
.checkbox.checkbox-success
|
||||
input#checkbox-primary-6(type='checkbox')
|
||||
label(for='checkbox-primary-6') Option 2
|
||||
.col-xl-6.col-sm-12
|
||||
.btn-group.btn-option(data-bs-toggle='buttons')
|
||||
div.btn.btn-info
|
||||
.checkbox.checkbox-info
|
||||
input#checkbox-primary-7(type='checkbox')
|
||||
label(for='checkbox-primary-7') Option 1
|
||||
div.btn.btn-info
|
||||
.checkbox.checkbox-info
|
||||
input#checkbox-primary-8(type='checkbox')
|
||||
label(for='checkbox-primary-8') Option 2
|
||||
.col-xl-6.col-sm-12
|
||||
.btn-group.btn-option(data-bs-toggle='buttons')
|
||||
div.btn.btn-warning
|
||||
.checkbox.checkbox-warning
|
||||
input#checkbox-warning-9(type='checkbox')
|
||||
label(for='checkbox-warning-9') Option 1
|
||||
div.btn.btn-warning
|
||||
.checkbox.checkbox-warning
|
||||
input#checkbox-warning-10(type='checkbox')
|
||||
label(for='checkbox-warning-10') Option 2
|
||||
.col-xl-6.col-sm-12
|
||||
.btn-group.btn-option(data-bs-toggle='buttons')
|
||||
div.btn.btn-danger
|
||||
.checkbox.checkbox-danger
|
||||
input#checkbox-danger-11(type='checkbox')
|
||||
label(for='checkbox-danger-11') Option 1
|
||||
div.btn.btn-danger
|
||||
.checkbox.checkbox-danger
|
||||
input#checkbox-danger-12(type='checkbox')
|
||||
label(for='checkbox-danger-12') Option 2
|
||||
.col-xl-6.col-sm-12.button-group-mb-sm
|
||||
.btn-group.btn-option(data-bs-toggle='buttons')
|
||||
div.btn.btn-light.txt-dark
|
||||
.checkbox.checkbox-light
|
||||
input#checkbox-light-13(type='checkbox')
|
||||
label(for='checkbox-light-13') Option 1
|
||||
div.btn.btn-light.txt-dark
|
||||
.checkbox.checkbox-light
|
||||
input#checkbox-light-14(type='checkbox')
|
||||
label(for='checkbox-light-14') Option 2
|
||||
.col-lg-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h5 Nesting
|
||||
span Make nesting buttons
|
||||
.card-body.btn-group-wrapper
|
||||
.m-b-30
|
||||
.btn-group(role='group', aria-label='Button group with nested dropdown')
|
||||
button.btn.btn-primary
|
||||
i.fa.fa-bold
|
||||
button.btn.btn-secondary
|
||||
i.fa.fa.fa-italic
|
||||
.btn-group(role='group')
|
||||
button#btnGroupDrop1.btn.btn-light.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-haspopup='true', aria-expanded='false') Dropdown
|
||||
.dropdown-menu(aria-labelledby='btnGroupDrop1')
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
.m-b-30
|
||||
.btn-group
|
||||
button.btn.btn-primary
|
||||
i.fa.fa-bold
|
||||
button.btn.btn-secondary
|
||||
i.fa.fa.fa-italic
|
||||
button.btn.btn-success
|
||||
i.fa.fa-file-image-o
|
||||
button.btn.btn-info
|
||||
i.fa.fa-paperclip
|
||||
.m-b-30
|
||||
.btn-group
|
||||
button.btn.btn-primary.btn-lg
|
||||
i.fa.fa-bold
|
||||
button.btn.btn-secondary.btn-lg
|
||||
i.fa.fa.fa-italic
|
||||
button.btn.btn-success.btn-lg
|
||||
i.fa.fa-file-image-o
|
||||
button.btn.btn-info.btn-lg
|
||||
i.fa.fa-paperclip
|
||||
.col-lg-6
|
||||
.card.height-equal
|
||||
.card-header
|
||||
h5 Vertical
|
||||
span Make vertical buttons
|
||||
.card-body.btn-group-wrapper
|
||||
.btn-group-vertical(role='group', aria-label='Vertical button group')
|
||||
button.btn.btn-primary(type='button') Button
|
||||
button.btn.btn-secondary(type='button') Button
|
||||
.btn-group(role='group')
|
||||
button#btnGroupVerticalDrop1.btn.btn-success.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-haspopup='true', aria-expanded='false') Dropdown
|
||||
.dropdown-menu(aria-labelledby='btnGroupVerticalDrop1')
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
button.btn.btn-info(type='button') Button
|
||||
button.btn.btn-warning(type='button') Button
|
||||
.btn-group(role='group')
|
||||
button#btnGroupVerticalDrop2.btn.btn-danger.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-haspopup='true', aria-expanded='false') Dropdown
|
||||
.dropdown-menu(aria-labelledby='btnGroupVerticalDrop2')
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
.btn-group(role='group')
|
||||
button#btnGroupVerticalDrop3.btn.btn-light.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-haspopup='true', aria-expanded='false') Dropdown
|
||||
.dropdown-menu(aria-labelledby='btnGroupVerticalDrop3')
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
a.dropdown-item(href='#') Dropdown link
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
630
static/admin/assets/pug/pages/theme/buttons-edge.pug
Normal file
630
static/admin/assets/pug/pages/theme/buttons-edge.pug
Normal file
@@ -0,0 +1,630 @@
|
||||
- var prism = true;
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
- var popper = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Edge Buttons
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Buttons
|
||||
li.breadcrumb-item.active Edge Buttons
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Default buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| class for edge button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-primary(type='button' title='btn btn-pill btn-primary') Primary Button
|
||||
button.btn.btn-pill.btn-secondary(type='button' title='btn btn-pill btn-secondary') Secondary Button
|
||||
button.btn.btn-pill.btn-success(type='button' title='btn btn-pill btn-success') Success Button
|
||||
button.btn.btn-pill.btn-info(type='button' title='btn btn-pill btn-info') Info Button
|
||||
button.btn.btn-pill.btn-warning(type='button' title='btn btn-pill btn-warning') Warning Button
|
||||
button.btn.btn-pill.btn-danger(type='button' title='btn btn-pill btn-danger') Danger Button
|
||||
button.btn.btn-pill.btn-light(type='button' title='btn btn-pill btn-light') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-primary">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-secondary">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-success">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-info">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-warning">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-danger">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-light">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Large buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| and
|
||||
code .btn-lg
|
||||
| class for large button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-primary.btn-lg(type='button' title='btn btn-pill btn-primary btn-lg') Primary Button
|
||||
button.btn.btn-pill.btn-secondary.btn-lg(type='button' title='btn btn-pill btn-secondary btn-lg') Secondary Button
|
||||
button.btn.btn-pill.btn-success.btn-lg(type='button' title='btn btn-pill btn-success btn-lg') Success Button
|
||||
button.btn.btn-pill.btn-info.btn-lg(type='button' title='btn btn-pill btn-info btn-lg') Info Button
|
||||
button.btn.btn-pill.btn-warning.btn-lg(type='button' title='btn btn-pill btn-warning btn-lg') Warning Button
|
||||
button.btn.btn-pill.btn-danger.btn-lg(type='button' title='btn btn-pill btn-danger btn-lg') Danger Button
|
||||
button.btn.btn-pill.btn-light.btn-lg(type='button' title='btn btn-pill btn-light btn-lg') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-primary btn-lg">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-secondary btn-lg">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-success btn-lg">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-info btn-lg">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-warning btn-lg">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-danger btn-lg">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-light btn-lg">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| and
|
||||
code .btn-sm
|
||||
| class for small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-primary.btn-sm(type='button' title='btn btn-pill btn-primary btn-sm') Primary Button
|
||||
button.btn.btn-pill.btn-secondary.btn-sm(type='button' title='btn btn-pill btn-secondary btn-sm') Secondary Button
|
||||
button.btn.btn-pill.btn-success.btn-sm(type='button' title='btn btn-pill btn-success btn-sm') Success Button
|
||||
button.btn.btn-pill.btn-info.btn-sm(type='button' title='btn btn-pill btn-info btn-sm') Info Button
|
||||
button.btn.btn-pill.btn-warning.btn-sm(type='button' title='btn btn-pill btn-warning btn-sm') Warning Button
|
||||
button.btn.btn-pill.btn-danger.btn-sm(type='button' title='btn btn-pill btn-danger btn-sm') Danger Button
|
||||
button.btn.btn-pill.btn-light.btn-sm(type='button' title='btn btn-pill btn-light btn-sm') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-primary btn-sm">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-secondary btn-sm">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-success btn-sm">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-info btn-sm">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-warning btn-sm">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-danger btn-sm">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-light btn-sm">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Active Buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .active
|
||||
| for active state
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-primary.active(type='button' title='btn btn-pill btn-primary active') Active
|
||||
button.btn.btn-pill.btn-secondary.active(type='button' title='btn btn-pill btn-secondary active') Active
|
||||
button.btn.btn-pill.btn-success.active(type='button' title='btn btn-pill btn-success active') Active
|
||||
button.btn.btn-pill.btn-info.active(type='button' title='btn btn-pill btn-info active') Active
|
||||
button.btn.btn-pill.btn-warning.active(type='button' title='btn btn-pill btn-warning active') Active
|
||||
button.btn.btn-pill.btn-danger.active(type='button' title='btn btn-pill btn-danger active') Active
|
||||
button.btn.btn-pill.btn-light.active.txt-dark(type='button' title='btn btn-pill btn-light active') Active
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head3', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head3
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-primary active">Active</button>
|
||||
| <button type="button" class="btn btn-pill btn-secondary active">Active</button>
|
||||
| <button type="button" class="btn btn-pill btn-success active">Active</button>
|
||||
| <button type="button" class="btn btn-pill btn-info active">Active</button>
|
||||
| <button type="button" class="btn btn-pill btn-warning active">Active</button>
|
||||
| <button type="button" class="btn btn-pill btn-danger active">Active</button>
|
||||
| <button type="button" class="btn btn-pill btn-light active txt-dark">Active</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Disabled buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .disabled
|
||||
| class or
|
||||
code disabled="disabled"
|
||||
| attribute for disabled button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-primary.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-secondary.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-success.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-info.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-warning.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-danger.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-light.disabled(type='button') Disabled
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head4', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head4
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-primary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-secondary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-success disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-info disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-warning disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-danger disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-light disabled">Disabled</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Custom state buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| The
|
||||
code .btn
|
||||
| class used with
|
||||
code <button>
|
||||
| ,
|
||||
code <a>
|
||||
| and
|
||||
code <input>
|
||||
| elements.
|
||||
.card-body.btn-showcase
|
||||
a.btn.btn-pill.btn-primary(href='#', data-toggle='tooltip', title='btn btn-primary', role='button') Link
|
||||
input.btn.btn-pill.btn-secondary(type='button', value='Input', data-toggle='tooltip', title='btn btn-secondary')
|
||||
input.btn.btn-pill.btn-success(type='submit', value='Submit', data-toggle='tooltip', title='btn btn-success')
|
||||
button.btn.btn-pill.btn-info(type='submit', title='btn btn-info') Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head5', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head5
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <a class="btn btn-pill btn-primary" href="#" data-bs-toggle="tooltip;" title="btn btn-primary" role="button">link</button>
|
||||
| <input class="btn btn-pill btn-primary" type="button" value="Input" data-bs-toggle="tooltip;" title="btn btn-secondary">
|
||||
| <input class="btn btn-pill btn-success" type="submit" value="Submit" data-bs-toggle="tooltip" title="btn btn-success">
|
||||
| <button class="btn btn-pill btn-info" type="submit">Button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| and
|
||||
code .btn-outline-*
|
||||
| class for button with outline
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-outline-primary(type='button' title='btn btn-pill btn-outline-primary') Primary Button
|
||||
button.btn.btn-pill.btn-outline-secondary(type='button' title='btn btn-pill btn-outline-secondary') Secondary Button
|
||||
button.btn.btn-pill.btn-outline-success(type='button' title='btn btn-pill btn-outline-success') Success Button
|
||||
button.btn.btn-pill.btn-outline-info(type='button' title='btn btn-pill btn-outline-info') Info Button
|
||||
button.btn.btn-pill.btn-outline-warning(type='button' title='btn btn-pill btn-outline-warning') Warning Button
|
||||
button.btn.btn-pill.btn-outline-danger(type='button' title='btn btn-pill btn-outline-danger') Danger Button
|
||||
button.btn.btn-pill.btn-outline-light.txt-dark(type='button' title='btn btn-pill btn-outline-light') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head6', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head6
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-outline-primary">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-secondary">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-success">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-info">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-warning">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-danger">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-light txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 bold Border outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| and
|
||||
code .btn-outline-*-2x
|
||||
| class for button with bold outline
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-outline-primary-2x(type='button' title='btn btn-pill btn-outline-primary-2x') Primary Button
|
||||
button.btn.btn-pill.btn-outline-secondary-2x(type='button' title='btn btn-pill btn-outline-secondary-2x') Secondary Button
|
||||
button.btn.btn-pill.btn-outline-success-2x(type='button' title='btn btn-pill btn-outline-success-2x') Success Button
|
||||
button.btn.btn-pill.btn-outline-info-2x(type='button' title='btn btn-pill btn-outline-info-2x') Info Button
|
||||
button.btn.btn-pill.btn-outline-warning-2x(type='button' title='btn btn-pill btn-outline-warning-2x') Warning Button
|
||||
button.btn.btn-pill.btn-outline-danger-2x(type='button' title='btn btn-pill btn-outline-danger-2x') Danger Button
|
||||
button.btn.btn-pill.btn-outline-light-2x.txt-dark(type='button' title='btn btn-pill btn-outline-light-2x') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head7', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head7
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-outline-primary-2x">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-secondary-2x">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-success-2x">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-info-2x">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-warning-2x">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-danger-2x">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-light-2x txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 outline Large buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| ,
|
||||
code .btn-outline-*
|
||||
| and
|
||||
code .btn-lg
|
||||
| class for large button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-outline-primary.btn-lg(type='button' title='btn btn-pill btn-outline-primary btn-lg') Primary Button
|
||||
button.btn.btn-pill.btn-outline-secondary.btn-lg(type='button' title='btn btn-pill btn-outline-secondary btn-lg') Secondary Button
|
||||
button.btn.btn-pill.btn-outline-success.btn-lg(type='button' title='btn btn-pill btn-outline-success btn-lg') Success Button
|
||||
button.btn.btn-pill.btn-outline-info.btn-lg(type='button' title='btn btn-pill btn-outline-info btn-lg') Info Button
|
||||
button.btn.btn-pill.btn-outline-warning.btn-lg(type='button' title='btn btn-pill btn-outline-warning btn-lg') Warning Button
|
||||
button.btn.btn-pill.btn-outline-danger.btn-lg(type='button' title='btn btn-pill btn-outline-danger btn-lg') Danger Button
|
||||
button.btn.btn-pill.btn-outline-light.btn-lg.txt-dark(type='button' title='btn btn-pill btn-outline-light btn-lg') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head8', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head8
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-outline-primary btn-lg">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-secondary btn-lg">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-success btn-lg">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-info btn-lg">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-warning btn-lg">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-danger btn-lg">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-light btn-lg txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 outline small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| ,
|
||||
code .btn-outline-*
|
||||
| and
|
||||
code .btn-sm
|
||||
| class for small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-outline-primary.btn-sm(type='button' title='btn btn-pill btn-outline-primary btn-sm') Primary Button
|
||||
button.btn.btn-pill.btn-outline-secondary.btn-sm(type='button' title='btn btn-pill btn-outline-secondary btn-sm') Secondary Button
|
||||
button.btn.btn-pill.btn-outline-success.btn-sm(type='button' title='btn btn-pill btn-outline-success btn-sm') Success Button
|
||||
button.btn.btn-pill.btn-outline-info.btn-sm(type='button' title='btn btn-pill btn-outline-info btn-sm') Info Button
|
||||
button.btn.btn-pill.btn-outline-warning.btn-sm(type='button' title='btn btn-pill btn-outline-warning btn-sm') Warning Button
|
||||
button.btn.btn-pill.btn-outline-danger.btn-sm(type='button' title='btn btn-pill btn-outline-danger btn-sm') Danger Button
|
||||
button.btn.btn-pill.btn-outline-light.btn-sm.txt-dark(type='button' title='btn btn-pill btn-outline-light btn-sm') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head9', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head9
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-outline-primary btn-sm">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-secondary btn-sm">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-success btn-sm">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-info btn-sm">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-warning btn-sm">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-danger btn-sm">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-light btn-sm txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Outline extra small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| ,
|
||||
code .btn-outline-*
|
||||
| and
|
||||
code .btn-xs
|
||||
| class for extra small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-outline-primary.btn-xs(type='button' title='btn btn-pill btn-outline-primary btn-xs') Primary Button
|
||||
button.btn.btn-pill.btn-outline-secondary.btn-xs(type='button' title='btn btn-pill btn-outline-secondary btn-xs') Secondary Button
|
||||
button.btn.btn-pill.btn-outline-success.btn-xs(type='button' title='btn btn-pill btn-outline-success btn-xs') Success Button
|
||||
button.btn.btn-pill.btn-outline-info.btn-xs(type='button' title='btn btn-pill btn-outline-info btn-xs') Info Button
|
||||
button.btn.btn-pill.btn-outline-warning.btn-xs(type='button' title='btn btn-pill btn-outline-warning btn-xs') Warning Button
|
||||
button.btn.btn-pill.btn-outline-danger.btn-xs(type='button' title='btn btn-pill btn-outline-danger btn-xs') Danger Button
|
||||
button.btn.btn-pill.btn-outline-light.btn-xs.txt-dark(type='button' title='btn btn-pill btn-outline-light btn-xs') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head10', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head10
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-outline-primary btn-xs">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-secondary btn-xs">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-success btn-xs">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-info btn-xs">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-warning btn-xs">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-danger btn-xs">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-light btn-xs txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Disabled outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .disabled
|
||||
| class or
|
||||
code disabled="disabled"
|
||||
| attribute for disabled button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-outline-primary.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-outline-secondary.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-outline-success.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-outline-info.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-outline-warning.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-outline-danger.disabled(type='button') Disabled
|
||||
button.btn.btn-pill.btn-outline-light.disabled.txt-dark(type='button') Disabled
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head11', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head11
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-outline-primary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-secondary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-success disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-info disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-warning disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-danger disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-pill btn-outline-light disabled txt-dark">Disabled</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Gradien buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-pill
|
||||
| and
|
||||
code .btn-*-gradien
|
||||
| class for gradien button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-pill.btn-primary-gradien(type='button' title='btn btn-pill btn-primary-gradien') Primary Button
|
||||
button.btn.btn-pill.btn-secondary-gradien(type='button' title='btn btn-pill btn-secondary-gradien') Secondary Button
|
||||
button.btn.btn-pill.btn-success-gradien(type='button' title='btn btn-pill btn-success-gradien') Success Button
|
||||
button.btn.btn-pill.btn-info-gradien(type='button' title='btn btn-pill btn-info-gradien') Info Button
|
||||
button.btn.btn-pill.btn-warning-gradien(type='button' title='btn btn-pill btn-warning-gradien') Warning Button
|
||||
button.btn.btn-pill.btn-danger-gradien(type='button' title='btn btn-pill btn-danger-gradien') Danger Button
|
||||
button.btn.btn-pill.btn-light-gradien.txt-dark(type='button' title='btn btn-pill btn-light-gradien') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head12', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head12
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-pill btn-primary-gradien">primary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-secondary-gradien">secondary button</button>
|
||||
| <button type="button" class="btn btn-pill btn-success-gradien">Success button</button>
|
||||
| <button type="button" class="btn btn-pill btn-info-gradien">Info button</button>
|
||||
| <button type="button" class="btn btn-pill btn-warning-gradien">warning button</button>
|
||||
| <button type="button" class="btn btn-pill btn-danger-gradien">danger button</button>
|
||||
| <button type="button" class="btn btn-pill btn-light-gradien.txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
676
static/admin/assets/pug/pages/theme/buttons-flat.pug
Normal file
676
static/admin/assets/pug/pages/theme/buttons-flat.pug
Normal file
@@ -0,0 +1,676 @@
|
||||
- var prism = true;
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
- var popper = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Flat Buttons
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Buttons
|
||||
li.breadcrumb-item.active Flat Buttons
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Default buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| class for flat button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-primary(type='button' title='btn btn-square btn-primary') Primary Button
|
||||
button.btn.btn-square.btn-secondary(type='button' title='btn btn-square btn-secondary') Secondary Button
|
||||
button.btn.btn-square.btn-success(type='button' title='btn btn-square btn-success') Success Button
|
||||
button.btn.btn-square.btn-info(type='button' title='btn btn-square btn-info') Info Button
|
||||
button.btn.btn-square.btn-warning(type='button' title='btn btn-square btn-warning') Warning Button
|
||||
button.btn.btn-square.btn-danger(type='button' title='btn btn-square btn-danger') Danger Button
|
||||
button.btn.btn-square.btn-light(type='button' title='btn btn-square btn-light') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-primary">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-secondary">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-success">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-info">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-warning">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-danger">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-light">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Large buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| and
|
||||
code .btn-lg
|
||||
| class for large button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-primary.btn-lg(type='button' title='btn btn-square btn-primary btn-lg') Primary Button
|
||||
button.btn.btn-square.btn-secondary.btn-lg(type='button' title='btn btn-square btn-secondary btn-lg') Secondary Button
|
||||
button.btn.btn-square.btn-success.btn-lg(type='button' title='btn btn-square btn-success btn-lg') Success Button
|
||||
button.btn.btn-square.btn-info.btn-lg(type='button' title='btn btn-square btn-info btn-lg') Info Button
|
||||
button.btn.btn-square.btn-warning.btn-lg(type='button' title='btn btn-square btn-warning btn-lg') Warning Button
|
||||
button.btn.btn-square.btn-danger.btn-lg(type='button' title='btn btn-square btn-danger btn-lg') Danger Button
|
||||
button.btn.btn-square.btn-light.btn-lg(type='button' title='btn btn-square btn-light btn-lg') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-primary btn-lg">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-secondary btn-lg">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-success btn-lg">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-info btn-lg">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-warning btn-lg">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-danger btn-lg">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-light btn-lg">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| and
|
||||
code .btn-sm
|
||||
| class for small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-primary.btn-sm(type='button' title='btn btn-square btn-primary btn-sm') Primary Button
|
||||
button.btn.btn-square.btn-secondary.btn-sm(type='button' title='btn btn-square btn-secondary btn-sm') Secondary Button
|
||||
button.btn.btn-square.btn-success.btn-sm(type='button' title='btn btn-square btn-success btn-sm') Success Button
|
||||
button.btn.btn-square.btn-info.btn-sm(type='button' title='btn btn-square btn-info btn-sm') Info Button
|
||||
button.btn.btn-square.btn-warning.btn-sm(type='button' title='btn btn-square btn-warning btn-sm') Warning Button
|
||||
button.btn.btn-square.btn-danger.btn-sm(type='button' title='btn btn-square btn-danger btn-sm') Danger Button
|
||||
button.btn.btn-square.btn-light.btn-sm(type='button' title='btn btn-square btn-light btn-sm') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-primary btn-sm">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-secondary btn-sm">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-success btn-sm">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-info btn-sm">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-warning btn-sm">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-danger btn-sm">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-light btn-sm">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Extra Small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| and
|
||||
code .btn-xs
|
||||
| class for extra small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-primary.btn-xs(type='button' title='btn btn-square btn-primary btn-xs') Primary Button
|
||||
button.btn.btn-square.btn-secondary.btn-xs(type='button' title='btn btn-square btn-secondary btn-xs') Secondary Button
|
||||
button.btn.btn-square.btn-success.btn-xs(type='button' title='btn btn-square btn-success btn-xs') Success Button
|
||||
button.btn.btn-square.btn-info.btn-xs(type='button' title='btn btn-square btn-info btn-xs') Info Button
|
||||
button.btn.btn-square.btn-warning.btn-xs(type='button' title='btn btn-square btn-warning btn-xs') Warning Button
|
||||
button.btn.btn-square.btn-danger.btn-xs(type='button' title='btn btn-square btn-danger btn-xs') Danger Button
|
||||
button.btn.btn-square.btn-light.btn-xs(type='button' title='btn btn-square btn-light btn-xs') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head3', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head3
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-primary btn-xs">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-secondary btn-xs">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-success btn-xs">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-info btn-xs">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-warning btn-xs">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-danger btn-xs">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-light btn-xs">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Active Buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .active
|
||||
| for active state
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-primary.active(type='button' title='btn btn-square btn-primary active') Active
|
||||
button.btn.btn-square.btn-secondary.active(type='button' title='btn btn-square btn-secondary active') Active
|
||||
button.btn.btn-square.btn-success.active(type='button' title='btn btn-square btn-success active') Active
|
||||
button.btn.btn-square.btn-info.active(type='button' title='btn btn-square btn-info active') Active
|
||||
button.btn.btn-square.btn-warning.active(type='button' title='btn btn-square btn-warning active') Active
|
||||
button.btn.btn-square.btn-danger.active(type='button' title='btn btn-square btn-danger active') Active
|
||||
button.btn.btn-square.btn-light.active.txt-dark(type='button' title='btn btn-square btn-light active') Active
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head4', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head4
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-primary active">Active</button>
|
||||
| <button type="button" class="btn btn-square btn-secondary active">Active</button>
|
||||
| <button type="button" class="btn btn-square btn-success active">Active</button>
|
||||
| <button type="button" class="btn btn-square btn-info active">Active</button>
|
||||
| <button type="button" class="btn btn-square btn-warning active">Active</button>
|
||||
| <button type="button" class="btn btn-square btn-danger active">Active</button>
|
||||
| <button type="button" class="btn btn-square btn-light active txt-dark">Active</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Disabled buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .disabled
|
||||
| class or
|
||||
code disabled="disabled"
|
||||
| attribute for disabled button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-primary.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-secondary.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-success.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-info.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-warning.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-danger.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-light.disabled(type='button') Disabled
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head5', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head5
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-primary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-secondary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-success disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-info disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-warning disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-danger disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-light disabled txt-dark">Disabled</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Custom state buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| The
|
||||
code .btn
|
||||
| class used with
|
||||
code <button>
|
||||
| ,
|
||||
code <a>
|
||||
| and
|
||||
code <input>
|
||||
| elements.
|
||||
.card-body.btn-showcase
|
||||
a.btn.btn-square.btn-primary(href='#', data-toggle='tooltip', title='btn btn-primary', role='button') Link
|
||||
input.btn.btn-square.btn-secondary(type='button', value='Input', data-toggle='tooltip', title='btn btn-secondary')
|
||||
input.btn.btn-square.btn-success(type='submit', value='Submit', data-toggle='tooltip', title='btn btn-success')
|
||||
button.btn.btn-square.btn-info(type='submit', title='btn btn-info') Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head6', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head6
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <a class="btn btn-square btn-primary" href="#" data-bs-toggle="tooltip;" title="btn btn-primary" role="button">link</button>
|
||||
| <input class="btn btn-square btn-primary" type="button" value="Input" data-bs-toggle="tooltip;" title="btn btn-secondary">
|
||||
| <input class="btn btn-square btn-success" type="submit" value="Submit" data-bs-toggle="tooltip" title="btn btn-success">
|
||||
| <button class="btn btn-square btn-info" type="submit">Button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| and
|
||||
code .btn-outline-*
|
||||
| class for button with outline
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-outline-primary(type='button' title='btn btn-square btn-outline-primary') Primary Button
|
||||
button.btn.btn-square.btn-outline-secondary(type='button' title='btn btn-square btn-outline-secondary') Secondary Button
|
||||
button.btn.btn-square.btn-outline-success(type='button' title='btn btn-square btn-outline-success') Success Button
|
||||
button.btn.btn-square.btn-outline-info(type='button' title='btn btn-square btn-outline-info') Info Button
|
||||
button.btn.btn-square.btn-outline-warning(type='button' title='btn btn-square btn-outline-warning') Warning Button
|
||||
button.btn.btn-square.btn-outline-danger(type='button' title='btn btn-square btn-outline-danger') Danger Button
|
||||
button.btn.btn-square.btn-outline-light.txt-dark(type='button' title='btn btn-square btn-outline-light') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head7', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head7
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-outline-primary">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-secondary">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-success">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-info">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-warning">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-danger">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-light txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 bold Border outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| and
|
||||
code .btn-outline-*-2x
|
||||
| class for button with bold outline
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-outline-primary-2x(type='button' title='btn btn-square btn-outline-primary-2x') Primary Button
|
||||
button.btn.btn-square.btn-outline-secondary-2x(type='button' title='btn btn-square btn-outline-secondary-2x') Secondary Button
|
||||
button.btn.btn-square.btn-outline-success-2x(type='button' title='btn btn-square btn-outline-success-2x') Success Button
|
||||
button.btn.btn-square.btn-outline-info-2x(type='button' title='btn btn-square btn-outline-info-2x') Info Button
|
||||
button.btn.btn-square.btn-outline-warning-2x(type='button' title='btn btn-square btn-outline-warning-2x') Warning Button
|
||||
button.btn.btn-square.btn-outline-danger-2x(type='button' title='btn btn-square btn-outline-danger-2x') Danger Button
|
||||
button.btn.btn-square.btn-outline-light-2x.txt-dark(type='button' title='btn btn-square btn-outline-light-2x') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head8', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head8
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-outline-primary-2x">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-secondary-2x">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-success-2x">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-info-2x">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-warning-2x">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-danger-2x">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-light-2x txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 outline Large buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| ,
|
||||
code .btn-outline-*
|
||||
| and
|
||||
code .btn-lg
|
||||
| class for large button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-outline-primary.btn-lg(type='button' title='btn btn-square btn-outline-primary btn-lg') Primary Button
|
||||
button.btn.btn-square.btn-outline-secondary.btn-lg(type='button' title='btn btn-square btn-outline-secondary btn-lg') Secondary Button
|
||||
button.btn.btn-square.btn-outline-success.btn-lg(type='button' title='btn btn-square btn-outline-success btn-lg') Success Button
|
||||
button.btn.btn-square.btn-outline-info.btn-lg(type='button' title='btn btn-square btn-outline-info btn-lg') Info Button
|
||||
button.btn.btn-square.btn-outline-warning.btn-lg(type='button' title='btn btn-square btn-outline-warning btn-lg') Warning Button
|
||||
button.btn.btn-square.btn-outline-danger.btn-lg(type='button' title='btn btn-square btn-outline-danger btn-lg') Danger Button
|
||||
button.btn.btn-square.btn-outline-light.btn-lg.txt-dark(type='button' title='btn btn-square btn-outline-light btn-lg') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head9', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head9
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-outline-primary btn-lg">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-secondary btn-lg">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-success btn-lg">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-info btn-lg">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-warning btn-lg">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-danger btn-lg">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-light btn-lg txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 outline small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| ,
|
||||
code .btn-outline-*
|
||||
| and
|
||||
code .btn-sm
|
||||
| class for small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-outline-primary.btn-sm(type='button' title='btn btn-square btn-outline-primary btn-sm') Primary Button
|
||||
button.btn.btn-square.btn-outline-secondary.btn-sm(type='button' title='btn btn-square btn-outline-secondary btn-sm') Secondary Button
|
||||
button.btn.btn-square.btn-outline-success.btn-sm(type='button' title='btn btn-square btn-outline-success btn-sm') Success Button
|
||||
button.btn.btn-square.btn-outline-info.btn-sm(type='button' title='btn btn-square btn-outline-info btn-sm') Info Button
|
||||
button.btn.btn-square.btn-outline-warning.btn-sm(type='button' title='btn btn-square btn-outline-warning btn-sm') Warning Button
|
||||
button.btn.btn-square.btn-outline-danger.btn-sm(type='button' title='btn btn-square btn-outline-danger btn-sm') Danger Button
|
||||
button.btn.btn-square.btn-outline-light.btn-sm.txt-dark(type='button' title='btn btn-square btn-outline-light btn-sm') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head10', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head10
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-outline-primary btn-sm">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-secondary btn-sm">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-success btn-sm">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-info btn-sm">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-warning btn-sm">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-danger btn-sm">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-light btn-sm txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 outline Extra small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| ,
|
||||
code .btn-outline-*
|
||||
| and
|
||||
code .btn-xs
|
||||
| class for extra small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-outline-primary.btn-xs(type='button' title='btn btn-square btn-outline-primary btn-xs') Primary Button
|
||||
button.btn.btn-square.btn-outline-secondary.btn-xs(type='button' title='btn btn-square btn-outline-secondary btn-xs') Secondary Button
|
||||
button.btn.btn-square.btn-outline-success.btn-xs(type='button' title='btn btn-square btn-outline-success btn-xs') Success Button
|
||||
button.btn.btn-square.btn-outline-info.btn-xs(type='button' title='btn btn-square btn-outline-info btn-xs') Info Button
|
||||
button.btn.btn-square.btn-outline-warning.btn-xs(type='button' title='btn btn-square btn-outline-warning btn-xs') Warning Button
|
||||
button.btn.btn-square.btn-outline-danger.btn-xs(type='button' title='btn btn-square btn-outline-danger btn-xs') Danger Button
|
||||
button.btn.btn-square.btn-outline-light.btn-xs.txt-dark(type='button' title='btn btn-square btn-outline-light btn-xs') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head11', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head11
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-outline-primary btn-xs">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-secondary btn-xs">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-success btn-xs">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-info btn-xs">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-warning btn-xs">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-danger btn-xs">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-light btn-xs txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Disabled outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .disabled
|
||||
| class or
|
||||
code disabled="disabled"
|
||||
| attribute for disabled button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-outline-primary.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-outline-secondary.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-outline-success.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-outline-info.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-outline-warning.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-outline-danger.disabled(type='button') Disabled
|
||||
button.btn.btn-square.btn-outline-light.disabled.txt-dark(type='button') Disabled
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head12', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head12
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-outline-primary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-secondary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-success disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-info disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-warning disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-danger disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-square btn-outline-light disabled txt-dark">Disabled</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Gradien buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-square
|
||||
| and
|
||||
code .btn-*-gradien
|
||||
| class for gradien button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-square.btn-primary-gradien(type='button' title='btn btn-square btn-primary-gradien') Primary Button
|
||||
button.btn.btn-square.btn-secondary-gradien(type='button' title='btn btn-square btn-secondary-gradien') Secondary Button
|
||||
button.btn.btn-square.btn-success-gradien(type='button' title='btn btn-square btn-success-gradien') Success Button
|
||||
button.btn.btn-square.btn-info-gradien(type='button' title='btn btn-square btn-info-gradien') Info Button
|
||||
button.btn.btn-square.btn-warning-gradien(type='button' title='btn btn-square btn-warning-gradien') Warning Button
|
||||
button.btn.btn-square.btn-danger-gradien(type='button' title='btn btn-square btn-danger-gradien') Danger Button
|
||||
button.btn.btn-square.btn-light-gradien.text-dark(type='button' title='btn btn-square btn-light-gradien') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head13', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head13
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-square btn-primary-gradien">primary button</button>
|
||||
| <button type="button" class="btn btn-square btn-secondary-gradien">secondary button</button>
|
||||
| <button type="button" class="btn btn-square btn-success-gradien">Success Button</button>
|
||||
| <button type="button" class="btn btn-square btn-info-gradien">Info button</button>
|
||||
| <button type="button" class="btn btn-square btn-warning-gradien">warning button</button>
|
||||
| <button type="button" class="btn btn-square btn-danger-gradien">danger button</button>
|
||||
| <button type="button" class="btn btn-square btn-light-gradien">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
658
static/admin/assets/pug/pages/theme/buttons.pug
Normal file
658
static/admin/assets/pug/pages/theme/buttons.pug
Normal file
@@ -0,0 +1,658 @@
|
||||
- var prism = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
- var popper = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Default Style
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Buttons
|
||||
li.breadcrumb-item.active Default Style
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
#default.card
|
||||
.card-header
|
||||
h5 Default buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span Bootstrap state buttons
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-primary(type='button' data-bs-toggle='tooltip' title='btn btn-primary') Primary Button
|
||||
button.btn.btn-secondary(type='button' data-bs-toggle='tooltip' title='btn btn-secondary') Secondary Button
|
||||
button.btn.btn-success(type='button' data-bs-toggle='tooltip' title='btn btn-success') Success Button
|
||||
button.btn.btn-info(type='button' data-bs-toggle='tooltip' title='btn btn-info') Info Button
|
||||
button.btn.btn-warning(type='button' data-bs-toggle='tooltip' title='btn btn-warning') Warning Button
|
||||
button.btn.btn-danger(type='button' data-bs-toggle='tooltip' title='btn btn-danger') Danger Button
|
||||
button.btn.btn-light(type='button' data-bs-toggle='tooltip' title='btn btn-light') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-primary">primary button</button>
|
||||
| <button type="button" class="btn btn-secondary">secondary button</button>
|
||||
| <button type="button" class="btn btn-success">Success button</button>
|
||||
| <button type="button" class="btn btn-info">Info button</button>
|
||||
| <button type="button" class="btn btn-warning">warning button</button>
|
||||
| <button type="button" class="btn btn-danger">danger button</button>
|
||||
| <button type="button" class="btn btn-light">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#large-btn.card
|
||||
.card-header
|
||||
h5 Large buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-lg
|
||||
| class for large size buttons
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-primary.btn-lg(type='button' data-bs-toggle='tooltip' title='btn btn-primary btn-lg') Primary Button
|
||||
button.btn.btn-secondary.btn-lg(type='button' data-bs-toggle='tooltip' title='btn btn-secondary btn-lg') Secondary Button
|
||||
button.btn.btn-success.btn-lg(type='button' data-bs-toggle='tooltip' title='btn btn-success btn-lg') Success Button
|
||||
button.btn.btn-info.btn-lg(type='button' data-bs-toggle='tooltip' title='btn btn-info btn-lg') Info Button
|
||||
button.btn.btn-warning.btn-lg(type='button' data-bs-toggle='tooltip' title='btn btn-warning btn-lg') Warning Button
|
||||
button.btn.btn-danger.btn-lg(type='button' data-bs-toggle='tooltip' title='btn btn-danger btn-lg') Danger Button
|
||||
button.btn.btn-light.btn-lg(type='button' data-bs-toggle='tooltip' title='btn btn-light btn-lg') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-primary btn-lg">primary button</button>
|
||||
| <button type="button" class="btn btn-secondary btn-lg">secondary button</button>
|
||||
| <button type="button" class="btn btn-success btn-lg">Success button</button>
|
||||
| <button type="button" class="btn btn-info btn-lg">Info button</button>
|
||||
| <button type="button" class="btn btn-warning btn-lg">warning button</button>
|
||||
| <button type="button" class="btn btn-danger btn-lg">danger button</button>
|
||||
| <button type="button" class="btn btn-light btn-lg">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#small-btn.card
|
||||
.card-header
|
||||
h5 Small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-sm
|
||||
| class for small size buttons
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-primary.btn-sm(type='button' title='btn btn-primary btn-sm') Primary Button
|
||||
button.btn.btn-secondary.btn-sm(type='button' title='btn btn-secondary btn-sm') Secondary Button
|
||||
button.btn.btn-success.btn-sm(type='button' title='btn btn-success btn-sm') Success Button
|
||||
button.btn.btn-info.btn-sm(type='button' title='btn btn-info btn-sm') Info Button
|
||||
button.btn.btn-warning.btn-sm(type='button' title='btn btn-warning btn-sm') Warning Button
|
||||
button.btn.btn-danger.btn-sm(type='button' title='btn btn-danger btn-sm') Danger Button
|
||||
button.btn.btn-light.btn-sm(type='button' title='btn btn-light btn-sm') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-primary btn-sm">primary button</button>
|
||||
| <button type="button" class="btn btn-secondary btn-sm">secondary button</button>
|
||||
| <button type="button" class="btn btn-success btn-sm">Success button</button>
|
||||
| <button type="button" class="btn btn-info btn-sm">Info button</button>
|
||||
| <button type="button" class="btn btn-warning btn-sm">warning button</button>
|
||||
| <button type="button" class="btn btn-danger btn-sm">danger button</button>
|
||||
| <button type="button" class="btn btn-light btn-sm">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#ex-small-btn.card
|
||||
.card-header
|
||||
h5 Extra Small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-xs
|
||||
| class for extra small size buttons
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-primary.btn-xs(type='button' title='btn btn-primary btn-xs') Primary Button
|
||||
button.btn.btn-secondary.btn-xs(type='button' title='btn btn-secondary btn-xs') Secondary Button
|
||||
button.btn.btn-success.btn-xs(type='button' title='btn btn-success btn-xs') Success Button
|
||||
button.btn.btn-info.btn-xs(type='button' title='btn btn-info btn-xs') Info Button
|
||||
button.btn.btn-warning.btn-xs(type='button' title='btn btn-warning btn-xs') Warning Button
|
||||
button.btn.btn-danger.btn-xs(type='button' title='btn btn-danger btn-xs') Danger Button
|
||||
button.btn.btn-light.btn-xs(type='button' title='btn btn-light btn-xs') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head3', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head3
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-primary btn-xs">primary button</button>
|
||||
| <button type="button" class="btn btn-secondary btn-xs">secondary button</button>
|
||||
| <button type="button" class="btn btn-success btn-xs">Success button</button>
|
||||
| <button type="button" class="btn btn-info btn-xs">Info button</button>
|
||||
| <button type="button" class="btn btn-warning btn-xs">warning button</button>
|
||||
| <button type="button" class="btn btn-danger btn-xs">danger button</button>
|
||||
| <button type="button" class="btn btn-light btn-xs">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#active-btn.card
|
||||
.card-header
|
||||
h5 Active Buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .active
|
||||
| class for active state
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-primary.active(type='button' title='btn btn-primary active') Active
|
||||
button.btn.btn-secondary.active(type='button' title='btn btn-secondary active') Active
|
||||
button.btn.btn-success.active(type='button' title='btn btn-success active') Active
|
||||
button.btn.btn-info.active(type='button' title='btn btn-info active') Active
|
||||
button.btn.btn-warning.active.txt-dark(type='button' title='btn btn-warning active') Active
|
||||
button.btn.btn-danger.active(type='button' title='btn btn-danger active') Active
|
||||
button.btn.btn-light.active.txt-dark(type='button' title='btn btn-light active') Active
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head4', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head4
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-primary active">Active</button>
|
||||
| <button type="button" class="btn btn-secondary active">Active</button>
|
||||
| <button type="button" class="btn btn-success active">Active</button>
|
||||
| <button type="button" class="btn btn-info active">Active</button>
|
||||
| <button type="button" class="btn btn-warning active">Active</button>
|
||||
| <button type="button" class="btn btn-danger active">Active</button>
|
||||
| <button type="button" class="btn btn-light active">Active</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#disabled-btn.card
|
||||
.card-header
|
||||
h5 Disabled buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .disabled
|
||||
| class or
|
||||
code disabled="disabled"
|
||||
| attribute for disabled button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-primary.disabled(type='button') Disabled
|
||||
button.btn.btn-secondary.disabled(type='button') Disabled
|
||||
button.btn.btn-success.disabled(type='button') Disabled
|
||||
button.btn.btn-info.disabled(type='button') Disabled
|
||||
button.btn.btn-warning.disabled(type='button') Disabled
|
||||
button.btn.btn-danger.disabled(type='button') Disabled
|
||||
button.btn.btn-light.disabled(type='button') Disabled
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head5', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head5
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-primary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-secondary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-success disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-info disabled">Info button</button>
|
||||
| <button type="button" class="btn btn-warning disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-danger disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-light disabled">Disabled</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#custom-state-button.card
|
||||
.card-header
|
||||
h5 Custom state buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| The
|
||||
code .btn
|
||||
| class used with
|
||||
code <button>
|
||||
| ,
|
||||
code <a>
|
||||
| and
|
||||
code <input>
|
||||
| elements.
|
||||
.card-body.btn-showcase
|
||||
a.btn.btn-primary(href='#', data-toggle='tooltip', title='btn btn-primary', role='button') Link
|
||||
input.btn.btn-secondary(type='button', value='Input', data-toggle='tooltip', title='btn btn-secondary')
|
||||
input.btn.btn-success(type='submit', value='Submit', data-toggle='tooltip', title='btn btn-success')
|
||||
button.btn.btn-info(type='submit', data-toggle='tooltip', title='btn btn-info') Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head6', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head6
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <a class="btn btn-primary" href="#" data-bs-toggle="tooltip;" title="btn btn-primary" role="button">link</button>
|
||||
| <input class="btn btn-primary" type="button" value="Input" data-bs-toggle="tooltip;" title="btn btn-secondary">
|
||||
| <input class="btn btn-success" type="submit" value="Submit" data-bs-toggle="tooltip" title="btn btn-success">
|
||||
| <button class="btn btn-info" type="submit">Button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#outline-button.card
|
||||
.card-header
|
||||
h5 outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-outline-*
|
||||
| class for border button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-outline-primary(type='button' title='btn btn-outline-primary') Primary Button
|
||||
button.btn.btn-outline-secondary(type='button' title='btn btn-outline-secondary') Secondary Button
|
||||
button.btn.btn-outline-success(type='button' title='btn btn-outline-success') Success Button
|
||||
button.btn.btn-outline-info(type='button' title='btn btn-outline-info') Info Button
|
||||
button.btn.btn-outline-warning(type='button' title='btn btn-outline-warning') Warning Button
|
||||
button.btn.btn-outline-danger(type='button' title='btn btn-outline-danger') Danger Button
|
||||
button.btn.btn-outline-light.txt-dark(type='button' title='btn btn-outline-light') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head7', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head7
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-outline-primary">primary button</button>
|
||||
| <button type="button" class="btn btn-outline-secondary">secondary button</button>
|
||||
| <button type="button" class="btn btn-outline-success">Success button</button>
|
||||
| <button type="button" class="btn btn-outline-info">Info button</button>
|
||||
| <button type="button" class="btn btn-outline-warning">warning button</button>
|
||||
| <button type="button" class="btn btn-outline-danger">danger button</button>
|
||||
| <button type="button" class="btn btn-outline-light txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#outline-bold-button.card
|
||||
.card-header
|
||||
h5 bold Border outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-outline-*-2x
|
||||
| class for bold outline
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-outline-primary-2x(type='button' title='btn btn-outline-primary-2x') Primary Button
|
||||
button.btn.btn-outline-secondary-2x(type='button' title='btn btn-outline-secondary-2x') Secondary Button
|
||||
button.btn.btn-outline-success-2x(type='button' title='btn btn-outline-success-2x') Success Button
|
||||
button.btn.btn-outline-info-2x(type='button' title='btn btn-outline-info-2x') Info Button
|
||||
button.btn.btn-outline-warning-2x(type='button' title='btn btn-outline-warning-2x') Warning Button
|
||||
button.btn.btn-outline-danger-2x(type='button' title='btn btn-outline-danger-2x') Danger Button
|
||||
button.btn.btn-outline-light-2x.txt-dark(type='button' title='btn btn-outline-light-2x') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head8', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head8
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-outline-primary-2x">primary button</button>
|
||||
| <button type="button" class="btn btn-outline-secondary-2x">secondary button</button>
|
||||
| <button type="button" class="btn btn-outline-success-2x">Success button</button>
|
||||
| <button type="button" class="btn btn-outline-info-2x">Info button</button>
|
||||
| <button type="button" class="btn btn-outline-warning-2x">warning button</button>
|
||||
| <button type="button" class="btn btn-outline-danger-2x">danger button</button>
|
||||
| <button type="button" class="btn btn-outline-light-2x txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#outline-large-button.card
|
||||
.card-header
|
||||
h5 outline Large buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-outline-*
|
||||
| class for outline and
|
||||
code .btn-lg
|
||||
| class for large button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-outline-primary.btn-lg(type='button' title='btn btn-outline-primary btn-lg') Primary Button
|
||||
button.btn.btn-outline-secondary.btn-lg(type='button' title='btn btn-outline-secondary btn-lg') Secondary Button
|
||||
button.btn.btn-outline-success.btn-lg(type='button' title='btn btn-outline-success btn-lg') Success Button
|
||||
button.btn.btn-outline-info.btn-lg(type='button' title='btn btn-outline-info btn-lg') Info Button
|
||||
button.btn.btn-outline-warning.btn-lg(type='button' title='btn btn-outline-warning btn-lg') Warning Button
|
||||
button.btn.btn-outline-danger.btn-lg(type='button' title='btn btn-outline-danger btn-lg') Danger Button
|
||||
button.btn.btn-outline-light.txt-dark.btn-lg(type='button' title='btn btn-outline-light btn-lg') Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head9', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head9
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-outline-primary btn-lg">primary button</button>
|
||||
| <button type="button" class="btn btn-outline-secondary btn-lg">secondary button</button>
|
||||
| <button type="button" class="btn btn-outline-success btn-lg">Success button</button>
|
||||
| <button type="button" class="btn btn-outline-info btn-lg">Info button</button>
|
||||
| <button type="button" class="btn btn-outline-warning btn-lg">warning button</button>
|
||||
| <button type="button" class="btn btn-outline-danger btn-lg">danger button</button>
|
||||
| <button type="button" class="btn btn-outline-light btn-lg txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#outline-small-button.card
|
||||
.card-header
|
||||
h5 outline small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-outline-*
|
||||
| class for outline and
|
||||
code .btn-sm
|
||||
| class for small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-outline-primary.btn-sm(type='button' title='btn btn-outline-primary btn-sm') Primary Button
|
||||
button.btn.btn-outline-secondary.btn-sm(type='button' title='btn btn-outline-secondary btn-sm')
|
||||
| Secondary Button
|
||||
button.btn.btn-outline-success.btn-sm(type='button' title='btn btn-outline-success btn-sm') Success Button
|
||||
button.btn.btn-outline-info.btn-sm(type='button' title='btn btn-outline-info btn-sm') Info Button
|
||||
button.btn.btn-outline-warning.btn-sm(type='button' title='btn btn-outline-warning btn-sm') Warning Button
|
||||
button.btn.btn-outline-danger.btn-sm(type='button' title='btn btn-outline-danger btn-sm') Danger Button
|
||||
button.btn.btn-outline-light.btn-sm.txt-dark(type='button' title='btn btn-outline-light btn-sm')
|
||||
| Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head10', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head10
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-outline-primary btn-sm">primary button</button>
|
||||
| <button type="button" class="btn btn-outline-secondary btn-sm">secondary button</button>
|
||||
| <button type="button" class="btn btn-outline-success btn-sm">Success button</button>
|
||||
| <button type="button" class="btn btn-outline-info btn-sm">Info button</button>
|
||||
| <button type="button" class="btn btn-outline-warning btn-sm">warning button</button>
|
||||
| <button type="button" class="btn btn-outline-danger btn-sm">danger button</button>
|
||||
| <button type="button" class="btn btn-outline-light btn-sm txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#ex-outline-small-button.card
|
||||
.card-header
|
||||
h5 Outline extra small buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-outline-*
|
||||
| class for outline and
|
||||
code .btn-xs
|
||||
| class for extra small button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-outline-primary.btn-xs(type='button' title='btn btn-outline-primary btn-xs') Primary Button
|
||||
button.btn.btn-outline-secondary.btn-xs(type='button' title='btn btn-outline-secondary btn-xs')
|
||||
| Secondary Button
|
||||
button.btn.btn-outline-success.btn-xs(type='button' title='btn btn-outline-success btn-xs') Success Button
|
||||
button.btn.btn-outline-info.btn-xs(type='button' title='btn btn-outline-info btn-xs') Info Button
|
||||
button.btn.btn-outline-warning.btn-xs(type='button' title='btn btn-outline-warning btn-xs') Warning Button
|
||||
button.btn.btn-outline-danger.btn-xs(type='button' title='btn btn-outline-danger btn-xs') Danger Button
|
||||
button.btn.btn-outline-light.btn-xs.txt-dark(type='button' title='btn btn-outline-light btn-xs')
|
||||
| Light Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head11', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head11
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-outline-primary btn-xs">primary button</button>
|
||||
| <button type="button" class="btn btn-outline-secondary btn-xs">secondary button</button>
|
||||
| <button type="button" class="btn btn-outline-success btn-xs">Success button</button>
|
||||
| <button type="button" class="btn btn-outline-info btn-xs">Info button</button>
|
||||
| <button type="button" class="btn btn-outline-warning btn-xs">warning button</button>
|
||||
| <button type="button" class="btn btn-outline-danger btn-xs">danger button</button>
|
||||
| <button type="button" class="btn btn-outline-light btn-xs txt-dark">light button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
.card
|
||||
.card-header
|
||||
h5 Disabled outline buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .disabled
|
||||
| class or
|
||||
code disabled="disabled"
|
||||
| attribute for disabled state
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-outline-primary.disabled(type='button') Disabled
|
||||
button.btn.btn-outline-secondary.disabled(type='button') Disabled
|
||||
button.btn.btn-outline-success.disabled(type='button') Disabled
|
||||
button.btn.btn-outline-info.disabled(type='button') Disabled
|
||||
button.btn.btn-outline-warning.disabled(type='button') Disabled
|
||||
button.btn.btn-outline-danger.disabled(type='button') Disabled
|
||||
button.btn.btn-outline-light.txt-dark.disabled(type='button')
|
||||
| Disabled
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head12', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head12
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-outline-primary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-outline-secondary disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-outline-success disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-outline-info disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-outline-warning disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-outline-danger disabled">Disabled</button>
|
||||
| <button type="button" class="btn btn-outline-light disabled txt-dark">Disabled</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
#gradiant.card
|
||||
.card-header
|
||||
h5 Gradien buttons
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
span
|
||||
| Add
|
||||
code .btn-*-gradien
|
||||
| class for gradien button
|
||||
.card-body.btn-showcase
|
||||
button.btn.btn-primary-gradien(type='button' title='btn btn-primary-gradien') Primary Button
|
||||
button.btn.btn-secondary-gradien(type='button' title='btn btn-secondary-gradien') Secondary Button
|
||||
button.btn.btn-success-gradien(type='button' title='btn btn-success-gradien') Success Button
|
||||
button.btn.btn-info-gradien(type='button' title='btn btn-info-gradien') Info Button
|
||||
button.btn.btn-warning-gradien(type='button' title='btn btn-warning-gradien') Warning Button
|
||||
button.btn.btn-danger-gradien(type='button' title='btn btn-danger-gradien') Danger Button
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head13', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head13
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <button type="button" class="btn btn-primary-gradien">primary button</button>
|
||||
| <button type="button" class="btn btn-secondary-gradien">secondary button</button>
|
||||
| <button type="button" class="btn btn-success-gradien">Success button</button>
|
||||
| <button type="button" class="btn btn-info-gradien">Info button</button>
|
||||
| <button type="button" class="btn btn-warning-gradien">warning button</button>
|
||||
| <button type="button" class="btn btn-danger-gradien">danger button</button>
|
||||
| <!-- Cod Box Copy end -->
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
74
static/admin/assets/pug/pages/theme/calendar-basic.pug
Normal file
74
static/admin/assets/pug/pages/theme/calendar-basic.pug
Normal file
@@ -0,0 +1,74 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var calendar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Calender Basic
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item.active Calender
|
||||
// Container-fluid starts
|
||||
.container-fluid.calendar-basic
|
||||
.card
|
||||
.card-body
|
||||
#wrap.row
|
||||
.col-xxl-3.box-col-12
|
||||
.md-sidebar.mb-3
|
||||
a.btn.btn-primary.md-sidebar-toggle(href='javascript:void(0)') calendar filter
|
||||
.md-sidebar-aside.job-left-aside.custom-scrollbar
|
||||
#external-events
|
||||
h4 Draggable Events
|
||||
#external-events-list
|
||||
.fc-event.fc-h-event.fc-daygrid-event.fc-daygrid-block-event
|
||||
.fc-event-main
|
||||
i.fa.fa-birthday-cake.me-2
|
||||
| Birthday Party
|
||||
.fc-event.fc-h-event.fc-daygrid-event.fc-daygrid-block-event
|
||||
.fc-event-main
|
||||
i.fa.fa-user.me-2
|
||||
| Meeting With Team.
|
||||
.fc-event.fc-h-event.fc-daygrid-event.fc-daygrid-block-event
|
||||
.fc-event-main
|
||||
i.fa.fa-plane.me-2
|
||||
| Tour & Picnic
|
||||
.fc-event.fc-h-event.fc-daygrid-event.fc-daygrid-block-event
|
||||
.fc-event-main
|
||||
i.fa.fa-file-text.me-2
|
||||
| Reporting Schedule
|
||||
.fc-event.fc-h-event.fc-daygrid-event.fc-daygrid-block-event
|
||||
.fc-event-main
|
||||
i.fa.fa-briefcase.me-2
|
||||
| Lunch & Break
|
||||
p
|
||||
input#drop-remove.checkbox_animated(type='checkbox')
|
||||
label(for='drop-remove') remove after drop
|
||||
.col-xxl-9.box-col-12
|
||||
#calendar-container.calendar-default
|
||||
#calendar
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
117
static/admin/assets/pug/pages/theme/cart.pug
Normal file
117
static/admin/assets/pug/pages/theme/cart.pug
Normal file
@@ -0,0 +1,117 @@
|
||||
- var theme_customizer = true;
|
||||
- var theme_customizer = true;
|
||||
- var touchspin = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Cart
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Ecommerce
|
||||
li.breadcrumb-item.active Cart
|
||||
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Cart
|
||||
.card-body
|
||||
.row
|
||||
.order-history.table-responsive.wishlist
|
||||
table.table.table-bordered
|
||||
thead
|
||||
tr
|
||||
th Prdouct
|
||||
th Prdouct Name
|
||||
th Price
|
||||
th Quantity
|
||||
th Action
|
||||
th Total
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40(src='../assets/images/product/1.png' alt='#')
|
||||
td
|
||||
.product-name
|
||||
a(href='#') Long Top
|
||||
td $21
|
||||
td
|
||||
fieldset.qty-box
|
||||
.input-group
|
||||
input.touchspin.text-center(type='text' value='5')
|
||||
td
|
||||
i(data-feather='x-circle')
|
||||
td $12456
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40(src='../assets/images/product/13.png' alt='#')
|
||||
td
|
||||
.product-name
|
||||
a(href='#') Fancy watch
|
||||
td $50
|
||||
td
|
||||
fieldset.qty-box
|
||||
.input-group
|
||||
input.touchspin.text-center(type='text' value='5')
|
||||
td
|
||||
i(data-feather='x-circle')
|
||||
td $12456
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40(src='../assets/images/product/4.png' alt='#')
|
||||
td
|
||||
.product-name
|
||||
a(href='#') Man shoes
|
||||
td $11
|
||||
td
|
||||
fieldset.qty-box
|
||||
.input-group
|
||||
input.touchspin.text-center(type='text' value='5')
|
||||
td
|
||||
i(data-feather='x-circle')
|
||||
td $12456
|
||||
tr
|
||||
td(colspan='4')
|
||||
.input-group
|
||||
input.form-control.me-2(type='text' placeholder='Enter coupan code')
|
||||
a.btn.btn-primary(href='#') Apply
|
||||
td.total-amount
|
||||
h6.m-0.text-end
|
||||
span.f-w-600 Total Price :
|
||||
td
|
||||
span $6935.00
|
||||
tr
|
||||
td.text-end(colspan='5')
|
||||
a.btn.btn-secondary.cart-btn-transform(href='product.html') continue shopping
|
||||
td
|
||||
a.btn.btn-success(href="checkout.html").cart-btn-transform check out
|
||||
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
133
static/admin/assets/pug/pages/theme/chart-apex.pug
Normal file
133
static/admin/assets/pug/pages/theme/chart-apex.pug
Normal file
@@ -0,0 +1,133 @@
|
||||
- var theme_customizer = true;
|
||||
- var apex = true;
|
||||
- var page_apex = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Apex Chart
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Apex Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Basic Area Chart
|
||||
.card-body
|
||||
#basic-apex
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Area Spaline Chart
|
||||
.card-body
|
||||
#area-spaline
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Bar chart
|
||||
.card-body
|
||||
#basic-bar
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Column Chart
|
||||
.card-body
|
||||
#column-chart
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| 3d Bubble Chart
|
||||
.card-body
|
||||
#chart-bubble
|
||||
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Stepline Chart
|
||||
.card-body
|
||||
#stepline
|
||||
.col-sm-12.col-xl-12.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Column Chart
|
||||
.card-body
|
||||
#annotationchart
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Pie Chart
|
||||
.card-body.apex-chart
|
||||
#piechart
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Donut Chart
|
||||
.card-body.apex-chart
|
||||
#donutchart
|
||||
.col-sm-12.col-xl-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Mixed Chart
|
||||
.card-body
|
||||
#mixedchart
|
||||
.col-sm-12.col-xl-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Candlestick Chart
|
||||
.card-body
|
||||
#candlestick
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Radar Chart
|
||||
.card-body
|
||||
#radarchart
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Radial Bar Chart
|
||||
.card-body
|
||||
#circlechart
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
154
static/admin/assets/pug/pages/theme/chart-flot.pug
Normal file
154
static/admin/assets/pug/pages/theme/chart-flot.pug
Normal file
@@ -0,0 +1,154 @@
|
||||
- var theme_customizer = true;
|
||||
- var flotchart = true;
|
||||
- var page_flotchart = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Flot Chart
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Flot Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.all-chart
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Real-Time Updates
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#real-time-update.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Multiple Real-Time Updates
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#multiple-real-timeupdate.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Error chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#error-flot-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Adding Annotations chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#annotations-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Basic chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#flot-basic-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Categories Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#flot-categories.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Toggling Series Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#toggling-series-flot.flot-chart-placeholder.float-start
|
||||
p#choices.float-end
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Stacking chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#stacking-flot-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Default pie chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#default-pie-flot-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Default pie chart (Interactive)
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#default-pie-flot-chart-hover.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Default pie chart without legend
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#default-pie-legend-flot-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Custom Label Formatter
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#custom-label1pie.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Label Radius chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#label-radius-flot-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Hidden Labels chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#hidden-label-radius-flot-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Tilted Pie chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#title-pie-flot-chart.flot-chart-placeholder
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Donut Hole chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#dount-hole-flot-chart.flot-chart-placeholder
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
140
static/admin/assets/pug/pages/theme/chart-google.pug
Normal file
140
static/admin/assets/pug/pages/theme/chart-google.pug
Normal file
@@ -0,0 +1,140 @@
|
||||
- var theme_customizer = true;
|
||||
- var googlechart = true;
|
||||
- var page_googlechart = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Google Chart
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Google Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Area Chart
|
||||
span 1
|
||||
.card-body.p-0.chart-block
|
||||
#area-chart1.chart-overflow
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Area Chart
|
||||
span 2
|
||||
.card-body.p-0.chart-block
|
||||
#area-chart2.chart-overflow
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Column Chart
|
||||
span 1
|
||||
.card-body.chart-block
|
||||
#column-chart1.chart-overflow
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Column Chart
|
||||
span 2
|
||||
.card-body.chart-block
|
||||
#column-chart2.chart-overflow
|
||||
.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Gantt Chart
|
||||
.card-body.chart-block
|
||||
#gantt_chart.chart-overflow
|
||||
.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Line Chart
|
||||
.card-body.chart-block
|
||||
#line-chart.chart-overflow
|
||||
.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Combo Chart
|
||||
.card-body.chart-block
|
||||
#combo-chart.chart-overflow
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 bar-chart2
|
||||
.card-body.chart-block
|
||||
#bar-chart2
|
||||
.col-sm-12.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 word tree
|
||||
.card-body.chart-block
|
||||
#wordtree_basic.word-tree
|
||||
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Pie Chart
|
||||
span 1
|
||||
.card-body.p-0.chart-block
|
||||
#pie-chart1.chart-overflow
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Pie Chart
|
||||
span 2
|
||||
.card-body.p-0.chart-block
|
||||
#pie-chart3.chart-overflow
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Pie Chart
|
||||
span 3
|
||||
.card-body.p-0.chart-block
|
||||
#pie-chart4.chart-overflow
|
||||
|
||||
.col-sm-12.col-xl-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Pie Chart
|
||||
span 4
|
||||
.card-body.p-0.chart-block
|
||||
#pie-chart2.chart-overflow
|
||||
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
103
static/admin/assets/pug/pages/theme/chart-knob.pug
Normal file
103
static/admin/assets/pug/pages/theme/chart-knob.pug
Normal file
@@ -0,0 +1,103 @@
|
||||
- var theme_customizer = true;
|
||||
- var knobchart = true;
|
||||
- var page_knobchart = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Knob Chart
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Knob Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-6.col-lg-12.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Clock
|
||||
.card-body
|
||||
.knob-block.text-center.knob-chart
|
||||
.chart-clock-main
|
||||
.clock-large
|
||||
input.knob.hour(data-min='0', data-max='24', data-bgcolor='#eeeeee', data-fgcolor='#7366ff', data-displayinput='false', data-width='300', data-height='300', data-thickness='.2')
|
||||
.clock-medium
|
||||
input.knob.minute(data-min='0', data-max='60', data-bgcolor='#eeeeee', data-fgcolor='#dc3545', data-displayinput='false', data-width='200', data-height='200', data-thickness='.20')
|
||||
.clock-small
|
||||
input.knob.second(data-min='0', data-max='60', data-bgcolor='#eeeeee', data-fgcolor='#51bb25', data-displayinput='false', data-width='100', data-height='100', data-thickness='.2')
|
||||
.col-xl-6.col-lg-12.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Tron
|
||||
.card-body
|
||||
.knob-block.text-center
|
||||
input.knob(data-width='295', data-height='295', data-angleoffset='180', data-fgcolor='#7366ff', data-skin='tron', data-thickness='.1', value='35')
|
||||
.col-xl-4.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Angle Offset
|
||||
.card-body
|
||||
.knob-block.text-center
|
||||
input.knob(data-width='200', data-thickness='.1', data-angleoffset='90', data-fgcolor='#7366ff', data-linecap='round', value='35')
|
||||
.col-xl-4.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Disable Display Input
|
||||
.card-body
|
||||
.knob-block.text-center.knob-input-disable
|
||||
input.knob(data-width='200', data-thickness='.1', data-fgcolor='#7366ff', data-displayinput='false', value='35')
|
||||
.col-xl-4.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Cursor Mode
|
||||
.card-body
|
||||
.knob-block.text-center
|
||||
input.knob(data-width='200', data-cursor='true', data-fgcolor='#7366ff', data-thickness='.1', value='29')
|
||||
.col-xl-4.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Display Previous Value
|
||||
.card-body
|
||||
.knob-block.text-center
|
||||
input.knob(data-width='200', data-thickness='.1', data-fgcolor='#7366ff', data-min='-100', data-displayprevious='true', value='44')
|
||||
.col-xl-4.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Angle Offset & Arc
|
||||
.card-body
|
||||
.knob-block.text-center
|
||||
input.knob(data-angleoffset='-125', data-anglearc='250', data-fgcolor='#7366ff', data-thickness='.1', data-rotation='anticlockwise', value='35')
|
||||
.col-xl-4.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 4-digit, step 0.1
|
||||
.card-body
|
||||
.knob-block.text-center
|
||||
input.knob(data-min='-10000', data-thickness='.1', data-fgcolor='#7366ff', data-displayprevious='true', data-max='10000', data-step='.1', value='0')
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
112
static/admin/assets/pug/pages/theme/chart-morris.pug
Normal file
112
static/admin/assets/pug/pages/theme/chart-morris.pug
Normal file
@@ -0,0 +1,112 @@
|
||||
- var theme_customizer = true;
|
||||
- var morrischart = true;
|
||||
- var page_morrischart = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Morris Chart
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Morris Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Line Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#morris-line-chart.flot-chart-placeholder
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Updating Data
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#updating-data-morris-chart.flot-chart-placeholder
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Decimal Data
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#decimal-morris-chart.flot-chart-placeholder.float-start
|
||||
p#choices.float-end
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Displaying X Labels Diagonally
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#x-Labels-Diagonally-morris-chart.flot-chart-placeholder
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Bar Line Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#bar-line-chart-morris.flot-chart-placeholder
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Displaying X Labels Diagonally(Bar Chart)
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#x-lable-morris-chart.flot-chart-placeholder
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Stacked Bars Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#stacked-bar-chart.flot-chart-placeholder
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Bar Charts
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#morris-simple-bar-chart.flot-chart-placeholder
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Area charts behaving like line Charts
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#graph123.flot-chart-placeholder
|
||||
.col-lg-6.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Donut Color Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#donut-color-chart-morris.flot-chart-placeholder
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
123
static/admin/assets/pug/pages/theme/chart-peity.pug
Normal file
123
static/admin/assets/pug/pages/theme/chart-peity.pug
Normal file
@@ -0,0 +1,123 @@
|
||||
- var theme_customizer = true;
|
||||
- var peitychart = true;
|
||||
- var page_peitychart = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Peity Chart
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Peity Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-4
|
||||
.card
|
||||
.card-header
|
||||
h5 Updating Chart
|
||||
.card-body.peity-charts.peity-chart-primary
|
||||
span.updating-chart 4,3,5,4,5,10,2,3,9,1,2,8
|
||||
.col-xl-4.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Line Chart 1
|
||||
.card-body.peity-charts.peity-chart-primary
|
||||
span.line 5,3,9,6,5,9,7,3,5,2
|
||||
.col-xl-4.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Line Chart 2
|
||||
.card-body.peity-charts.peity-chart-primary
|
||||
span.line 0,-3,-6,-4,-5,-4,-7,-3,-5,-2
|
||||
.col-xl-4.col-md-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Bar Chart 1
|
||||
.card-body.peity-charts.bar-odd-even
|
||||
span.bar 5,3,9,6,5,9,7,3,5,2
|
||||
.col-xl-4.col-md-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Bar Chart 2
|
||||
.card-body.peity-charts.bar-odd-even
|
||||
span.bar 5,3,2,-1,-3,-2,2,3,5,2
|
||||
.col-xl-4.col-md-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Donut Chart 1
|
||||
.card-body.peity-charts.donut-peity
|
||||
span.donut 226/360
|
||||
.col-xl-4.col-md-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Donut Chart 2
|
||||
.card-body.peity-charts.donut-peity2
|
||||
span.donut 1,2,3,2,2
|
||||
.col-xl-4.col-md-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Pie Chart 1
|
||||
.card-body.peity-charts.pie-peity
|
||||
span.pie 226,134
|
||||
.col-xl-4.col-md-6.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Pie Chart 2
|
||||
.card-body.peity-charts.pie-peity
|
||||
span.pie 1,2,3,2,2
|
||||
.col-xxl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Donut Charts with Radius
|
||||
.card-body
|
||||
p.data-attributes
|
||||
span.small-donut(data-peity='{"innerRadius": 10, "radius": 40 }') 1/7
|
||||
span.small-donut2(data-peity='{"innerRadius": 14, "radius": 36 }') 2/7
|
||||
span.small-donut3(data-peity='{"innerRadius": 16, "radius": 32 }') 3/7
|
||||
span.small-donut4(data-peity='{"innerRadius": 18, "radius": 28 }') 4/7
|
||||
span.small-donut5(data-peity='{"innerRadius": 20, "radius": 24 }') 5/7
|
||||
span.small-donut6(data-peity='{"innerRadius": 18, "radius": 20 }') 6/7
|
||||
.col-xxl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Peity Charts With Different Colors
|
||||
.card-body
|
||||
.row
|
||||
.col-sm-3.text-center.col-6
|
||||
.xm-mb-peity
|
||||
span.bar-colours-1 5,3,9,6,5,9,7,3,5,2
|
||||
.col-sm-3.text-center.col-6
|
||||
.xm-mb-peity
|
||||
span.bar-colours-2 5,3,2,-1,-3,-2,2,3,5,2
|
||||
.col-sm-3.text-center.col-6
|
||||
span.bar-colours-3 0,-3,-6,-4,-5,-4,-7,-3,-5,-2
|
||||
.col-sm-3.text-center.col-6
|
||||
span.pie-colours-1 4,7,6,5
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
83
static/admin/assets/pug/pages/theme/chart-sparkline.pug
Normal file
83
static/admin/assets/pug/pages/theme/chart-sparkline.pug
Normal file
@@ -0,0 +1,83 @@
|
||||
- var theme_customizer = true;
|
||||
- var sparkline = true;
|
||||
- var page_sparkline = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Sparkline Chart
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Sparkline Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-4.col-md-6.col-sm-12.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Mouse Speed Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#mouse-speed-chart-sparkline.flot-chart-placeholder
|
||||
.col-xl-4.col-md-6.col-sm-12.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Bar Charts
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#custom-line-chart.flot-chart-placeholder
|
||||
.col-xl-4.col-md-6.col-sm-12.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Line Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#line-chart-sparkline.flot-chart-placeholder.line-chart-sparkline
|
||||
.col-xl-4.col-md-6.col-sm-12.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple Line Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#simple-line-chart-sparkline.flot-chart-placeholder
|
||||
.col-xl-4.col-md-6.col-sm-12.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Bar Chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#bar-chart-sparkline.flot-chart-placeholder
|
||||
.col-xl-4.col-md-6.col-sm-12.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Pie chart
|
||||
.card-body.chart-block
|
||||
.flot-chart-container
|
||||
#pie-sparkline-chart.flot-chart-placeholder
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
291
static/admin/assets/pug/pages/theme/chart-widget.pug
Normal file
291
static/admin/assets/pug/pages/theme/chart-widget.pug
Normal file
@@ -0,0 +1,291 @@
|
||||
- var prism = true;
|
||||
- var theme_customizer = true;
|
||||
- var counter = true;
|
||||
- var clipboard = true;
|
||||
- var customcard = true;
|
||||
- var apex_widget = true;
|
||||
- var apex = true;
|
||||
- var chart_widget = true;
|
||||
- var sidebar = true;
|
||||
- var scrollbar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Chart
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Widgets
|
||||
li.breadcrumb-item.active Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
// Chart widget top Start
|
||||
.row
|
||||
.col-xl-4.col-md-12.box-col-12
|
||||
.card.o-hidden
|
||||
.chart-widget-top
|
||||
.row.card-body.pb-0.m-0
|
||||
.col-xl-9.col-lg-8.col-9.p-0
|
||||
h6.mb-2 Total Sale
|
||||
h4 $3654.00
|
||||
span Compare to last month
|
||||
.col-xl-3.col-lg-4.col-3.text-end.p-0
|
||||
h6.txt-success +65%
|
||||
div
|
||||
#chart-widget1
|
||||
.col-xl-4.col-md-12.box-col-12
|
||||
.card.o-hidden
|
||||
.chart-widget-top
|
||||
.row.card-body.pb-0.m-0
|
||||
.col-xl-9.col-lg-8.col-9.p-0
|
||||
h6.mb-2 Total Project
|
||||
h4 12569
|
||||
span Compare to last month
|
||||
.col-xl-3.col-lg-4.col-3.text-end.p-0
|
||||
h6.txt-success +65%
|
||||
div#chart-widget2
|
||||
#chart-widget-top-second.flot-chart-placeholder
|
||||
.col-xl-4.col-md-12.box-col-12
|
||||
.card.o-hidden
|
||||
.chart-widget-top
|
||||
.row.card-body.pb-0.m-0
|
||||
.col-xl-9.col-lg-8.col-9.p-0
|
||||
h6.mb-2 Total Product
|
||||
h4 93M
|
||||
span Compare to last month
|
||||
.col-xl-3.col-lg-4.col-3.text-end.p-0
|
||||
h6.txt-success +65%
|
||||
div#chart-widget3
|
||||
#chart-widget-top-third.flot-chart-placeholder
|
||||
// Chart widget top Ends
|
||||
// Chart widget with bar chart Start
|
||||
.row
|
||||
.col-md-12.box-col-12
|
||||
.card.o-hidden
|
||||
.card-header
|
||||
h5 Monthly History
|
||||
.bar-chart-widget
|
||||
.bottom-content.card-body
|
||||
.row
|
||||
.col-12
|
||||
div#chart-widget4
|
||||
.col-xl-6.col-lg-12.box-col-6.xl-50
|
||||
.card
|
||||
.card-header
|
||||
h5 Skill Status
|
||||
.card-body
|
||||
.chart-container.skill-chart
|
||||
#circlechart
|
||||
.col-xl-6.col-lg-12.box-col-6.xl-50
|
||||
.card
|
||||
.card-header
|
||||
.header-top
|
||||
h5 Order Status
|
||||
.card-header-right-icon
|
||||
.dropdown
|
||||
button#dropdownMenuButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown')
|
||||
| Today
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='dropdownMenuButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body
|
||||
.chart-container.progress-chart
|
||||
#progress1
|
||||
#progress2
|
||||
#progress3
|
||||
#progress4
|
||||
#progress5
|
||||
// Chart widget with bar chart Ends
|
||||
// small widgets Start
|
||||
.row
|
||||
// Live Product chart widget Start
|
||||
.xl-50.col-xl-7.col-lg-12
|
||||
.small-chart-widget.chart-widgets-small
|
||||
.card
|
||||
.card-header
|
||||
h5 Live Products
|
||||
.card-body
|
||||
.chart-container
|
||||
.row
|
||||
.col-12
|
||||
div#chart-widget6
|
||||
// Live Product chart widget Ends
|
||||
// Turnover chart widget Start
|
||||
.xl-50.col-xl-5.col-lg-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Turn over
|
||||
.card-body
|
||||
.chart-container
|
||||
.row
|
||||
.col-12
|
||||
div#chart-widget7
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head1
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <div class="chart-container">
|
||||
| <div class="row">
|
||||
| <div class="col-12">
|
||||
| <div id="chart-widget7"></div>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
// Turnover chart widget Ends
|
||||
// Crypto price chart Start
|
||||
.xl-50.col-xl-6.col-lg-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Cryptocurrency Prices
|
||||
.card-body
|
||||
.chart-container.crypto-chart
|
||||
.row
|
||||
.col-12
|
||||
div#chart-crypto
|
||||
// Crypto price chart end
|
||||
.xl-50.col-xl-6.col-lg-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Crypto Annotations
|
||||
.card-body
|
||||
.chart-container
|
||||
.row
|
||||
.col-12
|
||||
div#crypto-annotation
|
||||
// small widgets Ends
|
||||
// Browser uses and website visiter widget Start
|
||||
.row
|
||||
// browser uses widget chart Start
|
||||
.col-sm-12.box-col-12
|
||||
.donut-chart-widget
|
||||
.card
|
||||
.card-header
|
||||
h5 Stock Market
|
||||
.card-body
|
||||
#chart-widget13
|
||||
// browser uses widget chart Endss
|
||||
// status widget Start
|
||||
.col-xl-5.col-lg-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Finance
|
||||
.card-body
|
||||
.chart-container.column-container
|
||||
#columnchart
|
||||
.col-xl-7.col-lg-12.box-col-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Order Status
|
||||
.card-body
|
||||
.chart-container
|
||||
#linechart
|
||||
// status widget Ends
|
||||
// Monthly Sale chart widget Start
|
||||
.xl-50.col-xl-5.col-lg-12.box-col-6
|
||||
.small-chart-widget.chart-widgets-small
|
||||
.card
|
||||
.card-header
|
||||
h5 Monthly Sales
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
.chart-container
|
||||
.row
|
||||
.col-12
|
||||
div#chart-widget8
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head2
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <div class="chart-container">
|
||||
| <div class="row">
|
||||
| <div class="col-12">
|
||||
| <div id="chart-widget8"></div>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
// Monthly Sale chart widget Ends
|
||||
// Uses chart widget Start
|
||||
.xl-50.col-xl-7.col-lg-12.box-col-12
|
||||
.small-chart-widget.chart-widgets-small
|
||||
.card
|
||||
.card-header
|
||||
h5 Uses
|
||||
.card-header-right
|
||||
ul.list-unstyled.card-option
|
||||
li
|
||||
i.fa.fa-spin.fa-cog
|
||||
li
|
||||
i.view-html.fa.fa-code
|
||||
li
|
||||
i.icofont.icofont-maximize.full-card
|
||||
li
|
||||
i.icofont.icofont-minus.minimize-card
|
||||
li
|
||||
i.icofont.icofont-refresh.reload-card
|
||||
li
|
||||
i.icofont.icofont-error.close-card
|
||||
.card-body
|
||||
.chart-container
|
||||
.row
|
||||
.col-12
|
||||
div#chart-widget9
|
||||
.code-box-copy
|
||||
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head3', title='Copy')
|
||||
i.icofont.icofont-copy-alt
|
||||
pre
|
||||
code.language-html#example-head3
|
||||
| <!-- Cod Box Copy begin -->
|
||||
| <div class="chart-container">
|
||||
| <div class="row">
|
||||
| <div class="col-12">
|
||||
| <div id="chart-widget9"></div>
|
||||
| </div>
|
||||
| </div>
|
||||
| </div>
|
||||
| <!-- Cod Box Copy end -->
|
||||
// Uses chart widget Ends
|
||||
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
114
static/admin/assets/pug/pages/theme/chartist.pug
Normal file
114
static/admin/assets/pug/pages/theme/chartist.pug
Normal file
@@ -0,0 +1,114 @@
|
||||
- var theme_customizer = true;
|
||||
- var chartist = true;
|
||||
- var page_chartist = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Chartist Chart
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Chartist Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Advanced SMIL Animations
|
||||
.card-body
|
||||
.ct-6.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 SVG Path animation
|
||||
.card-body
|
||||
.ct-7.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Animating a Donut with Svg.animate
|
||||
.card-body
|
||||
.ct-8.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Bi-polar Line chart with area only
|
||||
.card-body
|
||||
.ct-5.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Line chart with area
|
||||
.card-body
|
||||
.ct-4.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Bi-polar bar chart
|
||||
.card-body
|
||||
.ct-9.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Stacked bar chart
|
||||
.card-body
|
||||
.ct-10.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Horizontal bar chart
|
||||
.card-body
|
||||
.ct-11.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Extreme responsive configuration
|
||||
.card-body
|
||||
.ct-12.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Simple line chart
|
||||
.card-body
|
||||
.ct-1.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Holes in data
|
||||
.card-body
|
||||
.ct-2.flot-chart-container
|
||||
.col-xl-6.col-md-12.col-sm-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Filled holes in data
|
||||
.card-body
|
||||
.ct-3.flot-chart-container
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
78
static/admin/assets/pug/pages/theme/chartjs.pug
Normal file
78
static/admin/assets/pug/pages/theme/chartjs.pug
Normal file
@@ -0,0 +1,78 @@
|
||||
- var theme_customizer = true;
|
||||
- var chartjs = true;
|
||||
- var page_chartjs = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| ChartJS Chart
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active ChartJS Chart
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-6.col-md-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Bar Chart
|
||||
.card-body.chart-block
|
||||
canvas#myBarGraph
|
||||
.col-xl-6.col-md-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Line Graph
|
||||
.card-body.chart-block
|
||||
canvas#myGraph
|
||||
.col-xl-6.col-md-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Radar Graph
|
||||
.card-body.chart-block
|
||||
canvas#myRadarGraph
|
||||
.col-xl-6.col-md-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Line Chart
|
||||
.card-body.chart-block
|
||||
canvas#myLineCharts
|
||||
.col-xl-6.col-md-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Doughnut Chart
|
||||
.card-body.chart-block.chart-vertical-center
|
||||
canvas#myDoughnutGraph
|
||||
.col-xl-6.col-md-12.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Polar Chart
|
||||
.card-body.chart-block.chart-vertical-center
|
||||
canvas#myPolarGraph
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
298
static/admin/assets/pug/pages/theme/chat-video.pug
Normal file
298
static/admin/assets/pug/pages/theme/chat-video.pug
Normal file
@@ -0,0 +1,298 @@
|
||||
- var theme_customizer = true;
|
||||
- var fullscreen = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Video Chat
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Chat
|
||||
li.breadcrumb-item.active Video Chat
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col.call-chat-sidebar
|
||||
.card
|
||||
.card-body.chat-body
|
||||
.chat-box
|
||||
// Chat left side Start
|
||||
.chat-left-aside
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/12.png', alt='')
|
||||
.about
|
||||
.name.f-w-600 Mark Jecno
|
||||
.status
|
||||
| Status...
|
||||
#people-list.people-list
|
||||
.search
|
||||
form.theme-form
|
||||
.mb-3
|
||||
input.form-control(type='text', placeholder='search')
|
||||
i.fa.fa-search
|
||||
ul.list
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/1.jpg', alt='')
|
||||
.status-circle.away
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
| Hello Name
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/2.png', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Aiden Chavez
|
||||
.status
|
||||
| Out is my favorite.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Prasanth Anand
|
||||
.status
|
||||
| Change for anyone.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.status-circle.offline
|
||||
.about
|
||||
.name Venkata Satyamu
|
||||
.status
|
||||
| First bun like a sun.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/5.jpg', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Ginger Johnston
|
||||
.status
|
||||
| it's my life. Mind it.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.offline
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
| Change for anyone.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/1.jpg', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
| Hello Name
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
| Change for anyone.
|
||||
// Chat left side Ends
|
||||
.col.call-chat-body
|
||||
.card
|
||||
.card-body.p-0
|
||||
.row.chat-box
|
||||
// Chat right side start
|
||||
.col.pr-xl-0.chat-right-aside
|
||||
// chat start
|
||||
.chat
|
||||
// chat-header start
|
||||
.chat-header.clearfix
|
||||
.media.align-items-center
|
||||
img.rounded-circle(src='../assets/images/user/8.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name
|
||||
| Kori Thomas
|
||||
span.font-primary.f-12 Typing...
|
||||
.status
|
||||
| Last Seen 3:55 PM
|
||||
ul.list-inline.chat-menu-icons
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-search
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-clip
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-headphone-alt
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-video-camera
|
||||
li.list-inline-item.toogle-bar
|
||||
a(href='#')
|
||||
i.icon-menu
|
||||
// chat-header end
|
||||
// chat-history start
|
||||
.chat-history
|
||||
.row
|
||||
.col.text-center.pe-0.call-content
|
||||
div
|
||||
.total-time
|
||||
h2 36 : 56
|
||||
.call-icons
|
||||
ul.list-inline
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-video-camera
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-volume
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-user
|
||||
button.btn.btn-danger-gradien.btn-block.btn-lg END CALL
|
||||
.receiver-img
|
||||
img(src='../assets/images/other-images/receiver-img.jpg', alt='')
|
||||
.col-sm-7.ps-0.caller-img
|
||||
img.img-fluid(src='../assets/images/other-images/caller.jpg', alt='')
|
||||
// chat-history ends
|
||||
// chat end
|
||||
// Chat right side ends
|
||||
.col.pl-xl-0.chat-menu
|
||||
ul#info-tab.nav.nav-tabs.border-tab.nav-primary(role='tablist')
|
||||
li.nav-item
|
||||
a#info-home-tab.nav-link.active(data-bs-toggle='tab', href='#info-home', role='tab', aria-selected='true')
|
||||
| CALL
|
||||
.material-border
|
||||
li.nav-item
|
||||
a#profile-info-tab.nav-link(data-bs-toggle='tab', href='#info-profile', role='tab', aria-selected='false')
|
||||
| STATUS
|
||||
.material-border
|
||||
li.nav-item
|
||||
a#contact-info-tab.nav-link(data-bs-toggle='tab', href='#info-contact', role='tab', aria-selected='false')
|
||||
| PROFILE
|
||||
.material-border
|
||||
#info-tabContent.tab-content
|
||||
#info-home.tab-pane.fade.show.active(role='tabpanel', aria-labelledby='info-home-tab')
|
||||
.people-list
|
||||
ul.list
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.about
|
||||
.name Erica Hughes
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 4:40 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image.mt-0(src='../assets/images/user/1.jpg', alt='')
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
i.fa.fa-reply.font-danger
|
||||
| 5 May, 5:30 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 1 Feb, 6:56 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/2.png', alt='')
|
||||
.about
|
||||
.name Aiden Chavez
|
||||
.status
|
||||
i.fa.fa-reply.font-danger
|
||||
| 3 June, 1:22 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.about
|
||||
.name Erica Hughes
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 4:40 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image.mt-0(src='../assets/images/user/1.jpg', alt='')
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 5:30 PM
|
||||
#info-profile.tab-pane.fade(role='tabpanel', aria-labelledby='profile-info-tab')
|
||||
.people-list
|
||||
.search
|
||||
form.theme-form
|
||||
.mb-3
|
||||
input.form-control(type='text', placeholder='Write Status...')
|
||||
i.fa.fa-pencil
|
||||
.status
|
||||
p.font-dark Active
|
||||
hr
|
||||
p
|
||||
| Established fact that a reader will be
|
||||
| distracted
|
||||
i.icofont.icofont-emo-heart-eyes.font-danger.f-20
|
||||
i.icofont.icofont-emo-heart-eyes.font-danger.f-20.m-l-5
|
||||
hr
|
||||
p
|
||||
| Dolore magna aliqua
|
||||
i.icofont.icofont-emo-rolling-eyes.font-success.f-20
|
||||
#info-contact.tab-pane.fade(role='tabpanel', aria-labelledby='contact-info-tab')
|
||||
.user-profile
|
||||
.image
|
||||
.avatar.text-center
|
||||
img(alt='', src='../assets/images/user/2.png')
|
||||
.icon-wrapper
|
||||
i.icofont.icofont-pencil-alt-5
|
||||
.user-content.text-center
|
||||
h5.text-uppercase mark jenco
|
||||
.social-media
|
||||
ul.list-inline
|
||||
li.list-inline-item
|
||||
a(href='https://www.facebook.com/' target="_blank")
|
||||
i.fa.fa-facebook
|
||||
li.list-inline-item
|
||||
a(href='https://accounts.google.com/' target="_blank")
|
||||
i.fa.fa-google-plus
|
||||
li.list-inline-item
|
||||
a(href='https://twitter.com/' target="_blank")
|
||||
i.fa.fa-twitter
|
||||
li.list-inline-item
|
||||
a(href='https://www.instagram.com/' target="_blank")
|
||||
i.fa.fa-instagram
|
||||
li.list-inline-item
|
||||
a(href='https://rss.app/' target="_blank")
|
||||
i.fa.fa-rss
|
||||
hr
|
||||
.follow.text-center
|
||||
.row
|
||||
.col.border-right
|
||||
span Following
|
||||
.follow-num 236k
|
||||
.col
|
||||
span Follower
|
||||
.follow-num 3691k
|
||||
hr
|
||||
.text-center
|
||||
p.mb-0 Mark.jecno23@gmail.com
|
||||
p.mb-0 +91 365 - 658 - 1236
|
||||
p.mb-0 Fax: 123-4560
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
321
static/admin/assets/pug/pages/theme/chat.pug
Normal file
321
static/admin/assets/pug/pages/theme/chat.pug
Normal file
@@ -0,0 +1,321 @@
|
||||
- var theme_customizer = true;
|
||||
- var fullscreen = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Chat App
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Chat
|
||||
li.breadcrumb-item.active Chat App
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col.call-chat-sidebar.col-sm-12
|
||||
.card
|
||||
.card-body.chat-body
|
||||
.chat-box
|
||||
// Chat left side Start
|
||||
.chat-left-aside
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/12.png', alt='')
|
||||
.about
|
||||
.name.f-w-600 Mark Jecno
|
||||
.status
|
||||
| Status...
|
||||
#people-list.people-list
|
||||
.search
|
||||
form.theme-form
|
||||
.mb-3
|
||||
input.form-control(type='text', placeholder='Search')
|
||||
i.fa.fa-search
|
||||
ul.list
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/1.jpg', alt='')
|
||||
.status-circle.away
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
| Hello Name
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/2.png', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Aiden Chavez
|
||||
.status
|
||||
| Out is my favorite.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Prasanth Anand
|
||||
.status
|
||||
| Change for anyone.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.status-circle.offline
|
||||
.about
|
||||
.name Venkata Satyamu
|
||||
.status
|
||||
| First bun like a sun.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/5.jpg', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Ginger Johnston
|
||||
.status
|
||||
| it's my life. Mind it.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.offline
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
| Change for anyone.
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/1.jpg', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
| Hello Name
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.online
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
| Change for anyone.
|
||||
// Chat left side Ends
|
||||
.col.call-chat-body
|
||||
.card
|
||||
.card-body.p-0
|
||||
.row.chat-box
|
||||
// Chat right side start
|
||||
.col.pe-0.chat-right-aside
|
||||
// chat start
|
||||
.chat
|
||||
// chat-header start
|
||||
.chat-header.clearfix
|
||||
img.rounded-circle(src='../assets/images/user/8.jpg', alt='')
|
||||
.about
|
||||
.name
|
||||
| Kori Thomas
|
||||
span.font-primary.f-12 Typing...
|
||||
.status
|
||||
| Last Seen 3:55 PM
|
||||
ul.list-inline.float-start.float-sm-end.chat-menu-icons
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-search
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-clip
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-headphone-alt
|
||||
li.list-inline-item
|
||||
a(href='#')
|
||||
i.icon-video-camera
|
||||
li.list-inline-item.toogle-bar
|
||||
a(href='#')
|
||||
i.icon-menu
|
||||
// chat-header end
|
||||
.chat-history.chat-msg-box.custom-scrollbar
|
||||
ul
|
||||
li
|
||||
.message.my-message
|
||||
img.rounded-circle.float-start.chat-user-img.img-30(src='../assets/images/user/3.png', alt='')
|
||||
.message-data.text-end
|
||||
span.message-data-time 10:12 am
|
||||
| Are we meeting today? Project has been already finished and I have results to show you.
|
||||
li.clearfix
|
||||
.message.other-message.pull-right
|
||||
img.rounded-circle.float-end.chat-user-img.img-30(src='../assets/images/user/12.png', alt='')
|
||||
.message-data
|
||||
span.message-data-time 10:14 am
|
||||
| Well I am not sure. The rest of the team is not here yet. Maybe in an hour or so?
|
||||
li.clearfix
|
||||
.message.other-message.pull-right
|
||||
img.rounded-circle.float-end.chat-user-img.img-30(src='../assets/images/user/12.png', alt='')
|
||||
.message-data
|
||||
span.message-data-time 10:14 am
|
||||
| Well I am not sure. The rest of the team
|
||||
li
|
||||
.message.my-message.mb-0
|
||||
img.rounded-circle.float-start.chat-user-img.img-30(src='../assets/images/user/3.png', alt='')
|
||||
.message-data.text-end
|
||||
span.message-data-time 10:20 am
|
||||
| Actually everything was fine. I'm very excited to show this to our team.
|
||||
// end chat-history
|
||||
.chat-message.clearfix
|
||||
.row
|
||||
.col-xl-12.d-flex
|
||||
.smiley-box.bg-primary
|
||||
.picker
|
||||
img(src='../assets/images/smiley.png', alt='')
|
||||
.input-group.text-box
|
||||
input#message-to-send.form-control.input-txt-bx(type='text', name='message-to-send', placeholder='Type a message......')
|
||||
button.input-group-text.btn.btn-primary(type='button') SEND
|
||||
// end chat-message
|
||||
// chat end
|
||||
// Chat right side ends
|
||||
.col.ps-0.chat-menu
|
||||
ul#info-tab.nav.nav-tabs.border-tab.nav-primary(role='tablist')
|
||||
li.nav-item
|
||||
a#info-home-tab.nav-link.active(data-bs-toggle='tab', href='#info-home', role='tab', aria-selected='true')
|
||||
| CALL
|
||||
.material-border
|
||||
li.nav-item
|
||||
a#profile-info-tab.nav-link(data-bs-toggle='tab', href='#info-profile', role='tab', aria-selected='false')
|
||||
| STATUS
|
||||
.material-border
|
||||
li.nav-item
|
||||
a#contact-info-tab.nav-link(data-bs-toggle='tab', href='#info-contact', role='tab', aria-selected='false')
|
||||
| PROFILE
|
||||
.material-border
|
||||
#info-tabContent.tab-content
|
||||
#info-home.tab-pane.fade.show.active(role='tabpanel', aria-labelledby='info-home-tab')
|
||||
.people-list
|
||||
ul.list
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.about
|
||||
.name Erica Hughes
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 4:40 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image.mt-0(src='../assets/images/user/1.jpg', alt='')
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
i.fa.fa-reply.font-danger
|
||||
| 5 May, 5:30 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 1 Feb, 6:56 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/2.png', alt='')
|
||||
.about
|
||||
.name Aiden Chavez
|
||||
.status
|
||||
i.fa.fa-reply.font-danger
|
||||
| 3 June, 1:22 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.about
|
||||
.name Erica Hughes
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 4:40 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image.mt-0(src='../assets/images/user/1.jpg', alt='')
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 5:30 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
i.fa.fa-reply.font-danger
|
||||
| 1 Feb, 6:56 PM
|
||||
li.clearfix
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.about
|
||||
.name Erica Hughes
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 4:40 PM
|
||||
#info-profile.tab-pane.fade(role='tabpanel', aria-labelledby='profile-info-tab')
|
||||
.people-list
|
||||
.search
|
||||
form.theme-form
|
||||
.mb-3
|
||||
input.form-control(type='text', placeholder='Write Status...')
|
||||
i.fa.fa-pencil
|
||||
.status
|
||||
p.font-dark Active
|
||||
hr
|
||||
p
|
||||
| Established fact that a reader will be
|
||||
| distracted
|
||||
i.icofont.icofont-emo-heart-eyes.font-danger.f-20
|
||||
i.icofont.icofont-emo-heart-eyes.font-danger.f-20.m-l-5
|
||||
hr
|
||||
p
|
||||
| Dolore magna aliqua
|
||||
i.icofont.icofont-emo-rolling-eyes.font-success.f-20
|
||||
#info-contact.tab-pane.fade(role='tabpanel', aria-labelledby='contact-info-tab')
|
||||
.user-profile
|
||||
.image
|
||||
.avatar.text-center
|
||||
img(alt='', src='../assets/images/user/2.png')
|
||||
.icon-wrapper
|
||||
i.icofont.icofont-pencil-alt-5
|
||||
.user-content.text-center
|
||||
h5.text-uppercase mark jenco
|
||||
.social-media
|
||||
ul.list-inline
|
||||
li.list-inline-item
|
||||
a(href='https://www.facebook.com/' target="_blank")
|
||||
i.fa.fa-facebook
|
||||
li.list-inline-item
|
||||
a(href='https://accounts.google.com/' target="_blank")
|
||||
i.fa.fa-google-plus
|
||||
li.list-inline-item
|
||||
a(href='https://twitter.com/' target="_blank")
|
||||
i.fa.fa-twitter
|
||||
li.list-inline-item
|
||||
a(href='https://www.instagram.com/' target="_blank")
|
||||
i.fa.fa-instagram
|
||||
li.list-inline-item
|
||||
a(href='https://rss.app/' target="_blank")
|
||||
i.fa.fa-rss
|
||||
hr
|
||||
.follow.text-center
|
||||
.row
|
||||
.col.border-right
|
||||
span Following
|
||||
.follow-num 236k
|
||||
.col
|
||||
span Follower
|
||||
.follow-num 3691k
|
||||
hr
|
||||
.text-center
|
||||
p.mb-0 Mark.jecno23@gmail.com
|
||||
p.mb-0 +91 365 - 658 - 1236
|
||||
p.mb-0 Fax: 123-4560
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
127
static/admin/assets/pug/pages/theme/checkout.pug
Normal file
127
static/admin/assets/pug/pages/theme/checkout.pug
Normal file
@@ -0,0 +1,127 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body.checkout
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Checkout
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Ecommerce
|
||||
li.breadcrumb-item.active Checkout
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.card
|
||||
.card-header
|
||||
h5 Billing Details
|
||||
.card-body
|
||||
.row
|
||||
.col-xl-6.col-sm-12
|
||||
form
|
||||
.row
|
||||
.mb-3.col-sm-6
|
||||
label(for='inputEmail4') First Name
|
||||
input#inputEmail4.form-control(type='email')
|
||||
.mb-3.col-sm-6
|
||||
label(for='inputPassword4') Last Name
|
||||
input#inputPassword4.form-control(type='password')
|
||||
.row
|
||||
.mb-3.col-sm-6
|
||||
label(for='inputEmail5') Phone
|
||||
input#inputEmail5.form-control(type='email')
|
||||
.mb-3.col-sm-6
|
||||
label(for='inputPassword7') Email Address
|
||||
input#inputPassword7.form-control(type='password')
|
||||
.mb-3
|
||||
label(for='inputState') Country
|
||||
select#inputState.form-control
|
||||
option(selected='') Choose...
|
||||
option ...
|
||||
.mb-3
|
||||
label(for='inputAddress5') Address
|
||||
input#inputAddress5.form-control(type='text')
|
||||
.mb-3
|
||||
label(for='inputCity') Town/City
|
||||
input#inputCity.form-control(type='text')
|
||||
.mb-3
|
||||
label(for='inputAddress2') State/Country
|
||||
input#inputAddress2.form-control(type='text')
|
||||
.mb-3
|
||||
label(for='inputAddress6') Postal Code
|
||||
input#inputAddress6.form-control(type='text')
|
||||
.mb-3
|
||||
.form-check
|
||||
input#gridCheck.form-check-input(type='checkbox')
|
||||
label.form-check-label(for='gridCheck')
|
||||
| Check me out
|
||||
.col-xl-6.col-sm-12
|
||||
.checkout-details
|
||||
.order-box
|
||||
.title-box
|
||||
div.checkbox-title
|
||||
h4 Product
|
||||
span Total
|
||||
ul.qty
|
||||
li
|
||||
| Pink Slim Shirt × 1
|
||||
span $25.10
|
||||
li
|
||||
| SLim Fit Jeans × 1
|
||||
span $555.00
|
||||
ul.sub-total
|
||||
li
|
||||
| Subtotal
|
||||
span.count $380.10
|
||||
li.shipping-class
|
||||
| Shipping
|
||||
.shopping-checkout-option
|
||||
label.d-block(for='chk-ani')
|
||||
input#chk-ani.checkbox_animated(type='checkbox', checked='')
|
||||
| Option 1
|
||||
label.d-block(for='chk-ani1')
|
||||
input#chk-ani1.checkbox_animated(type='checkbox')
|
||||
| Option 2
|
||||
ul.sub-total.total
|
||||
li
|
||||
| Total
|
||||
span.count $620.00
|
||||
.animate-chk
|
||||
.row
|
||||
.col
|
||||
label.d-block(for='edo-ani')
|
||||
input#edo-ani.radio_animated(type='radio', name='rdo-ani', checked='', data-original-title='', title='')
|
||||
| Check Payments
|
||||
label.d-block(for='edo-ani1')
|
||||
input#edo-ani1.radio_animated(type='radio', name='rdo-ani', data-original-title='', title='')
|
||||
| Cash On Delivery
|
||||
label.d-block(for='edo-ani2')
|
||||
input#edo-ani2.radio_animated(type='radio', name='rdo-ani', checked='', data-original-title='', title='')
|
||||
| PayPal
|
||||
img(src='../assets/images/checkout/paypal.png', alt='' class='img-paypal')
|
||||
.order-place
|
||||
a.btn.btn-primary(href='#') Place Order
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
89
static/admin/assets/pug/pages/theme/ckeditor.pug
Normal file
89
static/admin/assets/pug/pages/theme/ckeditor.pug
Normal file
@@ -0,0 +1,89 @@
|
||||
- var theme_customizer = true;
|
||||
- var ckeditor = true;
|
||||
- var page_ckeditor = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Ck Editor
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Editors
|
||||
li.breadcrumb-item.active Ck Editor
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Ck Editor
|
||||
.card-body
|
||||
textarea#editor1(name='editor1', cols='30', rows='10')
|
||||
| <h2>Technical details <a id="tech-details" name="tech-details"></a></h2>
|
||||
| <table align="right" border="1" cellpadding="5" cellspacing="0">
|
||||
| <caption><strong>Mission crew</strong></caption>
|
||||
| <thead>
|
||||
| <tr>
|
||||
| <th scope="col">Position</th>
|
||||
| <th scope="col">Astronaut</th>
|
||||
| </tr>
|
||||
| </thead>
|
||||
| <tbody>
|
||||
| <tr>
|
||||
| <td>Commander</td>
|
||||
| <td>Neil A. Armstrong</td>
|
||||
| </tr>
|
||||
| <tr>
|
||||
| <td>Command Module Pilot</td>
|
||||
| <td>Michael Collins</td>
|
||||
| </tr>
|
||||
| <tr>
|
||||
| <td>Lunar Module Pilot</td>
|
||||
| <td>Edwin "Buzz" E. Aldrin, Jr.</td>
|
||||
| </tr>
|
||||
| </tbody>
|
||||
| </table>
|
||||
| <p>Launched by a <strong>Saturn V</strong> rocket from <a href="#">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="#">NASA</a>'s Apollo program. The Apollo spacecraft had three parts:</p>
|
||||
| <ol>
|
||||
| <li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li>
|
||||
| <li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li>
|
||||
| <li><strong>Lunar Module</strong> for landing on the Moon.</li>
|
||||
| </ol>
|
||||
| <p>After being sent to the Moon by the Saturn V's upper stage, the astronauts separated the spacecraft from it and travelled for three days until they entered into lunar orbit. Armstrong and Aldrin then moved into the Lunar Module and landed in the <a href="#">Sea of Tranquility</a>. They stayed a total of about 21 and a half hours on the lunar surface. After lifting off in the upper part of the Lunar Module and rejoining Collins in the Command Module, they returned to Earth and landed in the <a href="#">Pacific Ocean</a> on July 24.</p>
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Inline Editor
|
||||
.card-body
|
||||
#area1(contenteditable='true')
|
||||
h1 Your title
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at vulputate urna, sed dignissim arcu. Aliquam at ligula imperdiet, faucibus ante a, interdum enim. Sed in mauris a lectus lobortis condimentum. Sed in nunc magna. Quisque massa urna, cursus vitae commodo eget, rhoncus nec erat. Sed sapien turpis, elementum sit amet elit vitae, elementum gravida eros. In ornare tempus nibh ut lobortis. Nam venenatis justo ex, vitae vulputate neque laoreet a.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
103
static/admin/assets/pug/pages/theme/clipboard.pug
Normal file
103
static/admin/assets/pug/pages/theme/clipboard.pug
Normal file
@@ -0,0 +1,103 @@
|
||||
- var theme_customizer = true;
|
||||
- var clipboard = true;
|
||||
- var page_clipboard = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Clipboard
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Form Widgets
|
||||
li.breadcrumb-item.active Clipboard
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Clipboard On Text Input
|
||||
.card-body
|
||||
.clipboaard-container
|
||||
p.card-description Cut/copy from text input
|
||||
input#clipboardExample1.form-control(type='text', placeholder='type some text to copy / cut')
|
||||
.mt-3.text-end
|
||||
button.btn.btn-primary.btn-clipboard(type='button', data-clipboard-action='copy', data-clipboard-target='#clipboardExample1')
|
||||
i.fa.fa-copy
|
||||
| Copy
|
||||
button.btn.btn-secondary.btn-clipboard-cut(type='button', data-clipboard-action='cut', data-clipboard-target='#clipboardExample1')
|
||||
i.fa.fa-cut
|
||||
| Cut
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Clipboard On Textarea
|
||||
.card-body
|
||||
.clipboaard-container
|
||||
p.card-description Cut/copy from textarea
|
||||
textarea#clipboardExample2.form-control.f-14(rows='1', spellcheck='false')
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
|
||||
.mt-3.text-end
|
||||
button.btn.btn-primary.btn-clipboard(type='button', data-clipboard-action='copy', data-clipboard-target='#clipboardExample2')
|
||||
i.fa.fa-copy
|
||||
| Copy
|
||||
button.btn.btn-secondary.btn-clipboard-cut(type='button', data-clipboard-action='cut', data-clipboard-target='#clipboardExample2')
|
||||
i.fa.fa-cut
|
||||
| Cut
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Clipboard On Paragraph
|
||||
.card-body
|
||||
.clipboaard-container
|
||||
p.card-description Copy from Paragraph
|
||||
h6#clipboardExample3.border.rounded.card-body.f-w-300
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
||||
| sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
.mt-3.text-end
|
||||
button.btn.btn-primary.btn-clipboard(type='button', data-clipboard-action='copy', data-clipboard-target='#clipboardExample3')
|
||||
i.fa.fa-copy
|
||||
| Copy
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Copy Portion From Paragraph
|
||||
.card-body
|
||||
.clipboaard-container
|
||||
p.card-description Copy Portion From Paragraph
|
||||
h6.border.rounded.card-body.f-w-300
|
||||
| Lorem ipsum
|
||||
span#clipboardExample4.bg-primary.text-white.p-1 dolor sit amet
|
||||
| , consectetur adipiscing elit,
|
||||
| sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
.mt-3.text-end
|
||||
button.btn.btn-primary.btn-clipboard(type='button', data-clipboard-action='copy', data-clipboard-target='#clipboardExample4')
|
||||
i.fa.fa-copy
|
||||
| Copy highlighted text
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
30
static/admin/assets/pug/pages/theme/comingsoon-bg-img.pug
Normal file
30
static/admin/assets/pug/pages/theme/comingsoon-bg-img.pug
Normal file
@@ -0,0 +1,30 @@
|
||||
- var countdown = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// Page Body Start
|
||||
.container-fluid.p-0.m-0
|
||||
.comingsoon.comingsoon-bgimg
|
||||
.comingsoon-inner.text-center
|
||||
img(src='../assets/images/other-images/logo-login.png', alt='')
|
||||
h5 WE ARE COMING SOON
|
||||
#clockdiv.countdown
|
||||
ul
|
||||
li
|
||||
span#days.time
|
||||
span.title days
|
||||
li
|
||||
span#hours.time
|
||||
span.title Hours
|
||||
li
|
||||
span#minutes.time
|
||||
span.title Minutes
|
||||
li
|
||||
span#seconds.time
|
||||
span.title Seconds
|
||||
include ../../components/footer-files
|
||||
32
static/admin/assets/pug/pages/theme/comingsoon-bg-video.pug
Normal file
32
static/admin/assets/pug/pages/theme/comingsoon-bg-video.pug
Normal file
@@ -0,0 +1,32 @@
|
||||
- var countdown = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// Page Body Start
|
||||
.container-fluid.p-0
|
||||
.comingsoon.auth-bg-video
|
||||
video#bgvid.bgvideo-comingsoon(poster='../assets/images/other-images/coming-soon-bg.jpg', playsinline='', autoplay='', muted='', loop='')
|
||||
source(src='../assets/video/auth-bg.mp4', type='video/mp4')
|
||||
.comingsoon-inner.text-center
|
||||
img(src='../assets/images/other-images/logo-login.png', alt='')
|
||||
h5 WE ARE COMING SOON
|
||||
#clockdiv.countdown
|
||||
ul
|
||||
li
|
||||
span#days.time
|
||||
span.title days
|
||||
li
|
||||
span#hours.time
|
||||
span.title Hours
|
||||
li
|
||||
span#minutes.time
|
||||
span.title Minutes
|
||||
li
|
||||
span#seconds.time
|
||||
span.title Seconds
|
||||
include ../../components/footer-files
|
||||
31
static/admin/assets/pug/pages/theme/comingsoon.pug
Normal file
31
static/admin/assets/pug/pages/theme/comingsoon.pug
Normal file
@@ -0,0 +1,31 @@
|
||||
- var countdown = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// Page Body Start
|
||||
.container-fluid.p-0
|
||||
.comingsoon
|
||||
.comingsoon-inner.text-center
|
||||
img(src='../assets/images/other-images/logo-login.png', alt='')
|
||||
h5 WE ARE COMING SOON
|
||||
#clockdiv.countdown
|
||||
ul
|
||||
li
|
||||
span#days.time
|
||||
span.title days
|
||||
li
|
||||
span#hours.time
|
||||
span.title Hours
|
||||
li
|
||||
span#minutes.time
|
||||
span.title Minutes
|
||||
li
|
||||
span#seconds.time
|
||||
span.title Seconds
|
||||
|
||||
include ../../components/footer-files
|
||||
795
static/admin/assets/pug/pages/theme/contacts.pug
Normal file
795
static/admin/assets/pug/pages/theme/contacts.pug
Normal file
@@ -0,0 +1,795 @@
|
||||
- var theme_customizer = true;
|
||||
- var form_validation_custom= true;
|
||||
- var select2 = true;
|
||||
- var page_select2 = true;
|
||||
- var sweetalert2 = true;
|
||||
- var notify = true;
|
||||
- var contact_page = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Contacts
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Apps
|
||||
li.breadcrumb-item.active Contacts
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.email-wrap.bookmark-wrap
|
||||
.row
|
||||
.col-xl-3.box-col-6
|
||||
.md-sidebar
|
||||
a.btn.btn-primary.md-sidebar-toggle(href='javascript:void(0)') contact filter
|
||||
.md-sidebar-aside.job-left-aside.custom-scrollbar
|
||||
.email-left-aside
|
||||
.card
|
||||
.card-body
|
||||
.email-app-sidebar.left-bookmark
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6.f-w-600 MARK JENCO
|
||||
p Markjecno@gmail.com
|
||||
ul.nav.main-menu(role='tablist').contact-options
|
||||
li.nav-item
|
||||
button.badge-light-primary.btn-block.btn-mail.w-100(type='button', data-bs-toggle='modal', data-bs-target='#exampleModal')
|
||||
i.me-2(data-feather='users')
|
||||
| New Contacts
|
||||
#exampleModal.modal.fade.modal-bookmark(tabindex='-1', role='dialog', aria-labelledby='exampleModalLabel', aria-hidden='true')
|
||||
.modal-dialog.modal-lg(role='document')
|
||||
.modal-content
|
||||
.modal-header
|
||||
h5#exampleModalLabel.modal-title Add Contact
|
||||
button.btn-close(type='button', data-bs-dismiss='modal', aria-label='Close')
|
||||
.modal-body
|
||||
form#bookmark-form.form-bookmark.needs-validation(novalidate='')
|
||||
.row.g-2
|
||||
.mb-3.col-md-12.mt-0
|
||||
label(for='con-name') Name
|
||||
.row
|
||||
.col-sm-6
|
||||
input.form-control#con-name(type='text', required='', placeholder='First Name', autocomplete='off')
|
||||
.col-sm-6
|
||||
input.form-control#con-last(type='text', required='', placeholder='Last Name', autocomplete='off')
|
||||
.mb-3.col-md-12.mt-0
|
||||
label(for='con-mail') Email Address
|
||||
input.form-control#con-mail(type='text', required='', autocomplete='off')
|
||||
.mb-3.col-md-12.my-0
|
||||
label(for='con-phone') Phone
|
||||
.row
|
||||
.col-sm-6
|
||||
input.form-control#con-phone(type='number', required='', autocomplete='off')
|
||||
.col-sm-6
|
||||
select.form-control#con-select
|
||||
option Mobile
|
||||
option Work
|
||||
option Others
|
||||
input#index_var(type='hidden' value='5')
|
||||
button.btn.btn-secondary(type='submit', onclick='submitContact()') Save
|
||||
button.btn.btn-primary(type='button', data-bs-dismiss='modal') Cancel
|
||||
li.nav-item
|
||||
span.main-title
|
||||
| Views
|
||||
li
|
||||
a#pills-personal-tab(data-bs-toggle='pill', href='#pills-personal', role='tab', aria-controls='pills-personal', aria-selected='true')
|
||||
span.title
|
||||
| Personal
|
||||
li
|
||||
button.btn.btn-category(type='button', data-bs-toggle='modal', data-bs-target='#exampleModal1')
|
||||
span.title
|
||||
| + Add Category
|
||||
#exampleModal1.modal.fade(tabindex='-1', role='dialog', aria-labelledby='exampleModalLabel1', aria-hidden='true')
|
||||
.modal-dialog(role='document')
|
||||
.modal-content
|
||||
.modal-header
|
||||
h5#exampleModalLabel1.modal-title Add Category
|
||||
button.btn-close(type='button', data-bs-dismiss='modal', aria-label='Close')
|
||||
.modal-body
|
||||
form.form-bookmark
|
||||
.row.g-2
|
||||
.mb-3.col-md-12
|
||||
input.form-control(type='text', required='', placeholder='Enter category name', autocomplete='off')
|
||||
button.btn.btn-secondary(type='button') Save
|
||||
button.btn.btn-primary(type='button', data-bs-dismiss='modal') Cancel
|
||||
li
|
||||
a#pills-organization-tab.show(data-bs-toggle='pill', href='#pills-organization', role='tab', aria-controls='pills-organization', aria-selected='false')
|
||||
span.title
|
||||
| Organization
|
||||
li
|
||||
a(href="#")
|
||||
span.title Follow up
|
||||
li
|
||||
a(href="#")
|
||||
span.title Favorites
|
||||
li
|
||||
a(href="#")
|
||||
span.title Ideas
|
||||
li
|
||||
a(href="#")
|
||||
span.title Important
|
||||
li
|
||||
a(href="#")
|
||||
span.title Business
|
||||
li
|
||||
a(href="#")
|
||||
span.title Holidays
|
||||
.col-xl-9.col-md-12.box-col-12
|
||||
.email-right-aside.bookmark-tabcontent.contacts-tabs
|
||||
.card.email-body.radius-left
|
||||
.ps-0
|
||||
.tab-content
|
||||
#pills-personal.tab-pane.fade.active.show(role='tabpanel', aria-labelledby='pills-personal-tab')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h5 Personal
|
||||
span.f-14.pull-right.mt-0 5 Contacts
|
||||
.card-body.p-0
|
||||
.row.list-persons#addcon
|
||||
.col-xl-4.xl-50.col-md-5
|
||||
#v-pills-tab.nav.flex-column.nav-pills(role='tablist', aria-orientation='vertical')
|
||||
a#v-pills-user-tab.contact-tab-0.nav-link.active(data-bs-toggle='pill', onclick= 'activeDiv(0)', href='#v-pills-user', role='tab', aria-controls='v-pills-user', aria-selected='true')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle.update_img_0(src='../assets/images/user/2.png' alt='')
|
||||
.media-body
|
||||
h6
|
||||
span.first_name_0 Bucky
|
||||
span.last_name_0 Barnes
|
||||
p.email_add_0 barnes@gmail.com
|
||||
a#v-pills-profile-tab.contact-tab-1.nav-link(data-bs-toggle='pill', onclick= 'activeDiv(1)', href='#v-pills-profile', role='tab', aria-controls='v-pills-profile', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle.update_img_1(src='../assets/images/user/8.jpg' alt='')
|
||||
.media-body
|
||||
h6
|
||||
span.first_name_1 Comeren
|
||||
span.last_name_1 Diaz
|
||||
p.email_add_1 comeren@gmail.com
|
||||
a#v-pills-messages-tab.contact-tab-2.nav-link(data-bs-toggle='pill', onclick= 'activeDiv(2)', href='#v-pills-messages', role='tab', aria-controls='v-pills-messages', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle.update_img_2(src='../assets/images/user/1.jpg' alt='')
|
||||
.media-body
|
||||
h6
|
||||
span.first_name_2 Issa
|
||||
span.last_name_2 Bell
|
||||
p.email_add_2 issabell@gmail.com
|
||||
a#v-pills-settings-tab.contact-tab-3.nav-link(data-bs-toggle='pill', onclick= 'activeDiv(3)', href='#v-pills-settings', role='tab', aria-controls='v-pills-settings', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle.update_img_3(src='../assets/images/user/14.png' alt='')
|
||||
.media-body
|
||||
h6
|
||||
span.first_name_3 Andew
|
||||
span.last_name_3 Jon
|
||||
p.email_add_3 andewjon@gmail.com
|
||||
a#v-pills-contact1-tab.contact-tab-4.nav-link(data-bs-toggle='pill', onclick= 'activeDiv(4)', href='#v-pills-contact1', role='tab', aria-controls='v-pills-settings', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle.update_img_4(src='../assets/images/user/5.jpg' alt='')
|
||||
.media-body
|
||||
h6
|
||||
span.first_name_4 Jason
|
||||
span.last_name_4 Borne
|
||||
p.email_add_4 jasonb@gmail.com
|
||||
a#v-pills-contact8-tab.contact-tab-5.nav-link(data-bs-toggle='pill', onclick= 'activeDiv(5)', href='#v-pills-contact2', role='tab', aria-controls='v-pills-settings', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle.update_img_5(src='../assets/images/avtar/11.jpg' alt='')
|
||||
.media-body
|
||||
h6
|
||||
span.first_name_5 Monty
|
||||
span.last_name_5 Carlo
|
||||
p.email_add_5 monty@gmail.com
|
||||
a#v-pills-contact3-tab.contact-tab-6.nav-link(data-bs-toggle='pill', onclick= 'activeDiv(6)', href='#v-pills-contact3', role='tab', aria-controls='v-pills-settings', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle.update_img_6(src='../assets/images/avtar/16.jpg' alt='')
|
||||
.media-body
|
||||
h6
|
||||
span.first_name_6 Brock
|
||||
span.last_name_6 Lee
|
||||
p.email_add_6 lee@gmail.com
|
||||
.col-xl-8.xl-50.col-md-7
|
||||
#v-pills-tabContent.tab-content
|
||||
#v-pills-user.tab-pane.contact-tab-0.tab-content-child.fade.show.active(role='tabpanel', aria-labelledby='v-pills-user-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_0(src='../assets/images/user/2.png' alt='')
|
||||
input.updateimg(type='file', name='img', onchange='readURL(this,0)')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_0 Bucky
|
||||
span.last_name_0 Barnes
|
||||
p.email_add_0 barnes@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='editContact(0)') Edit
|
||||
li
|
||||
a(href='#', onclick='deleteContact(0)') Delete
|
||||
li
|
||||
a(href='#', onclick='history(0)') History
|
||||
li
|
||||
a(href='#', onclick='printContact(0)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6.mb-3 General
|
||||
ul
|
||||
li Name
|
||||
span.font-primary.first_name_0 Bucky
|
||||
li Gender
|
||||
span.font-primary Male
|
||||
li Birthday
|
||||
span.font-primary
|
||||
span.birth_day_0 18
|
||||
span.birth_month_0.ms-1 May
|
||||
span.birth_year_0.ms-1 1994
|
||||
li Personality
|
||||
span.font-primary.personality_0 Cool
|
||||
li City
|
||||
span.font-primary.city_0 moline acres
|
||||
li Mobile No
|
||||
span.font-primary.mobile_num_0 +0 1800 76855
|
||||
li Email Address
|
||||
span.font-primary.email_add_0 barnes@gmail.com
|
||||
li Website
|
||||
span.font-primary.url_add_0 www.test.com
|
||||
li Interest
|
||||
span.font-primary.interest_0 photography
|
||||
#v-pills-profile.tab-pane.contact-tab-1.tab-content-child.fade(role='tabpanel', aria-labelledby='v-pills-profile-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_1(src='../assets/images/user/8.jpg' alt='')
|
||||
input.updateimg(type='file', name='img', onchange='readURL(this,1)')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_1 Comeren
|
||||
span.last_name_1 Diaz
|
||||
p.email_add_1 comeren@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='editContact(1)') Edit
|
||||
li
|
||||
a(href='#', onclick='deleteContact(1)') Delete
|
||||
li
|
||||
a(href='#', onclick='history(1)') History
|
||||
li
|
||||
a(href='#', onclick='printContact(1)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6.mb-3 General
|
||||
ul
|
||||
li Name
|
||||
span.font-primary.first_name_1 Comeren
|
||||
li Gender
|
||||
span.font-primary Female
|
||||
li Birthday
|
||||
span.font-primary
|
||||
span.birth_day_1 7
|
||||
span.birth_month_1.ms-1 Feb
|
||||
span.birth_year_1.ms-1 1995
|
||||
li Personality
|
||||
span.font-primary.personality_1 Cool
|
||||
li City
|
||||
span.font-primary.city_1 Delhi
|
||||
li Mobile No
|
||||
span.font-primary.mobile_num_1 +0 1800 55812
|
||||
li Email Address
|
||||
span.font-primary.email_add_1 comeren@gmail.com
|
||||
li Website
|
||||
span.font-primary.url_add_1 www.cometest@.com
|
||||
li Interest
|
||||
span.font-primary.interest_1 sports
|
||||
#v-pills-messages.tab-pane.contact-tab-2.tab-content-child.fade(role='tabpanel', aria-labelledby='v-pills-messages-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_2(src='../assets/images/user/1.jpg' alt='')
|
||||
input.updateimg(type='file', name='img', onchange='readURL(this,2)')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_2 Issa
|
||||
span.last_name_2 Bell
|
||||
p.email_add_2 issabell@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='editContact(2)') Edit
|
||||
li
|
||||
a(href='#', onclick='deleteContact(2)') Delete
|
||||
li
|
||||
a(href='#', onclick='history(2)') History
|
||||
li
|
||||
a(href='#', onclick='printContact(2)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6.mb-3 General
|
||||
ul
|
||||
li Name
|
||||
span.font-primary.first_name_2 Issa
|
||||
li Gender
|
||||
span.font-primary Male
|
||||
li Birthday
|
||||
span.font-primary
|
||||
span.birth_day_2 20
|
||||
span.birth_month_2.ms-1 Jul
|
||||
span.birth_year_2.ms-1 1993
|
||||
li Personality
|
||||
span.font-primary.personality_2 Cool
|
||||
li City
|
||||
span.font-primary.city_2 Mumbai
|
||||
li Mobile No
|
||||
span.font-primary.mobile_num_2 +0 1800 87412
|
||||
li Email Address
|
||||
span.font-primary.email_add_2 issabell@gmail.com
|
||||
li Website
|
||||
span.font-primary.url_add_2 www.belltest@.com
|
||||
li Interest
|
||||
span.font-primary.interest_2 cooking
|
||||
#v-pills-settings.tab-pane.contact-tab-3.tab-content-child.fade(role='tabpanel', aria-labelledby='v-pills-settings-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_3(src='../assets/images/user/14.png' alt='')
|
||||
input.updateimg(type='file', name='img', onchange='readURL(this,3)')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_3 Andew
|
||||
span.last_name_3 Jon
|
||||
p.email_add_3 andewjon@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='editContact(3)') Edit
|
||||
li
|
||||
a(href='#', onclick='deleteContact(3)') Delete
|
||||
li
|
||||
a(href='#', onclick='history(3)') History
|
||||
li
|
||||
a(href='#', onclick='printContact(3)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6.mb-3 General
|
||||
ul
|
||||
li Name
|
||||
span.font-primary.first_name_3 Andew
|
||||
li Gender
|
||||
span.font-primary Male
|
||||
li Birthday
|
||||
span.font-primary
|
||||
span.birth_day_3 25
|
||||
span.birth_month_3.ms-1 Aug
|
||||
span.birth_year_3.ms-1 1996
|
||||
li Personality
|
||||
span.font-primary.personality_3 Cool
|
||||
li City
|
||||
span.font-primary.city_3 Amreli
|
||||
li Mobile No
|
||||
span.font-primary.mobile_num_3 +0 1800 79877
|
||||
li Email Address
|
||||
span.font-primary.email_add_3 andewjon@gmail.com
|
||||
li Website
|
||||
span.font-primary.url_add_3 www.test@.com
|
||||
li Interest
|
||||
span.font-primary.interest_3 photography
|
||||
#v-pills-contact1.tab-pane.contact-tab-4.tab-content-child.fade(role='tabpanel', aria-labelledby='v-pills-contact1-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_4(src='../assets/images/user/5.jpg' alt='')
|
||||
input.updateimg(type='file', name='img', onchange='readURL(this,4)')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_4 Jason
|
||||
span.last_name_4 Borne
|
||||
p.email_add_4 jasonb@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='editContact(4)') Edit
|
||||
li
|
||||
a(href='#', onclick='deleteContact(4)') Delete
|
||||
li
|
||||
a(href='#', onclick='history(4)') History
|
||||
li
|
||||
a(href='#', onclick='printContact(4)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6.mb-3 General
|
||||
ul
|
||||
li Name
|
||||
span.font-primary.first_name_4 Jason
|
||||
li Gender
|
||||
span.font-primary Male
|
||||
li Birthday
|
||||
span.font-primary
|
||||
span.birth_day_4 30
|
||||
span.birth_month_4.ms-1 Oct
|
||||
span.birth_year_4.ms-1 1992
|
||||
li Personality
|
||||
span.font-primary.personality_4 Cool
|
||||
li City
|
||||
span.font-primary.city_4 Delhi
|
||||
li Mobile No
|
||||
span.font-primary.mobile_num_4 +0 1800 11547
|
||||
li Email Address
|
||||
span.font-primary.email_add_4 jasonb@gmail.com
|
||||
li Website
|
||||
span.font-primary.url_add_4 www.jason@.com
|
||||
li Interest
|
||||
span.font-primary.interest_4 photography
|
||||
#v-pills-contact8.tab-pane.contact-tab-5.tab-content-child.fade(role='tabpanel', aria-labelledby='v-pills-contact1-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_5(src='../assets/images/avtar/11.jpg' alt='')
|
||||
input.updateimg(type='file', name='img', onchange='readURL(this,5)')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_5 Monty
|
||||
span.last_name_5 Carlo
|
||||
p.email_add_5 monty@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='editContact(5)') Edit
|
||||
li
|
||||
a(href='#', onclick='deleteContact(5)') Delete
|
||||
li
|
||||
a(href='#', onclick='history(5)') History
|
||||
li
|
||||
a(href='#', onclick='printContact(5)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6.mb-3 General
|
||||
ul
|
||||
li Name
|
||||
span.font-primary.first_name_5 Monty
|
||||
li Gender
|
||||
span.font-primary Male
|
||||
li Birthday
|
||||
span.font-primary
|
||||
span.birth_day_5 12
|
||||
span.birth_month_5.ms-1 Nov
|
||||
span.birth_year_5.ms-1 1994
|
||||
li Personality
|
||||
span.font-primary.personality_5 Cool
|
||||
li City
|
||||
span.font-primary.city_5 Amreli
|
||||
li Mobile No
|
||||
span.font-primary.mobile_num_5 +0 1800 87944
|
||||
li Email Address
|
||||
span.font-primary.email_add_5 monty@gmail.com
|
||||
li Website
|
||||
span.font-primary.url_add_5 www.mon@.com
|
||||
li Interest
|
||||
span.font-primary.interest_5 sports
|
||||
#v-pills-contact9.tab-pane.contact-tab-6.tab-content-child.fade(role='tabpanel', aria-labelledby='v-pills-contact8-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_6(src='../assets/images/avtar/16.jpg' alt='')
|
||||
input.updateimg(type='file', name='img', onchange='readURL(this,6)')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_6 Brock
|
||||
span.last_name_6 Lee
|
||||
p.email_add_6 lee@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='editContact(6)') Edit
|
||||
li
|
||||
a(href='#', onclick='deleteContact(6)') Delete
|
||||
li
|
||||
a(href='#', onclick='history(6)') History
|
||||
li
|
||||
a(href='#', onclick='printContact(6)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6.mb-3 General
|
||||
ul
|
||||
li Name
|
||||
span.font-primary.first_name_6 Brock
|
||||
li Gender
|
||||
span.font-primary Male
|
||||
li Birthday
|
||||
span.font-primary
|
||||
span.birth_day_6 8
|
||||
span.birth_month_6.ms-1 Dec
|
||||
span.birth_year_6.ms-1 1992
|
||||
li Personality
|
||||
span.font-primary.personality_6 Cool
|
||||
li City
|
||||
span.font-primary.city_6 Ahemdabad
|
||||
li Mobile No
|
||||
span.font-primary.mobile_num_6 +0 1800 58712
|
||||
li Email Address
|
||||
span.font-primary.email_add_6 lee@gmail.com
|
||||
li Website
|
||||
span.font-primary.url_add_6 www.lee.com
|
||||
li Interest
|
||||
span.font-primary.interest_6 photography
|
||||
.contact-editform.ps-0
|
||||
form
|
||||
.row.g-2
|
||||
.mt-0.mb-3.col-md-12
|
||||
label Name
|
||||
.row
|
||||
.col-sm-6
|
||||
input.form-control#first_name(type='text', required='', placeholder='First Name', value='first_name')
|
||||
.col-sm-6
|
||||
input.form-control#last_name(type='text', required='', placeholder='Last Name', value='last_name')
|
||||
.mt-0.mb-3.col-md-12
|
||||
label Email Address
|
||||
input.form-control#email_add(type='text', required='', autocomplete='off')
|
||||
.mt-0.mb-3.col-md-12
|
||||
label Phone
|
||||
.row
|
||||
.col-sm-6
|
||||
input.form-control#mobile_num(type='text', required='', autocomplete='off')
|
||||
.col-sm-6
|
||||
select.form-control
|
||||
option Mobile
|
||||
option Work
|
||||
option Others
|
||||
.row.g-2.more-data
|
||||
.mt-0.mb-3.col-md-12
|
||||
label URLS
|
||||
.row
|
||||
.col-lg-6.col-sm-6
|
||||
input.form-control#url_add(type='text', required='')
|
||||
.col-lg-4.col-sm-6
|
||||
select.js-example-basic-single
|
||||
option(value='pw') Personal web address
|
||||
option(value='cw') Company web address
|
||||
option(value='fb') Fabebook URL
|
||||
option(value='tw') Twitter URL
|
||||
.mt-0.mb-3.col-md-12
|
||||
label Personal
|
||||
.d-block
|
||||
label.me-3(for='edo-ani')
|
||||
input#edo-ani.radio_animated(type='radio', name='rdo-ani' checked='')
|
||||
span Male
|
||||
label(for='edo-ani1')
|
||||
input#edo-ani1.radio_animated(type='radio', name='rdo-ani')
|
||||
span Female
|
||||
.mt-0.mb-3.col-md-12
|
||||
.row
|
||||
.col-lg-2.col-sm-4
|
||||
select.form-control#birth_day
|
||||
option.f-w-600 Day
|
||||
option 01
|
||||
option 02
|
||||
option 03
|
||||
option 04
|
||||
option 05
|
||||
option 06
|
||||
option 07
|
||||
option 08
|
||||
option 09
|
||||
option 10
|
||||
option 11
|
||||
option 12
|
||||
option 13
|
||||
option 14
|
||||
option 15
|
||||
option 16
|
||||
option 17
|
||||
option 18
|
||||
option 19
|
||||
option 20
|
||||
option 21
|
||||
option 22
|
||||
option 23
|
||||
option 24
|
||||
option 25
|
||||
option 26
|
||||
option 27
|
||||
option 28
|
||||
option 29
|
||||
option 30
|
||||
option 31
|
||||
.col-lg-3.col-sm-4
|
||||
select.form-control#birth_month
|
||||
option.f-w-600 Month
|
||||
option January
|
||||
option February
|
||||
option March
|
||||
option April
|
||||
option May
|
||||
option June
|
||||
option July
|
||||
option August
|
||||
option September
|
||||
option October
|
||||
option November
|
||||
option December
|
||||
.col-lg-3.col-sm-4
|
||||
input.form-control#birth_year(type='text')
|
||||
.mt-0.mb-3.col-md-12
|
||||
|
||||
.row
|
||||
.col-sm-6
|
||||
label Personality
|
||||
input.form-control#personality(type='text', required='', autocomplete='off')
|
||||
.col-sm-6
|
||||
label Interest
|
||||
input.form-control#interest(type='text', required='', autocomplete='off')
|
||||
.mb-3.col-md-12
|
||||
label Home Address
|
||||
.row
|
||||
.col-12
|
||||
.mb-2
|
||||
input.form-control(type='text', placeholder='Address')
|
||||
.col-sm-6
|
||||
.mb-2
|
||||
input.form-control#city(type='text', placeholder='City')
|
||||
.col-sm-6
|
||||
.mb-2
|
||||
input.form-control(type='text', placeholder='State')
|
||||
.col-sm-6
|
||||
div
|
||||
input.form-control(type='text', placeholder='Country')
|
||||
.col-sm-6
|
||||
div
|
||||
input.form-control(type='text', placeholder='Pin Code')
|
||||
a.ps-0.edit-information(href='#') Edit more information
|
||||
button.btn.btn-secondary.update-contact(type='button') Save
|
||||
button.btn.btn-primary(type='button', data-bs-dismiss='modal') Cancel
|
||||
#pills-organization.fade.tab-pane(role='tabpanel', aria-labelledby='pills-organization')
|
||||
.card.mb-0
|
||||
.card-header.d-flex
|
||||
h5 Organization
|
||||
span.f-14.pull-right.mt-0 10 Contacts
|
||||
.card-body.p-0
|
||||
.row.list-persons
|
||||
.col-xl-4.xl-50.col-md-5
|
||||
#v-pills-tab1.nav.flex-column.nav-pills(role='tablist', aria-orientation='vertical')
|
||||
a#v-pills-iduser-tab.nav-link.active(data-bs-toggle='pill', href='#v-pills-iduser', role='tab', aria-controls='v-pills-iduser', aria-selected='true')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle(src='../assets/images/user/user.png' alt='')
|
||||
.media-body
|
||||
h6 Mark jecno
|
||||
p markjecno@gmail.com
|
||||
a#v-pills-iduser1-tab.nav-link(data-bs-toggle='pill', href='#v-pills-iduser1', role='tab', aria-controls='v-pills-iduser1', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle(src='../assets/images/user/3.jpg' alt='')
|
||||
.media-body
|
||||
h6 Jason Borne
|
||||
p jasonb@gmail.com
|
||||
a#v-pills-iduser2-tab.nav-link(data-bs-toggle='pill', href='#v-pills-iduser2', role='tab', aria-controls='v-pills-iduser2', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle(src='../assets/images/user/4.jpg' alt='')
|
||||
.media-body
|
||||
h6 Sarah Loren
|
||||
p barnes@gmail.com
|
||||
a#v-pills-iduser3-tab.nav-link(data-bs-toggle='pill', href='#v-pills-iduser3', role='tab', aria-controls='v-pills-iduser3', aria-selected='false')
|
||||
.media
|
||||
img.img-50.img-fluid.m-r-20.rounded-circle(src='../assets/images/user/10.jpg' alt='')
|
||||
.media-body
|
||||
h6 Andew Jon
|
||||
p andrewj@gmail.com
|
||||
.col-xl-8.xl-50.col-md-7
|
||||
#v-pills-tabContent1.tab-content
|
||||
#v-pills-iduser.tab-pane.fade.show.active(role='tabpanel', aria-labelledby='v-pills-iduser-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_5(src='../assets/images/user/user.png' alt='')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_5 Mark
|
||||
span.last_name_5 jecno
|
||||
p.email_add_5 markjecno@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='printContact(5)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6 General
|
||||
p Email Address:
|
||||
span.font-primary.email_add_5 markjecno@gmail.com
|
||||
.gender
|
||||
h6 Personal
|
||||
p Gender:
|
||||
span Male
|
||||
#v-pills-iduser1.tab-pane.fade(role='tabpanel', aria-labelledby='v-pills-iduser1-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_6(src='../assets/images/user/3.jpg' alt='')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_6 Jason
|
||||
span.last_name_6 Borne
|
||||
p.email_add_6 jasonb@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='printContact(6)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6 General
|
||||
p Email Address:
|
||||
span.font-primary.email_add_6 jasonb@gmail.com
|
||||
.gender
|
||||
h6 Personal
|
||||
p Gender:
|
||||
span Male
|
||||
#v-pills-iduser2.tab-pane.fade(role='tabpanel', aria-labelledby='v-pills-iduser2-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_7(src='../assets/images/user/4.jpg' alt='')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_7 Sarah
|
||||
span.last_name_7 Loren
|
||||
p.email_add_7 barnes@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='printContact(7)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6 General
|
||||
p Email Address:
|
||||
span.font-primary.email_add_7 barnes@gmail.com
|
||||
.gender
|
||||
h6 Personal
|
||||
p Gender:
|
||||
span Female
|
||||
#v-pills-iduser3.tab-pane.fade(role='tabpanel', aria-labelledby='v-pills-iduser3-tab')
|
||||
.profile-mail
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle.update_img_8(src='../assets/images/user/10.jpg' alt='')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span.first_name_8 Andew
|
||||
span.last_name_8 Jon
|
||||
p.email_add_8 andrewj@gmail.com
|
||||
ul
|
||||
li
|
||||
a(href='#', onclick='printContact(8)', data-bs-toggle='modal', data-bs-target='#printModal') Print
|
||||
.email-general
|
||||
h6 General
|
||||
p Email Address:
|
||||
span.font-primary.email_add_8 andrewj@gmail.com
|
||||
.gender
|
||||
h6 Personal
|
||||
p Gender:
|
||||
span Female
|
||||
#right-history
|
||||
.modal-header.p-l-20.p-r-20
|
||||
h6.modal-title.w-100 Contact History
|
||||
span.pull-right
|
||||
a.closehistory(href='#')
|
||||
i.icofont.icofont-close
|
||||
.history-details
|
||||
.text-center
|
||||
i.icofont.icofont-ui-edit
|
||||
p Contact has not been modified yet.
|
||||
.media
|
||||
i.icofont.icofont-star.me-3
|
||||
.media-body.mt-0
|
||||
h6.mt-0 Contact Created
|
||||
p.mb-0 Contact is created via mail
|
||||
span.f-12 Sep 10, 2019 4:00
|
||||
#printModal.modal.fade.modal-bookmark(tabindex='-1', role='dialog', aria-hidden='true')
|
||||
.modal-dialog.modal-dialog-centered(role='document')
|
||||
.modal-content
|
||||
.modal-header
|
||||
h5.modal-title Print preview
|
||||
button.btn-close(type='button', data-bs-dismiss='modal', aria-label='Close')
|
||||
.modal-body.list-persons
|
||||
.profile-mail.pt-0#DivIdToPrint
|
||||
.media
|
||||
img.img-100.img-fluid.m-r-20.rounded-circle#updateimg(src='../assets/images/user/2.png' alt='')
|
||||
.media-body.mt-0
|
||||
h5
|
||||
span#printname Bucky
|
||||
span#printlast Barnes
|
||||
p#printmail barnes@gmail.com
|
||||
.email-general
|
||||
h6 General
|
||||
p Email Address:
|
||||
span.font-primary#mailadd barnes@gmail.com
|
||||
button.btn.btn-secondary#btnPrint(type='button', onclick='printDiv();') Print
|
||||
button.btn.btn-primary(type='button', data-bs-dismiss='modal') Cancel
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
124
static/admin/assets/pug/pages/theme/creative-card.pug
Normal file
124
static/admin/assets/pug/pages/theme/creative-card.pug
Normal file
@@ -0,0 +1,124 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Creative Card
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Bonus Ui
|
||||
li.breadcrumb-item.active Creative Card
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-l-primary
|
||||
h5 Border left
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-r-secondary
|
||||
h5 Border right
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-t-success
|
||||
h5 Border top
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-b-info
|
||||
h5 Border bottom
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-l-warning
|
||||
h5 Border color state
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-l-danger
|
||||
h5 Border color state
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-l-light
|
||||
h5 Border color state
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-l-primary
|
||||
h5 Border color state
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-l-secondary.border-2
|
||||
h5 Border color state
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header.b-l-primary.border-3
|
||||
h5 Border color state
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card.card-absolute
|
||||
.card-header.bg-primary
|
||||
h5.text-white Absolute Style
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card.card-absolute
|
||||
.card-header.bg-secondary
|
||||
h5.text-white Color state
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
643
static/admin/assets/pug/pages/theme/dashboard-02.pug
Normal file
643
static/admin/assets/pug/pages/theme/dashboard-02.pug
Normal file
@@ -0,0 +1,643 @@
|
||||
- var apex = true;
|
||||
- var theme_customizer = true;
|
||||
- var dashboard_2 = true;
|
||||
- var animate = true;
|
||||
- var counter = true;
|
||||
- var wow = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| E-Commerce Dashboard
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Dashboard
|
||||
li.breadcrumb-item.active E-Commerce
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row.size-column
|
||||
.col-xxl-10.col-md-12.box-col-8.grid-ed-12
|
||||
.row
|
||||
.col-xxl-5.col-md-7.box-col-7
|
||||
.row
|
||||
.col-sm-12
|
||||
.card.o-hidden
|
||||
.card-body.balance-widget
|
||||
span.f-w-500.f-light Total Balance
|
||||
h4.mb-3.mt-1.f-w-500.mb-0.f-22 $
|
||||
span.counter 245,154.00
|
||||
span.f-light.f-14.f-w-400.ms-1 this month
|
||||
a(href="#").purchase-btn.btn.btn-primary.btn-hover-effect.f-w-500 Tap Up Balance
|
||||
.mobile-right-img
|
||||
img.left-mobile-img(src="../assets/images/dashboard-2/widget-img.png", alt="")
|
||||
img.mobile-img(src="../assets/images/dashboard-2/mobile.gif", alt="mobile with coin")
|
||||
.col-6
|
||||
.card.small-widget
|
||||
.card-body.primary
|
||||
span.f-light New Orders
|
||||
.d-flex.align-items-end.gap-1
|
||||
h4 2,435
|
||||
span.font-primary.f-12.f-w-500
|
||||
i.icon-arrow-up
|
||||
span +50%
|
||||
.bg-gradient
|
||||
svg.stroke-icon.svg-fill
|
||||
use(href='../assets/svg/icon-sprite.svg#new-order')
|
||||
.col-6
|
||||
.card.small-widget
|
||||
.card-body.warning
|
||||
span.f-light New Customers
|
||||
.d-flex.align-items-end.gap-1
|
||||
h4 2,908
|
||||
span.font-warning.f-12.f-w-500
|
||||
i.icon-arrow-up
|
||||
span +20%
|
||||
.bg-gradient
|
||||
svg.stroke-icon.svg-fill
|
||||
use(href='../assets/svg/icon-sprite.svg#customers')
|
||||
.col-6
|
||||
.card.small-widget
|
||||
.card-body.secondary
|
||||
span.f-light Average Sale
|
||||
.d-flex.align-items-end.gap-1
|
||||
h4 $389k
|
||||
span.font-secondary.f-12.f-w-500
|
||||
i.icon-arrow-down
|
||||
span -10%
|
||||
.bg-gradient
|
||||
svg.stroke-icon.svg-fill
|
||||
use(href='../assets/svg/icon-sprite.svg#sale')
|
||||
.col-6
|
||||
.card.small-widget
|
||||
.card-body.success
|
||||
span.f-light Gross Profit
|
||||
.d-flex.align-items-end.gap-1
|
||||
h4 $3,908
|
||||
span.font-success.f-12.f-w-500
|
||||
i.icon-arrow-up
|
||||
span +80%
|
||||
.bg-gradient
|
||||
svg.stroke-icon.svg-fill
|
||||
use(href='../assets/svg/icon-sprite.svg#profit')
|
||||
.col-xxl-3.col-md-5.col-sm-6.box-col-5
|
||||
.appointment
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Valuable Customer
|
||||
.card-header-right-icon
|
||||
.dropdown.icon-dropdown
|
||||
button#dropdownMenuButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='dropdownMenuButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.appointment-table.customer-table.table-responsive
|
||||
table.table.table-bordernone
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/1.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").f-w-500 Jane Cooper
|
||||
span.f-light alma.lawson@gmail.com
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/2.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").f-w-500 Cameron Willia
|
||||
span.f-light tim.jennings@gmail.com
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/9.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").f-w-500 Floyd Miles
|
||||
span.f-light kenzi.lawson@gmail.com
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/5.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").f-w-500 Dianne Russell
|
||||
span.f-light curtis.weaver@gmail.com
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/3.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").f-w-500 Guy Hawkins
|
||||
span.f-light curtis.weaver@gmail.com
|
||||
.col-xxl-4.col-sm-6.box-col-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Order this month
|
||||
.card-header-right-icon
|
||||
.dropdown.icon-dropdown
|
||||
button#orderButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='orderButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.light-card.balance-card.d-inline-block
|
||||
h4.mb-0 $12,000
|
||||
span.f-light.f-14 (15,080 To Goal)
|
||||
.order-wrapper
|
||||
#order-goal
|
||||
.col-xxl-3.col-md-6.box-col-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 Monthly Profits
|
||||
span.f-light.f-w-500.f-14 (Total profit growth of 30%)
|
||||
.card-body.pt-0
|
||||
.monthly-profit
|
||||
#profitmonthly
|
||||
.col-xxl-9.box-col-12
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 Order Overview
|
||||
.card-body.pt-0
|
||||
.row.m-0.overall-card.overview-card
|
||||
.col-xl-9.col-md-8.col-sm-7.p-0.box-col-7
|
||||
.chart-right
|
||||
.row
|
||||
.col-xl-12
|
||||
.card-body.p-0
|
||||
ul.balance-data
|
||||
li
|
||||
span.circle.bg-secondary
|
||||
span.f-light.ms-1 Refunds
|
||||
li
|
||||
span.circle.bg-primary
|
||||
span.f-light.ms-1 Earning
|
||||
li
|
||||
span.circle.bg-success
|
||||
span.f-light.ms-1 Order
|
||||
.current-sale-container.order-container
|
||||
#orderoverview.overview-wrapper
|
||||
.back-bar-container
|
||||
#order-bar
|
||||
.col-xl-3.col-md-4.col-sm-5.p-0.box-col-5
|
||||
.row.g-sm-3.g-2
|
||||
.col-md-12
|
||||
.light-card.balance-card.widget-hover
|
||||
.svg-box
|
||||
svg.svg-fill
|
||||
use(href='../assets/svg/icon-sprite.svg#orders')
|
||||
div
|
||||
span.f-light Orders
|
||||
h6.mt-1.mb-0 10,098
|
||||
.ms-auto.text-end
|
||||
.dropdown.icon-dropdown
|
||||
button#orderdropdown.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='orderdropdown')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.col-md-12
|
||||
.light-card.balance-card.widget-hover
|
||||
.svg-box
|
||||
svg.svg-fill
|
||||
use(href='../assets/svg/icon-sprite.svg#expense')
|
||||
div
|
||||
span.f-light Earning
|
||||
h6.mt-1.mb-0 $12,678
|
||||
.ms-auto.text-end
|
||||
.dropdown.icon-dropdown
|
||||
button#earningdropdown.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='earningdropdown')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.col-md-12
|
||||
.light-card.balance-card.widget-hover
|
||||
.svg-box
|
||||
svg.svg-fill
|
||||
use(href='../assets/svg/icon-sprite.svg#doller-return')
|
||||
div
|
||||
span.f-light Refunds
|
||||
h6.mt-1.mb-0 3,001
|
||||
.ms-auto.text-end
|
||||
.dropdown.icon-dropdown
|
||||
button#incomedropdown.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='incomedropdown')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.col-xxl-3.col-xl-4.col-sm-6.box-col-6.wow.zoomIn
|
||||
.card.purchase-card.discover
|
||||
img.img-fluid(src="../assets/images/dashboard-2/discover.png", alt="vector discover")
|
||||
.card-body.pt-3
|
||||
h5.mb-1 Discover Pro
|
||||
p.f-light Amet minim mollit non deserunt ullamco est sit aliqua dolor
|
||||
a.purchase-btn.btn.btn-hover-effect.btn-primary.f-w-500(href="https://1.envato.market/3GVzd" target="_blank") Update Now
|
||||
.col-xxl-4.col-xl-4.col-sm-6.box-col-6
|
||||
.card.visitor-card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Visitors
|
||||
span.f-14.font-primary.f-w-500.ms-1
|
||||
svg.svg-fill.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#user-visitor')
|
||||
| (+2.8)
|
||||
.card-header-right-icon
|
||||
.dropdown.icon-dropdown
|
||||
button#visitorButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='visitorButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.visitors-container
|
||||
#visitor-chart
|
||||
.col-xxl-5.col-xl-4.box-col-12
|
||||
.card.recent-order
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Recent Orders
|
||||
.card-header-right-icon
|
||||
.dropdown.icon-dropdown
|
||||
button#recentButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='recentButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.recent-sliders
|
||||
.nav.nav-pills(id="v-pills-tab" role="tablist")
|
||||
button.active(id="v-pills-shirt-tab" data-bs-toggle="pill" data-bs-target="#v-pills-shirt" type="button" role="tab" aria-controls="v-pills-shirt" aria-selected="true").frame-box
|
||||
span.frame-image
|
||||
img(src="../assets/images/dashboard-2/order/1.png", alt="vector T-shirt")
|
||||
button(id="v-pills-television-tab" data-bs-toggle="pill" data-bs-target="#v-pills-television" type="button" role="tab" aria-controls="v-pills-television" aria-selected="false").frame-box
|
||||
span.frame-image
|
||||
img(src="../assets/images/dashboard-2/order/2.png", alt="vector television")
|
||||
button(id="v-pills-headphone-tab" data-bs-toggle="pill" data-bs-target="#v-pills-headphone" type="button" role="tab" aria-controls="v-pills-headphone" aria-selected="false").frame-box
|
||||
span.frame-image
|
||||
img(src="../assets/images/dashboard-2/order/3.png", alt="vector headphone")
|
||||
button(id="v-pills-chair-tab" data-bs-toggle="pill" data-bs-target="#v-pills-chair" type="button" role="tab" aria-controls="v-pills-chair" aria-selected="false").frame-box
|
||||
span.frame-image
|
||||
img(src="../assets/images/dashboard-2/order/4.png", alt="vector chair")
|
||||
button(id="v-pills-lamp-tab" data-bs-toggle="pill" data-bs-target="#v-pills-lamp" type="button" role="tab" aria-controls="v-pills-lamp" aria-selected="false").frame-box
|
||||
span.frame-image
|
||||
img(src="../assets/images/dashboard-2/order/5.png", alt="vector lamp")
|
||||
.tab-content(id="v-pills-tabContent")
|
||||
div.tab-pane.fade.show.active(id="v-pills-shirt" role="tabpanel" aria-labelledby="v-pills-shirt-tab")
|
||||
.recent-table.table-responsive
|
||||
table.table
|
||||
thead
|
||||
tr
|
||||
th.f-light Item
|
||||
th.f-light Qty
|
||||
th.f-light Price
|
||||
th.f-light Status
|
||||
th.f-light Total Price
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/4.png", alt="t-shirt")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") T-shirt
|
||||
span.f-light.f-12 Id : #CFDE-2163
|
||||
td.f-w-500 X1
|
||||
td.f-w-500 $56.00
|
||||
td.f-w-500
|
||||
.recent-status.font-success
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Verified
|
||||
td.f-w-500 $100.00
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/3.png", alt="t-shirt")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Pink T-shirt
|
||||
span.f-light.f-12 Id : #CFDE-2780
|
||||
td.f-w-500 X2
|
||||
td.f-w-500 $156.00
|
||||
td.f-w-500
|
||||
.recent-status.font-danger
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Rejected
|
||||
td.f-w-500 $870.00
|
||||
div.tab-pane.fade(id="v-pills-television" role="tabpanel" aria-labelledby="v-pills-television-tab")
|
||||
.recent-table.table-responsive
|
||||
table.table
|
||||
thead
|
||||
tr
|
||||
th.f-light Item
|
||||
th.f-light Qty
|
||||
th.f-light Price
|
||||
th.f-light Status
|
||||
th.f-light Total Price
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/5.png", alt="television")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Sony
|
||||
span.f-light.f-12 Id : #CFDE-2163
|
||||
td.f-w-500 X1
|
||||
td.f-w-500 $56.00
|
||||
td.f-w-500
|
||||
.recent-status.font-danger
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Rejected
|
||||
td.f-w-500 $390.00
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/6.png", alt="television")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Samsung
|
||||
span.f-light.f-12 Id : #CFDE-2780
|
||||
td.f-w-500 X2
|
||||
td.f-w-500 $100.00
|
||||
td.f-w-500
|
||||
.recent-status.font-success
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Verified
|
||||
td.f-w-500 $870.00
|
||||
div.tab-pane.fade(id="v-pills-headphone" role="tabpanel" aria-labelledby="v-pills-headphone-tab")
|
||||
.recent-table.table-responsive
|
||||
table.table
|
||||
thead
|
||||
tr
|
||||
th.f-light Item
|
||||
th.f-light Qty
|
||||
th.f-light Price
|
||||
th.f-light Status
|
||||
th.f-light Total Price
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/1.png", alt="headephones")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Sony
|
||||
span.f-light.f-12 Id : #CFDE-2163
|
||||
td.f-w-500 X1
|
||||
td.f-w-500 $56.00
|
||||
td.f-w-500
|
||||
.recent-status.font-success
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Verified
|
||||
td.f-w-500 $100.00
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/2.png", alt="headephones")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Sennheiser
|
||||
span.f-light.f-12 Id : #CFDE-2780
|
||||
td.f-w-500 X2
|
||||
td.f-w-500 $156.00
|
||||
td.f-w-500
|
||||
.recent-status.font-danger
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Rejected
|
||||
td.f-w-500 $100.00
|
||||
div.tab-pane.fade(id="v-pills-chair" role="tabpanel" aria-labelledby="v-pills-chair-tab")
|
||||
.recent-table.table-responsive
|
||||
table.table
|
||||
thead
|
||||
tr
|
||||
th.f-light Item
|
||||
th.f-light Qty
|
||||
th.f-light Price
|
||||
th.f-light Status
|
||||
th.f-light Total Price
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/7.png", alt="chair")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Chair
|
||||
span.f-light.f-12 Id : #CFDE-2163
|
||||
td.f-w-500 X1
|
||||
td.f-w-500 $48.00
|
||||
td.f-w-500
|
||||
.recent-status.font-success
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Verified
|
||||
td.f-w-500 $50.00
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/8.png", alt="chair")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Office chair
|
||||
span.f-light.f-12 Id : #CFDE-2780
|
||||
td.f-w-500 X2
|
||||
td.f-w-500 $73.00
|
||||
td.f-w-500
|
||||
.recent-status.font-danger
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Rejected
|
||||
td.f-w-500 $75.00
|
||||
div.tab-pane.fade(id="v-pills-lamp" role="tabpanel" aria-labelledby="v-pills-lamp-tab")
|
||||
.recent-table.table-responsive
|
||||
table.table
|
||||
thead
|
||||
tr
|
||||
th.f-light Item
|
||||
th.f-light Qty
|
||||
th.f-light Price
|
||||
th.f-light Status
|
||||
th.f-light Total Price
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/9.png", alt="lamp")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Lamp
|
||||
span.f-light.f-12 Id : #CFDE-2163
|
||||
td.f-w-500 X1
|
||||
td.f-w-500 $20.00
|
||||
td.f-w-500
|
||||
.recent-status.font-success
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Verified
|
||||
td.f-w-500 $25.00
|
||||
tr
|
||||
td
|
||||
div.product-content
|
||||
.order-image
|
||||
img(src="../assets/images/dashboard-2/order/sub-product/10.png", alt="lamp")
|
||||
div
|
||||
h6.f-14.mb-0
|
||||
a(href="order-history.html") Bedside lamp
|
||||
span.f-light.f-12 Id : #CFDE-2780
|
||||
td.f-w-500 X2
|
||||
td.f-w-500 $70.00
|
||||
td.f-w-500
|
||||
.recent-status.font-danger
|
||||
svg.me-1
|
||||
use(href='../assets/svg/icon-sprite.svg#24-hour')
|
||||
| Rejected
|
||||
td.f-w-500 $88.00
|
||||
.col-xxl-2.col-xl-3.col-md-4.grid-ed-none.box-col-4e.d-xxl-block.d-none
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
h5 Top Categories
|
||||
.card-body.pt-0
|
||||
ul.categories-list
|
||||
li.d-flex
|
||||
.bg-light
|
||||
img(src="../assets/images/dashboard-2/category/1.png", alt="vector burger")
|
||||
div
|
||||
h6.mb-0
|
||||
a(href="product.html") Food & Drinks
|
||||
span.f-light.f-12.f-w-500 (12,200)
|
||||
li.d-flex
|
||||
.bg-light
|
||||
img(src="../assets/images/dashboard-2/category/2.png", alt="vector furniture")
|
||||
div
|
||||
h6.mb-0
|
||||
a(href="product.html") Furniture
|
||||
span.f-light.f-12.f-w-500 (7,510)
|
||||
li.d-flex
|
||||
.bg-light
|
||||
img(src="../assets/images/dashboard-2/category/3.png", alt="vector grocery box")
|
||||
div
|
||||
h6.mb-0
|
||||
a(href="product.html") Grocery
|
||||
span.f-light.f-12.f-w-500 (15,475)
|
||||
li.d-flex
|
||||
.bg-light
|
||||
img(src="../assets/images/dashboard-2/category/4.png", alt="vector game remote")
|
||||
div
|
||||
h6.mb-0
|
||||
a(href="product.html") Electronics
|
||||
span.f-light.f-12.f-w-500 (27,840)
|
||||
li.d-flex
|
||||
.bg-light
|
||||
img(src="../assets/images/dashboard-2/category/5.png", alt="vector toys")
|
||||
div
|
||||
h6.mb-0
|
||||
a(href="product.html") Toys & Games
|
||||
span.f-light.f-12.f-w-500 (8,788)
|
||||
li.d-flex
|
||||
.bg-light
|
||||
img(src="../assets/images/dashboard-2/category/6.png", alt="vector monitor")
|
||||
div
|
||||
h6.mb-0
|
||||
a(href="product.html") Desktop
|
||||
span.f-light.f-12.f-w-500 (10,673)
|
||||
li.d-flex
|
||||
.bg-light
|
||||
img(src="../assets/images/dashboard-2/category/7.png", alt="vector mobile")
|
||||
div
|
||||
h6.mb-0
|
||||
a(href="product.html") Mobile & Accessories
|
||||
span.f-light.f-12.f-w-500 (5,129)
|
||||
div.recent-activity.notification
|
||||
h5 Recent Activity
|
||||
ul
|
||||
li.d-flex
|
||||
.activity-dot-primary
|
||||
.w-100.ms-3
|
||||
p.d-flex.justify-content-between.mb-2
|
||||
span.date-content.light-background 8th March, 2022
|
||||
h6 Added Bew Items
|
||||
span.dot-notification
|
||||
span.f-light Quisque a consequat ante sit amet magna...
|
||||
.recent-images
|
||||
ul
|
||||
li
|
||||
.recent-img-wrap
|
||||
img(src="../assets/images/dashboard-2/product/1.png", alt="chair")
|
||||
li
|
||||
.recent-img-wrap
|
||||
img(src="../assets/images/dashboard-2/product/2.png", alt="chair")
|
||||
li
|
||||
.recent-img-wrap
|
||||
img(src="../assets/images/dashboard-2/product/3.png", alt="men t-shirt")
|
||||
li.d-flex
|
||||
.activity-dot-warning
|
||||
.w-100.ms-3
|
||||
p.d-flex.justify-content-between.mb-2
|
||||
span.date-content.light-background 2nd Sep, Today
|
||||
h6 Anamika Comments this Poducts
|
||||
span.dot-notification
|
||||
span Quisque a consequat ante sit amet magna...
|
||||
li.d-flex
|
||||
.activity-dot-secondary
|
||||
.w-100.ms-3
|
||||
p.d-flex.justify-content-between.mb-2
|
||||
span.date-content.light-background 3nd Sep, 2022
|
||||
h6 Jacksion Purchase
|
||||
span.dot-notification
|
||||
span Quisque a consequat ante sit amet magna...
|
||||
li.d-flex
|
||||
.activity-dot-success
|
||||
.w-100.ms-3
|
||||
p.d-flex.justify-content-between.mb-2
|
||||
span.date-content.light-background 2nd Sep, Today
|
||||
h6 Anamika Comments this Poducts
|
||||
span.dot-notification
|
||||
span Quisque a consequat ante sit amet magna...
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
script.
|
||||
new WOW().init();
|
||||
312
static/admin/assets/pug/pages/theme/dashboard-03.pug
Normal file
312
static/admin/assets/pug/pages/theme/dashboard-03.pug
Normal file
@@ -0,0 +1,312 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var apexmoment = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
- var apex = true;
|
||||
- var dashboard_3 = true;
|
||||
- var date_picker = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Online course
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Dashboard
|
||||
li.breadcrumb-item.active Online course
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xxl-5.col-ed-6.col-xl-8.box-col-7
|
||||
.row
|
||||
.col-sm-12
|
||||
.card.o-hidden.welcome-card
|
||||
.card-body
|
||||
h4.mb-3.mt-1.f-w-500.mb-0.f-22 Hello Jashmin
|
||||
span
|
||||
img(src="../assets/images/dashboard-3/hand.svg", alt="hand vector")
|
||||
p Learn something new every day with world's best courses.Free online courses available.
|
||||
img.welcome-img(src="../assets/images/dashboard-3/widget.svg", alt="search image")
|
||||
.col-sm-6
|
||||
.card.course-box
|
||||
.card-body
|
||||
.course-widget
|
||||
.course-icon
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#course-1')
|
||||
div
|
||||
h4.mb-0 100+
|
||||
span.f-light Completed Courses
|
||||
a.btn.btn-light(href="learning-list-view.html").f-light View course
|
||||
span.ms-2
|
||||
svg.fill-icon.f-light
|
||||
use(href='../assets/svg/icon-sprite.svg#arrowright')
|
||||
ul.square-group
|
||||
li.square-1.warning
|
||||
li.square-1.primary
|
||||
li.square-2.warning1
|
||||
li.square-3.danger
|
||||
li.square-4.light
|
||||
li.square-5.warning
|
||||
li.square-6.success
|
||||
li.square-7.success
|
||||
.col-sm-6
|
||||
.card.course-box
|
||||
.card-body
|
||||
.course-widget
|
||||
.course-icon.warning
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#course-2')
|
||||
div
|
||||
h4.mb-0 50+
|
||||
span.f-light In Progress Courses
|
||||
a.btn.btn-light(href="learning-list-view.html").f-light View course
|
||||
span.ms-2
|
||||
svg.fill-icon.f-light
|
||||
use(href='../assets/svg/icon-sprite.svg#arrowright')
|
||||
ul.square-group
|
||||
li.square-1.warning
|
||||
li.square-1.primary
|
||||
li.square-2.warning1
|
||||
li.square-3.danger
|
||||
li.square-4.light
|
||||
li.square-5.warning
|
||||
li.square-6.success
|
||||
li.square-7.success
|
||||
.col-xxl-2.col-ed-3.col-xl-4.col-sm-6.box-col-5
|
||||
.card.get-card
|
||||
.card-header.card-no-border
|
||||
h5 Today Progress
|
||||
span.f-14.f-w-500.f-light Your Daily Goal Almost Done!
|
||||
.card-body.pt-0
|
||||
.progress-chart-wrap
|
||||
#progresschart
|
||||
.col-xl-2.col-ed-3.d-xxl-block.d-sm-none.box-col-none
|
||||
.card.get-card.overflow-hidden
|
||||
.card-header.card-no-border
|
||||
h5 Do You Want to Get
|
||||
span.f-14.f-w-500.f-light Better Results?
|
||||
a.btn.btn-primary.btn-hover-effect(href="#") More details
|
||||
span.ms-1
|
||||
svg.fill-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#arrowright')
|
||||
.card-body.pt-0
|
||||
.get-image.text-center
|
||||
img.img-fluid(src="../assets/images/dashboard-3/better.png", alt="leptop with men vector")
|
||||
ul.square-group
|
||||
li.square-1.warning
|
||||
li.square-1.primary
|
||||
li.square-2.warning1
|
||||
li.square-3.danger
|
||||
li.square-4.light
|
||||
li.square-5.warning
|
||||
li.square-6.success
|
||||
li.square-7.success
|
||||
.col-xxl-3.col-ed-5.col-xl-5.col-sm-6.box-col-5
|
||||
.card
|
||||
.card-body
|
||||
.default-datepicker
|
||||
.datepicker-here(data-language='en')
|
||||
.col-xxl-5.col-ed-7.col-xl-7.box-col-7
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Learning Overview
|
||||
span.f-14.f-w-500.ms-1.f-light
|
||||
| (75% activity growth)
|
||||
.card-header-right-icon
|
||||
.dropdown.icon-dropdown
|
||||
button#learningButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='learningButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.learning-wrap
|
||||
#learning-chart
|
||||
.col-xxl-4.col-ed-7.col-xl-7.col-md-6.box-col-7
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5 Activity Hours
|
||||
.dropdown.icon-dropdown
|
||||
button#activitydropdown.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='activitydropdown')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.row.m-0.overall-card
|
||||
.col-xl-8
|
||||
.chart-right
|
||||
.row
|
||||
.col-xl-12
|
||||
.card-body.p-0
|
||||
.activity-wrap
|
||||
#activity-chart
|
||||
.col-xl-4.p-0
|
||||
.row.g-sm-3.g-2.mt-0
|
||||
.col-xl-12.col-md-6.col-sm-4
|
||||
.light-card.balance-card
|
||||
div
|
||||
span.f-light Time Spent
|
||||
h6.mt-1.mb-0 30
|
||||
span.badge.badge-light-success.rounded-pill.ms-1 140%
|
||||
.col-xl-12.col-md-6.col-sm-4
|
||||
.light-card.balance-card
|
||||
div
|
||||
span.f-light Lessons taken
|
||||
h6.mt-1.mb-0 45
|
||||
span.badge.badge-light-success.rounded-pill.ms-1 86%
|
||||
.col-xl-12.col-md-6.col-sm-4
|
||||
.light-card.balance-card
|
||||
div
|
||||
span.f-light Exams passed
|
||||
h6.mt-1.mb-0 12
|
||||
span.badge.badge-light-success.rounded-pill.ms-1 120%
|
||||
.col-xxl-3.col-ed-5.col-xl-5.col-md-6.box-col-5
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5 Upcoming Events
|
||||
.dropdown.icon-dropdown
|
||||
button#upcomingdropdown.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='upcomingdropdown')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.upcoming-event-wrap
|
||||
#upcomingchart
|
||||
.col-xxl-5.col-ed-12.box-col-12
|
||||
.card.course-card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 My Course
|
||||
.card-header-right-icon
|
||||
.dropdown
|
||||
button#popularButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
| Most Popular
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='popularButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.course-main-card
|
||||
.course-wrapper
|
||||
.course-icon-box
|
||||
.icon-wrap
|
||||
img(src="../assets/images/dashboard-3/course/1.svg", alt="clock vector")
|
||||
img.arrow-bg(src="../assets/images/dashboard-3/course/back-arrow/1.png", alt="sqaure border arrow")
|
||||
h6.f-14 Management
|
||||
.course-wrapper
|
||||
.course-icon-box
|
||||
.icon-wrap
|
||||
img(src="../assets/images/dashboard-3/course/2.svg", alt="web development vector")
|
||||
img.arrow-bg(src="../assets/images/dashboard-3/course/back-arrow/2.png", alt="sqaure border arrow")
|
||||
h6.f-14 Web Devlopment
|
||||
.course-wrapper
|
||||
.course-icon-box
|
||||
.icon-wrap
|
||||
img(src="../assets/images/dashboard-3/course/3.svg", alt="business vector")
|
||||
img.arrow-bg(src="../assets/images/dashboard-3/course/back-arrow/1.png", alt="sqaure border arrow")
|
||||
h6.f-14 Business Analytics
|
||||
.course-wrapper
|
||||
.course-icon-box
|
||||
.icon-wrap
|
||||
img(src="../assets/images/dashboard-3/course/4.svg", alt="marketing vector")
|
||||
img.arrow-bg(src="../assets/images/dashboard-3/course/back-arrow/3.png", alt="sqaure border arrow")
|
||||
h6.f-14 Marketing
|
||||
.col-xxl-4.col-ed-6.col-md-7.box-col-7
|
||||
.card.schedule-card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Upcoming Schedule
|
||||
.card-header-right-icon
|
||||
a(href="#").btn.badge-light-primary + Create
|
||||
.card-body.pt-0
|
||||
ul.schedule-list
|
||||
li.primary
|
||||
img(src="../assets/images/dashboard/user/4.jpg", alt="profile")
|
||||
div
|
||||
h6.mb-1 Web Design
|
||||
ul
|
||||
li.f-light
|
||||
svg.fill-icon.f-light
|
||||
use(href='../assets/svg/icon-sprite.svg#bag')
|
||||
span January 3, 2022
|
||||
li.f-light
|
||||
svg.fill-icon.f-success
|
||||
use(href='../assets/svg/icon-sprite.svg#clock')
|
||||
span 09.00 - 12.00 AM
|
||||
li.warning
|
||||
img(src="../assets/images/dashboard/user/2.jpg", alt="profile")
|
||||
div
|
||||
h6.mb-1 UI/UX Design
|
||||
ul
|
||||
li.f-light
|
||||
svg.fill-icon.f-light
|
||||
use(href='../assets/svg/icon-sprite.svg#bag')
|
||||
span Febuary 10, 2022
|
||||
li.f-light
|
||||
svg.fill-icon.f-success
|
||||
use(href='../assets/svg/icon-sprite.svg#clock')
|
||||
span 11.00 - 1.00 PM
|
||||
.col-xxl-3.col-ed-6.col-md-5.col-sm-6.box-col-5
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Active Lessons
|
||||
.card-header-right-icon
|
||||
a(href="#").link-only View
|
||||
i(data-feather="arrow-right")
|
||||
.card-body.pt-0
|
||||
ul.lessons-lists
|
||||
li
|
||||
img(src="../assets/images/dashboard-3/lessons/1.png", alt="ux icon")
|
||||
div
|
||||
h6.f-14.f-w-400.mb-0 UI/UX
|
||||
span.f-light Web design
|
||||
.lesson-wrap.ms-auto
|
||||
#lessonChart1
|
||||
li
|
||||
img(src="../assets/images/dashboard-3/lessons/2.png", alt="vue icon")
|
||||
div
|
||||
h6.f-14.f-w-400.mb-0 Vue 3
|
||||
span.f-light JS Framework
|
||||
.lesson-wrap.ms-auto
|
||||
#lessonChart2
|
||||
li
|
||||
img(src="../assets/images/dashboard-3/lessons/3.png", alt="bootstrap icon")
|
||||
div
|
||||
h6.f-14.f-w-400.mb-0 Bootstrap 5
|
||||
span.f-light Framework
|
||||
.lesson-wrap.ms-auto
|
||||
#lessonChart3
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
830
static/admin/assets/pug/pages/theme/dashboard-04.pug
Normal file
830
static/admin/assets/pug/pages/theme/dashboard-04.pug
Normal file
@@ -0,0 +1,830 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var apex = true;
|
||||
- var dashboard_4 = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper StartMy Currencies
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Crypto
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Dashboard
|
||||
li.breadcrumb-item.active Crypto
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xxl-3.col-xl-4.box-col-4
|
||||
.row
|
||||
.col-xl-12.col-sm-6
|
||||
.card.crypto-main-card
|
||||
.card-body
|
||||
.deposit-wrap
|
||||
div
|
||||
h5 Cryptocurrency just got even better.
|
||||
p Lorem Ipsum is simply dummy text
|
||||
button.btn.btn-white.f-w-500 Deposit Now
|
||||
img(src="../assets/images/dashboard-4/crypto.png", alt="crypto")
|
||||
.col-xl-12.col-sm-6
|
||||
.card.widget-hover
|
||||
.card-body.radial-progress-card
|
||||
div
|
||||
h6.mb-0 Average Sales Per Day
|
||||
.sale-details
|
||||
h5.font-primary.mb-0 45,908
|
||||
span.f-12.f-light.f-w-500
|
||||
i(data-feather="arrow-up")
|
||||
| +5.7%
|
||||
p.f-light The point of using Lorem Ipsum
|
||||
.radial-chart-wrap
|
||||
#radial-chart
|
||||
.col-xl-12.col-sm-6
|
||||
.card.widget-hover
|
||||
.card-body.radial-progress-card
|
||||
div
|
||||
h6.mb-0 Average Profit Per Day
|
||||
.sale-details
|
||||
h5.font-secondary.mb-0 89.6%
|
||||
span.f-12.f-light.f-w-500
|
||||
i(data-feather="arrow-up")
|
||||
| +2.7%
|
||||
p.f-light The point of using Lorem Ipsum
|
||||
.radial-chart-wrap
|
||||
#radial-chart2
|
||||
.col-xl-12.col-sm-6
|
||||
.card.widget-hover
|
||||
.card-body.radial-progress-card
|
||||
div
|
||||
h6.mb-0 Average Visits Per Day
|
||||
.sale-details
|
||||
h5.font-success.mb-0 70k
|
||||
span.f-12.f-light.f-w-500
|
||||
i(data-feather="arrow-up")
|
||||
| +1.5%
|
||||
p.f-light The point of using Lorem Ipsum
|
||||
.radial-chart-wrap
|
||||
#radial-chart3
|
||||
.col-sm-12
|
||||
.card.tranaction-card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5 Transactions
|
||||
ul#myTab.nav.nav-tabs.custom-tab(role='tablist')
|
||||
li.nav-item(role='presentation')
|
||||
button#all-tab.nav-link.active(data-bs-toggle='tab' data-bs-target='#all' type='button' role='tab' aria-controls='all' aria-selected='true') All
|
||||
li.nav-item(role='presentation')
|
||||
button#buy-tab.nav-link(data-bs-toggle='tab' data-bs-target='#buy' type='button' role='tab' aria-controls='buy' aria-selected='false') Buy
|
||||
li.nav-item(role='presentation')
|
||||
button#sell-tab.nav-link(data-bs-toggle='tab' data-bs-target='#sell' type='button' role='tab' aria-controls='sell' aria-selected='false') Sell
|
||||
.card-body.pt-0
|
||||
#myTabContent.tab-content
|
||||
#all.tab-pane.fade.show.active(role='tabpanel' aria-labelledby='all-tab')
|
||||
.table-responsive.recent-table.transaction-table
|
||||
table.table
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy BTC
|
||||
span.f-light 14 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Sell ETH
|
||||
span.f-light 25 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.089 ETH
|
||||
td
|
||||
span.f-light.f-w-500 $116.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy LTC
|
||||
span.f-light 28 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy LTC
|
||||
span.f-light 05 Apr, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.089 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $29.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Sell BTC
|
||||
span.f-light 16 Apr, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.012 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy BTC
|
||||
span.f-light 14 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Sell ETH
|
||||
span.f-light 25 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.089 ETH
|
||||
td
|
||||
span.f-light.f-w-500 $116.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy LTC
|
||||
span.f-light 28 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
#buy.tab-pane.fade(role='tabpanel' aria-labelledby='buy-tab')
|
||||
.table-responsive.recent-table.transaction-table
|
||||
table.table
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy LTC
|
||||
span.f-light 30 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.010 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $105.00
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Buy ETH
|
||||
span.f-light 05 Apr, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.075 ETH
|
||||
td
|
||||
span.f-light.f-w-500 $120.74
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy BTC
|
||||
span.f-light 14 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy LTC
|
||||
span.f-light 05 Apr, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.089 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $29.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Buy BTC
|
||||
span.f-light 17 Sep, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.08 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $380.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy LTC
|
||||
span.f-light 30 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.010 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $105.00
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Buy ETH
|
||||
span.f-light 05 Apr, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.075 ETH
|
||||
td
|
||||
span.f-light.f-w-500 $120.74
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Buy BTC
|
||||
span.f-light 14 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
#sell.tab-pane.fade(role='tabpanel' aria-labelledby='sell-tab')
|
||||
.table-responsive.recent-table.transaction-table
|
||||
table.table
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Sell BTC
|
||||
span.f-light 14 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Sell ETH
|
||||
span.f-light 25 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.089 ETH
|
||||
td
|
||||
span.f-light.f-w-500 $116.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Sell LTC
|
||||
span.f-light 28 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Sell LTC
|
||||
span.f-light 05 Apr, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.089 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $29.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Sell BTC
|
||||
span.f-light 16 Apr, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.012 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Sell BTC
|
||||
span.f-light 14 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 BTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-danger.me-2(data-feather="trending-down")
|
||||
div
|
||||
h6.f-14.mb-0 Sell ETH
|
||||
span.f-light 25 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.089 ETH
|
||||
td
|
||||
span.f-light.f-w-500 $116.89
|
||||
tr
|
||||
td
|
||||
.d-flex
|
||||
i.font-success.me-2(data-feather="trending-up")
|
||||
div
|
||||
h6.f-14.mb-0 Sell LTC
|
||||
span.f-light 28 Mar, 2022
|
||||
td
|
||||
span.f-light.f-w-500 0.018 LTC
|
||||
td
|
||||
span.f-light.f-w-500 $236.89
|
||||
.col-xxl-6.col-xl-8.box-col-8e
|
||||
.row
|
||||
.col-sm-4
|
||||
.currency-widget.warning
|
||||
.d-flex
|
||||
.currency-icon-widget
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#beta')
|
||||
div
|
||||
h6 Bitcoin
|
||||
span.f-light BTC
|
||||
.card
|
||||
.card-body.d-flex
|
||||
.currency-chart-wrap
|
||||
#currency-chart
|
||||
.bg-light-warning.text-center
|
||||
h5.mb-0 $21,43
|
||||
span.f-12.f-w-500.font-warning
|
||||
i.me-1(data-feather="trending-up")
|
||||
| +50%
|
||||
.col-sm-4
|
||||
.currency-widget.primary
|
||||
.d-flex
|
||||
.currency-icon-widget
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#eth')
|
||||
div
|
||||
h6 Ethereum
|
||||
span.f-light ETC
|
||||
.card
|
||||
.card-body.d-flex
|
||||
.currency-chart-wrap
|
||||
#currency-chart2
|
||||
.bg-light-primary.text-center
|
||||
h5.mb-0 $7,450
|
||||
span.f-12.f-w-500.font-primary
|
||||
i.me-1(data-feather="trending-up")
|
||||
| +35%
|
||||
.col-sm-4
|
||||
.currency-widget.success
|
||||
.d-flex
|
||||
.currency-icon-widget
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#ltc')
|
||||
div
|
||||
h6 Leave Travel
|
||||
span.f-light LTC
|
||||
.card
|
||||
.card-body.d-flex
|
||||
.currency-chart-wrap
|
||||
#currency-chart3
|
||||
.bg-light-success.text-center
|
||||
h5.mb-0 $2,198
|
||||
span.f-12.f-w-500.font-success
|
||||
i.me-1(data-feather="trending-up")
|
||||
| +73%
|
||||
.col-xl-12
|
||||
.card.market-card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5 Market Graph
|
||||
ul#tabdesign.nav.nav-tabs.custom-tab(role='tablist')
|
||||
li.nav-item(role='presentation')
|
||||
button#hour-tab.nav-link(data-bs-toggle='tab' data-bs-target='#hour' type='button' role='tab' aria-selected='false') 1H
|
||||
li.nav-item(role='presentation')
|
||||
button#day-tab.nav-link(data-bs-toggle='tab' data-bs-target='#day' type='button' role='tab' aria-selected='false') 1D
|
||||
li.nav-item(role='presentation')
|
||||
button#week-tab.nav-link.active(data-bs-toggle='tab' data-bs-target='#week' type='button' role='tab' aria-selected='true') 1W
|
||||
li.nav-item(role='presentation')
|
||||
button#month-tab.nav-link(data-bs-toggle='tab' data-bs-target='#month' type='button' role='tab' aria-selected='false') 1M
|
||||
li.nav-item(role='presentation')
|
||||
button#year-tab.nav-link(data-bs-toggle='tab' data-bs-target='#year' type='button' role='tab' aria-selected='false') 1Y
|
||||
.card-body.pt-0
|
||||
.row.m-0.overall-card
|
||||
.col-xxl-8.col-xl-7.col-md-8.col-sm-7.p-0.box-col-7.col-ed-7
|
||||
.market-chart-container
|
||||
#market-chart
|
||||
.col-xxl-4.col-xl-5.col-md-4.col-sm-5.p-0.box-col-5.col-ed-5
|
||||
.row.g-sm-3.g-2
|
||||
.col-md-12
|
||||
.light-card.balance-card.align-items-center
|
||||
h6.f-w-400.f-14.mb-0 Coinmarketcap
|
||||
.ms-auto.text-end
|
||||
span.badge.badge-light-success.rounded-pill +11.67%
|
||||
.col-md-12
|
||||
.light-card.balance-card.align-items-center
|
||||
h6.f-w-400.f-14.mb-0 Binance
|
||||
.ms-auto.text-end
|
||||
span.badge.badge-light-success.rounded-pill +10.67%
|
||||
.col-md-12
|
||||
.light-card.balance-card.align-items-center
|
||||
h6.f-w-400.f-14.mb-0 Coinbase
|
||||
.ms-auto.text-end
|
||||
span.badge.badge-light-secondary.rounded-pill -11.67%
|
||||
.col-md-12
|
||||
.light-card.balance-card.align-items-center
|
||||
h6.f-w-400.f-14.mb-0 Yobit
|
||||
.ms-auto.text-end
|
||||
span.badge.badge-light-success.rounded-pill +13.67%
|
||||
.col-md-12
|
||||
button.btn.btn-outline-dark.w-100(type="button") See All Balance
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5 My Currencies
|
||||
.card-body.pt-0
|
||||
.recent-table.table-responsive.currency-table
|
||||
table.table
|
||||
thead
|
||||
tr
|
||||
th.f-light Coin Name
|
||||
th.f-light Price
|
||||
th.f-light 24h Change
|
||||
th.f-light Total Balance
|
||||
th.f-light Total Coin
|
||||
th.f-light Action
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.warning
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#beta')
|
||||
div
|
||||
h6.f-14.mb-0.f-w-400 Bitcoin
|
||||
td $13,098.09
|
||||
td
|
||||
.change-currency.font-success
|
||||
i.me-1(data-feather="trending-up")
|
||||
| 5.90
|
||||
td $74,871.470
|
||||
td 1.09634721
|
||||
td
|
||||
button.btn.badge-light-primary Trade
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.success
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#ltc')
|
||||
div
|
||||
h6.f-14.mb-0.f-w-400 Litecoin
|
||||
td $11,098.04
|
||||
td
|
||||
.change-currency.font-secondary
|
||||
i.me-1(data-feather="trending-down")
|
||||
| 2.90
|
||||
td $87,897.098
|
||||
td 1.09675432
|
||||
td
|
||||
button.btn.badge-light-primary Trade
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.primary
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#eth')
|
||||
div
|
||||
h6.f-14.mb-0.f-w-400 Eathereum
|
||||
td $45,198.09
|
||||
td
|
||||
.change-currency.font-success
|
||||
i.me-1(data-feather="trending-up")
|
||||
| 0.12
|
||||
td $45,178.010
|
||||
td 1.41557127
|
||||
td
|
||||
button.btn.badge-light-primary Trade
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.secondary
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#bin')
|
||||
div
|
||||
h6.f-14.mb-0.f-w-400 Binance
|
||||
td $35,098.34
|
||||
td
|
||||
.change-currency.font-success
|
||||
i.me-1(data-feather="trending-up")
|
||||
| 3.56
|
||||
td $64,100.066
|
||||
td 1.78142254
|
||||
td
|
||||
button.btn.badge-light-primary Trade
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.dark-green
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#te')
|
||||
div
|
||||
h6.f-14.mb-0.f-w-400 Tether
|
||||
td $56,898.91
|
||||
td
|
||||
.change-currency.font-secondary
|
||||
i.me-1(data-feather="trending-down")
|
||||
| 1.23
|
||||
td $61,574.218
|
||||
td 1.574215
|
||||
td
|
||||
button.btn.badge-light-primary Trade
|
||||
.col-sm-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top.gap-1
|
||||
h5 Buy Coins
|
||||
.dropdown.icon-dropdown
|
||||
button#buydropdown.btn.dropdown-toggle(type='button' data-bs-toggle='dropdown' aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='buydropdown')
|
||||
a.dropdown-item(href='#') Weekly
|
||||
a.dropdown-item(href='#') Monthly
|
||||
a.dropdown-item(href='#') Yearly
|
||||
.card-body.pt-0
|
||||
form.theme-form.crypto-form
|
||||
.mb-3
|
||||
label.form-label.f-light(for='money') Enter your Money
|
||||
.position-relative
|
||||
input#money.form-control(type='number' placeholder="100")
|
||||
select.form-select.crypto-select.warning
|
||||
option USD
|
||||
option BTC
|
||||
option LTC
|
||||
option ETH
|
||||
.mb-3
|
||||
label.form-label.f-light(for='coin') Enter Coins Converted to
|
||||
.position-relative
|
||||
input#coin.form-control(type='number' placeholder="0.0043")
|
||||
select.form-select.crypto-select.primary
|
||||
option BTC
|
||||
option USD
|
||||
option LTC
|
||||
option ETH
|
||||
button.btn.btn-primary.btn-hover-effect.w-100(type="button") Buy Coins
|
||||
.col-sm-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top.gap-1
|
||||
h5 Sell Coins
|
||||
.dropdown.icon-dropdown
|
||||
button#selldropdown.btn.dropdown-toggle(type='button' data-bs-toggle='dropdown' aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='selldropdown')
|
||||
a.dropdown-item(href='#') Weekly
|
||||
a.dropdown-item(href='#') Monthly
|
||||
a.dropdown-item(href='#') Yearly
|
||||
.card-body.pt-0
|
||||
form.theme-form.crypto-form
|
||||
.mb-3
|
||||
label.form-label.f-light(for='crypto-coin') Enter Crypto Coins
|
||||
.position-relative
|
||||
input#crypto-coin.form-control(type='number' placeholder="100")
|
||||
select.form-select.crypto-select.warning
|
||||
option USD
|
||||
option BTC
|
||||
option LTC
|
||||
option ETH
|
||||
.mb-3
|
||||
label.form-label.f-light(for='bitcoin') Enter Money Converted to
|
||||
.position-relative
|
||||
input#bitcoin.form-control(type='number' placeholder="0.0043")
|
||||
select.form-select.crypto-select.primary
|
||||
option LTC
|
||||
option USD
|
||||
option BTC
|
||||
option ETH
|
||||
button.btn.btn-primary.btn-hover-effect.w-100(type="button") Sell Coins
|
||||
.col-xxl-3.box-col-12
|
||||
.row.box-order
|
||||
.col-xxl-12.col-sm-6.box-col-6
|
||||
.card.balance-box
|
||||
.card-body
|
||||
.balance-profile
|
||||
.balance-img
|
||||
img(src="../assets/images/dashboard-4/user.png", alt="user vector")
|
||||
a(href="user-profile.html").edit-icon
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#pencil')
|
||||
span.f-light.d-block Your Balance
|
||||
h5.mt-1 $768,987.90
|
||||
ul
|
||||
li
|
||||
.balance-item.danger
|
||||
.balance-icon-wrap
|
||||
.balance-icon
|
||||
i(data-feather="arrow-down-right")
|
||||
div
|
||||
span.f-12.f-light Investment
|
||||
h5 78.8K
|
||||
span.badge.badge-light-danger.rounded-pill -11.67%
|
||||
li
|
||||
.balance-item.success
|
||||
.balance-icon-wrap
|
||||
.balance-icon
|
||||
i(data-feather="arrow-up-right")
|
||||
div
|
||||
span.f-12.f-light Cash Back
|
||||
h5 19.7K
|
||||
span.badge.badge-light-success.rounded-pill +10.67%
|
||||
.col-xxl-12.order-xxl-0.order-1
|
||||
.card.portfolio-card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 My Portfolio
|
||||
.card-header-right-icon
|
||||
.dropdown
|
||||
button#portfolioButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
| BTC
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='portfolioButton')
|
||||
a.dropdown-item(href='#') ETH
|
||||
a.dropdown-item(href='#') USD
|
||||
a.dropdown-item(href='#') LTC
|
||||
.card-body
|
||||
.row
|
||||
.col-xxl-12.col-xl-7.col-sm-6.box-col-6
|
||||
.portfolio-chart-container
|
||||
#portfolio-chart
|
||||
.col-xxl-12.col-xl-5.col-sm-6.box-col-6
|
||||
.portfolio-table.recent-table.table-responsive
|
||||
table.table
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.warning
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#beta')
|
||||
div
|
||||
h6.f-14.mb-1 Bitcoin
|
||||
div.d-flex.align-items-center.gap-1
|
||||
span.status.bg-success
|
||||
span.f-light BTC
|
||||
td.text-end
|
||||
h6.f-14.f-w-400.mb-1 BTC 0.00876543
|
||||
span.font-success $14,987.13
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.success
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#ltc')
|
||||
div
|
||||
h6.f-14.mb-1 Ethereum
|
||||
div.d-flex.align-items-center.gap-1
|
||||
span.status.bg-danger
|
||||
span.f-light ETH
|
||||
td.text-end
|
||||
h6.f-14.f-w-400.mb-1 ETC 1.60876543
|
||||
span.font-danger $49,987.13
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.primary
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#eth')
|
||||
div
|
||||
h6.f-14.mb-1 Litecoin
|
||||
div.d-flex.align-items-center.gap-1
|
||||
span.status.bg-success
|
||||
span.f-light LTC
|
||||
td.text-end
|
||||
h6.f-14.f-w-400.mb-1 LTC 1.60876543
|
||||
span.font-success $35,571.25
|
||||
tr
|
||||
td
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.currency-icon.light-blue
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#dash')
|
||||
div
|
||||
h6.f-14.mb-1 Dash
|
||||
div.d-flex.align-items-center.gap-1
|
||||
span.status.bg-success
|
||||
span.f-light DSH
|
||||
td.text-end
|
||||
h6.f-14.f-w-400.mb-1 DSH 1.80741510
|
||||
span.font-success $17,047.30
|
||||
.col-xxl-12.col-sm-6.box-col-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Activities
|
||||
.card-header-right-icon
|
||||
.dropdown.icon-dropdown
|
||||
button#activitiesButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='activitiesButton')
|
||||
a.dropdown-item(href='#') Weekly
|
||||
a.dropdown-item(href='#') Yearly
|
||||
a.dropdown-item(href='#') Monthly
|
||||
.card-body.pt-0.activity-card
|
||||
.appointment-table.customer-table.table-responsive
|
||||
table.table.table-bordernone
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/3.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").d-block.f-w-500 Anna K.
|
||||
span.f-light To : 0x187...12bb
|
||||
td.text-end
|
||||
span.font-success +0.3BNB
|
||||
span.d-block.f-light 29.09.22
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/12.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").d-block.f-w-500 Guy Hawkins
|
||||
span.f-light To : 0x187...12bb
|
||||
td.text-end
|
||||
span.font-success +0.3BNB
|
||||
span.d-block.f-light 29.09.22
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/10.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").d-block.f-w-500 Jenny Wilson
|
||||
span.f-light To : 0x187...12bb
|
||||
td.text-end
|
||||
span.font-danger -0.1BNB
|
||||
span.d-block.f-light 29.09.22
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/11.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").d-block.f-w-500 Jacob B.
|
||||
span.f-light To : 0x187...12bb
|
||||
td.text-end
|
||||
span.font-success +0.3BNB
|
||||
span.d-block.f-light 29.09.22
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/13.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").d-block.f-w-500 Esther Howard
|
||||
span.f-light To : 0x187...12bb
|
||||
td.text-end
|
||||
span.font-danger -0.2BNB
|
||||
span.d-block.f-light 29.09.22
|
||||
tr
|
||||
td
|
||||
img.img-fluid.img-40.rounded-circle.me-2(src='../assets/images/dashboard/user/5.jpg',alt='user')
|
||||
td.img-content-box
|
||||
a(href="user-profile.html").d-block.f-w-500 Leslie Alexander
|
||||
span.f-light To : 0x187...12bb
|
||||
td.text-end
|
||||
span.font-success +0.3BNB
|
||||
span.d-block.f-light 29.09.22
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
346
static/admin/assets/pug/pages/theme/dashboard-05.pug
Normal file
346
static/admin/assets/pug/pages/theme/dashboard-05.pug
Normal file
@@ -0,0 +1,346 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var apex = true;
|
||||
- var dashboard_5 = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Social
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Dashboard
|
||||
li.breadcrumb-item.active Social
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xxl-3.col-ed-4.col-xl-4.box-col-4
|
||||
.row
|
||||
.col-xl-12.col-md-6
|
||||
.card.social-profile
|
||||
.card-body
|
||||
.social-img-wrap
|
||||
.social-img
|
||||
img(src="../assets/images/dashboard-5/profile.png", alt="profile")
|
||||
.edit-icon
|
||||
svg
|
||||
use(href='../assets/svg/icon-sprite.svg#profile-check')
|
||||
.social-details
|
||||
h5.mb-1
|
||||
a(href="social-app.html") Brooklyn Simmons
|
||||
span.f-light @brookly.simmons
|
||||
ul.social-follow
|
||||
li
|
||||
h5.mb-0 1,908
|
||||
span.f-light Posts
|
||||
li
|
||||
h5.mb-0 34.0k
|
||||
span.f-light Followers
|
||||
li
|
||||
h5.mb-0 897
|
||||
span.f-light Following
|
||||
.col-xl-12.col-md-6
|
||||
.card.mobile-app-card
|
||||
.card-header.card-no-border.pb-0
|
||||
h5.mb-3
|
||||
span.f-16.f-light Have you Tried Our
|
||||
| Mobile Application?
|
||||
button.purchase-btn.btn.btn-primary.btn-hover-effect.f-w-500(type="button") Try Now
|
||||
.card-body.p-0.text-end
|
||||
img.wavy(src="../assets/images/dashboard-5/wave.png", alt="")
|
||||
img(src="../assets/images/dashboard-5/mobile-img.png", alt="")
|
||||
.col-xxl-6.col-ed-8.col-xl-8.box-col-8e
|
||||
.row
|
||||
.col-md-4.col-sm-6
|
||||
.card.social-widget.widget-hover
|
||||
.card-body
|
||||
.d-flex.align-items-center.justify-content-between
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.social-icons
|
||||
img(src="../assets/images/dashboard-5/social/1.png", alt="facebook icon")
|
||||
span Facebook
|
||||
span.font-success.f-12.d-xxl-block.d-xl-none +22.9%
|
||||
.social-content
|
||||
div
|
||||
h5.mb-1 12,098
|
||||
span.f-light Followers
|
||||
.social-chart
|
||||
#radial-facebook
|
||||
.col-md-4.col-sm-6
|
||||
.card.social-widget.widget-hover
|
||||
.card-body
|
||||
.d-flex.align-items-center.justify-content-between
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.social-icons
|
||||
img(src="../assets/images/dashboard-5/social/2.png", alt="instagram icon")
|
||||
span Instagram
|
||||
span.font-success.f-12.d-xxl-block.d-xl-none +27.4%
|
||||
.social-content
|
||||
div
|
||||
h5.mb-1 15,080
|
||||
span.f-light Followers
|
||||
.social-chart
|
||||
#radial-instagram
|
||||
.col-md-4
|
||||
.card.social-widget.widget-hover
|
||||
.card-body
|
||||
.d-flex.align-items-center.justify-content-between
|
||||
div.d-flex.align-items-center.gap-2
|
||||
.social-icons
|
||||
img(src="../assets/images/dashboard-5/social/3.png", alt="twitter icon")
|
||||
span Twitter
|
||||
span.font-success.f-12.d-xxl-block.d-xl-none +14.09%
|
||||
.social-content
|
||||
div
|
||||
h5.mb-1 12,564
|
||||
span.f-light Followers
|
||||
.social-chart
|
||||
#radial-twitter
|
||||
.col-md-8
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Instagram Subscribers
|
||||
span.f-14.f-w-500.ms-1.f-light
|
||||
| (75% activity growth)
|
||||
.card-header-right-icon
|
||||
.dropdown.icon-dropdown
|
||||
button#subscribeButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='subscribeButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.subscriber-chart-container
|
||||
#subscriber-chart
|
||||
.col-md-4
|
||||
.row
|
||||
.col-md-12.col-sm-6
|
||||
.card.click-widgets.widget-hover
|
||||
.card-body
|
||||
.dropdown.icon-dropdown.text-end
|
||||
button#photoButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='photoButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.d-flex.justify-content-around
|
||||
.click-chart
|
||||
#photo-click
|
||||
div
|
||||
h4.mb-0 %76
|
||||
span.f-light.d-block.my-1 Photo Clicks
|
||||
span.font-success +72.9%
|
||||
.col-md-12.col-sm-6
|
||||
.card.click-widgets.widget-hover
|
||||
.card-body
|
||||
.dropdown.icon-dropdown.text-end
|
||||
button#clickButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='clickButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.d-flex.justify-content-around
|
||||
.click-chart
|
||||
#link-click
|
||||
div
|
||||
h4.mb-0 %89
|
||||
span.f-light.d-block.my-1 Link Clicks
|
||||
span.font-secondary 79.9%
|
||||
.col-xl-3.col-ed-none.d-xxl-block.d-lg-none.box-col-none
|
||||
.row
|
||||
.col-lg-12.col-sm-6
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top.gap-1
|
||||
h5 Follower Gender
|
||||
.dropdown.icon-dropdown
|
||||
button#followerdropdown.btn.dropdown-toggle(type='button' data-bs-toggle='dropdown' aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='followerdropdown')
|
||||
a.dropdown-item(href='#') Weekly
|
||||
a.dropdown-item(href='#') Monthly
|
||||
a.dropdown-item(href='#') Yearly
|
||||
.card-body.pt-0
|
||||
.follower-chart
|
||||
#followerchart
|
||||
.col-lg-12.col-sm-6
|
||||
.card.follower-wrap
|
||||
.card-header.card-no-border
|
||||
h5.mb-1 Facebook Campaign
|
||||
div.d-inline-block.badge.badge-light-success.rounded-pill Active
|
||||
.card-body.pt-0.papernote-wrap
|
||||
ul.campaign-list
|
||||
li
|
||||
.campaign-box
|
||||
h5.mb-1 1,897
|
||||
span.f-light Followers today
|
||||
li
|
||||
.campaign-box
|
||||
h5.mb-1 50,000
|
||||
span.f-light Followers goals
|
||||
.customers
|
||||
ul
|
||||
li.d-inline-block
|
||||
img.img-40.rounded-circle(src="../assets/images/dashboard/user/1.jpg", alt="user")
|
||||
li.d-inline-block
|
||||
img.img-40.rounded-circle(src="../assets/images/dashboard/user/6.jpg", alt="user")
|
||||
li.d-inline-block
|
||||
img.img-40.rounded-circle(src="../assets/images/dashboard/user/7.jpg", alt="user")
|
||||
li.d-inline-block
|
||||
img.img-40.rounded-circle(src="../assets/images/dashboard/user/3.jpg", alt="user")
|
||||
li.d-inline-block
|
||||
img.img-40.rounded-circle(src="../assets/images/dashboard/user/8.jpg", alt="user")
|
||||
li.d-inline-block
|
||||
.light-card
|
||||
span.f-w-500 +5
|
||||
.col-xl-7
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 All Campaigns
|
||||
.card-header-right-icon
|
||||
.dropdown.icon-dropdown
|
||||
button#allcampButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
i.icon-more-alt
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='allcampButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0.campaign-table
|
||||
.recent-table.table-responsive.currency-table
|
||||
table.table
|
||||
thead
|
||||
tr
|
||||
th.f-light AD Platform
|
||||
th.f-light Campaign
|
||||
th.f-light GEO
|
||||
th.f-light Profitability
|
||||
th.f-light Max Participation Avai.
|
||||
th.f-light Status
|
||||
th.f-light Create
|
||||
tbody
|
||||
tr
|
||||
td.border-icon.facebook
|
||||
div
|
||||
.social-circle
|
||||
i.fa.fa-facebook
|
||||
td Jane Cooper
|
||||
td UK
|
||||
td
|
||||
.change-currency
|
||||
i.font-success.me-1(data-feather="trending-up")
|
||||
| 45.6%
|
||||
td $9,786
|
||||
td
|
||||
button.btn.badge-light-primary Active
|
||||
td
|
||||
button.plus-btn +
|
||||
tr
|
||||
td.border-icon.instagram
|
||||
div
|
||||
.social-circle
|
||||
i.fa.fa-instagram
|
||||
td Floyd Miles
|
||||
td DE
|
||||
td
|
||||
.change-currency
|
||||
i.font-danger.me-1(data-feather="trending-down")
|
||||
| 12.3%
|
||||
td $19,7098
|
||||
td
|
||||
button.btn.badge-light-primary Active
|
||||
td
|
||||
button.plus-btn +
|
||||
tr
|
||||
td.border-icon.pinterest
|
||||
div
|
||||
.social-circle
|
||||
i.fa.fa-pinterest
|
||||
td Guy Hawkins
|
||||
td ES
|
||||
td
|
||||
.change-currency
|
||||
i.font-success.me-1(data-feather="trending-up")
|
||||
| 65.6%
|
||||
td $90,986
|
||||
td
|
||||
button.btn.badge-light-primary Active
|
||||
td
|
||||
button.plus-btn +
|
||||
tr
|
||||
td.border-icon.twitter
|
||||
div
|
||||
.social-circle
|
||||
i.fa.fa-twitter
|
||||
td Travis Wright
|
||||
td ES
|
||||
td
|
||||
.change-currency
|
||||
i.font-danger.me-1(data-feather="trending-down")
|
||||
| 35.6%
|
||||
td $23,654
|
||||
td
|
||||
button.btn.badge-light-light.disabled Inactive
|
||||
td
|
||||
button.plus-btn +
|
||||
tr
|
||||
td.border-icon.you-tube
|
||||
div
|
||||
.social-circle
|
||||
i.fa.fa-youtube-play
|
||||
td Mark Green
|
||||
td UK
|
||||
td
|
||||
.change-currency
|
||||
i.font-success.me-1(data-feather="trending-up")
|
||||
| 45.6%
|
||||
td $12,796
|
||||
td
|
||||
button(type="button").btn.badge-light-light.disabled Inactive
|
||||
td
|
||||
button(type="button").plus-btn +
|
||||
.col-xl-5
|
||||
.card
|
||||
.card-header.card-no-border
|
||||
.header-top
|
||||
h5.m-0 Views
|
||||
.card-header-right-icon
|
||||
.dropdown
|
||||
button#viewButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
| Today
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='viewButton')
|
||||
a.dropdown-item(href='#') Today
|
||||
a.dropdown-item(href='#') Tomorrow
|
||||
a.dropdown-item(href='#') Yesterday
|
||||
.card-body.pt-0
|
||||
.view-container
|
||||
#view
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
1787
static/admin/assets/pug/pages/theme/datatable-API.pug
Normal file
1787
static/admin/assets/pug/pages/theme/datatable-API.pug
Normal file
File diff suppressed because it is too large
Load Diff
3390
static/admin/assets/pug/pages/theme/datatable-basic-init.pug
Normal file
3390
static/admin/assets/pug/pages/theme/datatable-basic-init.pug
Normal file
File diff suppressed because it is too large
Load Diff
1249
static/admin/assets/pug/pages/theme/datatable-data-source.pug
Normal file
1249
static/admin/assets/pug/pages/theme/datatable-data-source.pug
Normal file
File diff suppressed because it is too large
Load Diff
5466
static/admin/assets/pug/pages/theme/datatable-ext-autofill.pug
Normal file
5466
static/admin/assets/pug/pages/theme/datatable-ext-autofill.pug
Normal file
File diff suppressed because it is too large
Load Diff
89
static/admin/assets/pug/pages/theme/datepicker.pug
Normal file
89
static/admin/assets/pug/pages/theme/datepicker.pug
Normal file
@@ -0,0 +1,89 @@
|
||||
- var theme_customizer = true;
|
||||
- var date_picker = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Date Picker
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Form Widgets
|
||||
li.breadcrumb-item.active Date Picker
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.card
|
||||
.card-header
|
||||
h5 Date Picker
|
||||
.card-body
|
||||
.row
|
||||
.col-md-12
|
||||
.date-picker
|
||||
form.theme-form
|
||||
.mb-3.row.g-3
|
||||
label.col-sm-3.col-form-label.text-sm-end Default
|
||||
.col-xl-5.col-sm-9
|
||||
.input-group
|
||||
input.datepicker-here.form-control.digits(type='text', data-language='en')
|
||||
.mb-3.row.g-3
|
||||
label.col-sm-3.col-form-label.text-sm-end Selecting multiple dates
|
||||
.col-xl-5.col-sm-9
|
||||
input.datepicker-here.form-control.digits(type='text', data-multiple-dates='3', data-multiple-dates-separator=', ', data-language='en')
|
||||
.mb-3.row.g-3
|
||||
label.col-sm-3.col-form-label.text-sm-end Month selection
|
||||
.col-xl-5.col-sm-9
|
||||
input.datepicker-here.form-control.digits(type='text', data-language='en', data-min-view='months', data-view='months', data-date-format='MM yyyy')
|
||||
.mb-3.row.g-3
|
||||
label.col-sm-3.col-form-label.text-sm-end Minimum and maximum dates
|
||||
.col-xl-5.col-sm-9
|
||||
input#minMaxExample.form-control.digits(type='text')
|
||||
.mb-3.row.g-3
|
||||
label.col-sm-3.col-form-label.text-sm-end Range of dates
|
||||
.col-xl-5.col-sm-9
|
||||
input.datepicker-here.form-control.digits(type='text', data-range='true', data-multiple-dates-separator=' - ', data-language='en')
|
||||
.mb-3.row.g-3
|
||||
label.col-sm-3.col-form-label.text-sm-end Disable days of week
|
||||
.col-xl-5.col-sm-9
|
||||
input#disabled-days.form-control.digits(type='text')
|
||||
.mb-3.row.g-3
|
||||
label.col-sm-3.col-form-label.text-sm-end Orientation
|
||||
.col-xl-5.col-sm-9
|
||||
.form-row
|
||||
.col-md-12.mb-2
|
||||
input.datepicker-here.form-control.digits(type='text', data-language='en', data-multiple-dates-separator=', ', data-position='top left', placeholder='top left')
|
||||
.col-md-12.mb-2
|
||||
input.datepicker-here.form-control.digits(type='text', data-language='en', data-multiple-dates-separator=', ', data-position='top right', placeholder='top right')
|
||||
.col-md-12.mb-2
|
||||
input.datepicker-here.form-control.digits(type='text', data-language='en', data-multiple-dates-separator=', ', data-position='bottom left', placeholder='bottom left')
|
||||
.col-md-12
|
||||
input.datepicker-here.form-control.digits(type='text', data-language='en', data-multiple-dates-separator=', ', data-position='bottom right', placeholder='bottom right')
|
||||
.mb-3.row.g-3.mb-0
|
||||
label.col-sm-3.col-form-label.text-sm-end Permanently visible Datepicker
|
||||
.col-sm-3
|
||||
.datepicker-here(data-language='en')
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
86
static/admin/assets/pug/pages/theme/daterangepicker.pug
Normal file
86
static/admin/assets/pug/pages/theme/daterangepicker.pug
Normal file
@@ -0,0 +1,86 @@
|
||||
- var theme_customizer = true;
|
||||
- var date_rangepicker = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Date Range Picker
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Form Widgets
|
||||
li.breadcrumb-item.active Date Range Picker
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.card
|
||||
.card-header
|
||||
h5 Date Range Picker
|
||||
.card-body
|
||||
.row.date-range-picker
|
||||
.col-xl-6
|
||||
h6.sub-title Date Range Picker
|
||||
p
|
||||
| The Date Range Picker use the current value of the input to initialize, and update the input if new dates are chosen.
|
||||
.theme-form
|
||||
div
|
||||
input.form-control(type='text', name='daterange', value='01/15/2017 - 02/15/2017')
|
||||
.col-xl-6
|
||||
h6.sub-title Predefined Ranges
|
||||
p
|
||||
| This example shows the option to predefine date ranges that the user can choose from a list.
|
||||
.theme-form
|
||||
div
|
||||
input#reportrange.form-control(type='text')
|
||||
.col-xl-6
|
||||
h6.sub-title Single Date Picker
|
||||
p
|
||||
| The Date Range Picker can be turned into a single date picker widget with only one calendar. In this example, dropdowns to select a month and year have also been enabled at the top of the calendar to quickly jump to different months.
|
||||
.theme-form
|
||||
div
|
||||
input.form-control(type='text', name='birthdate', value='10/24/1989')
|
||||
.col-xl-6
|
||||
h6.sub-title Input Initially Empty
|
||||
p
|
||||
| If you're using a date range as a filter, you may want to attach a picker to an input but leave it empty by default. This example shows how to accomplish that using the
|
||||
code autoUpdateInput
|
||||
| setting, and the
|
||||
code apply
|
||||
| and
|
||||
code cancel
|
||||
| events.
|
||||
.theme-form
|
||||
div
|
||||
input.form-control(type='text', name='datefilter', value='')
|
||||
.col-lg-12
|
||||
h6.sub-title Date and Time
|
||||
p
|
||||
| The Date Range Picker can also be used to select times. Hour, minute and (optional) second dropdowns are added below the calendars. An option exists to set the increment count of the minutes dropdown to e.g. offer only 15-minute or 30-minute increments.
|
||||
.theme-form
|
||||
div
|
||||
input.form-control.dropup(type='text', name='daterange2', value='01/01/2017 1:30 PM - 01/01/2017 2:00 PM')
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
101
static/admin/assets/pug/pages/theme/datetimepicker.pug
Normal file
101
static/admin/assets/pug/pages/theme/datetimepicker.pug
Normal file
@@ -0,0 +1,101 @@
|
||||
- var theme_customizer = true;
|
||||
- var date_time_picker = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Date Time Picker
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Form Widgets
|
||||
li.breadcrumb-item.active Date Time Picker
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.card
|
||||
.card-header
|
||||
h5 Date Time Picker
|
||||
.card-body
|
||||
.row
|
||||
.col-md-12
|
||||
.datetime-picker
|
||||
form.theme-form
|
||||
.mb-3.row.g-sm-3
|
||||
label.col-sm-3.col-form-label.text-end Minimum Setup
|
||||
.col-xl-5.col-sm-7.col-lg-8
|
||||
#dt-minimum.input-group.date(data-target-input='nearest')
|
||||
input.form-control.datetimepicker-input.digits(type='text', data-target='#dt-minimum')
|
||||
.input-group-text(data-target='#dt-minimum', data-toggle='datetimepicker')
|
||||
i.fa.fa-calendar
|
||||
.mb-3.row.g-sm-3
|
||||
label.col-sm-3.col-form-label.text-end Using Locales
|
||||
.col-xl-5.col-sm-7.col-lg-8
|
||||
#dt-local.input-group.date(data-target-input='nearest')
|
||||
input.form-control.datetimepicker-input.digits(type='text', data-target='#dt-local')
|
||||
.input-group-text(data-target='#dt-local', data-toggle='datetimepicker')
|
||||
i.fa.fa-calendar
|
||||
.mb-3.row.g-sm-3
|
||||
label.col-sm-3.col-form-label.text-end Time Only
|
||||
.col-xl-5.col-sm-7.col-lg-8
|
||||
#dt-time.input-group.date(data-target-input='nearest')
|
||||
input.form-control.datetimepicker-input.digits(type='text', data-target='#dt-time')
|
||||
.input-group-text(data-target='#dt-time', data-toggle='datetimepicker')
|
||||
i.fa.fa-clock-o
|
||||
.mb-3.row.g-sm-3
|
||||
label.col-sm-3.col-form-label.text-end Date Only
|
||||
.col-xl-5.col-sm-7.col-lg-8
|
||||
#dt-date.input-group.date(data-target-input='nearest')
|
||||
input.form-control.datetimepicker-input.digits(type='text', data-target='#dt-date')
|
||||
.input-group-text(data-target='#dt-date', data-toggle='datetimepicker')
|
||||
i.fa.fa-calendar
|
||||
.mb-3.row.g-sm-3
|
||||
label.col-sm-3.col-form-label.text-end No Icon (input field only)
|
||||
.col-xl-5.col-sm-7.col-lg-8
|
||||
input#dt-noicon.form-control.datetimepicker-input.digits(type='text', data-toggle='datetimepicker', data-target='#dt-noicon')
|
||||
.mb-3.row.g-sm-3
|
||||
label.col-sm-3.col-form-label.text-end Enabled/Disabled Dates
|
||||
.col-xl-5.col-sm-7.col-lg-8
|
||||
#dt-enab-disab-date.input-group.date(data-target-input='nearest')
|
||||
input.form-control.datetimepicker-input.digits(type='text', data-target='#dt-enab-disab-date')
|
||||
.input-group-text(data-target='#dt-enab-disab-date', data-toggle='datetimepicker')
|
||||
i.fa.fa-calendar
|
||||
.mb-3.row.g-sm-3
|
||||
label.col-sm-3.col-form-label.text-end View Mode
|
||||
.col-xl-5.col-sm-7.col-lg-8
|
||||
#dt-view.input-group.date(data-target-input='nearest')
|
||||
input.form-control.datetimepicker-input.digits(type='text', data-target='#dt-view')
|
||||
.input-group-text(data-target='#dt-view', data-toggle='datetimepicker')
|
||||
i.fa.fa-calendar
|
||||
.mb-3.row.g-sm-3.mb-0
|
||||
label.col-sm-3.col-form-label.text-end Disabled Days of the Week
|
||||
.col-xl-5.col-sm-7.col-lg-8
|
||||
#dt-disab-days.input-group.date(data-target-input='nearest')
|
||||
input.form-control.datetimepicker-input.digits(type='text', data-target='#dt-disab-days')
|
||||
.input-group-text(data-target='#dt-disab-days', data-toggle='datetimepicker')
|
||||
i.fa.fa-calendar
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
192
static/admin/assets/pug/pages/theme/default-form.pug
Normal file
192
static/admin/assets/pug/pages/theme/default-form.pug
Normal file
@@ -0,0 +1,192 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Default Forms
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Form Layout
|
||||
li.breadcrumb-item.active Default Forms
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12.col-xl-6
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Default Form Layout
|
||||
span
|
||||
| Using the
|
||||
a(href='#') card
|
||||
| component, you can extend the default collapse behavior to create an accordion.
|
||||
.card-body
|
||||
form.theme-form
|
||||
.mb-3
|
||||
label.col-form-label.pt-0(for='exampleInputEmail1') Email address
|
||||
input#exampleInputEmail1.form-control(type='email' aria-describedby='emailHelp' placeholder='Enter email')
|
||||
small#emailHelp.form-text.text-muted We'll never share your email with anyone else.
|
||||
.mb-3
|
||||
label.col-form-label.pt-0(for='exampleInputPassword1') Password
|
||||
input#exampleInputPassword1.form-control(type='password' placeholder='Password')
|
||||
.checkbox.p-0
|
||||
input#dafault-checkbox(type='checkbox')
|
||||
label.mb-0(for='dafault-checkbox') Remember my preference
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary Submit
|
||||
button.btn.btn-secondary Cancel
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Horizontal Form Layout
|
||||
span
|
||||
| Using the
|
||||
a(href='#') card
|
||||
| component, you can extend the default collapse behavior to create an accordion.
|
||||
.card-body
|
||||
form.theme-form
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label(for='inputEmail3') Email
|
||||
.col-sm-9
|
||||
input#inputEmail3.form-control(type='email' placeholder='Email')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label(for='inputPassword3') Password
|
||||
.col-sm-9
|
||||
input#inputPassword3.form-control(type='password' placeholder='Password')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label(for='inputPassword3') Contact Number
|
||||
.col-sm-9
|
||||
input#inputnumber.form-control(type='number' placeholder='Contact')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label(for='inputPassword3') Company name
|
||||
.col-sm-9
|
||||
input#url.form-control(type='text' placeholder='Company name')
|
||||
.mb-3.row
|
||||
label.col-sm-3.col-form-label(for='inputPassword3') Website
|
||||
.col-sm-9
|
||||
input#Website.form-control(type='url' placeholder='Website')
|
||||
fieldset.mb-3
|
||||
.row
|
||||
label.col-form-label.col-sm-3.pt-0 Radios
|
||||
.col-sm-9
|
||||
.form-check.radio.radio-primary
|
||||
input#radio11.form-check-input(type='radio' name='radio1' value='option1')
|
||||
label.form-check-label(for='radio11') Option 1
|
||||
.form-check.radio.radio-primary
|
||||
input#radio22.form-check-input(type='radio' name='radio1' value='option1')
|
||||
label.form-check-label(for='radio22') Option 2
|
||||
.form-check.radio.radio-primary
|
||||
input#radio33.form-check-input(type='radio' name='radio1' value='option1' disabled='')
|
||||
label.form-check-label(for='radio33') Disabled
|
||||
.form-check.radio.radio-primary
|
||||
input#radio44.form-check-input(type='radio' name='radio1' value='option1' checked='')
|
||||
label.form-check-label(for='radio44') Option 3
|
||||
.form-check.radio.radio-primary
|
||||
input#radio55.form-check-input(type='radio' name='radio1' value='option1' checked='')
|
||||
label.form-check-label(for='radio44') Option 4
|
||||
.row.mb-0
|
||||
label.col-sm-3.col-form-label.pb-0 Checkboxes
|
||||
.col-sm-9
|
||||
.mb-0
|
||||
.form-check.form-check-inline.checkbox.checkbox-primary
|
||||
input#inline-form-1.form-check-input(type='checkbox')
|
||||
label.form-check-label(for='inline-form-1') Option 1
|
||||
.form-check.form-check-inline.checkbox.checkbox-primary
|
||||
input#inline-form-2.form-check-input(type='checkbox')
|
||||
label.form-check-label(for='inline-form-2') Option 1
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary Submit
|
||||
button.btn.btn-secondary Cancel
|
||||
.col-sm-12.col-xl-6
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Mega form
|
||||
.card-body
|
||||
form.theme-form.mega-form
|
||||
h6 Account Information
|
||||
.mb-3
|
||||
label.col-form-label Your Name
|
||||
input.form-control(type='text' placeholder='your Name')
|
||||
.mb-3
|
||||
label.col-form-label Email Address
|
||||
input.form-control(type='email' placeholder='Enter email')
|
||||
.mb-3
|
||||
label.col-form-label Contact Number
|
||||
input.form-control(type='Number' placeholder='Enter contact number')
|
||||
hr.mt-4.mb-4
|
||||
h6 Company Information
|
||||
.mb-3
|
||||
label.col-form-label Company Name
|
||||
input.form-control(type='text', placeholder='Company Name')
|
||||
.mb-3
|
||||
label.col-form-label Website
|
||||
input.form-control(type='text', placeholder='Website')
|
||||
hr.mt-4.mb-4
|
||||
h6.pb-3.mb-0 Billing Information
|
||||
form.form-space.theme-form.row
|
||||
.col-auto
|
||||
input.form-control(type='text' placeholder='Name On Card')
|
||||
.col-auto
|
||||
input.form-control(type='text' name='inputPassword' placeholder='Card Number')
|
||||
.col-auto
|
||||
input.form-control(type='text' name='inputPassword' placeholder='Zip Code')
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary Submit
|
||||
button.btn.btn-secondary Cancel
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Inline Form
|
||||
span
|
||||
| Use
|
||||
code .form-inline
|
||||
| class in the form to style with inline fields.
|
||||
.card-body
|
||||
h6 Inline Form with Label
|
||||
form.row.theme-form.mt-3
|
||||
.col-xxl-4.mb-3.d-flex.align-items-center
|
||||
label.col-form-label.pe-2(for='inputInlineUsername') Username
|
||||
input#inputInlineUsername.form-control(type='text' name='inputUsername' placeholder='Username' autocomplete='off')
|
||||
.col-xxl-4.mb-3.d-flex.align-items-center
|
||||
label.col-form-label.pe-2(for='inputInlinePassword') Password
|
||||
input#inputInlinePassword.form-control(type='password' name='inputPassword' placeholder='Password' autocomplete='off')
|
||||
.col-xxl-4.mb-3.d-flex.align-items-center
|
||||
button.btn.btn-primary Login
|
||||
h6 Inline Form without Label
|
||||
form.row.row-cols-sm-3.theme-form.mt-3.form-bottom.align-items-center.g-2
|
||||
.d-flex
|
||||
input.form-control(type='text' name='inputUnlabelUsername' placeholder='Username' autocomplete='off')
|
||||
.d-flex
|
||||
input#inputUnlabelPassword.form-control(type='password' name='inputPassword' placeholder='Password' autocomplete='off')
|
||||
.d-flex
|
||||
button.btn.btn-secondary Login
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
94
static/admin/assets/pug/pages/theme/dragable-card.pug
Normal file
94
static/admin/assets/pug/pages/theme/dragable-card.pug
Normal file
@@ -0,0 +1,94 @@
|
||||
- var theme_customizer = true;
|
||||
- var jquery_ui = true;
|
||||
- var dragable = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Draggable Card
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Bonus Ui
|
||||
li.breadcrumb-item.active Draggable Card
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
#draggableMultiple.row.ui-sortable
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Basic Card
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card.b-r-0
|
||||
.card-header
|
||||
h5 Flat Card
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card.shadow-none.border
|
||||
.card-header
|
||||
h5 Without shadow Card
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
i.icon-move.me-2
|
||||
| Icon in Heading
|
||||
.card-body
|
||||
p
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Card sub Title
|
||||
span
|
||||
| Using the
|
||||
a(href='#') card
|
||||
| component, you can extend the default collapse behavior to create an accordion.
|
||||
.card-body
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the.
|
||||
.col-sm-12.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 Card sub Title
|
||||
span
|
||||
| Using the
|
||||
a(href='#') card
|
||||
| component, you can extend the default collapse behavior to create an accordion.
|
||||
.card-body
|
||||
p.mb-0
|
||||
| Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
1085
static/admin/assets/pug/pages/theme/dropdown.pug
Normal file
1085
static/admin/assets/pug/pages/theme/dropdown.pug
Normal file
File diff suppressed because it is too large
Load Diff
81
static/admin/assets/pug/pages/theme/dropzone.pug
Normal file
81
static/admin/assets/pug/pages/theme/dropzone.pug
Normal file
@@ -0,0 +1,81 @@
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
- var dropzone = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Dropzone
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Bonus Ui
|
||||
li.breadcrumb-item.active Dropzone
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Single File Upload
|
||||
.card-body
|
||||
form#singleFileUpload.dropzone(action='/upload.php')
|
||||
.dz-message.needsclick
|
||||
i.icon-cloud-up
|
||||
h6 Drop files here or click to upload.
|
||||
span.note.needsclick
|
||||
| (This is just a demo dropzone. Selected files are
|
||||
strong not
|
||||
| actually uploaded.)
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Multi File Upload
|
||||
.card-body
|
||||
form#multiFileUpload.dropzone.dropzone-primary(action='/upload.php')
|
||||
.dz-message.needsclick
|
||||
i.icon-cloud-up
|
||||
h6 Drop files here or click to upload.
|
||||
span.note.needsclick
|
||||
| (This is just a demo dropzone. Selected files are
|
||||
strong not
|
||||
| actually uploaded.)
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 File Type Validation
|
||||
.card-body
|
||||
form#fileTypeValidation.dropzone.dropzone-info(action='/upload.php')
|
||||
.dz-message.needsclick
|
||||
i.icon-cloud-up
|
||||
h6 Drop files here or click to upload.
|
||||
span.note.needsclick
|
||||
| (This is just a demo dropzone. Selected files are
|
||||
strong not
|
||||
| actually uploaded.)
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
146
static/admin/assets/pug/pages/theme/echarts.pug
Normal file
146
static/admin/assets/pug/pages/theme/echarts.pug
Normal file
@@ -0,0 +1,146 @@
|
||||
- var theme_customizer = true;
|
||||
- var echart = true;
|
||||
- var echart_pie = true;
|
||||
- var page_echart = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.sidebar-icon
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Echarts
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Charts
|
||||
li.breadcrumb-item.active Echarts
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5
|
||||
| Basic Area Chart
|
||||
.card-body
|
||||
#area-echart.apache-cotainer
|
||||
.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Area pie chart
|
||||
.card-body
|
||||
#echart-pie.apache-cotainer
|
||||
.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Bar polar chart
|
||||
.card-body
|
||||
#echart-polar.apache-cotainer
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Bar chart
|
||||
.card-body
|
||||
#echart-bar.apache-cotainer-large
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Bar chart 2
|
||||
.card-body
|
||||
#echart-bar2.apache-cotainer-large
|
||||
.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Boxplot chart
|
||||
.card-body
|
||||
#echart-boxplot.apache-cotainer.boxplot-cotainer
|
||||
.col-xl-6.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 lines clip chart
|
||||
.card-body.clip-chart-wrapper
|
||||
#lines-clip.apache-cotainer
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header
|
||||
h5 line visual chart
|
||||
.card-body
|
||||
#line-visual.apache-cotainer
|
||||
.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 angle chart
|
||||
.card-body
|
||||
#texture-bar-by-clipPath.apache-cotainer
|
||||
.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 gauge chart
|
||||
.card-body
|
||||
#echart-gauge.apache-cotainer
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header
|
||||
h5 line visual chart 2
|
||||
.card-body
|
||||
#line-visulH.apache-cotainer
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-header
|
||||
h5 pictorial repeat chart
|
||||
.card-body
|
||||
#dynamic-data.apache-cotainer
|
||||
.col-xl-6.xl-100.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 radar chart
|
||||
.card-body
|
||||
#echart-radar.apache-cotainer
|
||||
.col-xl-6.xl-100.box-col-12
|
||||
.card
|
||||
.card-header
|
||||
h5 polar line chart
|
||||
.card-body
|
||||
#main0.apache-container.polar-line
|
||||
.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 pie rich text chart
|
||||
.card-body
|
||||
#echart-pierich.apache-container
|
||||
.col-xl-6
|
||||
.card
|
||||
.card-header
|
||||
h5 pictorial single chart
|
||||
.card-body
|
||||
#dotted.apache-container
|
||||
.col-xl-12
|
||||
.card.note.p-20.d-inline-block.w-100
|
||||
| Echarts for more options please refer
|
||||
a(href="https://echarts.apache.org/examples/en/index.html" target="_blank") echart Official site
|
||||
| And
|
||||
a(href="https://github.com/apache/echarts" target="_blank") githup link
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
271
static/admin/assets/pug/pages/theme/ecommerce-templates.pug
Normal file
271
static/admin/assets/pug/pages/theme/ecommerce-templates.pug
Normal file
@@ -0,0 +1,271 @@
|
||||
doctype html
|
||||
html(lang='en')
|
||||
head
|
||||
meta(http-equiv='Content-Type', content='text/html; charset=UTF-8')
|
||||
meta(http-equiv='X-UA-Compatible', content='IE=edge')
|
||||
meta(name='viewport', content='width=device-width, initial-scale=1.0')
|
||||
link(rel='icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
link(rel='shortcut icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
title Cuba - Premium Admin Template
|
||||
link(href='https://fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700,800,900', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i', rel='stylesheet')
|
||||
style(type='text/css').
|
||||
body{
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
width: 650px;
|
||||
font-family: work-Sans, sans-serif;
|
||||
background-color: #f6f7fb;
|
||||
display: block;
|
||||
}
|
||||
ul{
|
||||
margin:0;
|
||||
padding: 0;
|
||||
}
|
||||
li{
|
||||
display: inline-block;
|
||||
text-decoration: unset;
|
||||
}
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
p{
|
||||
margin: 15px 0;
|
||||
}
|
||||
h5{
|
||||
color:#444;
|
||||
text-align:left;
|
||||
font-weight:400;
|
||||
}
|
||||
.text-center{
|
||||
text-align: center
|
||||
}
|
||||
.main-bg-light{
|
||||
background-color: #fafafa;
|
||||
box-shadow: 0px 0px 14px -4px rgba(0, 0, 0, 0.2705882353);
|
||||
}
|
||||
.title{
|
||||
color: #444444;
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
padding-bottom: 0;
|
||||
text-transform: uppercase;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
}
|
||||
table{
|
||||
margin-top:30px
|
||||
}
|
||||
table.top-0{
|
||||
margin-top:0;
|
||||
}
|
||||
table.order-detail {
|
||||
border: 1px solid #ddd;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
table.order-detail tr:nth-child(even) {
|
||||
border-top:1px solid #ddd;
|
||||
border-bottom:1px solid #ddd;
|
||||
}
|
||||
table.order-detail tr:nth-child(odd) {
|
||||
border-bottom:1px solid #ddd;
|
||||
}
|
||||
.pad-left-right-space{
|
||||
border: unset !important;
|
||||
}
|
||||
.pad-left-right-space td{
|
||||
padding: 5px 15px;
|
||||
}
|
||||
.pad-left-right-space td p{
|
||||
margin: 0;
|
||||
}
|
||||
.pad-left-right-space td b{
|
||||
font-size:15px;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
}
|
||||
.order-detail th{
|
||||
font-size:16px;
|
||||
padding:15px;
|
||||
text-align:center;
|
||||
background: #fafafa;
|
||||
}
|
||||
.footer-social-icon tr td img{
|
||||
margin-left:5px;
|
||||
margin-right:5px;
|
||||
}
|
||||
body(style='margin: 20px auto;')
|
||||
table(align='center', border='0', cellpadding='0', cellspacing='0', style='padding: 0 30px;background-color: #fff; -webkit-box-shadow: 0px 0px 14px -4px rgba(0, 0, 0, 0.2705882353);box-shadow: 0px 0px 14px -4px rgba(0, 0, 0, 0.2705882353);width: 100%;')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
table(align='left', border='0', cellpadding='0', cellspacing='0', style='text-align: left;', width='100%')
|
||||
tbody
|
||||
tr
|
||||
td(style='text-align: center;')
|
||||
img(src='../assets/images/email-template/delivery-2.png', alt='', style=';margin-bottom: 30px;')
|
||||
tr
|
||||
td
|
||||
p(style='font-size: 14px;')
|
||||
b Hi John Doe,
|
||||
p(style='font-size: 14px;') Order Is Successfully Processsed And Your Order Is On The Way,
|
||||
p(style='font-size: 14px;') Transaction ID : 267676GHERT105467,
|
||||
table(cellpadding='0', cellspacing='0', border='0', align='left', style='width: 100%;margin-top: 10px; margin-bottom: 10px;')
|
||||
tbody
|
||||
tr
|
||||
td(style='background-color: #fafafa;border: 1px solid #ddd;padding: 15px;letter-spacing: 0.3px;width: 50%;')
|
||||
h5(style='font-size: 16px; font-weight: 600;color: #000; line-height: 16px; padding-bottom: 13px; border-bottom: 1px solid #e6e8eb; letter-spacing: -0.65px; margin-top:0; margin-bottom: 13px;') Your Shipping Address
|
||||
p(style='text-align: left;font-weight: normal; font-size: 14px; color: #000000;line-height: 21px; margin-top: 0;')
|
||||
| 268 Cambridge Lane New Albany,
|
||||
br
|
||||
| IN 47150268 Cambridge Lane
|
||||
br
|
||||
| New Albany, IN 47150
|
||||
td
|
||||
img(src='../assets/images/email-template/space.jpg', alt=' ', height='25', width='30')
|
||||
td(style='background-color: #fafafa;border: 1px solid #ddd;padding: 15px;letter-spacing: 0.3px;width: 50%;')
|
||||
h5(style='font-size: 16px;font-weight: 600;color: #000; line-height: 16px; padding-bottom: 13px; border-bottom: 1px solid #e6e8eb; letter-spacing: -0.65px; margin-top:0; margin-bottom: 13px;') Your Billing Address:
|
||||
p(style='text-align: left;font-weight: normal; font-size: 14px; color: #000000;line-height: 21px; margin-top: 0;')
|
||||
| 268 Cambridge Lane New Albany,
|
||||
br
|
||||
| IN 47150268 Cambridge Lane
|
||||
br
|
||||
| New Albany, IN 47150
|
||||
table.order-detail(border='0', cellpadding='0', cellspacing='0', align='left', style='width: 100%; margin-bottom: 50px;')
|
||||
tbody
|
||||
tr(align='left')
|
||||
th PRODUCT
|
||||
th(style='padding-left: 15px;') DESCRIPTION
|
||||
th QUANTITY
|
||||
th PRICE
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/4.png', alt='', width='80')
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='margin-top: 15px;') Three seater Wood Style sofa for Leavingroom
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px; margin-bottom: 0px;')
|
||||
| Size :
|
||||
span L
|
||||
h5(style='font-size: 14px; color:#444;margin-top: 10px;')
|
||||
| QTY :
|
||||
span 1
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px')
|
||||
b $500
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/1.png', alt='', width='80')
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='margin-top: 15px;') Three seater Wood Style sofa for Leavingroom
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px; margin-bottom: 0px;')
|
||||
| Size :
|
||||
span L
|
||||
h5(style='font-size: 14px; color:#444;margin-top: 10px;')
|
||||
| QTY :
|
||||
span 1
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px')
|
||||
b $500
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/4.png', alt='', width='80')
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='margin-top: 15px;') Three seater Wood Style sofa for Leavingroom
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px; margin-bottom: 0px;')
|
||||
| Size :
|
||||
span L
|
||||
h5(style='font-size: 14px; color:#444;margin-top: 10px;')
|
||||
| QTY :
|
||||
span 1
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px')
|
||||
b $500
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/1.png', alt='', width='80')
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='margin-top: 15px;') Three seater Wood Style sofa for Leavingroom
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px; margin-bottom: 0px;')
|
||||
| Size :
|
||||
span L
|
||||
h5(style='font-size: 14px; color:#444;margin-top: 10px;')
|
||||
| QTY :
|
||||
span 1
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px')
|
||||
b $500
|
||||
tr.pad-left-right-space
|
||||
td.m-t-5(colspan='2', align='left')
|
||||
p(style='font-size: 14px;') Subtotal :
|
||||
td.m-t-5(colspan='2', align='right')
|
||||
b(style='') $2000
|
||||
tr.pad-left-right-space
|
||||
td(colspan='2', align='left')
|
||||
p(style='font-size: 14px;') TAX :
|
||||
td(colspan='2', align='right')
|
||||
b $5
|
||||
tr.pad-left-right-space
|
||||
td(colspan='2', align='left')
|
||||
p(style='font-size: 14px;') VAT :
|
||||
td(colspan='2', align='right')
|
||||
b $5
|
||||
tr.pad-left-right-space
|
||||
td(colspan='2', align='left')
|
||||
p(style='font-size: 14px;') SHIPPING Charge :
|
||||
td(colspan='2', align='right')
|
||||
b $2
|
||||
tr.pad-left-right-space
|
||||
td(colspan='2', align='left')
|
||||
p(style='font-size: 14px;') Discount :
|
||||
td(colspan='2', align='right')
|
||||
b $1000
|
||||
tr.pad-left-right-space
|
||||
td.m-b-5(colspan='2', align='left')
|
||||
p(style='font-size: 14px;') Total :
|
||||
td.m-b-5(colspan='2', align='right')
|
||||
b $2600
|
||||
table.main-bg-light.text-center.top-0(align='center', border='0', cellpadding='0', cellspacing='0', width='100%')
|
||||
tbody
|
||||
tr
|
||||
td(style='padding: 30px;')
|
||||
div
|
||||
h4.title(style='margin:0;text-align: center;') Follow us
|
||||
table.footer-social-icon(border='0', cellpadding='0', cellspacing='0', align='center', style='margin-top:20px;')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/facebook.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/youtube.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/twitter.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/gplus.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/linkedin.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/pinterest.png', alt='')
|
||||
div(style='border-top: 1px solid #ddd; margin: 20px auto 0;')
|
||||
table(border='0', cellpadding='0', cellspacing='0', width='100%', style='margin: 20px auto 0;')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
a(href='#', style='font-size:13px') Want to change how you receive these emails?
|
||||
tr
|
||||
td
|
||||
p(style='font-size:13px; margin:0;') 2018 - 19 Copy Right by Themeforest powerd by Pixel Strap
|
||||
tr
|
||||
td
|
||||
a(href='#', style='font-size:13px; margin:0;text-decoration: underline;') Unsubscribe
|
||||
254
static/admin/assets/pug/pages/theme/edit-profile.pug
Normal file
254
static/admin/assets/pug/pages/theme/edit-profile.pug
Normal file
@@ -0,0 +1,254 @@
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Edit Profile
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Users
|
||||
li.breadcrumb-item.active Edit Profile
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.edit-profile
|
||||
.row
|
||||
.col-xl-4
|
||||
.card
|
||||
.card-header
|
||||
h4.card-title.mb-0 My Profile
|
||||
.card-options
|
||||
a.card-options-collapse(href='#', data-bs-toggle='card-collapse')
|
||||
i.fe.fe-chevron-up
|
||||
a.card-options-remove(href='#', data-bs-toggle='card-remove')
|
||||
i.fe.fe-x
|
||||
.card-body
|
||||
form
|
||||
.row.mb-2
|
||||
.profile-title
|
||||
.media
|
||||
img.img-70.rounded-circle(alt='', src='../assets/images/user/7.jpg')
|
||||
.media-body
|
||||
h5.mb-1 MARK JECNO
|
||||
p DESIGNER
|
||||
.mb-3
|
||||
h6.form-label Bio
|
||||
textarea.form-control(rows='5') On the other hand, we denounce with righteous indignation
|
||||
.mb-3
|
||||
label.form-label Email-Address
|
||||
input.form-control(placeholder='your-email@domain.com')
|
||||
.mb-3
|
||||
label.form-label Password
|
||||
input.form-control(type='password', value='password')
|
||||
.mb-3
|
||||
label.form-label Website
|
||||
input.form-control(placeholder='http://Uplor .com')
|
||||
.form-footer
|
||||
button.btn.btn-primary.btn-block Save
|
||||
.col-xl-8
|
||||
form.card
|
||||
.card-header
|
||||
h4.card-title.mb-0 Edit Profile
|
||||
.card-options
|
||||
a.card-options-collapse(href='#', data-bs-toggle='card-collapse')
|
||||
i.fe.fe-chevron-up
|
||||
a.card-options-remove(href='#', data-bs-toggle='card-remove')
|
||||
i.fe.fe-x
|
||||
.card-body
|
||||
.row
|
||||
.col-md-5
|
||||
.mb-3
|
||||
label.form-label Company
|
||||
input.form-control(type='text', placeholder='Company')
|
||||
.col-sm-6.col-md-3
|
||||
.mb-3
|
||||
label.form-label Username
|
||||
input.form-control(type='text', placeholder='Username')
|
||||
.col-sm-6.col-md-4
|
||||
.mb-3
|
||||
label.form-label Email address
|
||||
input.form-control(type='email', placeholder='Email')
|
||||
.col-sm-6.col-md-6
|
||||
.mb-3
|
||||
label.form-label First Name
|
||||
input.form-control(type='text', placeholder='Company')
|
||||
.col-sm-6.col-md-6
|
||||
.mb-3
|
||||
label.form-label Last Name
|
||||
input.form-control(type='text', placeholder='Last Name')
|
||||
.col-md-12
|
||||
.mb-3
|
||||
label.form-label Address
|
||||
input.form-control(type='text', placeholder='Home Address')
|
||||
.col-sm-6.col-md-4
|
||||
.mb-3
|
||||
label.form-label City
|
||||
input.form-control(type='text', placeholder='City')
|
||||
.col-sm-6.col-md-3
|
||||
.mb-3
|
||||
label.form-label Postal Code
|
||||
input.form-control(type='number', placeholder='ZIP Code')
|
||||
.col-md-5
|
||||
.mb-3
|
||||
label.form-label Country
|
||||
select.form-control.btn-square
|
||||
option(value='0') --Select--
|
||||
option(value='1') Germany
|
||||
option(value='2') Canada
|
||||
option(value='3') Usa
|
||||
option(value='4') Aus
|
||||
.col-md-12
|
||||
div
|
||||
label.form-label About Me
|
||||
textarea.form-control(rows='4', placeholder='Enter About your description')
|
||||
.card-footer.text-end
|
||||
button.btn.btn-primary(type='submit') Update Profile
|
||||
.col-md-12
|
||||
.card
|
||||
.card-header
|
||||
h4.card-title.mb-0 Add projects And Upload
|
||||
.card-options
|
||||
a.card-options-collapse(href='#', data-bs-toggle='card-collapse')
|
||||
i.fe.fe-chevron-up
|
||||
a.card-options-remove(href='#', data-bs-toggle='card-remove')
|
||||
i.fe.fe-x
|
||||
.table-responsive.add-project
|
||||
table.table.card-table.table-vcenter.text-nowrap
|
||||
thead
|
||||
tr
|
||||
th Project Name
|
||||
th Date
|
||||
th Status
|
||||
th Price
|
||||
th
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
a.text-inherit(href='#') Untrammelled prevents
|
||||
td 28 May 2018
|
||||
td
|
||||
span.status-icon.bg-success
|
||||
| Completed
|
||||
td $56,908
|
||||
td.text-end
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-primary.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-pencil
|
||||
| Edit
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-transparent.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-link
|
||||
| Update
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-danger.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-trash
|
||||
| Delete
|
||||
tr
|
||||
td
|
||||
a.text-inherit(href='#') Untrammelled prevents
|
||||
td 12 June 2018
|
||||
td
|
||||
span.status-icon.bg-danger
|
||||
| On going
|
||||
td $45,087
|
||||
td.text-end
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-primary.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-pencil
|
||||
| Edit
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-transparent.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-link
|
||||
| Update
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-danger.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-trash
|
||||
| Delete
|
||||
tr
|
||||
td
|
||||
a.text-inherit(href='#') Untrammelled prevents
|
||||
td 12 July 2018
|
||||
td
|
||||
span.status-icon.bg-warning
|
||||
| Pending
|
||||
td $60,123
|
||||
td.text-end
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-primary.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-pencil
|
||||
| Edit
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-transparent.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-link
|
||||
| Update
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-danger.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-trash
|
||||
| Delete
|
||||
tr
|
||||
td
|
||||
a.text-inherit(href='#') Untrammelled prevents
|
||||
td 14 June 2018
|
||||
td
|
||||
span.status-icon.bg-warning
|
||||
| Pending
|
||||
td $70,435
|
||||
td.text-end
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-primary.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-pencil
|
||||
| Edit
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-transparent.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-link
|
||||
| Update
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-danger.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-trash
|
||||
| Delete
|
||||
tr
|
||||
td
|
||||
a.text-inherit(href='#') Untrammelled prevents
|
||||
td 25 June 2018
|
||||
td
|
||||
span.status-icon.bg-success
|
||||
| Completed
|
||||
td $15,987
|
||||
td.text-end
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-primary.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-pencil
|
||||
| Edit
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-transparent.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-link
|
||||
| Update
|
||||
a.icon(href='javascript:void(0)')
|
||||
a.btn.btn-danger.btn-sm(href='javascript:void(0)')
|
||||
i.fa.fa-trash
|
||||
| Delete
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
317
static/admin/assets/pug/pages/theme/email-application.pug
Normal file
317
static/admin/assets/pug/pages/theme/email-application.pug
Normal file
@@ -0,0 +1,317 @@
|
||||
- var theme_customizer = true;
|
||||
- var ckeditor = true;
|
||||
- var email_app = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Email Application
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Email
|
||||
li.breadcrumb-item.active Email Application
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.email-wrap
|
||||
.row
|
||||
.col-xl-3.box-col-12
|
||||
.md-sidebar
|
||||
a.btn.btn-primary.md-sidebar-toggle(href='javascript:void(0)') email filter
|
||||
.md-sidebar-aside.job-left-aside.custom-scrollbar
|
||||
.email-left-aside
|
||||
.card
|
||||
.card-body
|
||||
.email-app-sidebar
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6.f-w-600 MARKJENCO
|
||||
p Markjecno@gmail.com
|
||||
ul.nav.main-menu(role='tablist')
|
||||
li.nav-item
|
||||
a#pills-darkhome-tab.btn-primary.btn-block.btn-mail.w-100(data-bs-toggle='pill', href='#pills-darkhome', role='tab', aria-controls='pills-darkhome', aria-selected='true')
|
||||
i.icofont.icofont-envelope.me-2
|
||||
| NEW MAIL
|
||||
li.nav-item
|
||||
a#pills-darkprofile-tab.show(data-bs-toggle='pill', href='#pills-darkprofile', role='tab', aria-controls='pills-darkprofile', aria-selected='false')
|
||||
span.title
|
||||
i.icon-import
|
||||
| Inbox
|
||||
span.badge.pull-right (236)
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-folder
|
||||
| All mail
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-new-window
|
||||
| Sent
|
||||
span.badge.pull-right (69)
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-pencil-alt
|
||||
| DRAFT
|
||||
span.badge.pull-right (59)
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-trash
|
||||
| TRASH
|
||||
span.badge.pull-right (99)
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-info-alt
|
||||
| IMPORTANT
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-star
|
||||
| Starred
|
||||
li
|
||||
hr
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-email
|
||||
| UNREAD
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-export
|
||||
| SPAM
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-share
|
||||
| OUTBOX
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-file
|
||||
| UPDATE
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-bell
|
||||
| ALERT
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-notepad
|
||||
| NOTES
|
||||
span.badge.pull-right (20)
|
||||
.col-xl-9.box-col-12
|
||||
.email-right-aside
|
||||
.card.email-body
|
||||
.row
|
||||
.col-xl-4.col-md-12.box-md-12.pr-0
|
||||
.pe-0.b-r-light
|
||||
.email-top
|
||||
.row
|
||||
.col
|
||||
h5 Inbox
|
||||
.col.text-end
|
||||
.dropdown
|
||||
button#dropdownMenuButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
| More
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='dropdownMenuButton')
|
||||
a.dropdown-item(href='#') Action
|
||||
a.dropdown-item(href='#') Another action
|
||||
a.dropdown-item(href='#') Something else here
|
||||
.inbox
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Pork Lorn
|
||||
small
|
||||
span (15
|
||||
| July
|
||||
span 2018)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media.active
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Lorm lpsa
|
||||
small
|
||||
span (20
|
||||
| January)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Hileri makr
|
||||
small
|
||||
span (20
|
||||
| Aug
|
||||
span 2018)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Lion Lorpa
|
||||
small
|
||||
span (02
|
||||
| Jun
|
||||
span 2016)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6.mt-0
|
||||
| Solvn Relto
|
||||
small
|
||||
span (25
|
||||
| July
|
||||
span 2015)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Repro Soft
|
||||
small
|
||||
span (15
|
||||
| July
|
||||
span 2018)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Lion Lorpa
|
||||
small
|
||||
span (02
|
||||
| Jun
|
||||
span 2016)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.col-xl-8.col-md-12.box-md-12.pl-0
|
||||
.email-right-aside
|
||||
.email-body.radius-left
|
||||
.ps-0
|
||||
.tab-content
|
||||
#pills-darkhome.tab-pane.fade(role='tabpanel', aria-labelledby='pills-darkhome-tab')
|
||||
.email-compose
|
||||
.email-top.compose-border
|
||||
.row
|
||||
.col-sm-8.xl-50
|
||||
h4.mb-0 New Message
|
||||
.col-sm-4.btn-middle.xl-50
|
||||
button.btn.btn-primary.btn-block.btn-mail.text-center.mb-0.mt-0.w-100(type='button')
|
||||
i.fa.fa-paper-plane.me-2
|
||||
| SEND
|
||||
.email-wrapper
|
||||
form.theme-form
|
||||
.mb-3
|
||||
label.col-form-label.pt-0(for='exampleInputEmail1') To
|
||||
input#exampleInputEmail1.form-control(type='email')
|
||||
.mb-3
|
||||
label(for='exampleInputPassword1') Subject
|
||||
input#exampleInputPassword1.form-control(type='text')
|
||||
div
|
||||
label.text-muted Message
|
||||
textarea#text-box(name='text-box', cols='10', rows='2')
|
||||
#pills-darkprofile.tab-pane.fade.active.show(role='tabpanel', aria-labelledby='pills-darkprofile-tab')
|
||||
.email-content
|
||||
.email-top
|
||||
.row
|
||||
.col-md-6.xl-100.col-sm-12
|
||||
.media
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Lorm lpsa
|
||||
small
|
||||
span (20
|
||||
| January)
|
||||
span 6:00
|
||||
| AM
|
||||
p Mattis luctus. Donec nisi diam text.
|
||||
.col-md-6.col-sm-12.xl-100
|
||||
.float-end.d-flex
|
||||
p.user-emailid
|
||||
| Lormlpsa
|
||||
span 23
|
||||
| @company.com
|
||||
i.fa.fa-star-o.f-18.mt-1
|
||||
.email-wrapper
|
||||
p Hello
|
||||
p Dear Sir Good Morning,
|
||||
h5 Elementum varius nisi vel tempus. Donec eleifend egestas viverra.
|
||||
p.m-b-20
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur non diam facilisis, commodo libero et, commodo sapien. Pellentesque sollicitudin massa sagittis dolor facilisis, sit amet vulputate nunc molestie. Pellentesque maximus nibh id luctus porta. Ut consectetur dui nec nulla mattis luctus. Donec nisi diam, congue vitae felis at, ullamcorper bibendum tortor. Vestibulum pellentesque felis felis. Etiam ac tortor felis. Ut elit arcu, rhoncus in laoreet vel, gravida sed tortor.
|
||||
p
|
||||
| In elementum varius nisi vel tempus. Donec eleifend egestas viverra. Donec dapibus sollicitudin blandit. Donec scelerisque purus sit amet feugiat efficitur. Quisque feugiat semper sapien vel hendrerit. Mauris lacus felis, consequat nec pellentesque viverra, venenatis a lorem. Sed urna
|
||||
hr
|
||||
.d-inline-block
|
||||
h6.text-muted
|
||||
i.icofont.icofont-clip
|
||||
| ATTACHMENTS
|
||||
a.text-muted.text-end.right-download(href='#')
|
||||
i.fa.fa-long-arrow-down.me-2
|
||||
| Download All
|
||||
.clearfix
|
||||
.attachment
|
||||
ul.list-inline
|
||||
li.list-inline-item
|
||||
img.img-fluid(src='../assets/images/email/1.jpg', alt='')
|
||||
li.list-inline-item
|
||||
img.img-fluid(src='../assets/images/email/2.jpg', alt='')
|
||||
li.list-inline-item
|
||||
img.img-fluid(src='../assets/images/email/3.jpg', alt='')
|
||||
hr
|
||||
.action-wrapper
|
||||
ul.actions
|
||||
li
|
||||
a.text-muted(href='#')
|
||||
i.fa.fa-reply.me-2
|
||||
| Reply
|
||||
li
|
||||
a.text-muted(href='#')
|
||||
i.fa.fa-reply-all.me-2
|
||||
| Reply All
|
||||
li
|
||||
a.text-muted(href='#')
|
||||
i.fa.fa-share.me-2
|
||||
| Forward
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
317
static/admin/assets/pug/pages/theme/email-compose.pug
Normal file
317
static/admin/assets/pug/pages/theme/email-compose.pug
Normal file
@@ -0,0 +1,317 @@
|
||||
- var theme_customizer = true;
|
||||
- var ckeditor = true;
|
||||
- var email_app = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Email Compose
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Email
|
||||
li.breadcrumb-item.active Email Compose
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.email-wrap
|
||||
.row
|
||||
.col-xl-3.box-col-12
|
||||
.md-sidebar
|
||||
a.btn.btn-primary.md-sidebar-toggle(href='javascript:void(0)') email filter
|
||||
.md-sidebar-aside.job-left-aside.custom-scrollbar
|
||||
.email-left-aside
|
||||
.card
|
||||
.card-body
|
||||
.email-app-sidebar
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6.f-w-600 MARKJENCO
|
||||
p Markjecno@gmail.com
|
||||
ul.nav.main-menu(role='tablist')
|
||||
li.nav-item
|
||||
a#pills-darkhome-tab.btn-primary.btn-block.btn-mail.show(data-bs-toggle='pill', href='#pills-darkhome', role='tab', aria-controls='pills-darkhome', aria-selected='true')
|
||||
i.icofont.icofont-envelope.me-2
|
||||
| NEW MAIL
|
||||
li.nav-item
|
||||
a#pills-darkprofile-tab(data-bs-toggle='pill', href='#pills-darkprofile', role='tab', aria-controls='pills-darkprofile', aria-selected='false')
|
||||
span.title
|
||||
i.icon-import
|
||||
| Inbox
|
||||
span.badge.pull-right (236)
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-folder
|
||||
| All mail
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-new-window
|
||||
| Sent
|
||||
span.badge.pull-right (69)
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-pencil-alt
|
||||
| DRAFT
|
||||
span.badge.pull-right (59)
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-trash
|
||||
| TRASH
|
||||
span.badge.pull-right (99)
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-info-alt
|
||||
| IMPORTANT
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-star
|
||||
| Starred
|
||||
li
|
||||
hr
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-email
|
||||
| UNREAD
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-export
|
||||
| SPAM
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-share
|
||||
| OUTBOX
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-file
|
||||
| UPDATE
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-bell
|
||||
| ALERT
|
||||
li
|
||||
a(href='#')
|
||||
span.title
|
||||
i.icon-notepad
|
||||
| NOTES
|
||||
span.badge.pull-right (20)
|
||||
.col-xl-9.box-col-12
|
||||
.email-right-aside
|
||||
.card.email-body
|
||||
.row
|
||||
.col-xl-4.col-md-12.box-md-12.pr-0
|
||||
.pe-0.b-r-light
|
||||
.email-top
|
||||
.row
|
||||
.col
|
||||
h5 Inbox
|
||||
.col.text-end
|
||||
.dropdown
|
||||
button#dropdownMenuButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
|
||||
| More
|
||||
.dropdown-menu.dropdown-menu-end(aria-labelledby='dropdownMenuButton')
|
||||
a.dropdown-item(href='#') Action
|
||||
a.dropdown-item(href='#') Another action
|
||||
a.dropdown-item(href='#') Something else here
|
||||
.inbox
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Pork Lorn
|
||||
small
|
||||
span (15
|
||||
| July
|
||||
span 2018)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media.active
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Lorm lpsa
|
||||
small
|
||||
span (20
|
||||
| January)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Hileri makr
|
||||
small
|
||||
span (20
|
||||
| Aug
|
||||
span 2018)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Lion Lorpa
|
||||
small
|
||||
span (02
|
||||
| Jun
|
||||
span 2016)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6.mt-0
|
||||
| Solvn Relto
|
||||
small
|
||||
span (25
|
||||
| July
|
||||
span 2015)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media
|
||||
.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Repro Soft
|
||||
small
|
||||
span (15
|
||||
| July
|
||||
span 2018)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.media.media-size-email
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Lion Lorpa
|
||||
small
|
||||
span (02
|
||||
| Jun
|
||||
span 2016)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.col-xl-8.col-md-12.box-md-12.pl-0
|
||||
.email-right-aside
|
||||
.email-body.radius-left
|
||||
.ps-0
|
||||
.tab-content
|
||||
#pills-darkhome.tab-pane.fade.active.show(role='tabpanel', aria-labelledby='pills-darkhome-tab')
|
||||
.email-compose
|
||||
.email-top.compose-border
|
||||
.row
|
||||
.col-sm-8.xl-50
|
||||
h4.mb-0 New Message
|
||||
.col-sm-4.btn-middle.xl-50
|
||||
button.btn.btn-primary.btn-block.btn-mail.text-center.mb-0.mt-0.w-100(type='button')
|
||||
i.fa.fa-paper-plane.me-2
|
||||
| SEND
|
||||
.email-wrapper
|
||||
form.theme-form
|
||||
.mb-3
|
||||
label.col-form-label.pt-0(for='exampleInputEmail1') To
|
||||
input#exampleInputEmail1.form-control(type='email')
|
||||
.mb-3
|
||||
label(for='exampleInputPassword1') Subject
|
||||
input#exampleInputPassword1.form-control(type='text')
|
||||
div
|
||||
label.text-muted Message
|
||||
textarea#text-box(name='text-box', cols='10', rows='2')
|
||||
#pills-darkprofile.tab-pane.fade(role='tabpanel', aria-labelledby='pills-darkprofile-tab')
|
||||
.email-content
|
||||
.email-top
|
||||
.row
|
||||
.col-md-6.xl-100.col-sm-12
|
||||
.media
|
||||
img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
|
||||
.media-body
|
||||
h6
|
||||
| Lorm lpsa
|
||||
small
|
||||
span (20
|
||||
| January)
|
||||
span 6:00
|
||||
| AM
|
||||
p Mattis luctus. Donec nisi diam text.
|
||||
.col-md-6.col-sm-12.xl-100
|
||||
.float-end.d-flex
|
||||
p.user-emailid
|
||||
| Lormlpsa
|
||||
span 23
|
||||
| @company.com
|
||||
i.fa.fa-star-o.f-18.mt-1
|
||||
.email-wrapper
|
||||
p Hello
|
||||
p Dear Sir Good Morning,
|
||||
h5 Elementum varius nisi vel tempus. Donec eleifend egestas viverra.
|
||||
p.m-b-20
|
||||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur non diam facilisis, commodo libero et, commodo sapien. Pellentesque sollicitudin massa sagittis dolor facilisis, sit amet vulputate nunc molestie. Pellentesque maximus nibh id luctus porta. Ut consectetur dui nec nulla mattis luctus. Donec nisi diam, congue vitae felis at, ullamcorper bibendum tortor. Vestibulum pellentesque felis felis. Etiam ac tortor felis. Ut elit arcu, rhoncus in laoreet vel, gravida sed tortor.
|
||||
p
|
||||
| In elementum varius nisi vel tempus. Donec eleifend egestas viverra. Donec dapibus sollicitudin blandit. Donec scelerisque purus sit amet feugiat efficitur. Quisque feugiat semper sapien vel hendrerit. Mauris lacus felis, consequat nec pellentesque viverra, venenatis a lorem. Sed urna
|
||||
hr
|
||||
.d-inline-block
|
||||
h6.text-muted
|
||||
i.icofont.icofont-clip
|
||||
| ATTACHMENTS
|
||||
a.text-muted.text-end.right-download(href='#')
|
||||
i.fa.fa-long-arrow-down.me-2
|
||||
| Download All
|
||||
.clearfix
|
||||
.attachment
|
||||
ul.list-inline
|
||||
li.list-inline-item
|
||||
img.img-fluid(src='../assets/images/email/1.jpg', alt='')
|
||||
li.list-inline-item
|
||||
img.img-fluid(src='../assets/images/email/2.jpg', alt='')
|
||||
li.list-inline-item
|
||||
img.img-fluid(src='../assets/images/email/3.jpg', alt='')
|
||||
hr
|
||||
.action-wrapper
|
||||
ul.actions
|
||||
li
|
||||
a.text-muted(href='#')
|
||||
i.fa.fa-reply.me-2
|
||||
| Reply
|
||||
li
|
||||
a.text-muted(href='#')
|
||||
i.fa.fa-reply-all.me-2
|
||||
| Reply All
|
||||
li
|
||||
a.text-muted(href='#')
|
||||
i.fa.fa-share.me-2
|
||||
| Forward
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
74
static/admin/assets/pug/pages/theme/email-header.pug
Normal file
74
static/admin/assets/pug/pages/theme/email-header.pug
Normal file
@@ -0,0 +1,74 @@
|
||||
doctype html
|
||||
html(lang='en')
|
||||
head
|
||||
meta(http-equiv='Content-Type', content='text/html; charset=UTF-8')
|
||||
meta(http-equiv='X-UA-Compatible', content='IE=edge')
|
||||
meta(name='viewport', content='width=device-width, initial-scale=1.0')
|
||||
link(rel='icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
link(rel='shortcut icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
title Cuba - Premium Admin Template
|
||||
link(href='https://fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700,800,900', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i', rel='stylesheet')
|
||||
style(type='text/css').
|
||||
body{
|
||||
width: 650px;
|
||||
font-family: work-Sans, sans-serif;
|
||||
background-color: #f6f7fb;
|
||||
display: block;
|
||||
}
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
span {
|
||||
font-size: 14px;
|
||||
}
|
||||
p {
|
||||
font-size: 13px;
|
||||
line-height: 1.7;
|
||||
letter-spacing: 0.7px;
|
||||
margin-top: 0;
|
||||
}
|
||||
.text-center{
|
||||
text-align: center
|
||||
}
|
||||
h6 {
|
||||
font-size: 16px;
|
||||
margin: 0 0 18px 0;
|
||||
}
|
||||
body(style='margin: 30px auto;')
|
||||
table(style='width: 100%')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
table(style='background-color: #f6f7fb; width: 100%')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
table(style='width: 650px; margin: 0 auto; margin-bottom: 30px')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/other-images/logo-login.png', alt='')
|
||||
td(style='text-align: right; color:#999')
|
||||
span Some Description
|
||||
table(style='width: 650px; margin: 0 auto; background-color: #fff; border-radius: 8px')
|
||||
tbody
|
||||
tr
|
||||
td(style='padding: 30px')
|
||||
h6(style='font-weight: 600') Password Reset
|
||||
p reset your password.
|
||||
p(style='text-align: center')
|
||||
a(href='#' style='padding: 10px; background-color: #7366ff; color: #fff; display: inline-block; border-radius: 4px') Reset Password
|
||||
p If you have remember your password you can safely ignore his email.
|
||||
p Good luck! Hope it works.
|
||||
p(style='margin-bottom: 0') Regards,<br>
|
||||
| Webiots Software
|
||||
table(style='width: 650px; margin: 0 auto; margin-top: 30px')
|
||||
tbody
|
||||
tr(style='text-align: center')
|
||||
td
|
||||
p(style='color: #999; margin-bottom: 0')
|
||||
p(style='color: #999; margin-bottom: 0')
|
||||
a(href='#', style='color: #7366ff')
|
||||
p(style='color: #999; margin-bottom: 0') Powered By The CodeGrammer
|
||||
228
static/admin/assets/pug/pages/theme/email-order-success.pug
Normal file
228
static/admin/assets/pug/pages/theme/email-order-success.pug
Normal file
@@ -0,0 +1,228 @@
|
||||
doctype html
|
||||
html(lang='en')
|
||||
head
|
||||
meta(http-equiv='Content-Type', content='text/html; charset=UTF-8')
|
||||
meta(http-equiv='X-UA-Compatible', content='IE=edge')
|
||||
meta(name='viewport', content='width=device-width, initial-scale=1.0')
|
||||
link(rel='icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
link(rel='shortcut icon', href='../assets/images/favicon.png', type='image/x-icon')
|
||||
title Cuba - Premium Admin Template
|
||||
link(href='https://fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700,800,900', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i', rel='stylesheet')
|
||||
link(href='https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i', rel='stylesheet')
|
||||
style(type='text/css').
|
||||
body{
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
width: 650px;
|
||||
font-family: work-Sans, sans-serif;
|
||||
background-color: #f6f7fb;
|
||||
display: block;
|
||||
}
|
||||
ul{
|
||||
margin:0;
|
||||
padding: 0;
|
||||
}
|
||||
li{
|
||||
display: inline-block;
|
||||
text-decoration: unset;
|
||||
}
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
p{
|
||||
margin: 15px 0;
|
||||
}
|
||||
h5{
|
||||
color:#444;
|
||||
text-align:left;
|
||||
font-weight:400;
|
||||
}
|
||||
.text-center{
|
||||
text-align: center
|
||||
}
|
||||
.main-bg-light{
|
||||
background-color: #fafafa;
|
||||
box-shadow: 0px 0px 14px -4px rgba(0, 0, 0, 0.2705882353);
|
||||
}
|
||||
.title{
|
||||
color: #444444;
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
padding-bottom: 0;
|
||||
text-transform: uppercase;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
}
|
||||
table{
|
||||
margin-top:30px
|
||||
}
|
||||
table.top-0{
|
||||
margin-top:0;
|
||||
}
|
||||
table.order-detail , .order-detail th , .order-detail td {
|
||||
border: 1px solid #ddd;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
.order-detail th{
|
||||
font-size:16px;
|
||||
padding:15px;
|
||||
text-align:center;
|
||||
}
|
||||
.footer-social-icon tr td img{
|
||||
margin-left:5px;
|
||||
margin-right:5px;
|
||||
}
|
||||
body(style='margin: 20px auto;')
|
||||
table(align='center', border='0', cellpadding='0', cellspacing='0', style='padding: 0 30px;background-color: #fff; -webkit-box-shadow: 0px 0px 14px -4px rgba(0, 0, 0, 0.2705882353);box-shadow: 0px 0px 14px -4px rgba(0, 0, 0, 0.2705882353);width: 100%;')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
table(align='center', border='0', cellpadding='0', cellspacing='0')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/delivery.png', alt='', style=';margin-bottom: 30px;')
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/success.png', alt='')
|
||||
tr
|
||||
td
|
||||
h2.title thank you
|
||||
tr
|
||||
td
|
||||
p Payment Is Successfully Processsed And Your Order Is On The Way
|
||||
p Transaction ID:267676GHERT105467
|
||||
tr
|
||||
td
|
||||
div(style='border-top:1px solid #777;height:1px;margin-top: 30px;')
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/order-success.png', alt='', style='margin-top: 30px;')
|
||||
table(border='0', cellpadding='0', cellspacing='0')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
h2.title YOUR ORDER DETAILS
|
||||
table.order-detail(border='0', cellpadding='0', cellspacing='0', align='left')
|
||||
tbody
|
||||
tr(align='left')
|
||||
th PRODUCT
|
||||
th(style='padding-left: 15px;') DESCRIPTION
|
||||
th QUANTITY
|
||||
th PRICE
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/4.png', alt='', width='130')
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='margin-top: 15px;') Three seater Wood Style sofa for Leavingroom
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px; margin-bottom: 0px;')
|
||||
| Size :
|
||||
span L
|
||||
h5(style='font-size: 14px; color:#444;margin-top: 10px;')
|
||||
| QTY :
|
||||
span 1
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px')
|
||||
b $500
|
||||
tr
|
||||
td
|
||||
img(src='../assets/images/email-template/1.png', alt='', width='130')
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='margin-top: 15px;') Three seater Wood Style sofa for Leavingroom
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px; margin-bottom: 0px;')
|
||||
| Size :
|
||||
span L
|
||||
h5(style='font-size: 14px; color:#444;margin-top: 10px;')
|
||||
| QTY :
|
||||
span 1
|
||||
td(valign='top', style='padding-left: 15px;')
|
||||
h5(style='font-size: 14px; color:#444;margin-top:15px')
|
||||
b $500
|
||||
tr
|
||||
td(colspan='2', style='line-height: 49px;font-size: 13px;color: #000000;padding-left: 20px;text-align:left;border-right: unset;') Products:
|
||||
td.price(colspan='3', style='line-height: 49px;text-align: right;padding-right: 28px;font-size: 13px;color: #000000;text-align:right;border-left: unset;')
|
||||
b $2600.00
|
||||
tr
|
||||
td(colspan='2', style='line-height: 49px;font-size: 13px;color: #000000;padding-left: 20px;text-align:left;border-right: unset;') Discount :
|
||||
td.price(colspan='3', style='line-height: 49px;text-align: right;padding-right: 28px;font-size: 13px;color: #000000;text-align:right;border-left: unset;')
|
||||
b $10
|
||||
tr
|
||||
td(colspan='2', style='line-height: 49px;font-family: Arial;font-size: 13px;color: #000000;padding-left: 20px;text-align:left;border-right: unset;') Gift Wripping:
|
||||
td.price(colspan='3', style='line-height: 49px;text-align: right;padding-right: 28px;font-size: 13px;color: #000000;text-align:right;border-left: unset;')
|
||||
b $2600
|
||||
tr
|
||||
td(colspan='2', style='line-height: 49px;font-size: 13px;color: #000000;\
|
||||
padding-left: 20px;text-align:left;border-right: unset;') Shipping :
|
||||
td.price(colspan='3', style='\
|
||||
line-height: 49px;text-align: right;padding-right: 28px;font-size: 13px;color: #000000;text-align:right;border-left: unset;')
|
||||
b $30
|
||||
tr
|
||||
td(colspan='2', style='line-height: 49px;font-size: 13px;color: #000000;\
|
||||
padding-left: 20px;text-align:left;border-right: unset;') TOTAL PAID :
|
||||
td.price(colspan='3', style='line-height: 49px;text-align: right;padding-right: 28px;font-size: 13px;color: #000000;text-align:right;border-left: unset;')
|
||||
b $2600
|
||||
table(cellpadding='0', cellspacing='0', border='0', align='left', style='width: 100%;margin-top: 30px; margin-bottom: 30px;')
|
||||
tbody
|
||||
tr
|
||||
td(style='font-size: 13px; font-weight: 400; color: #444444; letter-spacing: 0.2px;width: 50%;')
|
||||
h5(style='font-size: 16px; font-weight: 500;color: #000; line-height: 16px; padding-bottom: 13px; border-bottom: 1px solid #e6e8eb; letter-spacing: -0.65px; margin-top:0; margin-bottom: 13px;') DILIVERY ADDRESS
|
||||
p(style='text-align: left;font-weight: normal; font-size: 14px; color: #000000;line-height: 21px; margin-top: 0;')
|
||||
| 268 Cambridge Lane New Albany,
|
||||
br
|
||||
| IN 47150268 Cambridge Lane
|
||||
br
|
||||
| New Albany, IN 47150
|
||||
td.user-info(width='57', height='25')
|
||||
img(src='../assets/images/email-template/space.jpg', alt=' ', height='25', width='57')
|
||||
td.user-info(style='font-size: 13px; font-weight: 400; color: #444444; letter-spacing: 0.2px;width: 50%;')
|
||||
h5(style='font-size: 16px;font-weight: 500;color: #000; line-height: 16px; padding-bottom: 13px; border-bottom: 1px solid #e6e8eb; letter-spacing: -0.65px; margin-top:0; margin-bottom: 13px;') SHIPPING ADDRESS
|
||||
p(style='text-align: left;font-weight: normal; font-size: 14px; color: #000000;line-height: 21px; margin-top: 0;')
|
||||
| 268 Cambridge Lane New Albany,
|
||||
br
|
||||
| IN 47150268 Cambridge Lane
|
||||
br
|
||||
| New Albany, IN 47150
|
||||
table.main-bg-light.text-center.top-0(align='center', border='0', cellpadding='0', cellspacing='0', width='100%')
|
||||
tbody
|
||||
tr
|
||||
td(style='padding: 30px;')
|
||||
div
|
||||
h4.title(style='margin:0;text-align: center;') Follow us
|
||||
table.footer-social-icon(border='0', cellpadding='0', cellspacing='0', align='center', style='margin-top:20px;')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/facebook.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/youtube.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/twitter.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/gplus.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/linkedin.png', alt='')
|
||||
td
|
||||
a(href='#')
|
||||
img(src='../assets/images/email-template/pinterest.png', alt='')
|
||||
div(style='border-top: 1px solid #ddd; margin: 20px auto 0;')
|
||||
table(border='0', cellpadding='0', cellspacing='0', width='100%', style='margin: 20px auto 0;')
|
||||
tbody
|
||||
tr
|
||||
td
|
||||
a(href='#', style='font-size:13px') Want to change how you receive these emails?
|
||||
tr
|
||||
td
|
||||
p(style='font-size:13px; margin:0;') 2018 - 19 Copy Right by Themeforest powerd by Pixel Strap
|
||||
tr
|
||||
td
|
||||
a(href='#', style='font-size:13px; margin:0;text-decoration: underline;') Unsubscribe
|
||||
20
static/admin/assets/pug/pages/theme/error-400.pug
Normal file
20
static/admin/assets/pug/pages/theme/error-400.pug
Normal file
@@ -0,0 +1,20 @@
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// error-400 start
|
||||
.error-wrapper
|
||||
.container
|
||||
img.img-100(src='../assets/images/other-images/sad.png', alt='')
|
||||
.error-heading
|
||||
h2.headline.font-info 400
|
||||
.col-md-8.offset-md-2
|
||||
p.sub-content
|
||||
| The page you are attempting to reach is currently not available. This may be because the page does not exist or has been moved.
|
||||
div
|
||||
a.btn.btn-info-gradien.btn-lg(href='index.html') BACK TO HOME PAGE
|
||||
// error-400 end
|
||||
include ../../components/footer-files
|
||||
21
static/admin/assets/pug/pages/theme/error-401.pug
Normal file
21
static/admin/assets/pug/pages/theme/error-401.pug
Normal file
@@ -0,0 +1,21 @@
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// error-401 start
|
||||
.error-wrapper
|
||||
.container
|
||||
img.img-100(src='../assets/images/other-images/sad.png', alt='')
|
||||
.error-heading
|
||||
h2.headline.font-warning 401
|
||||
.col-md-8.offset-md-2
|
||||
p.sub-content
|
||||
| The page you are attempting to reach is currently not available. This may be because the page does not exist or has been moved.
|
||||
div
|
||||
a.btn.btn-warning-gradien.btn-lg(href='index.html') BACK TO HOME PAGE
|
||||
// error-401 end
|
||||
include ../../components/footer-files
|
||||
21
static/admin/assets/pug/pages/theme/error-403.pug
Normal file
21
static/admin/assets/pug/pages/theme/error-403.pug
Normal file
@@ -0,0 +1,21 @@
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// error-403 start
|
||||
.error-wrapper
|
||||
.container
|
||||
img.img-100(src='../assets/images/other-images/sad.png', alt='')
|
||||
.error-heading
|
||||
h2.headline.font-success 403
|
||||
.col-md-8.offset-md-2
|
||||
p.sub-content
|
||||
| The page you are attempting to reach is currently not available. This may be because the page does not exist or has been moved.
|
||||
div
|
||||
a.btn.btn-success-gradien.btn-lg(href='index.html') BACK TO HOME PAGE
|
||||
// error-403 end
|
||||
include ../../components/footer-files
|
||||
21
static/admin/assets/pug/pages/theme/error-404.pug
Normal file
21
static/admin/assets/pug/pages/theme/error-404.pug
Normal file
@@ -0,0 +1,21 @@
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// error-404 start
|
||||
.error-wrapper
|
||||
.container
|
||||
img.img-100(src='../assets/images/other-images/sad.png', alt='')
|
||||
.error-heading
|
||||
h2.headline.font-danger 404
|
||||
.col-md-8.offset-md-2
|
||||
p.sub-content
|
||||
| The page you are attempting to reach is currently not available. This may be because the page does not exist or has been moved.
|
||||
div
|
||||
a.btn.btn-danger-gradien.btn-lg(href='index.html') BACK TO HOME PAGE
|
||||
// error-404 end
|
||||
include ../../components/footer-files
|
||||
21
static/admin/assets/pug/pages/theme/error-500.pug
Normal file
21
static/admin/assets/pug/pages/theme/error-500.pug
Normal file
@@ -0,0 +1,21 @@
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// error-500 start
|
||||
.error-wrapper
|
||||
.container
|
||||
img.img-100(src='../assets/images/other-images/sad.png', alt='')
|
||||
.error-heading
|
||||
h2.headline.font-primary 500
|
||||
.col-md-8.offset-md-2
|
||||
p.sub-content
|
||||
| The page you are attempting to reach is currently not available. This may be because the page does not exist or has been moved.
|
||||
div
|
||||
a.btn.btn-primary-gradien.btn-lg(href='index.html') BACK TO HOME PAGE
|
||||
// error-500 end
|
||||
include ../../components/footer-files
|
||||
21
static/admin/assets/pug/pages/theme/error-503.pug
Normal file
21
static/admin/assets/pug/pages/theme/error-503.pug
Normal file
@@ -0,0 +1,21 @@
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
// error-503 start
|
||||
.error-wrapper
|
||||
.container
|
||||
img.img-100(src='../assets/images/other-images/sad.png', alt='')
|
||||
.error-heading
|
||||
h2.headline.font-secondary 503
|
||||
.col-md-8.offset-md-2
|
||||
p.sub-content
|
||||
| The page you are attempting to reach is currently not available. This may be because the page does not exist or has been moved.
|
||||
div
|
||||
a.btn.btn-secondary-gradien.btn-lg(href='index.html') BACK TO HOME PAGE
|
||||
// error-503 end
|
||||
include ../../components/footer-files
|
||||
498
static/admin/assets/pug/pages/theme/faq.pug
Normal file
498
static/admin/assets/pug/pages/theme/faq.pug
Normal file
@@ -0,0 +1,498 @@
|
||||
- var height_equal = true;
|
||||
- var theme_customizer = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| FAQ
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item FAQ
|
||||
li.breadcrumb-item.active FAQ
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.faq-wrap
|
||||
.row
|
||||
.col-xl-4.box-col-6
|
||||
.card.bg-primary
|
||||
.card-body
|
||||
.media.faq-widgets
|
||||
.media-body
|
||||
h5 Articles
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
i(data-feather='file-text')
|
||||
.col-xl-4.col-sm-6.box-col-6
|
||||
.card.bg-primary
|
||||
.card-body
|
||||
.media.faq-widgets
|
||||
.media-body
|
||||
h5 Knowledgebase
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
i(data-feather='book-open')
|
||||
.col-xl-4.col-sm-6.box-col-12
|
||||
.card.bg-primary
|
||||
.card-body
|
||||
.media.faq-widgets
|
||||
.media-body
|
||||
h5 Support
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
i(data-feather='aperture')
|
||||
.col-lg-12
|
||||
.header-faq
|
||||
h5.mb-0 Quick Questions are answered
|
||||
#accordionoc.row.default-according.style-1.faq-accordion
|
||||
.col-xl-8.xl-60.col-lg-6.col-md-7
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon', aria-expanded='false', aria-controls='collapseicon')
|
||||
i(data-feather='help-circle')
|
||||
| Integrating WordPress with Your Website?
|
||||
#collapseicon.collapse(aria-labelledby='collapseicon', data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon2', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| WordPress Site Maintenance ?
|
||||
#collapseicon2.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon3', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| Meta Tags in WordPress ?
|
||||
#collapseicon3.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon4', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| WordPress in Your Language ?
|
||||
#collapseicon4.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.faq-title
|
||||
h6 Intellectual Property
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon5', aria-expanded='false')
|
||||
i(data-feather='help-circle')
|
||||
| WordPress Site Maintenance ?
|
||||
#collapseicon5.collapse(aria-labelledby='collapseicon5', data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon7', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| WordPress in Your Language ?
|
||||
#collapseicon7.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon8', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| Integrating WordPress with Your Website ?
|
||||
#collapseicon8.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.faq-title
|
||||
h6 Selling And Buying
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon9', aria-expanded='false')
|
||||
i(data-feather='help-circle')
|
||||
| WordPress Site Maintenance ?
|
||||
#collapseicon9.collapse(aria-labelledby='collapseicon9', data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon10', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| Meta Tags in WordPress ?
|
||||
#collapseicon10.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon11', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| Validating a Website ?
|
||||
#collapseicon11.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon12', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| Know Your Sources ?
|
||||
#collapseicon12.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.faq-title
|
||||
h6 User Accounts
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon13', aria-expanded='false')
|
||||
i(data-feather='help-circle')
|
||||
| Integrating WordPress with Your Website ?
|
||||
#collapseicon13.collapse(aria-labelledby='collapseicon13', data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon14', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| WordPress Site Maintenance ?
|
||||
#collapseicon14.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon16', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| WordPress in Your Language ?
|
||||
#collapseicon16.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon17', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| Validating a Website ?
|
||||
#collapseicon17.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card
|
||||
.card-header
|
||||
h5.mb-0
|
||||
button.btn.btn-link.collapsed.ps-0(data-bs-toggle='collapse', data-bs-target='#collapseicon18', aria-expanded='false', aria-controls='collapseicon2')
|
||||
i(data-feather='help-circle')
|
||||
| Meta Tags in WordPress ?
|
||||
#collapseicon18.collapse(data-bs-parent='#accordionoc')
|
||||
.card-body
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.col-xl-4.xl-40.col-lg-6.col-md-5
|
||||
.row
|
||||
.col-lg-12
|
||||
.card.card-mb-faq.xs-mt-search
|
||||
.card-header.faq-header.pb-0
|
||||
h5 Search articles
|
||||
i(data-feather='help-circle')
|
||||
.card-body.faq-body
|
||||
.faq-form
|
||||
input.form-control(type='text', placeholder='Search..')
|
||||
i.search-icon(data-feather='search')
|
||||
.col-lg-12
|
||||
.card.card-mb-faq
|
||||
.card-header.faq-header.pb-0
|
||||
h5 Navigation
|
||||
i(data-feather='settings')
|
||||
.card-body.faq-body
|
||||
.navigation-btn
|
||||
a.btn.btn-primary(href='#')
|
||||
i.m-r-10(data-feather='message-square')
|
||||
| Ask Question
|
||||
.navigation-option
|
||||
ul
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='edit')
|
||||
| Tutorials
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='globe')
|
||||
| Help center
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='book-open')
|
||||
| Knowledgebase
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='file-text')
|
||||
| Articles
|
||||
span.badge.badge-primary.rounded-pill.pull-right 42
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='youtube')
|
||||
| Video Tutorials
|
||||
span.badge.badge-primary.rounded-pill.pull-right 648
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='message-circle')
|
||||
| Ask our community
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='mail')
|
||||
| Contact us
|
||||
hr
|
||||
ul
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='message-circle')
|
||||
| Ask our community
|
||||
li
|
||||
a(href='#')
|
||||
i(data-feather='mail')
|
||||
| Contact us
|
||||
.col-lg-12
|
||||
.card
|
||||
.card-header.faq-header.pb-0
|
||||
h5.d-inline-block Latest Updates
|
||||
span.pull-right.d-inline-block See All
|
||||
.card-body.faq-body
|
||||
.media.updates-faq-main
|
||||
.updates-faq
|
||||
i.font-primary(data-feather='rotate-cw')
|
||||
.media-body.updates-bottom-time
|
||||
p
|
||||
a(href='#') David Linner
|
||||
| requested money back for a double debit card charge
|
||||
p 10 minutes ago
|
||||
.media.updates-faq-main
|
||||
.updates-faq
|
||||
i.font-primary(data-feather='dollar-sign')
|
||||
.media-body.updates-bottom-time
|
||||
p All sellers have received monthly payouts
|
||||
p 2 hours ago
|
||||
.media.updates-faq-main
|
||||
.updates-faq
|
||||
i.font-primary(data-feather='link')
|
||||
.media-body.updates-bottom-time
|
||||
p
|
||||
| User Christopher
|
||||
a(href='#') Wallace
|
||||
| is on hold and awaiting for staff reply
|
||||
p 45 minutes ago
|
||||
.media.updates-faq-main
|
||||
.updates-faq
|
||||
i.font-primary(data-feather='check')
|
||||
.media-body.updates-bottom-time
|
||||
p
|
||||
| Ticket #43683 has been closed by
|
||||
a(href='#') Victoria Wilson
|
||||
p Dec 7, 11:48
|
||||
.col-lg-12
|
||||
.header-faq
|
||||
h5.mb-0 Featured Tutorials
|
||||
.row
|
||||
.col-xxl-3.col-md-6.box-col-6
|
||||
.card.features-faq.product-box
|
||||
.faq-image.product-img
|
||||
img.img-fluid(src='../assets/images/faq/1.jpg', alt='')
|
||||
.product-hover
|
||||
ul
|
||||
li
|
||||
i.icon-link
|
||||
li
|
||||
i.icon-import
|
||||
.card-body
|
||||
h6 Web Design
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card-footer
|
||||
span Dec 15, 2022
|
||||
span.pull-right
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
.col-xxl-3.col-md-6.box-col-6
|
||||
.card.features-faq.product-box
|
||||
.faq-image.product-img
|
||||
img.img-fluid(src='../assets/images/faq/2.jpg', alt='')
|
||||
.product-hover
|
||||
ul
|
||||
li
|
||||
i.icon-link
|
||||
li
|
||||
i.icon-import
|
||||
.card-body
|
||||
h6 Web Development
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card-footer
|
||||
span Dec 15, 2022
|
||||
span.pull-right
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star-o.font-primary
|
||||
.col-xxl-3.col-md-6.box-col-6
|
||||
.card.features-faq.product-box
|
||||
.faq-image.product-img
|
||||
img.img-fluid(src='../assets/images/faq/3.jpg', alt='')
|
||||
.product-hover
|
||||
ul
|
||||
li
|
||||
i.icon-link
|
||||
li
|
||||
i.icon-import
|
||||
.card-body
|
||||
h6 UI Design
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card-footer
|
||||
span Dec 15, 2022
|
||||
span.pull-right
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
.col-xxl-3.col-md-6.box-col-6
|
||||
.card.features-faq.product-box
|
||||
.faq-image.product-img
|
||||
img.img-fluid(src='../assets/images/faq/4.jpg', alt='')
|
||||
.product-hover
|
||||
ul
|
||||
li
|
||||
i.icon-link
|
||||
li
|
||||
i.icon-import
|
||||
.card-body
|
||||
h6 UX Design
|
||||
p
|
||||
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
||||
.card-footer
|
||||
span Dec 15, 2022
|
||||
span.pull-right
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star.font-primary
|
||||
i.fa.fa-star-half-o.font-primary
|
||||
.col-lg-12
|
||||
.header-faq
|
||||
h5.mb-0 Latest articles and videos
|
||||
.row
|
||||
.col-xl-4.col-md-6
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='codepen')
|
||||
.media-body
|
||||
h6.f-w-500 Using Video
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='codepen')
|
||||
.media-body
|
||||
h6.f-w-500 Vel illum qu
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='codepen')
|
||||
.media-body
|
||||
h6.f-w-500 Cum sociis natoqu
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
.col-xl-4.col-md-6
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='file-text')
|
||||
.media-body
|
||||
h6.f-w-500 Donec pede justo
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='file-text')
|
||||
.media-body
|
||||
h6.f-w-500 Nam quam nunc
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='file-text')
|
||||
.media-body
|
||||
h6.f-w-500 Using Video
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
.col-xl-4
|
||||
.row
|
||||
.col-xl-12.col-md-6
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='youtube')
|
||||
.media-body
|
||||
h6.f-w-500 Vel illum qu
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
.col-xl-12.col-md-6
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='youtube')
|
||||
.media-body
|
||||
h6.f-w-500 Cum sociis natoqu
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
.col-xl-12
|
||||
.card
|
||||
.card-body
|
||||
.media
|
||||
i.m-r-30(data-feather='youtube')
|
||||
.media-body
|
||||
h6.f-w-500 Donec pede justo
|
||||
p Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
1402
static/admin/assets/pug/pages/theme/feather-icon.pug
Normal file
1402
static/admin/assets/pug/pages/theme/feather-icon.pug
Normal file
File diff suppressed because it is too large
Load Diff
266
static/admin/assets/pug/pages/theme/file-manager.pug
Normal file
266
static/admin/assets/pug/pages/theme/file-manager.pug
Normal file
@@ -0,0 +1,266 @@
|
||||
- var chat_menu = true;
|
||||
- var theme_customizer = true;
|
||||
- var typeahead = true;
|
||||
- var typeahead_search = true;
|
||||
- var page_feather_icon = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| File Manager
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Apps
|
||||
li.breadcrumb-item.active File Manager
|
||||
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-xl-3.box-col-6.pe-0
|
||||
.md-sidebar
|
||||
a.btn.btn-primary.md-sidebar-toggle(href='javascript:void(0)') file filter
|
||||
.md-sidebar-aside.job-left-aside.custom-scrollbar
|
||||
.file-sidebar
|
||||
.card
|
||||
.card-body
|
||||
ul
|
||||
li
|
||||
.btn.btn-primary
|
||||
i(data-feather="home")
|
||||
| Home
|
||||
li
|
||||
.btn.btn-light
|
||||
i(data-feather="folder")
|
||||
| All
|
||||
li
|
||||
.btn.btn-light
|
||||
i(data-feather="clock")
|
||||
| Recent
|
||||
li
|
||||
.btn.btn-light
|
||||
i(data-feather="star")
|
||||
| Starred
|
||||
li
|
||||
.btn.btn-light
|
||||
i(data-feather="alert-circle")
|
||||
| Recovery
|
||||
li
|
||||
.btn.btn-light
|
||||
i(data-feather="trash-2")
|
||||
| Deleted
|
||||
hr
|
||||
ul
|
||||
li
|
||||
.btn.btn-outline-primary
|
||||
i(data-feather="database")
|
||||
| Storage
|
||||
.m-t-15
|
||||
.progress.sm-progress-bar.mb-1
|
||||
.progress-bar.bg-primary(role='progressbar' style='width: 25%' aria-valuenow='25' aria-valuemin='0' aria-valuemax='100')
|
||||
p 25 GB of 100 GB used
|
||||
hr
|
||||
ul
|
||||
li
|
||||
.btn.btn-outline-primary
|
||||
i(data-feather="grid")
|
||||
| Pricing plan
|
||||
li
|
||||
.pricing-plan
|
||||
h6 Trial Version
|
||||
h5 FREE
|
||||
p 100 GB Space
|
||||
.btn.btn-outline-primary.btn-xs
|
||||
| Selected
|
||||
img.bg-img(src='../assets/images/dashboard/folder.png', alt='')
|
||||
li
|
||||
.pricing-plan
|
||||
h6 Premium
|
||||
h5 $5/month
|
||||
p 200 GB Space
|
||||
.btn.btn-outline-primary.btn-xs
|
||||
| Contact Us
|
||||
img.bg-img(src='../assets/images/dashboard/folder1.png', alt='')
|
||||
|
||||
.col-xl-9.col-md-12.box-col-12
|
||||
.file-content
|
||||
.card
|
||||
.card-header
|
||||
.media
|
||||
form.form-inline(action='#' method='get')
|
||||
.form-group.mb-0
|
||||
i.fa.fa-search
|
||||
input.form-control-plaintext(type='text' placeholder='Search...')
|
||||
|
||||
.media-body.text-end
|
||||
form.d-inline-flex(action='#', method='POST', enctype='multipart/form-data', name='myForm')
|
||||
.btn.btn-primary(onclick='getFile()')
|
||||
i(data-feather="plus-square")
|
||||
| Add New
|
||||
div(style='height: 0px;width: 0px; overflow:hidden;')
|
||||
input#upfile(type='file', onchange='sub(this)')
|
||||
|
||||
.btn.btn-outline-primary.ms-2
|
||||
i(data-feather="upload")
|
||||
| Upload
|
||||
.card-body.file-manager
|
||||
h4.mb-3 All Files
|
||||
h6 Recently opened files
|
||||
ul.files
|
||||
li.file-box
|
||||
.file-top
|
||||
i.fa.fa-file-image-o.txt-primary
|
||||
i.fa.fa-ellipsis-v.f-14.ellips
|
||||
.file-bottom
|
||||
h6 Logo.psd
|
||||
p.mb-1 2.0 MB
|
||||
p
|
||||
b last open :
|
||||
| 1 hour ago
|
||||
li.file-box
|
||||
.file-top
|
||||
i.fa.fa-file-archive-o.txt-secondary
|
||||
i.fa.fa-ellipsis-v.f-14.ellips
|
||||
.file-bottom
|
||||
h6 Project.zip
|
||||
p.mb-1 1.90 GB
|
||||
p
|
||||
b last open :
|
||||
| 1 hour ago
|
||||
li.file-box
|
||||
.file-top
|
||||
i.fa.fa-file-excel-o.txt-success
|
||||
i.fa.fa-ellipsis-v.f-14.ellips
|
||||
.file-bottom
|
||||
h6 Backend.xls
|
||||
p.mb-1 2.00 GB
|
||||
p
|
||||
b last open :
|
||||
| 1 hour ago
|
||||
li.file-box
|
||||
.file-top
|
||||
i.fa.fa-file-text-o.txt-info
|
||||
i.fa.fa-ellipsis-v.f-14.ellips
|
||||
.file-bottom
|
||||
h6 requirements.txt
|
||||
p.mb-1 0.90 KB
|
||||
p
|
||||
b last open :
|
||||
| 1 hour ago
|
||||
|
||||
h6.mt-4 Folders
|
||||
ul.folder
|
||||
li.folder-box
|
||||
.media
|
||||
i.fa.fa-file-archive-o.f-36.txt-warning
|
||||
.media-body.ms-3
|
||||
h6.mb-0 Endless admin
|
||||
p 204 files, 50mb
|
||||
li.folder-box
|
||||
.media
|
||||
i.fa.fa-folder.f-36.txt-warning
|
||||
.media-body.ms-3
|
||||
h6.mb-0 Endless admin
|
||||
p 101 files, 10mb
|
||||
li.folder-box
|
||||
.media
|
||||
i.fa.fa-file-archive-o.f-36.txt-warning
|
||||
.media-body.ms-3
|
||||
h6.mb-0 Endless admin
|
||||
p 25 files, 2mb
|
||||
li.folder-box
|
||||
.media
|
||||
i.fa.fa-folder.f-36.txt-warning
|
||||
.media-body.ms-3
|
||||
h6.mb-0 Endless admin
|
||||
p 108 files, 5mb
|
||||
|
||||
h6.mt-4 Files
|
||||
ul.files
|
||||
li.file-box
|
||||
.file-top
|
||||
i.fa.fa-file-archive-o.txt-secondary
|
||||
i.fa.fa-ellipsis-v.f-14.ellips
|
||||
.file-bottom
|
||||
h6 Project.zip
|
||||
p.mb-1 1.90 GB
|
||||
p
|
||||
b last open :
|
||||
| 1 hour ago
|
||||
li.file-box
|
||||
.file-top
|
||||
i.fa.fa-file-excel-o.txt-success
|
||||
i.fa.fa-ellipsis-v.f-14.ellips
|
||||
.file-bottom
|
||||
h6 Backend.xls
|
||||
p.mb-1 2.00 GB
|
||||
p
|
||||
b last open :
|
||||
| 1 hour ago
|
||||
li.file-box
|
||||
.file-top
|
||||
i.fa.fa-file-text-o.txt-info
|
||||
i.fa.fa-ellipsis-v.f-14.ellips
|
||||
.file-bottom
|
||||
h6 requirements.txt
|
||||
p.mb-1 0.90 KB
|
||||
p
|
||||
b last open :
|
||||
| 1 hour ago
|
||||
li.file-box
|
||||
.file-top
|
||||
i.fa.fa-file-text-o.txt-primary
|
||||
i.fa.fa-ellipsis-v.f-14.ellips
|
||||
.file-bottom
|
||||
h6 Logo.psd
|
||||
p.mb-1 2.0 MB
|
||||
p
|
||||
b last open :
|
||||
| 1 hour ago
|
||||
|
||||
|
||||
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
.icon-hover-bottom.p-fixed.fa-fa-icon-show-div.opecity-0
|
||||
.container-fluid
|
||||
.row
|
||||
.icon-popup
|
||||
.close-icon
|
||||
i.icofont.icofont-close
|
||||
.icon-first
|
||||
i#icon_main
|
||||
.icon-class
|
||||
label.icon-title data-feather
|
||||
span#fclass1
|
||||
.icon-last.icon-last
|
||||
label.icon-title Markup
|
||||
.form-inline
|
||||
.form-group
|
||||
input#input_copy.inp-val.form-control.m-r-10(type='text', value='', readonly='readonly')
|
||||
button.btn.btn-primary.notification(onclick='myFunction()') Copy text
|
||||
include ../../components/footer-files
|
||||
1542
static/admin/assets/pug/pages/theme/flag-icon.pug
Normal file
1542
static/admin/assets/pug/pages/theme/flag-icon.pug
Normal file
File diff suppressed because it is too large
Load Diff
1868
static/admin/assets/pug/pages/theme/font-awesome.pug
Normal file
1868
static/admin/assets/pug/pages/theme/font-awesome.pug
Normal file
File diff suppressed because it is too large
Load Diff
56
static/admin/assets/pug/pages/theme/footer-dark.pug
Normal file
56
static/admin/assets/pug/pages/theme/footer-dark.pug
Normal file
@@ -0,0 +1,56 @@
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
- var footer_dark = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Footer Dark
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Page Layout
|
||||
li.breadcrumb-item.active Footer Dark
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Sample Card
|
||||
span lorem ipsum dolor sit amet, consectetur adipisicing elit
|
||||
.card-body
|
||||
p
|
||||
| "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||
| eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
|
||||
| enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
||||
| nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
|
||||
| in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
||||
| nulla pariatur. Excepteur sint occaecat cupidatat non proident,
|
||||
| sunt in culpa qui officia deserunt mollit anim id est laborum."
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
57
static/admin/assets/pug/pages/theme/footer-fixed.pug
Normal file
57
static/admin/assets/pug/pages/theme/footer-fixed.pug
Normal file
@@ -0,0 +1,57 @@
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
-var footer_fix = true;
|
||||
-var footer_dark = false;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Footer Fixed
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Page Layout
|
||||
li.breadcrumb-item.active Footer Fixed
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Sample Card
|
||||
span lorem ipsum dolor sit amet, consectetur adipisicing elit
|
||||
.card-body
|
||||
p
|
||||
| "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||
| eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
|
||||
| enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
||||
| nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
|
||||
| in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
||||
| nulla pariatur. Excepteur sint occaecat cupidatat non proident,
|
||||
| sunt in culpa qui officia deserunt mollit anim id est laborum."
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
55
static/admin/assets/pug/pages/theme/footer-light.pug
Normal file
55
static/admin/assets/pug/pages/theme/footer-light.pug
Normal file
@@ -0,0 +1,55 @@
|
||||
- var theme_customizer = true;
|
||||
- var tooltip = true;
|
||||
- var sidebar = true;
|
||||
- var slick = true;
|
||||
- var header_slider = true;
|
||||
- var animate = true;
|
||||
- var scrollbar = true;
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
include ../../components/taptop
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper.compact-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-title
|
||||
.row
|
||||
.col-6
|
||||
h3
|
||||
| Footer Light
|
||||
|
||||
.col-6
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
svg.stroke-icon
|
||||
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
||||
li.breadcrumb-item Page Layout
|
||||
li.breadcrumb-item.active Footer Light
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col-sm-12
|
||||
.card
|
||||
.card-header
|
||||
h5 Sample Card
|
||||
span lorem ipsum dolor sit amet, consectetur adipisicing elit
|
||||
.card-body
|
||||
p
|
||||
| "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||
| eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
|
||||
| enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
||||
| nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
|
||||
| in reprehenderit in voluptate velit esse cillum dolore eu fugiat
|
||||
| nulla pariatur. Excepteur sint occaecat cupidatat non proident,
|
||||
| sunt in culpa qui officia deserunt mollit anim id est laborum."
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user