Skip to content

V
virtualX
Commit dd3285ef authored by Nameer AS's avatar Nameer AS
Browse files
Options

ne pages integrated

parent 4daf7d35
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 4223 additions and 30 deletions
package.json
View file @ dd3285ef
...@@ -10,10 +10,11 @@ ...@@ -10,10 +10,11 @@
"author": "ZURB <foundation@zurb.com>", "author": "ZURB <foundation@zurb.com>",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@fortawesome/fontawesome": "^1.1.4",
"foundation-sites": "~6.4.1", "foundation-sites": "~6.4.1",
"jquery": ">=3.0.0", "jquery": ">=3.0.0",
"what-input": "^4.1.3", "motion-ui": "~1.2.2",
"motion-ui": "~1.2.2" "what-input": "^4.1.3"
}, },
"devDependencies": { "devDependencies": {
"babel-core": "^6.24.1", "babel-core": "^6.24.1",
......
src/assets/js/app.js
View file @ dd3285ef
...@@ -6,9 +6,11 @@ window.jQuery = window.$ = require("jquery"); ...@@ -6,9 +6,11 @@ window.jQuery = window.$ = require("jquery");
import Foundation from 'foundation-sites'; import Foundation from 'foundation-sites';
require('./jquery.waypoints.min.js'); require('./jquery.waypoints.min.js');
require('./jquery.counterup.js'); require('./jquery.counterup.js');
require('./jquery.hoverdir.js'); require('./jquery.hoverdir.js');
require('./SmoothScroll.js'); require('./SmoothScroll.js');
require('./owl.carousel.js'); require('./owl.carousel.js');
require('@fortawesome/fontawesome')
require('./main.js'); require('./main.js');
\ No newline at end of file
src/assets/js/main.js
View file @ dd3285ef
...@@ -143,18 +143,11 @@ $(document).ready(function() { ...@@ -143,18 +143,11 @@ $(document).ready(function() {
parentItem.addClass('hide-to-top'); parentItem.addClass('hide-to-top');
parentItem.siblings('.item').addClass('show-from-bottom'); parentItem.siblings('.item').addClass('show-from-bottom');
}); });
$('.select-plan ul li').click(function() { $('.select-plan ul li').click(function() {
$(this).siblings().addBack().children().remove(); var curTab = $(this).attr('data-plan');
$(this).siblings().toggle(); $('#' + curTab).hide();
$(this).siblings().slideToggle();
$(this).parent().prepend(this); $(this).parent().prepend(this);
$(this).parent().toggleClass('nnn'); $('#' + curTab).show();
});
$('.select-plan > ul> li:not(:first-child)').click(function() {
var _curr_tab = $(this).attr('data-plan');
console.log(_curr_tab)
}); });
}); });
\ No newline at end of file
src/assets/scss/_main.scss
View file @ dd3285ef
...@@ -90,6 +90,9 @@ h1 { ...@@ -90,6 +90,9 @@ h1 {
h2 { h2 {
margin: 0; margin: 0;
&.padd-adj {
padding-bottom: 30px;
}
} }
h6 { h6 {
...@@ -200,6 +203,64 @@ header { ...@@ -200,6 +203,64 @@ header {
background: #fff; background: #fff;
z-index: 9999; z-index: 9999;
padding: 10px 0 18px; padding: 10px 0 18px;
box-shadow: 0px 2px 19px -4px rgba(0, 0, 0, 0.36);
&.type-2 {
&.small {
.user-welcome {
top: -5px;
}
}
.language-bar {
flex: 1 0 50%;
}
.user-welcome {
position: relative;
top: -15px;
transition: all ease 0.5s;
font-size: 14px;
font-weight: bold;
span {
color: #cd202f;
}
a {
color: #000;
}
}
nav {
margin-top: 0 !important;
position: static;
background: transparent;
min-width: inherit;
height: auto;
padding: 0;
ul.vertical.menu {
height: auto !important;
flex-direction: row;
li {
padding: 0 19px;
&.active {
a {
color: #cd202f;
background: transparent;
}
}
a {
color: #000000;
padding: 0;
&:hover {
color: #cd202f;
&:before {
display: none;
}
}
}
}
}
&:before {
display: none;
}
}
}
.logo { .logo {
align-self: flex-end; align-self: flex-end;
img { img {
...@@ -208,7 +269,6 @@ header { ...@@ -208,7 +269,6 @@ header {
} }
} }
&.small { &.small {
box-shadow: 0px 2px 19px -4px rgba(0, 0, 0, 0.36);
.logo { .logo {
img { img {
max-width: 120px; max-width: 120px;
...@@ -339,6 +399,7 @@ header { ...@@ -339,6 +399,7 @@ header {
font-size: 12px; font-size: 12px;
font-weight: 300; font-weight: 300;
color: rgba(255, 255, 255, 0.3); color: rgba(255, 255, 255, 0.3);
margin: 0 0 15px;
} }
padding-top: 15px; padding-top: 15px;
padding-bottom: 15px; padding-bottom: 15px;
...@@ -346,7 +407,9 @@ header { ...@@ -346,7 +407,9 @@ header {
position: relative; position: relative;
} }
input, input,
textarea { textarea,
select {
font-family: "Roboto", sans-serif;
background: transparent; background: transparent;
color: #fff; color: #fff;
border: none; border: none;
...@@ -364,6 +427,50 @@ header { ...@@ -364,6 +427,50 @@ header {
@extend input; @extend input;
} }
} }
input {
&[type="radio"] {
position: absolute;
left: 0;
top: 0;
height: auto;
margin: 0;
outline: 0;
opacity: 0;
&:checked {
&+.checkmark:after {
display: block;
}
}
}
}
select {
background: url(../img/dropdown.png) no-repeat center right 12px !important;
color: rgba(255, 255, 255, 0.3) !important;
option {
color: #000 !important;
}
}
.checkmark {
position: absolute;
top: 0;
left: 0;
height: 14px;
width: 14px;
background-color: #eee;
border: solid 1px #d8d8d8;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
&:after {
content: "";
width: 6px;
height: 6px;
border-radius: 50%;
background: #9e2323;
display: none;
}
}
label { label {
transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0);
position: absolute; position: absolute;
...@@ -424,6 +531,46 @@ header { ...@@ -424,6 +531,46 @@ header {
position: static; position: static;
} }
} }
.panel {
font-size: 16px;
display: inline-block;
width: 100%;
margin: 0 0 25px;
border: solid 1px #d7d7d7;
.panel-head {
background: #9e2323;
color: #fff;
padding: 7px 15px;
font-size: 16px;
}
.panel-body {
float: left;
width: 100%;
padding: 0 15px;
.plan-type {
border-bottom: solid 1px #d7d7d7;
display: block;
padding: 15px 15px 10px;
margin: 0 -15px;
}
.plan-price {
display: inline-block;
width: 100%;
padding: 15px 0 10px;
}
.payment-type {
display: flex;
padding: 12px 0;
justify-content: space-between;
.radio-wrap {
position: relative;
display: flex;
align-items: center;
padding: 0 0 0 25px;
}
}
}
}
} }
.hamburger-menu { .hamburger-menu {
...@@ -1440,11 +1587,21 @@ footer { ...@@ -1440,11 +1587,21 @@ footer {
margin: 0; margin: 0;
} }
.register { .unf-padding {
padding: 35px 0;
}
.full-height {
min-height: 100%; min-height: 100%;
padding: 70px 0; }
.dark-bg {
background: #261b1b; background: #261b1b;
color: #fff; color: #fff;
}
.register {
padding: 70px 0;
.price { .price {
color: #fff; color: #fff;
background: #cb022c; background: #cb022c;
...@@ -1458,6 +1615,92 @@ footer { ...@@ -1458,6 +1615,92 @@ footer {
background: #261b1b; background: #261b1b;
color: #fff; color: #fff;
} }
.plan-detail {
display: none;
}
}
&.settings {
background: transparent;
color: #000;
h2 {
padding-bottom: 40px;
}
.form-wrap {
.info {
color: #000;
}
label {
color: #000;
opacity: 1;
}
select {
color: #000 !important;
}
}
}
}
.search-result {
padding: 70px 0;
.sr-result {
display: flex;
flex-wrap: wrap;
.item-block {
flex: 1 1 50%;
}
}
h5 {
color: #cb022c;
font-size: 20px;
font-weight: normal;
margin: 0 0 20px;
}
p {
line-height: 25px;
font-size: 18px;
color: rgba(255, 255, 255, 0.3);
}
.item-block {
padding-bottom: 65px;
&:nth-child(2n+1) {
padding-right: 100px;
border-right: solid 1px #514949;
}
&:nth-child(2n+2) {
padding-left: 100px;
}
&:nth-child(n+3) {
padding-top: 65px;
border-top: solid 1px #514949;
}
}
}
.vx-table {
border-bottom: none;
border-color: transparent;
&.text-center {
th {
text-align: center;
}
}
thead,
tbody {
border: none;
}
tr,
th,
td {
border: solid 1px #d7d7d7;
padding: 10px 25px;
}
tr {
&:last-child {
border: solid 1px #d7d7d7;
}
i {
color: #cd202f;
}
} }
} }
......
src/assets/scss/app.scss
View file @ dd3285ef
...@@ -48,5 +48,6 @@ ...@@ -48,5 +48,6 @@
@include motion-ui-transitions; @include motion-ui-transitions;
@include motion-ui-animations; @include motion-ui-animations;
@import 'owl.carousel'; @import 'owl.carousel';
@import 'fontawesome';
@import 'main'; @import 'main';
@import 'responsive'; @import 'responsive';
\ No newline at end of file
src/assets/scss/fontawesome.scss 0 → 100644
View file @ dd3285ef
This diff is collapsed.
src/layouts/default.html
View file @ dd3285ef
...@@ -15,9 +15,7 @@ ...@@ -15,9 +15,7 @@
</head> </head>
<body> <body>
{{#ifpage 'dashboard' 'orders' 'account-settings' 'make-payment'}} {{> header-type-2}}{{> body}} {{/ifpage}} {{#unlesspage 'dashboard' 'orders' 'account-settings' 'make-payment' }} {{> header}} {{> body}} {{/unlesspage}}
{{> header}} {{> body}}
<script src="{{root}}assets/js/app.js"></script> <script src="{{root}}assets/js/app.js"></script>
</body> </body>
......
src/pages/account-settings.html 0 → 100644
View file @ dd3285ef
<section class="register settings unf-padding full-height">
<div class="grid-container">
<h2>Account Settings </h2>
<div class="grid-x grid-padding-x">
<div class="large-12 medium-6 cell">
<div class="grid-x grid-padding-x form-wrap">
<div class="large-6 medium-6 cell">
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">Account Name *</label>
</div>
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">Email *</label>
</div>
<div class=" cell">
<input type="password" placeholder="" required="">
<label for="">Password *</label>
</div>
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">Address Line 1*</label>
</div>
<div class="cell">
<select>
<option value="" disabled selected>Country*</option>
<option value="">India</option>
<option value="">UAE</option>
</select>
</div>
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">Zip Code*</label>
</div>
<div class="cell">
<select>
<option value="" disabled selected>Phone Code*</option>
<option value="">+91</option>
<option value="">+97</option>
</select>
</div>
</div>
<div class="large-6 medium-6 cell">
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">Exam Portal *</label>
</div>
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">Username *</label>
</div>
<div class=" cell">
<input type="password" placeholder="" required="">
<label for="">Password Confirmation *</label>
</div>
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">Address Line 1*</label>
</div>
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">City*</label>
</div>
<div class="cell">
<select>
<option value="" disabled selected>Time Zone*</option>
<option value="">UTC +11</option>
<option value="">UTC +10</option>
</select>
</div>
<div class=" cell">
<input type="text" placeholder="" required="">
<label for="">Phone Number*</label>
</div>
</div>
<div class="large-6 medium-6 cell">
<div class="checkbox">
<input id="checkbox1" type="checkbox">
<label for="checkbox1">I accept terms and conditions</label>
</div>
</div>
<div class="large-6 medium-6 cell ">
<span class="text-right info"><span class="red">*</span>Mandatory Fields</span>
</div>
<div class="large-12 medium-12 cell">
<a href="" class="button float-right dark-hover">Submit</a>
</div>
</div>
</div>
</div>
</div>
</section>
\ No newline at end of file
src/pages/dashboard.html 0 → 100644
View file @ dd3285ef
<section class="unf-padding">
<div class="grid-container">
<h2 class="padd-adj">Dashboard </h2>
<div class="grid-x grid-padding-x ">
<div class="large-4 medium-6 cell">
<table class="unstriped vx-table text-center">
<thead>
<tr>
<th class="red">Credit Point</th>
<th>Balance Credit Points</th>
</tr>
</thead>
<tbody>
<tr>
<td>-</td>
<td>0</td>
</tr>
</tbody>
</table>
</div>
<div class="large-8 medium-6 cell">
<table class="unstriped vx-table">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Timezone</th>
<th>Country</th>
<th>Phone Number</th>
</tr>
</thead>
<tbody>
<tr>
<td>Alimon</td>
<td>alimon.kr@pitsolutions.com</td>
<td>Kolkata</td>
<td>India</td>
<td>+91 999857587</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
\ No newline at end of file
src/pages/make-payment.html 0 → 100644
View file @ dd3285ef
<section class="unf-padding">
<form action="" class="form-wrap">
<div class="grid-container">
<h2 class="padd-adj">Make Payment </h2>
<div class="grid-x grid-padding-x">
<div class="large-5 medium-6 cell">
<div class="grid-x grid-padding-x">
<div class="large-12 medium-6 cell">
<div class="panel">
<div class="panel-head">Package</div>
<div class="panel-body">
<div class="plan-type">Basic</div>
<div class="plan-price">
<div class="cr-point float-left">800</div>
<div class="plan-value float-right"> $199.96</div>
</div>
</div>
</div>
</div>
<div class="large-12 medium-6 cell">
<div class="panel">
<div class="panel-head">Select Payment Mode</div>
<div class="panel-body">
<div class="payment-type">
<div class="radio-wrap">
<input type="radio" name="payment_method" checked>
<span class="checkmark"></span>
<img src="assets/img/card-pay.png" alt="">
</div>
<div class="radio-wrap">
<input type="radio" name="payment_method">
<span class="checkmark"></span>
<img src="assets/img/paypal.png" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="large-7 medium-6 cell"></div>
</div>
</div>
</form>
</section>
\ No newline at end of file
src/pages/orders.html 0 → 100644
View file @ dd3285ef
<section class="unf-padding">
<div class="grid-container">
<h2 class="padd-adj">Orders </h2>
<div class="grid-x grid-padding-x ">
<div class="large-12 medium-6 cell">
<table class="unstriped vx-table">
<thead>
<tr>
<th>#</th>
<th>Package</th>
<th>Quantity</th>
<th>Total Price</th>
<th>Credit Points</th>
<th>Renewal</th>
<th>Status</th>
<th>Created at</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td class="red">
Basic
</td>
<td>4</td>
<td> $199.96</td>
<td>800</td>
<td>No</td>
<td>Pending</td>
<td>March 05, 2018 at 12:08 PM</td>
<td><i class="fas fa-sync-alt"></i></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
\ No newline at end of file
src/pages/register.html
View file @ dd3285ef
<section class="register"> <section class="register dark-bg unf-padding full-height">
<div class="grid-container"> <div class="grid-container">
<h2 class="text-center">Register </h2> <h2 class="text-center">Register </h2>
<span class="sub-text text-center">Choose the most suitable tariff plan for your requirements</span> <span class="sub-text text-center">Choose the most suitable tariff plan for your requirements</span>
...@@ -31,6 +31,38 @@ ...@@ -31,6 +31,38 @@
<a href="register.html" class="button">Sign Up</a> <a href="register.html" class="button">Sign Up</a>
</div> </div>
</div> </div>
<div class="plan-detail" id="basic-plus">
<div class="card-price">
<sup>$</sup>49.99
</div>
<div class="card-section">
<ul>
<li>100 Credit Points*</li>
<li>Unlimited Exams</li>
<li>Unlimited Questions</li>
<li>Various Question Types</li>
<li>Concurrent Users: &lt; 100</li>
<li>Validity : 6 months</li>
</ul>
<a href="register.html" class="button">Sign Up</a>
</div>
</div>
<div class="plan-detail" id="premium">
<div class="card-price">
<sup>$</sup>49.99
</div>
<div class="card-section">
<ul>
<li>100 Credit Points*</li>
<li>Unlimited Exams</li>
<li>Unlimited Questions</li>
<li>Various Question Types</li>
<li>Concurrent Users: &lt; 100</li>
<li>Validity : 6 months</li>
</ul>
<a href="register.html" class="button">Sign Up</a>
</div>
</div>
</div> </div>
</div> </div>
<div class="large-9 medium-6 cell"> <div class="large-9 medium-6 cell">
...@@ -52,17 +84,24 @@ ...@@ -52,17 +84,24 @@
<input type="text" placeholder="" required=""> <input type="text" placeholder="" required="">
<label for="">Address Line 1*</label> <label for="">Address Line 1*</label>
</div> </div>
<div class=" cell">
<input type="text" placeholder="" required=""> <div class="cell">
<label for="">Name*</label> <select>
<option value="" disabled selected>Country*</option>
<option value="">India</option>
<option value="">UAE</option>
</select>
</div> </div>
<div class=" cell"> <div class=" cell">
<input type="text" placeholder="" required=""> <input type="text" placeholder="" required="">
<label for="">Zip Code*</label> <label for="">Zip Code*</label>
</div> </div>
<div class=" cell"> <div class="cell">
<input type="text" placeholder="" required=""> <select>
<label for="">Name*</label> <option value="" disabled selected>Phone Code*</option>
<option value="">+91</option>
<option value="">+97</option>
</select>
</div> </div>
</div> </div>
<div class="large-6 medium-6 cell"> <div class="large-6 medium-6 cell">
...@@ -86,9 +125,12 @@ ...@@ -86,9 +125,12 @@
<input type="text" placeholder="" required=""> <input type="text" placeholder="" required="">
<label for="">City*</label> <label for="">City*</label>
</div> </div>
<div class=" cell"> <div class="cell">
<input type="text" placeholder="" required=""> <select>
<label for="">Name*</label> <option value="" disabled selected>Time Zone*</option>
<option value="">UTC +11</option>
<option value="">UTC +10</option>
</select>
</div> </div>
<div class=" cell"> <div class=" cell">
<input type="text" placeholder="" required=""> <input type="text" placeholder="" required="">
......
src/pages/search-result.html 0 → 100644
View file @ dd3285ef
<section class="dark-bg full-height search-result">
<div class="grid-container">
<h2><span class="red">Search </span>Result </h2>
<span class="sub-text">Suitable results for your searching</span>
<div class="sr-result">
<div class="item-block">
<h5>Home</h5>
<p>Demo VirtualX is a fully automated exam management system which can significantly help your organization to improve the efficiency when conducting online examinations. Support We are there to help. Our committed VirtualX team will be always
there to provide all assistance and support...</p>
</div>
<div class="item-block">
<h5>Features</h5>
<p>It‘s passion, not only work! We have worked diligently to bring you our online examination product that we are proud of. VirtualX was developed keeping in mind all the needs of an online examination system. The VirtualX team throughout
the development process ensured that the VirtualX delivers high performance yet remains simple...</p>
</div>
<div class="item-block">
<h5>Services</h5>
<p>It‘s passion, not only work! We have worked diligently to bring you our online examination product that we are proud of. VirtualX was developed keeping in mind all the needs of an online examination system. The VirtualX team throughout
the development process ensured that the VirtualX delivers high performance yet remains simple...</p>
</div>
<div class="item-block">
<h5>Pricing</h5>
<p>Demo VirtualX is a fully automated exam management system which can significantly help your organization to improve the efficiency when conducting online examinations. Support We are there to help. Our committed VirtualX team will be always
there to provide all assistance and support...</p>
</div>
</div>
</div>
</section>
\ No newline at end of file
src/partials/header-type-2.html 0 → 100644
View file @ dd3285ef
<header class="type-2">
<div class="grid-container fluid">
<div class="top-block">
<div class="logo">
<a href="">
<img src="assets/img/logo.png" alt="">
</a>
</div>
<div class="navigation-wrap">
<div class="language-bar">
<ul>
<li class="active"><a href="">English</a></li>
<li class="ar"><a href="">العربية</a></li>
</ul>
</div>
<div class="user-welcome">
<span>Welcome</span>
<a href="">Alimonkhader</a>
</div>
<nav class="navigation">
<ul class="vertical menu">
<li>
<a href=""> Dashboard </a>
</li>
<li>
<a href=""> Orders </a>
</li>
<li>
<a href=""> Settings </a>
</li>
<li class="active">
<a href=""><b> Log Out</b> </a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</header>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment