1292 lines
51 KiB
HTML
1292 lines
51 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head data-v-save-global="index.html,head">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<meta charset="utf-8">
|
||
|
||
<base href="">
|
||
|
||
<title>Vvveb Landing - Homepage</title>
|
||
|
||
<meta name="description" content="" />
|
||
<meta name="keywords" content="">
|
||
<meta name="author" content="">
|
||
<link rel="canonical" href="">
|
||
|
||
<link id="landing-css" href="css/style.bundle.css" rel="stylesheet" media="screen">
|
||
<link id="fonts-css" href="css/fonts.css" rel="stylesheet" media="screen">
|
||
<link id="vvvebjs-css" href="css/custom.css" rel="stylesheet" media="screen">
|
||
|
||
|
||
|
||
|
||
|
||
<style>
|
||
}
|
||
</style>
|
||
|
||
|
||
|
||
|
||
<link rel="sitemap" type="application/xml" title="Sitemap" href="/feed/index">
|
||
<link rel="alternate" type="application/rss+xml" title="Feed" href="/feed/posts" />
|
||
<link rel="alternate" type="application/rss+xml" title="Feed" href="/feed/pages" />
|
||
<link rel="alternate" type="application/rss+xml" title="Products" href="/feed/products" />
|
||
<link rel="alternate" type="application/rss+xml" title="Comments Feed" href="/feed/comments" />
|
||
|
||
<link rel="icon" type="image/x-icon" href="media/favicon.ico" data-v-global-site.favicon>
|
||
|
||
<link rel="manifest" href="/manifest.webmanifest">
|
||
|
||
<link rel="alternate" hreflang="" href="" />
|
||
</head>
|
||
|
||
|
||
|
||
<body class="home">
|
||
|
||
<nav class="navigation-4 clearfix" data-v-save-global="index.html,.navigation-4">
|
||
|
||
<div class="navbar navbar-expand-md">
|
||
|
||
<div class="container">
|
||
|
||
<div data-v-component-site>
|
||
<!-- <a class="navbar-brand" href="/" data-url data-v-url-params='{"host":"*.*.*"}'><span class="visually-hidden">Logo</span> -->
|
||
<a class="navbar-brand" href="/" data-v-site-url>
|
||
<span class="visually-hidden">Logo</span>
|
||
<img src="demo/img/logo.png" alt="Site logo" loading="lazy" class="logo-default" data-v-site-logo>
|
||
<img src="demo/img/logo.png" alt="Site logo sticky" loading="lazy" class="logo-sticky" data-v-site-logo-sticky>
|
||
<img src="demo/img/logo-white.png" alt="Site logo dark" loading="lazy" class="logo-default-dark" data-v-site-logo-dark>
|
||
<img src="demo/img/logo-white.png" alt="Site logo dark sticky" loading="lazy" class="logo-default-dark-sticky" data-v-site-logo-dark-sticky>
|
||
</a>
|
||
</div>
|
||
|
||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar" aria-controls="navbar" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-icon"></span>
|
||
</button>
|
||
|
||
|
||
<div class="collapse navbar-collapse" id="navbar" data-v-component-menu="header" data-v-slug="main-menu">
|
||
<ul class="navbar-nav ms-auto" data-v-menu-items>
|
||
<li class="nav-item dropdown" data-v-menu-item data-v-class-if-has-dropdown="category.children > 0">
|
||
|
||
<a class="nav-link" data-v-class-if-dropdown-toggle="category.children > 0" aria-expanded="false" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Resources</span>
|
||
</a>
|
||
|
||
<div class="dropdown-menu" data-v-menu-item-recursive>
|
||
<div data-v-menu-item class="nav-item" data-v-menu-item data-v-class-if-dropdown="category.children > 0">
|
||
<a class="dropdown-item" href="https://github.com/givanz/VvvebJs/wiki" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>User Documentation</span>
|
||
</a>
|
||
</div>
|
||
<div data-v-menu-item class="nav-item" data-v-menu-item data-v-class-if-dropdown="category.children > 0">
|
||
<a class="dropdown-item" href="https://github.com/givanz/VvvebJs/wiki" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Developer Documentation</span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
<li class="nav-item" data-v-menu-item>
|
||
<a class="nav-link" href="https://blog.vvveb.com" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Blog</span>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item" data-v-menu-item>
|
||
<a class="nav-link" href="https://www.vvveb.com/page/contact" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Contact</span>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item" data-v-menu-item>
|
||
<a class="nav-link" href="https://www.vvveb.com" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>About us</span>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-link dropdown-toggle" href="//demo.vvveb.com/admin/?module=/editor/editor&template=index.html&url=/" role="button">Demo</a>
|
||
<div class="dropdown-menu">
|
||
<a class="dropdown-item" target="_blank" href="//demo.vvveb.com/admin/?module=/editor/editor&template=index.html&url=/">Page builder</a>
|
||
<a class="dropdown-item" target="_blank" href="//demo.vvveb.com/admin">Admin dashboard</a>
|
||
<a class="dropdown-item" target="_blank" href="//demo.vvveb.com">Frontend</a>
|
||
<div class="dropdown-divider"></div>
|
||
<a class="dropdown-item" target="_blank" href="https://vercel-vvveb-commerce.vercel.app/">Next.js Frontend GraphQL</a>
|
||
</div>
|
||
</li>
|
||
|
||
|
||
<li class="nav-toggle">
|
||
<!-- User Login Info -->
|
||
<div class="dropdown nav-item">
|
||
<a class="dropdown-toggle nav-link " href role="button" id="user-dropdown" data-bs-toggle="dropdown" aria-expanded="false" data-v-url="user/index">
|
||
<!-- <img src="demo/img/user.svg" loading="lazy" width="20" alt> -->
|
||
<!-- <i class="la la-lg la-user"></i> -->
|
||
<svg width="20px" viewBox="0 0 24 24" fill="none">
|
||
<path d="M20 21C20 19.6044 20 18.9067 19.8278 18.3389C19.44 17.0605 18.4395 16.06 17.1611 15.6722C16.5933 15.5 15.8956 15.5 14.5 15.5H9.5C8.10444 15.5 7.40665 15.5 6.83886 15.6722C5.56045 16.06 4.56004 17.0605 4.17224 18.3389C4 18.9067 4 19.6044 4 21M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
|
||
</svg>
|
||
|
||
<span class="visually-hidden">User</span>
|
||
</a>
|
||
|
||
<div class="dropdown-menu dropdown-menu-end login-box user-box" aria-labelledby="user-dropdown">
|
||
|
||
<div data-v-component-user>
|
||
|
||
<div class="notifications" data-v-notifications>
|
||
|
||
<div class="alert alert-danger d-flex alert-dismissable" role="alert" data-v-notification-error data-v-type="login">
|
||
|
||
<div class="icon align-middle me-2">
|
||
<i class="align-middle la la-2x lh-1 la-exclamation-triangle"></i>
|
||
</div>
|
||
|
||
<div class="flex-grow-1 align-self-center text-small">
|
||
<div>
|
||
<div data-v-notification-text>
|
||
This is a placeholder for a notification message.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<button type="button" class="btn-close align-middle" data-bs-dismiss="alert" aria-label="Close">
|
||
<span aria-hidden="true">
|
||
<!-- <i class="la la-times"></i> -->
|
||
</span>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="alert alert-success d-flex alert-dismissable d-flex" role="alert" data-v-notification-success data-v-type="login">
|
||
|
||
<div class="icon align-middle me-2">
|
||
<i class="align-middle la la-2x lh-1 la-check-circle"></i>
|
||
</div>
|
||
|
||
<div class="flex-grow-1 align-self-center align-middle" data-v-notification-text>
|
||
This is a placeholder for a success message.
|
||
</div>
|
||
|
||
<button type="button" class="btn-close align-middle" data-bs-dismiss="alert" aria-label="Close">
|
||
<span aria-hidden="true">
|
||
<!-- <i class="la la-times"></i> -->
|
||
</span>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="alert alert-primary d-flex alert-dismissable d-flex" role="alert" data-v-notification-info data-v-type="login">
|
||
|
||
<div class="icon align-middle me-2">
|
||
<i class="align-middle la la-2x lh-1 la-info-circle"></i>
|
||
</div>
|
||
|
||
<div class="flex-grow-1 align-self-center" data-v-notification-text>
|
||
This is a placeholder for a info message.
|
||
</div>
|
||
|
||
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close">
|
||
<span aria-hidden="true">
|
||
<!-- <i class="la la-times"></i> -->
|
||
</span>
|
||
</button>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<form action method="post" enctype="multipart/form-data" data-v-url="user/login/index" data-v-vvveb-action="login" data-v-vvveb-on="submit" class="login-form">
|
||
|
||
<input type="hidden" name="csrf" data-v-csrf>
|
||
|
||
<div class="login-form" data-v-if-not="component.user_id">
|
||
|
||
<div class="mb-3">
|
||
<input type="email" name="email" value placeholder=" " id="user-email" class="form-control label-over" data-v-user-email required>
|
||
<label class="form-label" for="user-email">E-Mail Address</label>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
|
||
<div class="input-group">
|
||
<input type="password" minlength="4" autocorrect="off" autocomplete="current-password" class="form-control label-over" placeholder=" " id="user-password" name="password" value="" aria-label="Password" required>
|
||
<label class="form-label" for="user-password">Password</label>
|
||
<button class="btn btn-sm px-3 border border-start-0" type="button" onclick="togglePasswordInput(this, 'user-password')">
|
||
<i class="la la-eye-slash"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<button type="submit" value="Login" class="btn btn-primary py-2 btn-login w-100">
|
||
|
||
<span class="loading d-none">
|
||
<span class="spinner-border spinner-border-sm align-middle" role="status" aria-hidden="true">
|
||
</span>
|
||
<span>Authenticating</span>...
|
||
</span>
|
||
|
||
<span class="button-text">
|
||
Login <i class="la la-arrow-right ms-2"></i>
|
||
</span>
|
||
|
||
</button>
|
||
<div class="my-2"></div>
|
||
<a href="/user/reset" data-v-url="user/reset/index" class="my-2">Forgot your password?</a>
|
||
|
||
<div class="my-2"></div>
|
||
<!--
|
||
<a>
|
||
<span class="btn btn-secondary btn-sm">
|
||
<i class="lab la-google la-lg"></i>
|
||
</span>
|
||
</a>
|
||
<a>
|
||
<span class="btn btn-secondary btn-sm">
|
||
<i class="lab la-facebook la-lg"></i>
|
||
</span>
|
||
</a> -->
|
||
<hr class="text-secondary">
|
||
<span>Don’t have an account?</span>
|
||
<br>
|
||
<a href="/user/signup" data-v-url="user/signup/index">Register Account</a>
|
||
<span class="text-body-tertiary">|</span>
|
||
<a href="/user/login" data-v-url="user/login/index">Login</a>
|
||
|
||
</div>
|
||
|
||
|
||
<div class="user-form" data-v-if="component.user_id">
|
||
<div class="text-center" data-v-if="user.first_name">Welcome <b data-v-user-first_name data-filter-capitalize>John</b>
|
||
<b data-v-user-last_name data-filter-capitalize>Doe</b>
|
||
</div>
|
||
<div class="text-center" data-v-if-not="user.first_name">Welcome <b data-v-user-username>johndoe</b>
|
||
</div>
|
||
|
||
<div class="dropdown-divider opacity-50 my-3"></div>
|
||
|
||
<ul class="m-3 list-unstyled">
|
||
<li>
|
||
<a href="user" data-v-url="user/index">
|
||
<i class="la la-user la-lg text-muted m-1"></i>
|
||
<span>My account</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="user/comments" data-v-url="user/comments/index">
|
||
<i class="la la-comment la-lg text-muted m-1"></i>
|
||
<span>Comments</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="user/orders" data-v-url="user/orders/index">
|
||
<i class="la la-shopping-bag la-lg text-muted m-1"></i>
|
||
<span>Orders</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="user/downloads" data-v-url="user/downloads/index">
|
||
<i class="la la-hand-holding-heart la-lg text-muted m-1"></i>
|
||
<span>Downloads</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="user/wishlist" data-v-url="user/wishlist/index">
|
||
<i class="la la-download la-lg text-muted m-1"></i>
|
||
<span>Wishlist</span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="user/profile" data-v-url="user/profile/index">
|
||
<i class="la la-cogs la-lg text-muted m-1"></i>
|
||
<span>Profile</span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
|
||
|
||
<input type="hidden" name="logout">
|
||
|
||
<button type="submit" value="logout" class="btn btn-sm btn-primary w-100">
|
||
|
||
<span class="loading d-none">
|
||
<span class="spinner-border spinner-border-sm align-middle" role="status" aria-hidden="true">
|
||
</span>
|
||
<span>Loading ...</span>...
|
||
</span>
|
||
|
||
<span class="button-text">
|
||
<i class="la la-sign-out-alt la-lg m-1"></i>
|
||
<span>Log out</span>
|
||
</a>
|
||
</span>
|
||
|
||
</button>
|
||
</div>
|
||
</form>
|
||
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</li>
|
||
|
||
<li class="nav-toggle">
|
||
<button class="btn btn-outline-secondary btn-sm border-0" type="submit" title="Search" data-bs-toggle="modal" data-bs-target="#searchModal">
|
||
<div class="la-flip-horizontal">
|
||
<i class="la la-search la-lg" aria-hidden="true"></i>
|
||
</div>
|
||
</button>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a id="color-theme-switch" class="nav-link" role="button" title="Switch sidebar color theme">
|
||
<i class="la la-sun"></i>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!--
|
||
<div class="search-area toggle-hover">
|
||
<form action="/search" method="get" data-v-action="/search">
|
||
<input type="hidden" name="route" value="search">
|
||
<div class="input-group">
|
||
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
|
||
<button class="btn border-0" type="submit" title="Search">
|
||
<div class="la-flip-horizontal">
|
||
<i class="la la-search la-lg" aria-hidden="true"></i>
|
||
</div>
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
-->
|
||
<!-- </div> -->
|
||
<!--
|
||
<div class="collapse navbar-collapse" id="navbar">
|
||
<ul class="navbar-nav ms-auto">
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="#features">Features <span class="sr-only">(current)</span></a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://themes.vvveb.com">Themes</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://plugins.vvveb.com">Plugins</a>
|
||
</li>
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-link dropdown-toggle" id="dropdown01" data-bs-toggle="dropdown" aria-expanded="false">Resources</a>
|
||
<div class="dropdown-menu" aria-labelledby="dropdown01">
|
||
<a class="dropdown-item" target="_blank" href="https://github.com/givanz/VvvebJs/wiki">User Documentation</a>
|
||
<a class="dropdown-item" target="_blank" href="https://github.com/givanz/VvvebJs/wiki">Developer Documentation</a>
|
||
</div>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" target="_blank" href="https://github.com/givanz/VvvebJs">Github</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="contact.html">Contact</a>
|
||
</li>
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="https://vvveb.com/download.php">Download for free</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
-->
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</nav>
|
||
|
||
|
||
<header class="hero-1" aria-label="hero-1">
|
||
|
||
<div class="container">
|
||
<div class="heading">
|
||
<h1 class="display-1">Open Source CMS Reinvented</h1>
|
||
|
||
<h2 class="fs-3 text-muted">Powerful and easy to use drag and drop website builder for blogs, websites or ecommerce stores.</h2>
|
||
|
||
<div class="btns">
|
||
<a class="btn btn-primary btn-lg btn-shadow" href="/page/download" role="button">
|
||
<span>Create website</span>
|
||
<i class="la la-caret-right"></i>
|
||
</a>
|
||
|
||
<a class="btn btn-outline-secondary btn-lg btn-shadow" href="/download.php" role="button">
|
||
<span>Free Download</span>
|
||
<i class="la la-arrow-down"></i>
|
||
</a>
|
||
<!--
|
||
<div class="nav-item dropdown">
|
||
<a class="btn btn-outline-primary nav-link dropdown-toggle" href="//demo.vvveb.com/admin/?module=/editor/editor&template=index.html&url=/" role="button">Live demo <b>›</b></a>
|
||
<div class="dropdown-menu">
|
||
<a class="dropdown-item" target="_blank" href="//demo.vvveb.com/admin/?module=/editor/editor&template=index.html&url=/">Page builder</a>
|
||
<a class="dropdown-item" target="_blank" href="//demo.vvveb.com/admin">Admin dashboard</a>
|
||
<a class="dropdown-item" target="_blank" href="//demo.vvveb.com">Frontend</a>
|
||
<div class="dropdown-divider"></div>
|
||
<a class="dropdown-item" target="_blank" href="https://vercel-vvveb-commerce.vercel.app/">Next.js Frontend GraphQL</a>
|
||
</div>
|
||
</div>
|
||
-->
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div class="frame mx-auto">
|
||
<!--
|
||
<video loading="lazy" src="video/intro.mp4" width="1280" muted="true" playsinline="true" loop="true" controls="true" poster="https://www.vvveb.com/img/dark-theme.webp"></video> -->
|
||
<img src="https://www.vvveb.com/img/dark-theme.webp" class="img-fluid">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="overlay">
|
||
</div>
|
||
|
||
<div class="background-container">
|
||
<!-- <img src="demo/img//background.svg" alt="Hero background" loading="lazy"> -->
|
||
</div>
|
||
|
||
</header>
|
||
|
||
|
||
|
||
<!--
|
||
|
||
<section class="d-flex showcase-1 section-overlap pt-0" style="background:var(--bs-body-bg)">
|
||
<div class="container">
|
||
<div class="frame mx-auto">
|
||
<video loading="lazy" src="video/intro.mp4" width="1280" muted="true" playsinline="true" loop="true" controls="true"></video>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</section>
|
||
-->
|
||
|
||
<section class="mb-5 py-5" style="background-color:rgba(var(--bs-body-color-rgb), 0.03)">
|
||
<div class="container">
|
||
<div class="py-4">
|
||
<h2 class="display-6 fw-bold text-center">Packed with everything you need to build any modern website.</h2>
|
||
<div class="mx-auto text-center">
|
||
<p class="fs-5 mx-auto">Vvveb has all the features you will need to manage your content or sell online.</p>
|
||
<p class="fs-5 mx-auto">It includes a page builder, has full internationalization support, advanced ecommerce features, security.</p>
|
||
<p class="fs-5 mx-auto">And with the integrated extensions marketplace you can extend it for any purpose.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-5 col-sm-12 col-text">
|
||
<div>
|
||
<h3>Drag and drop page builder</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-mouse la-lg"></i>
|
||
<p>Unique abillity to customize any page and element without limitations.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-desktop la-lg"></i>
|
||
<p>Real WYSIWYG editor, the page will look exactly like in the editor with no difference.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video float-end">
|
||
<video loading="lazy" class="img-fluid" src="video/drag.m4v" width="1280" muted="true" loop="true" controls="true" poster="https://www.vvveb.com/img/light-theme.webp"></video>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video">
|
||
<!-- <video loading="lazy" class="img-fluid" src="video/drag.m4v" muted playsinline loop></video> -->
|
||
<img src="img/security.webp" class="img-fluid" alt="Security dashboard" loading="lazy">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 col-sm-12 col-text">
|
||
<div>
|
||
<h3>Better Security</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-user-lock la-lg"></i>
|
||
<p>Custom random <i>/admin-0j57bgw</i> login page for admin to protect against password brute force attacks.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-lock la-lg"></i>
|
||
<p>Vvveb is 100% safe against sql injections a vulnerability that affects many CMSes.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-shield-alt la-lg"></i>
|
||
<p>Document root folder can be set to /public to expose only index.php to minimize attack surface and protect plugins php files from exposure.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-key la-lg"></i>
|
||
<p>Built in integrity check.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-fingerprint la-lg"></i>
|
||
<p>2FA Authentication.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>Hybrid Headless CMS</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-code-branch la-lg"></i>
|
||
<p>Vvveb can used both as a traditional CMS and a Headless CMS</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-server la-lg"></i>
|
||
<p>Both GraphQL and REST Api are available for integration.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video d-flex">
|
||
<!-- <video loading="lazy" class="img-fluid" src="video/drag.m4v" muted playsinline loop></video> -->
|
||
<img src="https://plugins.vvveb.com/media//plugins/openapi/openapi-1.png" alt="OpenAPI Headless CMS" class="w-50" loading="lazy">
|
||
<img src="https://plugins.vvveb.com/media//plugins/graphql/graphql-1.png" alt="GraphQL Headless CMS" class="w-50" loading="lazy">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video d-flex">
|
||
<!-- <video loading="lazy" class="img-fluid" src="video/drag.m4v" muted playsinline loop></video> -->
|
||
<img class="img-fluid" src="img/role.webp" alt="CMS Role permissions" loading="lazy">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>Role-based access and permissions.</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-lock la-lg"></i>
|
||
<p>Action level access management for each role</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-key la-lg"></i>
|
||
<p>Control role permission for both dashboard and GraphQL and Rest APIs.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>Localization</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-flag la-lg"></i>
|
||
<p>Publish content in multiple languages or sell in different currencies.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-globe la-lg"></i>
|
||
<p>With language packs use the interface in the language you like.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video float-end">
|
||
<!-- <video loading="lazy" class="img-fluid" src="video/drag.m4v" muted playsinline loop></video> -->
|
||
<img class="img-fluid" src="img/languages.webp" alt="Languages list" loading="lazy">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video">
|
||
<!-- <video loading="lazy" class="img-fluid" src="video/drag.m4v" muted playsinline loop></video> -->
|
||
<img class="img-fluid" src="img/ecommerce.webp" alt="Ecommerce product edit" loading="lazy">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 col-sm-12 col-text">
|
||
<div>
|
||
<h3>Ecommerce</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-store-alt la-lg"></i>
|
||
<p>Vvveb is a full featured ecommerce platform with advanced functionality.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-shopping-bag la-lg"></i>
|
||
<p>All modern ecommerce features are available</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-wallet la-lg"></i>
|
||
<p>Multiple payment methods</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>Easy installation</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-hand-pointer la-lg"></i>
|
||
<p>One click easy installation, with no setup when using sqlite.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-database la-lg"></i>
|
||
<p>Supports MySql, SQLite and PostgreSql databases.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="lab la-php la-lg"></i>
|
||
<p>Compatible with all PHP versions from 7.4 to 8.4+</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video">
|
||
<!-- <video loading="lazy" class="img-fluid" src="video/drag.m4v" muted playsinline loop></video> -->
|
||
<img class="img-fluid" src="img/install.webp" alt="Install screen first step" loading="lazy">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video">
|
||
<!-- <video loading="lazy" class="img-fluid" src="video/drag.m4v" muted playsinline loop></video> -->
|
||
<img class="img-fluid" src="img/multisite.webp" alt="Multi site list" loading="lazy">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>Multi site</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-project-diagram la-lg"></i>
|
||
<p>Manage multiple websites or subdomains from the same installation.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-network-wired la-lg"></i>
|
||
<p>Run your blog, store, portfolio everything from the same dashboard.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>SEO out of the box</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-lightbulb la-lg"></i>
|
||
<p>Optimized for Lighthouse 100% high score <a href="https://pagespeed.web.dev/analysis/https-www-vvveb-com/ifu8jek4v9?form_factor=desktop" target="_blank">test results</a>.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-sitemap la-lg"></i>
|
||
<p>Automatic sitemaps and robots.txt configuration.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-server la-lg"></i>
|
||
<p>Time To First Byte in a few miliseconds.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-language la-lg"></i>
|
||
<p>Href langs support for multi language SEO.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="lab la-twitter la-lg"></i>
|
||
<p>Open Graph protocol meta tags for social snippets.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video float-end">
|
||
<img class="img-fluid" src="img/seo.webp" alt="Search engine optimization" loading="lazy">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video">
|
||
<img class="img-fluid" class="img-fluid" src="img/cache.webp" alt="Cache performance" loading="lazy">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>Very, very fast</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-feather-alt la-lg"></i>
|
||
<p>Low footprint, runs fast even on free shared hosting.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-file-alt la-lg"></i>
|
||
<p>With advanced caching can serve pages as fast as static websites.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-traffic-light la-lg"></i>
|
||
<p>Because of high performance can withstand traffic spikes without issues.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>Demo import</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-eye la-lg"></i>
|
||
<p>Built in theme demo import functionality helps you get started faster by providing initial content and configuration.</p>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video float-end">
|
||
<img class="img-fluid" src="img/themes.webp" alt="Themes demo import" loading="lazy">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
|
||
<section class="d-flex showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video">
|
||
<img class="img-fluid" src="img/open_source.webp" alt="Open source collaboration" loading="lazy">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 col-sm-12">
|
||
<div class="col-text">
|
||
<h3>Open source & free</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-hands la-lg"></i>
|
||
<p>Open source code means transparency and collaboration.</p>
|
||
</div>
|
||
<div class="d-flex">
|
||
<i class="la la-dove la-lg"></i>
|
||
<p>Free to use for everyone.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<section class="d-flex showcase-1 ">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-5 col-sm-12 col-text">
|
||
<div>
|
||
<h3>Unlimited design powers</h3>
|
||
<div class="d-flex">
|
||
<i class="la la-code la-lg"></i>
|
||
<p>Vvveb uses plain html for templating for maximum flexibility, convert any html template to a theme in just a few minutes.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-7 col-sm-12 col-img">
|
||
<div class="video float-end">
|
||
<!-- <video loading="lazy" class="img-fluid" src="video/drag.m4v" muted playsinline loop></video> -->
|
||
<img class="img-fluid" src="img/html.webp" alt="Html code preview" loading="lazy">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<!--
|
||
<section class="showcase-1">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
|
||
<h3 class="text-center">Sponsors</h3>
|
||
<hr class="border-secondary"/>
|
||
|
||
<div class="text-center my-4">
|
||
<a href="https://trycrypto.com/?utm_source=opencollective&utm_medium=github&utm_campaign=vvvebjs" rel="sponsored noopener" target="_blank">
|
||
<img class="img-fluid" src="https://opencollective.com/vvvebjs/sponsors/0/avatar" alt="Sponsors" loading="lazy">
|
||
<h2 class="visually-hidden">Sponsors</h2>
|
||
</a>
|
||
</div>
|
||
<div class="text-center">
|
||
<a href="https://opencollective.com/vvvebjs/backers/0/website" rel="sponsored noopener" target="_blank">
|
||
<img class="img-fluid" width="32" src="https://opencollective.com/vvvebjs/backers/0/avatar" alt="Backers" loading="lazy">
|
||
<h2 class="visually-hidden">Backers</h2>
|
||
</a>
|
||
</div>
|
||
|
||
<div class="p-3 fs-5 text-center my-4">
|
||
<a href="/page/sponsor" class="btn btn-primary mx-auto d-inline-block">Become Sponsor</a>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
-->
|
||
<footer class="footer-1" title="footer-1" data-v-save-global="index.html,.footer-1">
|
||
<div class="container" data-v-component-menu="footer" data-v-slug="main-footer">
|
||
|
||
<div class="row" data-v-menu-items>
|
||
|
||
<div class="col-md">
|
||
|
||
<div data-v-component-site>
|
||
<img src="demo/img/logo-white.png" alt="Site logo dark" loading="lazy" class="logo-default-dark" data-v-site-logo-dark>
|
||
<img src="demo/img/logo.png" alt="Site logo" loading="lazy" class="logo-default" data-v-site-logo>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
|
||
<div class="col-md" data-v-menu-item data-v-if="category.children > 0">
|
||
<div class="h6" data-v-menu-item-name>Vvveb</div>
|
||
<nav data-v-menu-item-recursive>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="https://themes.vvveb.com/" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Themes</span>
|
||
</a>
|
||
</div>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="https://plugins.vvveb.com/" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Plugins</span>
|
||
</a>
|
||
</div>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="content/index.html" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Blog</span>
|
||
</a>
|
||
</div>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="product/index.html" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Shop</span>
|
||
</a>
|
||
</div>
|
||
</nav>
|
||
</div>
|
||
|
||
<div class="col-md" data-v-menu-item data-v-if="category.children > 0">
|
||
<div class="h6" data-v-menu-item-name>Resources</div>
|
||
<nav data-v-menu-item-recursive>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="https://github.com/givanz/VvvebJs/wiki" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>User documentation</span>
|
||
</a>
|
||
</div>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="https://github.com/givanz/VvvebJs/wiki" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Developer documentation</span>
|
||
</a>
|
||
</div>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="pricing.html" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Pricing</span>
|
||
</a>
|
||
</div>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="services.html" data-v-menu-item-url>
|
||
<span data-v-menu-item-name>Services</span>
|
||
</a>
|
||
</div>
|
||
</nav>
|
||
</div>
|
||
|
||
<div class="col-md" data-v-menu-item data-v-if="category.children > 0">
|
||
<div class="h6" data-v-menu-item-name>Contact</div>
|
||
<nav data-v-menu-item-recursive>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="" href="contact.html">Contact us</a>
|
||
<a href="" href="portfolio.html">Portfolio</a>
|
||
<a href="" href="about.html">About us</a>
|
||
<a href="" href="user/return-form.html">Return form</a>
|
||
</div>
|
||
</nav>
|
||
</div>
|
||
|
||
<div class="col-md" data-v-menu-item data-v-if="category.children > 0">
|
||
<div class="h6" data-v-menu-item-name>My account</div>
|
||
<nav data-v-menu-item-recursive>
|
||
<div data-v-menu-item data-v-if="category.children == 0">
|
||
<a href="" href="user/order-tracking.html">Order tracking</a>
|
||
<a href="" href="user/wishlist.html">Wishlist</a>
|
||
<a href="" href="user/orders.html">Orders</a>
|
||
<a href="" href="cart/compare.html">Compare</a>
|
||
</div>
|
||
</nav>
|
||
</div>
|
||
|
||
|
||
|
||
</div>
|
||
<!--
|
||
<div class="row justify-content-end">
|
||
<div class="col-md-3 text-muted text-small mt-5">
|
||
© <span data-v-global-current_year>2025</span> <span data-v-sitename>Vvveb</span>. Powered by <a href="https://vvveb.com" target="_blank">Vvveb</a>
|
||
</div>
|
||
</div>
|
||
-->
|
||
|
||
</div>
|
||
|
||
<div class="footer-copyright">
|
||
<div class="container">
|
||
<div class="d-flex flex-column flex-md-row">
|
||
<div class="text-muted flex-grow-1">
|
||
<a class="btn-link text-muted" href="/page/terms-conditions">Terms and conditions</a> |
|
||
<a class="btn-link text-muted" href="/page/privacy-policy">Privacy Policy</a>
|
||
</div>
|
||
<div class="text-muted">
|
||
© <span data-v-global-current_year>2025</span>
|
||
<span data-v-global-site.description.title>Vvveb</span>. <span>Powered by</span>
|
||
<a href="https://vvveb.com" class="btn-link text-muted" target="_blank">Vvveb</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</footer>
|
||
|
||
<div class="bg-image"></div>
|
||
|
||
<div class="alert alert-light alert-dismissible fade alert-top" role="alert" style="display:none">
|
||
<div class="container">
|
||
|
||
<div class="message">
|
||
Product was added to cart.
|
||
</div>
|
||
|
||
|
||
<button type="button" class="btn-close" data-dismiss="alert" aria-label="Close"></button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="modal fade" id="searchModal" tabindex="-1" aria-labelledby="searchModalLabel" aria-hidden="true">
|
||
<div class="modal-dialog modal-dialog-scrollable">
|
||
<div class="modal-content shadow">
|
||
<div class="modal-body p-0">
|
||
|
||
<form action="/search" method="get">
|
||
<input type="hidden" name="route" value="search" />
|
||
<div class="d-flex">
|
||
<div class="input-group">
|
||
<input type="search" name="search" class="form-control border-0 p-3 px-4" id="headerSearch" placeholder="Start typing to search" data-v-vvveb-action="search" data-selector=".search-results" data-v-vvveb-on="keyup" />
|
||
<button class="btn btn-outline-primary border-0" type="submit" title="Search">
|
||
<div class="la-flip-horizontal">
|
||
<i class="la la-search la-lg" aria-hidden="true"></i>
|
||
</div>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="loading d-none d-flex justify-content-center m-5">
|
||
<div class="spinner-border" role="status">
|
||
<span class="visually-hidden">Loading...</span>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
|
||
<div class="search-results">
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<button type="button" class="btn-close btn-close-white small" data-bs-dismiss="modal" aria-label="Close"></button>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
|
||
<div class="offcanvas offcanvas-end" tabindex="-1" id="cart-offcanvas" aria-labelledby="cart-offcanvas">
|
||
|
||
<div class="offcanvas-header pb-0">
|
||
<h5 class="offcanvas-title"></h5>
|
||
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||
</div>
|
||
<div class="offcanvas-body d-flex flex-column pt-2" data-v-component-cart="offcanvas">
|
||
|
||
<div class="table-responsive flex-grow-1">
|
||
<table class="table cart-table align-middle mb-0">
|
||
<tbody>
|
||
|
||
|
||
<tr data-v-cart-product>
|
||
<td class="text-center">
|
||
<a href="#40" data-v-cart-product-url>
|
||
<img src="demo/img/product.webp" alt="Product name" class="img-rounded" loading="lazy" data-v-cart-product-image width=50>
|
||
</a>
|
||
</td>
|
||
<td class="text-start small">
|
||
<a href="#40" class="d-block" data-v-cart-product-url>
|
||
<span data-v-cart-product-name>Product name</span>
|
||
</a>
|
||
|
||
<span data-v-cart-product-quantity>1</span>
|
||
<i class="la la-times text-muted"></i>
|
||
<span data-v-cart-product-price_tax_formatted>$123.20</span>
|
||
|
||
<div class="option" data-v-if="product.option">
|
||
<div class="" data-v-product-option>
|
||
<span data-v-product-option-option>Color</span>: <span data-v-product-option-name>Red</span>
|
||
<span data-v-if="value.price > 0">(<span data-v-product-option-price></span>)</span>
|
||
</div>
|
||
<div class="" data-v-product-option>
|
||
<span data-v-product-option-option>Size</span>: <span data-v-product-option-name>XL</span>
|
||
<span data-v-if="value.price > 0">(<span data-v-product-option-price></span>)</span>
|
||
</div>
|
||
<div class="" data-v-product-option>
|
||
<span data-v-product-option-option>Material</span>: <span data-v-product-option-name>Wool</span>
|
||
<span data-v-if="value.price > 0">(<span data-v-product-option-price></span>)</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="subscription" data-v-if="product.subscription">
|
||
<span>Subscription plan</span>:
|
||
<span data-v-cart-product-subscription_name>Subscription plan</span>
|
||
</div>
|
||
</td>
|
||
<td class="text-end">
|
||
<a class="btn btn-remove btn-sm border-0" data-v-vvveb-action="removeFromCart" data-v-cart-product-remove-url>
|
||
<i class="la la-times-circle la-lg"></i>
|
||
</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-v-cart-product>
|
||
<td class="text-center">
|
||
<a href="#40" data-v-cart-product-url>
|
||
<img src="demo/img/product.webp" alt="Product name" class="img-rounded" loading="lazy" data-v-cart-product-image width=50>
|
||
</a>
|
||
</td>
|
||
<td class="text-start">
|
||
<a href="#40" class="d-block" data-v-cart-product-url data-v-cart-product-name>
|
||
Product name
|
||
</a>
|
||
|
||
<span data-v-cart-product-quantity>1</span>
|
||
<i class="la la-times text-muted"></i>
|
||
<span data-v-cart-product-price_tax_formatted>$123.20</span>
|
||
|
||
|
||
</td>
|
||
<td class="text-end">
|
||
<a class="btn btn-outline-secondary btn-sm border-0" data-v-vvveb-action="removeFromCart" data-v-cart-product-remove-url>
|
||
<i class="la la-times"></i>
|
||
</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-v-if-not="cart.total_items">
|
||
<td colspan="100">
|
||
<div class="d-flex p-2">
|
||
<div class="text-center p-2 opacity-75">
|
||
<!-- <img src="demo/img/bag.svg" width="20" alt> -->
|
||
<i class="la la-2x la-shopping-bag"></i>
|
||
</div>
|
||
<div class="p-2">
|
||
<strong>Empty cart</strong>
|
||
<br>
|
||
<span class="text-muted">No products added yet!</span>
|
||
</div>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
|
||
</table>
|
||
</div>
|
||
|
||
<div class="p-3 pt-0 border-top" data-v-if="cart.total_items">
|
||
<div class="table-responsive mb-2" data-v-cart-totals>
|
||
<table class="table mb-0 cart-table cart-total" cellspacing="0">
|
||
<tfoot>
|
||
<tr data-v-cart-total>
|
||
<td colspan="5" class="text-end">
|
||
<small data-v-cart-total-title>Sub-Total</small>:
|
||
</td>
|
||
<td class="text-end">
|
||
<span data-v-cart-total-text data-v-if="total.text"> - </span>
|
||
<span data-v-cart-total-value_formatted data-v-if="total.value > 0">$101.00</span>
|
||
</td>
|
||
</tr>
|
||
<tr data-v-cart-total>
|
||
<td colspan="5" class="text-end">
|
||
<small>Eco Tax (2.00):</small>
|
||
</td>
|
||
<td class="text-end">$2.00</td>
|
||
</tr>
|
||
<tr data-v-cart-total>
|
||
<td colspan="5" class="text-end">
|
||
<small>VAT (19%):</small>
|
||
</td>
|
||
<td class="text-end">$20.20</td>
|
||
</tr>
|
||
<tr data-v-cart-total>
|
||
<td colspan="5" class="text-end">
|
||
<small>Total:</small>
|
||
</td>
|
||
<td class="text-end">$123.20</td>
|
||
</tr>
|
||
<tr>
|
||
<td colspan="5" class="text-end">Total:</td>
|
||
<td class="text-end" data-v-grand-total_formatted>$0</td>
|
||
</tr>
|
||
</tfoot>
|
||
|
||
</table>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div class="row mt-2 g-2 px-3 pb-2" data-v-if="cart.total_items">
|
||
<div class="col-6">
|
||
<a href="" class="btn btn-light btn-sm border w-100" data-v-url="cart/cart/index" data-url>
|
||
<i class="la la-shopping-cart la-lg"></i>
|
||
<span>View cart</span>
|
||
</a>
|
||
</div>
|
||
<div class="col-6">
|
||
<a href="" class="btn btn-primary btn-sm w-100" data-v-url="checkout/checkout/index">
|
||
<span>Checkout</span>
|
||
<i class="la la-arrow-right la-lg"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
|
||
<div id="page-loading-status" class="progress progress-bar"></div>
|
||
|
||
<!-- Vvveb Common Js -->
|
||
<script id="popper-js" src="js/popper.min.js"></script>
|
||
<!-- <script src="js/bootstrap.min.js"></script> -->
|
||
<!-- <script src="js/bootstrap.bundle.min.js"></script> -->
|
||
<script id="bootstrap-js" src="js/bootstrap.min.js"></script>
|
||
<!-- Vvveb Ajax Common Js -->
|
||
<script id="app-js" src="/js/app.js"></script>
|
||
|
||
<!-- Animation -->
|
||
|
||
<link rel="stylesheet" href="js/aos.css" />
|
||
<noscript>
|
||
<style type="text/css">
|
||
[data-aos] {
|
||
opacity: 1 !important;
|
||
transform: translate(0) scale(1) !important;
|
||
}
|
||
</style>
|
||
</noscript>
|
||
|
||
<script src="js/aos.js"></script>
|
||
<script>
|
||
AOS.init();
|
||
</script>
|
||
|
||
<script id="cart-js" src="/js/app/cart.js"></script>
|
||
|
||
<link id="glightbox-css" rel="stylesheet" href="/js/libs/glightbox/glightbox.css" />
|
||
<script id="glightbox-js" src="/js/libs/glightbox/glightbox.min.js"></script>
|
||
|
||
<script id="theme-js" src="/js/app/theme.js"></script>
|
||
|
||
<script type="speculationrules">
|
||
{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/*"},{"not":{"href_matches":["\/public\/*","\/themes\/*","\/plugins\/*","\/cart\/*","\/checkout\/*","\/user\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}
|
||
</script>
|
||
|
||
|
||
<script>
|
||
/*
|
||
var options = {
|
||
//root: document.body,
|
||
rootMargin: '0px',
|
||
threshold: 1.0 // trigger only when element comes into view completely
|
||
};
|
||
|
||
var previousVideo = false;
|
||
var currentVideo = false;
|
||
var ob = new IntersectionObserver((entries, observer) => {
|
||
currentVideo = entries[0].target;
|
||
|
||
if (previousVideo) {
|
||
previousVideo.pause();
|
||
previousVideo.parentNode.classList.toggle('play');
|
||
}
|
||
previousVideo = entries[0].target;
|
||
currentVideo.play();
|
||
currentVideo.parentNode.classList.toggle('play');
|
||
//console.log(entries[0].target);
|
||
|
||
}, options);
|
||
|
||
// observe all paragraphs, when coming into view, change color
|
||
document.querySelectorAll('video').forEach((item) => {
|
||
ob.observe(item);
|
||
});
|
||
*/
|
||
</script>
|
||
|
||
</body>
|
||
|
||
</html> |