Skip to content

N
NAP-wordpress
Commit f27f13ee authored by imac's avatar imac
Browse files
Options

[ADD]Access Popup

parent b66fb619
Hide whitespace changes
Inline Side-by-side
Showing with 114 additions and 11 deletions
wp-content/themes/nap/assets/css/main.css
View file @ f27f13ee
......@@ -168,6 +168,10 @@ input[type=file] {
::-moz-placeholder { color:#232E7C !important ; font-size: 11px;opacity: 0.5}
input:-moz-placeholder{color:#232E7C !important; font-size: 11px;opacity: 0.5}
input:-ms-input-placeholder{color:#232E7C !important; font-size: 11px;opacity: 0.5}
.access-form ::-webkit-input-placeholder { color:#FFF ! important; font-size: 9px;opacity: 1}
.access-form ::-moz-placeholder { color:#FFF !important ; font-size: 9px;opacity: 1}
.access-form input:-moz-placeholder{color:#FFF !important; font-size: 9px;opacity: 1}
.access-form input:-ms-input-placeholder{color:#FFF !important; font-size: 9px;opacity: 1}
svg, svg * {
pointer-events: none;
cursor: pointer;
......@@ -194,6 +198,11 @@ select,option{
opacity: 1 !important;
font-size: 11px !important;
}
#login{
background: transparent url(img/login.svg) no-repeat 6% 50%;
background-size: 11px;
padding-left: 25px;
}
/*==========================================================================
II/ Helper..............Helper classes
========================================================================== */
......@@ -275,6 +284,10 @@ II/ Helper..............Helper classes
background: #05162b;
color: #fff;
}
.pink-bg{
background: #FF6A5F;
color: #fff;
}
.search-btn{
font-size: 0px;
height: 14px;
......@@ -299,7 +312,7 @@ II/ Helper..............Helper classes
opacity:1;
}
.half-col{
width : calc(49% - 2px);
width : calc(49% - 4px);
}
.marker:before{
content: "";
......@@ -404,6 +417,10 @@ II/ Helper..............Helper classes
background: #FF6A5F;
color: #fff;
}
.white-btn{
background: #FFF;
color: #FF6A5F;
}
.no-wave:after{
display: none;
}
......@@ -809,6 +826,7 @@ aside.news-wrapper {
overflow-x: hidden;
display: none;
height: 100%;
max-width: 430px;
}
.news-header{
position: relative;
......@@ -1894,6 +1912,62 @@ div.wpcf7-mail-sent-ok{
.woocommerce-product-gallery{
display: none !important;
}
/* ------------------------*/ /* ---------->>> Acces Popup <<<-----------*/ /* ------------------------*/
/*POPUP*/
.popup-container {
position: absolute;
height: 100%;
top: 0;
width: 100%;
z-index: 99999999;
display: none;
background: rgba(18,22,45,0.5);
}
.popup {
width: 365px;
position: fixed;
top: 50%;
left: 0;
right: 0;
z-index: 999;
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
margin: 0 auto;
}
.popup-first.animated{
}
.popup-first .close-btn {
top: 11px;
right: 11px;
background: transparent;
}
.popup-first .inner {
width: 202px;
position: relative;
background: transparent;
text-align: center;
margin: 0px auto;
padding: 28px 20px 35px;
}
.popup-first h2{
padding-bottom: 10px;
}
.access-form{
width: 100%;
}
.access-form input{
background: transparent;
border: 1px solid #fff;
letter-spacing: 0.2px;
padding-left: 12px;
}
.access-form .white-btn{
margin-top: 9px;
}
/* --------------*/ /* ---------->>> Loading <<<-----------*/ /* --------------*/
#loading-container{
background-color: #fff;
......
wp-content/themes/nap/assets/js/main.js
View file @ f27f13ee
......@@ -39,10 +39,10 @@ $(function(){
});
});
//Get file name of uploaded file
$('#file-p').on('change',function(e){
var fileName = e.target.files[0].name;
$('.upload-btn').after($('<p class="loaded-file">' + fileName + '</p>'));
})
$('#file-p').on('change',function(e){
var fileName = e.target.files[0].name;
$('.upload-btn').after($('<p class="loaded-file">' + fileName + '</p>'));
})
//END get file name
//END load content page on left Panel
$(document).on('click','.close-panel',function(e){
......@@ -50,6 +50,20 @@ $(function(){
$('html').css('overflow','auto');
//$('.load-page').removeClass('fadeInUp').addClass('animated fadeOutUp');
});
$(document).on('click','.acces li',function(e){
e.stopImmediatePropagation();
$('.popup-container').fadeIn();
$('.popup-first').removeClass('fadeOutDown ').addClass('animated visible-elem pulse');
});
//Close popup
$('.popup-first .close-btn').click(
function(){
$('.popup-first').removeClass('visible-elem pulse').addClass('fadeOutDown');
setTimeout(function(){
$('.popup-container').fadeOut('slow');
},0);
});
checkWhiteColor = function(color) {
var white = ["#fff","#ffffff","white" ];
if ($.inArray(color, white) != -1){
......@@ -168,7 +182,6 @@ $(function(){
container = $(this).parent().parent();
container.find('.article-bg').css({"background-color": selectedColor, opacity:'0.1'});
container.find('img').attr({'src' : selectedImage , 'data-link' : linkProduct});
console.log(linkProduct);
tl.fromTo(container.find('img'),1,{opacity:0,visibility:"hidden"},{opacity:1,visibility:"visible"},0);
}
$.fn.animatePageScroll = function(element, duration) {
......@@ -298,7 +311,6 @@ function animateOnScroll(){
onScroll: true,
onResize: false,
callbackOnInit: function() {
console.log('Initialised');
},
callbackOnAnimate: function(element) {
}
......@@ -349,7 +361,6 @@ function onScroll(event){
onScrollCover();
$(items).each(function () {
var currLink = $(this);
console.log(currLink);
var refElement = $(currLink.attr("href"));
//console.log(currLink);
if (refElement.position().top - 20 <= scrollPos && refElement.position().top + refElement.height() > scrollPos) {
......
wp-content/themes/nap/footer.php
View file @ f27f13ee
</div>
<div class="right-panel-wrapper abs-full fixed transition">
<div id="load-page" class="load-page transition"></div>
</div>
<div id="load-page" class="load-page transition"></div>
</div>
<footer class="blue-bg">
<?php wp_footer(); ?>
<div class="footer font-small animated fadeInUp">
<div class="row">
<div class="row acces">
<ul>
<li><a href="#">accès pro</a></li>
</ul>
......@@ -20,6 +20,24 @@
</div>
</div>
</footer>
<div class="popup-container">
<div class="popup">
<div class="popup-first pink-bg hidden-elem" style="display: block;">
<span class="close-btn"></span>
<div class="inner">
<div class="close" id="close-popup"></div>
<h2 class="crete small-title" >Accès pro</h2>
<div class="access-form row">
<form action="" id="nl-form" method="post">
<input type="text" name="login" id="login" placeholder = "Identifiant" />
<input type="password" name="pwd" id="pwd" placeholder = "Mot de passe" />
<button class="btn rounded white-btn" type="submit" class="nl-btn">Se connecter</button>
</form>
</div>
</div>
</div>
</div>
</div>
<script src="<?php echo home_url('wp-content/themes/nap/assets/js/jQuery-v1-11.min.js') ?>"></script>
<script src="<?php echo home_url('wp-content/themes/nap/assets/js/jquery-ui.min.js') ?>"></script>
<script src="<?php echo home_url('wp-content/themes/nap/assets/js/vendors/TweenMax.min.js') ?>"></script>
......
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