Skip to content

Commit

Permalink
qr gen page added
Browse files Browse the repository at this point in the history
  • Loading branch information
@anistark
anistark committed Aug 23, 2019
1 parent 90a2ab2 commit 4603267
Show file tree
Hide file tree
Showing 4 changed files with 370 additions and 6 deletions.
159 changes: 159 additions & 0 deletions css/editor.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,159 @@
:root {
--base: #242831;
--brightness: 1;
--contrast: 1;
--blur: 0px;
--grayscale: 0%;
--opacity: 100%;
--saturate: 2;
--sepia: 0;
--invert: 10%;
}

.wrapper {
min-width: 100vw;
min-height: 100vh;
}

header {
width: 100%;
height: 5rem;
/*background-color: #1A1D24;*/
display: flex;
align-items: center;
justify-content: center;
}

header h1 {
font-size: 1.7rem;
font-style: italic;
text-align: center;
}

section {
display: flex;
}

section .main {
width: 60%;
height: 100vh;
padding-top: 1rem;
/*background-color: #080D13;*/
}

.display-board {
width: 100%;
height: 30rem;
padding: 1rem 0;
display: flex;
justify-content: center;
align-items: center;
}

img {
width: 70%;
height: 70%;
background-cover: contain;
background-repeat: no-repeat;
background-size: 100% 100%;
filter: brightness(var(--brightness)) contrast(var(--contrast)) blur(var(--blur)) grayscale(var(--grayscale)) opacity(var(--opacity)) saturate(var(--saturate)) sepia(var(--sepia)) invert(var(--invert));
}

section .filters {
width: 40%;
}

.filters {
width: 100%;
padding: 1rem;
margin-top: 0.5rem;
}

#filter {
padding: 1rem 0;
}

.search__box {
display: flex;
justify-content: center;
align-items: center;
}

.search__box input {
background-color: transparent;
border: none;
border-bottom: 2px solid #e4e4e4;
font-size: 1rem;
color: #e4e4e4;
outline: none;
}

.go {
width: 50px;
height: 50px;
border-radius: 50%;
margin-left: 1.5rem;
background-color: #e4e4e4;
font-size: 1.05rem;
animation: transform 0.2 ease-in-out;
cursor: pointer;
outline: none;
}

.go:hover {
transform: scale(1.1);
}

#filter .individual__filter {
width: 100%;
padding: 1rem 0;
font-size: 1.05rem;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-style: italic;
display: flex;

}

label {
width: 30%;
}

input {
width: 70%;
}

input[type='range']::-webkit-slider-thumb {
-webkit-appearance: none !important;
background-color: #E9E9E9;
border: 1px solid #CECECE;
height: 15px;
width: 15px;
cursor: pointer;
}

.btn {
display: flex;
justify-content: center;
align-items: center;
margin-top: 1rem;
}

#reset {
width: 8rem;
height: 2.5rem;
font-size: 1.05rem;
font-style: italic;
background-color: #e4e4e4;
cursor: pointer;
animation: transform 0.2 ease-in-out;
}

#reset:hover {
transform: scale(1.1);
}

#qrcode {
width: 500px;
height: 500px;
margin-top: 50px;
}
209 changes: 209 additions & 0 deletions editor.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,209 @@
<!doctype html>
<html lang="zxx">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>QR Generator</title>
<link rel="icon" href="img/favicon.ico">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/all.css">
<link rel="stylesheet" href="css/flaticon.css">
<link rel="stylesheet" href="css/themify-icons.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/slick.css">
<link rel="stylesheet" href="css/style.css">

<link rel="stylesheet" href="./css/editor.css">
</head>

<body>
<header class="main_menu home_menu">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-12">
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand" href="index.html"> <img src="https://i.imgur.com/nkQsYHi.png" alt="logo"> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="menu_icon"><i class="fas fa-bars"></i></span>
</button>

<div class="collapse navbar-collapse main-menu-item" id="navbarSupportedContent">
<ul class="navbar-nav">
<!-- <li class="nav-item"><a class="nav-link" href="/">Home</a></li> -->
<!-- <li class="nav-item"><a class="nav-link" href="#">feature</a></li> -->
<!-- <li class="nav-item"><a class="nav-link" href="pricing.html">pricing</a></li> -->
<!-- <li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="blog.html" id="navbarDropdown"
role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Blog
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="blog.html"> blog</a>
<a class="dropdown-item" href="single-blog.html">Single blog</a>
</div>
</li> -->
<!-- <li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="blog.html" id="navbarDropdown1"
role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
pages
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown1">
<a class="dropdown-item" href="elements.html">Elements</a>
</div>
</li> -->
<!-- <li class="nav-item"><a class="nav-link" href="#">Contact</a></li> -->
</ul>
</div>
<!-- <a id="search_1" href="javascript:void(0)"><i class="ti-search"></i></a> -->
<!-- <div class="dropdown cart"> -->
<!-- <a class="dropdown-toggle" href="#" id="navbarDropdown3" role="button" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<i class="fas fa-cart-plus"></i>
</a> -->
<!-- <div class="dropdown-menu" aria-labelledby="navbarDropdown">
<div class="single_product">
</div>
</div> -->
<!-- <a href="#" id="btn-login" role="button">Login</a> -->
<!-- </div> -->
</nav>
</div>
</div>
</div>
<!-- <div class="search_input" id="search_input_box">
<div class="container ">
<form class="d-flex justify-content-between search-inner">
<input type="text" class="form-control" id="search_input" placeholder="Search Here">
<button type="submit" class="btn"></button>
<span class="ti-close" id="close_search" title="Close Search"></span>
</form>
</div>
</div> -->
</header>

<section class="editor section_padding">
<div class="wrapper">
<header>
<h1>Generate QR Code</h1>
</header>
<section>
<div class="main">
<div class="display-board">
<div id="qrcode"></div>
</div>
</div>
<div class="filters">
<div class="search__box">
<textarea rows="15" cols="50" name="message" class="form-control" id="message" placeholder="Message..." tabindex="4" required></textarea>
<!-- <button class="go">Go</button> -->
</div>
</div>
</section>
</div>
</section>

<footer class="footer_part">
<div class="container">
<!-- <div class="row">
<div class="col-sm-6 col-lg-3">
<div class="single_footer_part">
<a href="index.html" class="footer_logo_iner"> <img src="img/footer_logo.png" alt="#"> </a>
<h4>About QR Gen</h4>
<p>QR Gen is an open source project under Apache 2.0 license. We would love to keep it that way for as long as we can.</p>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="single_footer_part">
<h4>Contact Info</h4>
<p>Address : Planet Earth.</p>
<p>Phone : +8880 44338899</p>
<p>Email : info@qrgen.com</p>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="single_footer_part">
<h4>Important Link</h4>
<ul class="list-unstyled">
<li><a href=""> WHMCS-bridge</a></li>
<li><a href="">Search Domain</a></li>
<li><a href="">My Account</a></li>
<li><a href="">Shopping Cart</a></li>
<li><a href="">Our Shop</a></li>
</ul>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="single_footer_part">
<h4>Newsletter</h4>
<p>Heaven fruitful doesn't over lesser in days. Appear creeping seasons deve behold bearing days
open
</p>
<div id="mc_embed_signup">
<form target="_blank"
action="https://spondonit.us12.list-manage.com/subscribe/post?u=1462626880ade1ac87bd9c93a&amp;id=92a4423d01"
method="get" class="subscribe_form relative mail_part">
<input type="email" name="email" id="newsletter-form-email" placeholder="Email Address"
class="placeholder hide-on-focus" onfocus="this.placeholder = ''"
onblur="this.placeholder = ' Email Address '">
<button type="submit" name="submit" id="newsletter-submit"
class="email_icon newsletter-submit button-contactForm"><i
class="far fa-paper-plane"></i></button>
<div class="mt-10 info"></div>
</form>
</div>
</div>
</div>
</div> -->
<!-- <hr> -->
<div class="row">
<div class="col-lg-8">
<div class="copyright_text">
<p>
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="ti-heart" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
</p>
</div>
</div>
<div class="col-lg-4">
<div class="footer_icon social_icon">
<ul class="list-unstyled">
<li><a href="https://www.facebook.com/kranirudha" class="single_social_icon"><i class="fab fa-facebook-f"></i></a></li>
<li><a href="https://twitter.com/kranirudha" class="single_social_icon"><i class="fab fa-twitter"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</footer>

<script src="js/jquery-1.12.1.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.magnific-popup.js"></script>
<script src="js/swiper.min.js"></script>
<script src="js/masonry.pkgd.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.nice-select.min.js"></script>
<script src="js/slick.min.js"></script>
<script src="js/jquery.counterup.min.js"></script>
<script src="js/waypoints.min.js"></script>
<script src="js/contact.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.form.js"></script>
<script src="js/jquery.validate.min.js"></script>
<script src="js/mail-script.js"></script>
<script src="js/custom.js"></script>

<script type="text/javascript" src="./js/editor.js"></script>

<script type="text/javascript" src="https://cdn.rawgit.com/davidshimjs/qrcodejs/gh-pages/qrcode.min.js"></script>
<script type="text/javascript" src="./js/main.js"></script>
</body>

</html>
8 changes: 2 additions & 6 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -176,11 +176,8 @@ <h4>100k</h4>
<div class="row align-items-center justify-content-between">
<div class="col-md-6 col-lg-5">
<div class="about_us_text">
<h2>Right people at the
Right time.</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua. Ut enim ad minim</p>
<h2>Generate anywhere use anytime</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim</p>
<a href="#" class="btn_1">get started</a>
<a href="#" class="btn_2">sing up free</a>
</div>
Expand All @@ -195,7 +192,6 @@ <h2>Right people at the
<img src="img/left_sharp.png" alt="" class="left_shape_1">
<img src="img/about_shape.png" alt="" class="about_shape_1">
<img src="img/animate_icon/Shape-16.png" alt="" class="feature_icon_1">
<img src="img/animate_icon/Shape-1.png" alt="" class="feature_icon_4">
</section> -->

<!-- <section class="use_sasu">
Expand Down
Empty file added js/editor.js
View file
Empty file.

0 comments on commit 4603267

Please sign in to comment.