CINXE.COM

<!DOCTYPE html> <html lang="en"> <head><script type="text/javascript" src="/_static/js/bundle-playback.js?v=HxkREWBo" charset="utf-8"></script> <script type="text/javascript" src="/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("https://web.archive.org/web"); __wm.wombat("https://dribbble.com/shots/2383457-Login-Popup","20160914043922","https://web.archive.org/","web","/_static/", "1473827962"); </script> <link rel="stylesheet" type="text/css" href="/_static/css/banner-styles.css?v=S1zqJCYt" /> <link rel="stylesheet" type="text/css" href="/_static/css/iconochive.css?v=3PDvdIFv" />  <title> Login Popup by VibeThemes - Dribbble </title> <meta charset="utf-8"/> <script type="text/javascript">window.NREUM||(NREUM={});NREUM.info={"beacon":"bam.nr-data.net","errorBeacon":"bam.nr-data.net","licenseKey":"7840d0c136","applicationID":"2909452","transactionName":"Jg1bREUOClsARUpHABcHUF5ECQlDFhgWXAwS","queueTime":0,"applicationTime":61,"agent":""}</script> <script type="text/javascript">window.NREUM||(NREUM={}),__nr_require=function(t,e,n){function r(n){if(!e[n]){var o=e[n]={exports:{}};t[n][0].call(o.exports,function(e){var o=t[n][1][e];return r(o||e)},o,o.exports)}return e[n].exports}if("function"==typeof __nr_require)return __nr_require;for(var o=0;o<n.length;o++)r(n[o]);return r}({1:[function(t,e,n){function r(){}function o(t,e,n){return function(){return i(t,[(new Date).getTime()].concat(u(arguments)),e?null:this,n),e?void 0:this}}var i=t("handle"),a=t(2),u=t(3),c=t("ee").get("tracer"),f=NREUM;"undefined"==typeof window.newrelic&&(newrelic=f);var s=["setPageViewName","setCustomAttribute","setErrorHandler","finished","addToTrace","inlineHit"],p="api-",l=p+"ixn-";a(s,function(t,e){f[e]=o(p+e,!0,"api")}),f.addPageAction=o(p+"addPageAction",!0),e.exports=newrelic,f.interaction=function(){return(new r).get()};var d=r.prototype={createTracer:function(t,e){var n={},r=this,o="function"==typeof e;return i(l+"tracer",[Date.now(),t,n],r),function(){if(c.emit((o?"":"no-")+"fn-start",[Date.now(),r,o],n),o)try{return e.apply(this,arguments)}finally{c.emit("fn-end",[Date.now()],n)}}}};a("setName,setAttribute,save,ignore,onEnd,getContext,end,get".split(","),function(t,e){d[e]=o(l+e)}),newrelic.noticeError=function(t){"string"==typeof t&&(t=new Error(t)),i("err",[t,(new Date).getTime()])}},{}],2:[function(t,e,n){function r(t,e){var n=[],r="",i=0;for(r in t)o.call(t,r)&&(n[i]=e(r,t[r]),i+=1);return n}var o=Object.prototype.hasOwnProperty;e.exports=r},{}],3:[function(t,e,n){function r(t,e,n){e||(e=0),"undefined"==typeof n&&(n=t?t.length:0);for(var r=-1,o=n-e||0,i=Array(o<0?0:o);++r<o;)i[r]=t[e+r];return i}e.exports=r},{}],ee:[function(t,e,n){function r(){}function o(t){function e(t){return t&&t instanceof r?t:t?u(t,a,i):i()}function n(n,r,o){t&&t(n,r,o);for(var i=e(o),a=l(n),u=a.length,c=0;c<u;c++)a[c].apply(i,r);var s=f[m[n]];return s&&s.push([w,n,r,i]),i}function p(t,e){g[t]=l(t).concat(e)}function l(t){return g[t]||[]}function d(t){return s[t]=s[t]||o(n)}function v(t,e){c(t,function(t,n){e=e||"feature",m[n]=e,e in f||(f[e]=[])})}var g={},m={},w={on:p,emit:n,get:d,listeners:l,context:e,buffer:v};return w}function i(){return new r}var a="nr@context",u=t("gos"),c=t(2),f={},s={},p=e.exports=o();p.backlog=f},{}],gos:[function(t,e,n){function r(t,e,n){if(o.call(t,e))return t[e];var r=n();if(Object.defineProperty&&Object.keys)try{return Object.defineProperty(t,e,{value:r,writable:!0,enumerable:!1}),r}catch(i){}return t[e]=r,r}var o=Object.prototype.hasOwnProperty;e.exports=r},{}],handle:[function(t,e,n){function r(t,e,n,r){o.buffer([t],r),o.emit(t,e,n)}var o=t("ee").get("handle");e.exports=r,r.ee=o},{}],id:[function(t,e,n){function r(t){var e=typeof t;return!t||"object"!==e&&"function"!==e?-1:t===window?0:a(t,i,function(){return o++})}var o=1,i="nr@id",a=t("gos");e.exports=r},{}],loader:[function(t,e,n){function r(){if(!h++){var t=y.info=NREUM.info,e=s.getElementsByTagName("script")[0];if(t&&t.licenseKey&&t.applicationID&&e){c(m,function(e,n){t[e]||(t[e]=n)});var n="https"===g.split(":")[0]||t.sslForHttp;y.proto=n?"https://":"http://",u("mark",["onload",a()],null,"api");var r=s.createElement("script");r.src=y.proto+t.agent,e.parentNode.insertBefore(r,e)}}}function o(){"complete"===s.readyState&&i()}function i(){u("mark",["domContent",a()],null,"api")}function a(){return(new Date).getTime()}var u=t("handle"),c=t(2),f=window,s=f.document,p="addEventListener",l="attachEvent",d=f.XMLHttpRequest,v=d&&d.prototype;NREUM.o={ST:setTimeout,CT:clearTimeout,XHR:d,REQ:f.Request,EV:f.Event,PR:f.Promise,MO:f.MutationObserver},t(1);var g=""+location,m={beacon:"bam.nr-data.net",errorBeacon:"bam.nr-data.net",agent:"js-agent.newrelic.com/nr-974.min.js"},w=d&&v&&v[p]&&!/CriOS/.test(navigator.userAgent),y=e.exports={offset:a(),origin:g,features:{},xhrWrappable:w};s[p]?(s[p]("DOMContentLoaded",i,!1),f[p]("load",r,!1)):(s[l]("onreadystatechange",o),f[l]("onload",r)),u("mark",["firstbyte",a()],null,"api");var h=0},{}]},{},["loader"]);</script> <meta name="theme-color" content="#333333"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0"/> <meta name="referrer" content="always">  <link rel="stylesheet" media="screen, projection" href="https://web.archive.org/web/20160914043922cs_/https://d13yacurqjgara.cloudfront.net/assets/master-835e431fe2059febf2a971283c4ed066b4de00feaeaa327e1e4c53259c7d12ed.css"/> <link rel="stylesheet" media="screen, projection" href="https://web.archive.org/web/20160914043922cs_/https://d13yacurqjgara.cloudfront.net/assets/infinite-6efea9ce34122c525f5c723777317cfeb9e701e41a1a9e3de814f857f4ca9e1f.css"/><link rel="stylesheet" media="screen, projection" href="https://web.archive.org/web/20160914043922cs_/https://d13yacurqjgara.cloudfront.net/assets/color-browse-7b4e99ee0f42d8ec89664048318210c1b958f98e872c10c8d5644f0219177945.css"/> <link rel="stylesheet" media="screen, projection" href="https://web.archive.org/web/20160914043922cs_/https://d13yacurqjgara.cloudfront.net/assets/adapt-11a855a2ec0658480a31f86c7b4e2885189461984b9672897f2b5fb217ee8553.css"/> <link rel="stylesheet" media="screen, projection" href="https://web.archive.org/web/20160914043922cs_/https://d13yacurqjgara.cloudfront.net/assets/attachment-overlay-02442056949dba59dc67ad7ac47ad4de8c748ff24bb7a2b7a87fc285a6d7bd49.css"/>  <link rel="stylesheet" media="print" href="https://web.archive.org/web/20160914043922cs_/https://d13yacurqjgara.cloudfront.net/assets/print-af897c350716ce875940317977d37c5289e6aa39cb324abab961d4b514bd61f2.css"/> <link href="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/dribbble-vector-ball-95ca193529993e9b3904f7adb541680aba196642f557cfaf3cdbb0a48a284be4.svg" rel="mask-icon" color="#ea4c89"/> <link href="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/apple-touch-icon-precomposed-4a188d3f4dd693b67971fda843fd4bdeae751f9a245e3b878cae17e0a9d6a0a3.png" rel="apple-touch-icon-precomposed"/> <link href="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/favicon-63b2904a073c89b52b19aa08cebc16a154bcf83fee8ecc6439968b1e6db569c7.ico" rel="icon"/> <link href="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/dribbble-ball-192-ec064e49e6f63d9a5fa911518781bee0c90688d052a038f8876ef0824f65eaf2.png" sizes="192x192" rel="icon"/> <meta name="csrf-param" content="authenticity_token"/> <meta name="csrf-token" content="FYmwHIeqoFUIdDjmAbKij4AFxMcIv70GBikbLL6aiSaLgR4XhWvU56+x6B/zDUHabnxfmHiOBcRx5hMRci7iIA=="/> <meta name="description" content="Login popup for WPLMS 2.0 theme"/> <meta property="og:url" content="https://web.archive.org/web/20160914043922/https://dribbble.com/shots/2383457-Login-Popup"/> <meta property="og:type" content="article"/> <meta property="og:title" content="Login Popup"/> <meta property="og:image" content="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/2383457/dark_login_popup.png"/> <meta property="og:site_name" content="Dribbble"/> <meta property="og:description" content="Login popup for WPLMS 2.0 theme"/> <meta name="twitter:card" content="photo"/> <meta name="twitter:site" content="@dribbble"/> <meta name="twitter:creator" content="@VibeThemes"/> <meta name="twitter:image:width" content="800"/> <meta name="twitter:image:height" content="600"/> <script> if (location.hash.match(/^#\./) && window.history) { window.history.replaceState({}, window.title, location.origin + location.pathname + location.search) } </script> </head> <body id="details" class="logged-out not-pro not-player not-self not-team grid-small grid-with-meta"> <div id="header" role="banner"> <div id="header-inner"> <div id="logo"> <a href="/web/20160914043922/https://dribbble.com/"><img alt="dribbble" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/logo-bw-0200c7483844c355752e89efaa4ba89b83c9c591d70254ba10f4b25d901359d0.gif"/></a> </div> <a href="#nav" id="toggle-nav">Toggle navigation</a> <ul id="nav" role="navigation"> <li id="t-search" role="search"> <form id="search" action="https://web.archive.org/web/20160914043922/https://dribbble.com/search"> <input class="search-text" type="text" name="q" placeholder="Search " value=""/> </form> </li> <li id="t-signin"> <a href="https://web.archive.org/web/20160914043922/https://dribbble.com/session/new?return_to=%2Fshots%2F2383457-Login-Popup"> <span>Sign in</span> </a> </li> <li id="t-signup"> <a href="https://web.archive.org/web/20160914043922/https://dribbble.com/signup?return_to=%2Fshots%2F2383457-Login-Popup">Sign up</a> </li> <li id="t-shots"> <a class="has-sub" href="/web/20160914043922/https://dribbble.com/shots">Shots</a> <ul class="tabs"> <li><a href="/web/20160914043922/https://dribbble.com/shots">Popular</a></li> <li><a href="/web/20160914043922/https://dribbble.com/shots?sort=recent">Recent</a></li> <li><a href="/web/20160914043922/https://dribbble.com/shots?list=debuts">Debuts</a></li> <li><a href="/web/20160914043922/https://dribbble.com/shots?list=teams">Teams</a></li> <li><a href="/web/20160914043922/https://dribbble.com/shots?list=playoffs">Playoffs</a></li> <li class="separate"><a href="/web/20160914043922/https://dribbble.com/highlights">Highlights</a></li> <li><a href="/web/20160914043922/https://dribbble.com/projects">Projects</a></li> <li><a href="/web/20160914043922/https://dribbble.com/goods">Goods by Designers</a></li> </ul> </li> <li id="t-players"> <a class="has-sub" href="/web/20160914043922/https://dribbble.com/designers">Designers</a> <ul class="tabs"> <li><a href="/web/20160914043922/https://dribbble.com/designers">All</a></li> <li><a href="/web/20160914043922/https://dribbble.com/designers?for_hire=on">For Hire</a></li> <li class="separate"><a href="/web/20160914043922/https://dribbble.com/places">Community</a></li> </ul> </li> <li id="t-teams"> <a class="has-sub" href="/web/20160914043922/https://dribbble.com/teams">Teams</a> <ul class="tabs"> <li><a href="/web/20160914043922/https://dribbble.com/teams">All</a></li> <li><a href="/web/20160914043922/https://dribbble.com/teams?hiring=on">Hiring Designers</a></li> <li><a href="/web/20160914043922/https://dribbble.com/teams?for_hire=on">Design Teams for Hire</a></li> <li class="separate"><a href="/web/20160914043922/https://dribbble.com/teams/info">Add Your Design Team</a></li> </ul> </li> <li id="t-community"> <a href="/web/20160914043922/https://dribbble.com/places">Community</a> <ul class="tabs"> <li><a href="/web/20160914043922/https://dribbble.com/places">Places</a></li> <li><a href="/web/20160914043922/https://dribbble.com/meetups">Meetups</a></li> <li class="separate"><a href="/web/20160914043922/https://dribbble.com/stories">Stories</a></li> <li><a href="/web/20160914043922/https://dribbble.com/stories/categories/overtime">Podcast</a></li> <li><a href="/web/20160914043922/https://dribbble.com/testimonials">Testimonials</a></li> <li class="separate"><a href="/web/20160914043922/https://dribbble.com/guidelines">Guidelines</a></li> </ul> </li> <li id="t-jobs"> <a href="/web/20160914043922/https://dribbble.com/jobs">Jobs</a> <ul class="tabs"> <li><a href="/web/20160914043922/https://dribbble.com/jobs">All</a></li> <li><a href="/web/20160914043922/https://dribbble.com/jobs?location=Anywhere">Remote / Anywhere</a></li> <li><a href="/web/20160914043922/https://dribbble.com/jobs?teams_only=true">Teams Hiring</a></li> <li class="separate"><a href="/web/20160914043922/https://dribbble.com/jobs/info">Post a Job</a></li> </ul> </li> <li id="t-more"> <a href="/web/20160914043922/https://dribbble.com/about"> <span>More</span> </a> <ul class="tabs"> <li><a href="/web/20160914043922/https://dribbble.com/about">About</a></li> <li><a href="https://web.archive.org/web/20160914043922/http://shop.dribbble.com/">Shop</a></li> <li><a href="https://web.archive.org/web/20160914043922/http://help.dribbble.com/">Support</a></li> <li class="separate"><a href="/web/20160914043922/https://dribbble.com/buckets">Buckets</a></li> <li><a href="/web/20160914043922/https://dribbble.com/colors">Colors</a></li> <li><a href="/web/20160914043922/https://dribbble.com/tags">Tags</a></li> <li><a href="/web/20160914043922/https://dribbble.com/training">Training</a></li> <li class="separate"><a href="https://web.archive.org/web/20160914043922/http://twitter.com/dribbble">Twitter</a></li> <li><a href="https://web.archive.org/web/20160914043922/http://facebook.com/dribbble">Facebook</a></li> <li><a href="/web/20160914043922/https://dribbble.com/integrations">Integrations</a></li> </ul> </li> </ul> </div> </div>  <hr/> <div class="ajax notice hide"> <h2></h2> </div> <div id="wrap"> <div id="wrap-inner"> <div id="content" role="main"> <div class="notice-alert"> <h3></h3> <a href="#" class="close" aria-label="close"> <img width="25" alt="close" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-shot-x-light-2x-a4fcd61bdb114023583740bd9f5a46734e243e5be2bff1baa3e1cc33e7877fcd.png"/> </a> </div> <div class="non-overlay group"> <div id="screenshot-title-section" class="full"> <div class="slat-header user "> <a class="url hoverable" rel="contact" title="VibeThemes" href="/web/20160914043922/https://dribbble.com/VibeThemes"><div data-picture data-class="photo"> <div data-src="https://web.archive.org/web/20160914043922oe_/https://d13yacurqjgara.cloudfront.net/users/64059/avatars/original/mrvibe.png?1325266244"></div> <div data-src="https://web.archive.org/web/20160914043922oe_/https://d13yacurqjgara.cloudfront.net/users/64059/avatars/original/mrvibe.png?1325266244" data-media="(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx)"></div> <noscript> <img class="photo" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/64059/avatars/original/mrvibe.png?1325266244"/> </noscript> </div> </a> <h1>Login Popup</h1> <h2 class="shot-byline"> <span class="attribution "> <span class="shot-byline-user"> by <a class="url hoverable" rel="contact" href="/web/20160914043922/https://dribbble.com/VibeThemes">VibeThemes</a> </span> </span> <span class="shot-byline-date"> on <a href="/web/20160914043922/https://dribbble.com/shots?date=2015-12-02">Dec 2, 2015</a> </span> </h2> </div> </div> <div class="main-shot zoomable"> <div class="the-shot" data-screenshot_id="2383457" data-img-src="https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/2383457/dark_login_popup.png"> <div class="single group"> <div class="single-grid"><div class="single-img"> <div data-picture data-alt="Login Popup"> <div data-src="https://web.archive.org/web/20160914043922oe_/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/2383457/dark_login_popup_1x.png"></div> <div data-src="https://web.archive.org/web/20160914043922oe_/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/2383457/dark_login_popup.png" data-media="(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx)"></div> <noscript> <img alt="Login Popup" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/2383457/dark_login_popup_1x.png"/> </noscript> </div> </div></div> </div> </div> <div class="screenshot-info-wrapper"> <div class="screenshot-conversation "> <div class="shot-desc"> <p>Login popup for WPLMS 2.0 theme</p> </div> <div id="comments-section"></div> </div> <div class="screenshot-meta "> <ul class="shot-stats"> <li class="shot-stats-share"> <a href="#" class="stats-action share-shot"> <img src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-shotstat-share-128ae71c26985fc7325ac5362aba434686f12fdfffa45ed874262a19f923b071.png" alt="Icon shotstat share"/> <span class="stats-label">Share</span> </a> <span class="views-count stats-num"> 342 views </span> <div class="share-btns" data-share-shot="2383457"> </div> </li> <li> <span class="stats-action"> <img src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-shotstat-like-6a1e9e9db48b9b788639f05a658379b7bb027a75d256127f812bf9392664396f.png" alt="Icon shotstat like"/> <span class="stats-label likes-count"> 14 likes </span> </span> </li> <li class="shot-stats-colors"> <a rel="tipsy" title="Download this color palette (.aco)" class="stats-action" href="/web/20160914043922/https://dribbble.com/shots/2383457-Login-Popup/colors.aco"><img width="20" height="20 " src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-shotstat-drop-0152bfcbd3cb7ed50e73b830df47c754f061a376a662eac8841ad45316598d97.png" alt="Icon shotstat drop"/></a> <ul class="color-chips group"> <li class="color"> <a style="background-color: #39322C" title="#39322C" href="/web/20160914043922/https://dribbble.com/colors/39322C">#39322C</a> </li> <li class="color"> <a style="background-color: #FFFFFF" title="#FFFFFF" href="/web/20160914043922/https://dribbble.com/colors/FFFFFF">#FFFFFF</a> </li> <li class="color"> <a style="background-color: #99AFB1" title="#99AFB1" href="/web/20160914043922/https://dribbble.com/colors/99AFB1">#99AFB1</a> </li> <li class="color"> <a style="background-color: #DE6041" title="#DE6041" href="/web/20160914043922/https://dribbble.com/colors/DE6041">#DE6041</a> </li> <li class="color"> <a style="background-color: #71B8BD" title="#71B8BD" href="/web/20160914043922/https://dribbble.com/colors/71B8BD">#71B8BD</a> </li> <li class="color"> <a style="background-color: #D1D0D0" title="#D1D0D0" href="/web/20160914043922/https://dribbble.com/colors/D1D0D0">#D1D0D0</a> </li> <li class="color"> <a style="background-color: #9DC8C9" title="#9DC8C9" href="/web/20160914043922/https://dribbble.com/colors/9DC8C9">#9DC8C9</a> </li> </ul> </li> </ul> <div class="related-player-shots"> <div class="follow-prompt compact"> <a class="follow" rel="tipsy" title="Follow VibeThemes" href="/web/20160914043922/https://dribbble.com/VibeThemes/followers"> <span>Follow</span> </a> <a class="unfollow" rel="tipsy" title="Unfollow VibeThemes" href="/web/20160914043922/https://dribbble.com/VibeThemes/followers/VibeThemes"> <span>Following</span> </a> <a class="unblock" data-hover="Unblock" href="/web/20160914043922/https://dribbble.com/blocks/VibeThemes">Blocked</a> </div> <h3 class="meta-head"> <a href="/web/20160914043922/https://dribbble.com/VibeThemes"> More from VibeThemes </a> </h3> <ol class="more-thumbs"> <li class="multi-thumb"> <a href="/web/20160914043922/https://dribbble.com/shots/2919328-Landing-page-for-eLearning-site"> <img alt="Landing page for eLearning site" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/2919328/dribble_shot_teaser.jpg"/> </a> </li> <li class="multi-thumb"> <a href="/web/20160914043922/https://dribbble.com/shots/1855996-Unit-Notes-Discussions-in-WPLMS"> <img alt="Unit Notes & Discussions in WPLMS" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/1855996/screen_shot_2014-12-22_at_4.59.58_pm_teaser.png"/> </a> </li> <li class="multi-thumb"> <a href="/web/20160914043922/https://dribbble.com/shots/1629544-Wplms-Quiz"> <img alt="Wplms Quiz" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/1629544/wplms_quiz_teaser.jpg"/> </a> </li> <li class="multi-thumb"> <a href="/web/20160914043922/https://dribbble.com/shots/1567216-Front-end-course-creation-in-WPLMS"> <img alt="Front end course creation in WPLMS " src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/1567216/dribble_debut_teaser.jpg"/> </a> </li> </ol> </div> <h3 class="meta-head">Tags</h3> <div class="tags-section"> <ol id="tags" class="popular-tags"> <li id="tag-li-1607" class="tag"> <a rel="tag" href="/web/20160914043922/https://dribbble.com/VibeThemes/tags/login"> <strong>login</strong> </a></li> <li id="tag-li-2776" class="tag"> <a rel="tag" href="/web/20160914043922/https://dribbble.com/VibeThemes/tags/popup"> <strong>popup</strong> </a></li> <li id="tag-li-305423" class="tag"> <a rel="tag" href="/web/20160914043922/https://dribbble.com/VibeThemes/tags/wplms"> <strong>wplms</strong> </a></li> </ol> </div> </div> </div> </div>  <div id="kbd-legend"> <p>keyboard shortcuts: <span><strong>L</strong> or <strong>F</strong> like</span> <span><strong>Z</strong> toggle zoom</span> <span><strong class="keyboard-submit-shortcut"></strong> post comment</span> </p> </div> </div> </div> </div> </div> <hr/> <div id="footer" role="contentinfo"> <div id="footer-inner"> <div class="group"> <div class="footer-mod"> <p class="logo"><a href="/web/20160914043922/https://dribbble.com/"><img width="80" alt="dribbble" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/logo-footer-hd-a05db77841b4b27c0bf23ec1378e97c988190dfe7d26e32e1faea7269f9e001b.png"/></a><br/>Show and tell for designers</p> <p class="about">What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.</p> </div> <div class="footer-mod"> <ul class="extra-links"> <li><a id="f-home" href="/web/20160914043922/https://dribbble.com/about">About</a></li> <li><a href="https://web.archive.org/web/20160914043922/http://help.dribbble.com/">Help</a></li> <li><a href="/web/20160914043922/https://dribbble.com/contact">Contact</a></li> <li><a href="/web/20160914043922/https://dribbble.com/terms">Terms</a></li> <li><a href="/web/20160914043922/https://dribbble.com/guidelines">Guidelines</a></li> <li><a href="/web/20160914043922/https://dribbble.com/privacy">Privacy</a></li> <li><a href="https://web.archive.org/web/20160914043922/http://shop.dribbble.com/">Shop</a></li> <li><a href="/web/20160914043922/https://dribbble.com/testimonials">Testimonials</a></li> <li><a href="/web/20160914043922/https://dribbble.com/branding">Brand</a></li> <li><a href="/web/20160914043922/https://dribbble.com/advertise">Advertise</a></li> <li><a href="https://web.archive.org/web/20160914043922/http://developer.dribbble.com/">API</a></li> <li><a href="/web/20160914043922/https://dribbble.com/integrations">Integrations</a></li> </ul> </div> <div class="footer-mod"> <h3> <a href="/web/20160914043922/https://dribbble.com/jobs"> Jobs <span class="meta">for Designers</span> </a> </h3> <ol class="jobs-list"> <li class="group"> <a class="item-team" rel="tipsy" title="Visit the team's profile" href="/web/20160914043922/https://dribbble.com/betterup"> <img src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/1342883/avatars/normal/f9e783dca411c0e61a206861af9d372b.png?1472065641" alt="F9e783dca411c0e61a206861af9d372b"/> </a> <a class="job-edit" rel="tipsy" title="Edit this job" data-creator-id="1342883" href="/web/20160914043922/https://dribbble.com/account/jobs/11594/edit"> <img src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-edit-button-8d0f2493aa649d9e18d5cf27ee32c93aaa6488ddda85b481f6ca341b85fde845.png" alt="Icon edit button"/> </a> <a class="item-link group" data-url="https://web.archive.org/web/20160914043922/https://betterup.workable.com/jobs/324144" href="/web/20160914043922/https://dribbble.com/jobs/11594?source=footer"> <span class="item-info"> <span class="item-title">BetterUp</span> <span class="item-desc">UX Designer</span> </span> <span class="item-meta">San Francisco</span> </a></li> <li class="group"> <a class="item-team" rel="tipsy" title="Visit the team's profile" href="/web/20160914043922/https://dribbble.com/basicagency"> <img src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/users/161791/avatars/normal/basic-logo-square-01.jpg?1352735445" alt="Basic logo square 01"/> </a> <a class="job-edit" rel="tipsy" title="Edit this job" data-creator-id="161791" href="/web/20160914043922/https://dribbble.com/account/jobs/11520/edit"> <img src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-edit-button-8d0f2493aa649d9e18d5cf27ee32c93aaa6488ddda85b481f6ca341b85fde845.png" alt="Icon edit button"/> </a> <a class="item-link group" data-url="https://web.archive.org/web/20160914043922/http://www.basicagency.com/careers" href="/web/20160914043922/https://dribbble.com/jobs/11520?source=footer"> <span class="item-info"> <span class="item-title">BASIC</span> <span class="item-desc">Associate Creative Director</span> </span> <span class="item-meta">San Diego</span> </a></li> </ol> </div> <div class="footer-mod last"> <div class="ad thedeck target group notloaded"> <a href="https://web.archive.org/web/20160914043922/http://decknetwork.net/" class="flag">Ads via The Deck</a> </div> </div> </div> <h4 id="pixels-total" class="group"> <strong>584,471,755,382</strong> pixels dribbbled </h4> <p>Copyright © 2009–2016 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.</p> <p class="follow"> <a href="/web/20160914043922/https://dribbble.com/dribbble"><img width="24" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-team-dribbble-8706862cdb0afa7f43f9e0218b073515f0a2bef19780961d324ae4620ebe249b.png" alt="Icon team dribbble"/></a> <a href="https://web.archive.org/web/20160914043922/http://twitter.com/dribbble"><img width="24" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-team-twitter-1fa6921d96b16e47f00ad0381ebbab59ba089c22b21f9bce783c9a4a077f40e9.png" alt="Icon team twitter"/></a> <a href="https://web.archive.org/web/20160914043922/http://facebook.com/dribbble"><img width="24" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-team-facebook-4d63851997b88eb903858057327d93df9f950a55c5104a3a19206f2005682ea3.png" alt="Icon team facebook"/></a> <a href="https://web.archive.org/web/20160914043922/http://instagram.com/dribbble"><img width="24" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-team-instagram-5dfdcd1478ea4a1c1e109b32adbd3878062aa1eb571da63ac379e0da1d2d5762.png" alt="Icon team instagram"/></a> <a href="/web/20160914043922/https://dribbble.com/stories"> <img width="24" src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-team-blog-2705adcb7ee6522051e175d10683208f0fa0ad17daa15fdf3f36aca99c540312.png" alt="Icon team blog"/> </a> </p> </div> </div>  <div class="shot-overlay" style="display:none;" tabindex="-1"> <a href="#" class="close-overlay" aria-label="close"> <img src="https://web.archive.org/web/20160914043922im_/https://d13yacurqjgara.cloudfront.net/assets/icon-shot-x-light-40c073cd65443c99d4ac129b69bf578c8cf97d69b78990c00c4f8c5873b0d601.png" alt="Icon shot x light"/> </a> <div class="overlay-content group" style="display: none"></div> </div> <div class="attachment-overlay" style="display:none;" tabindex="-1"></div> <script src="//web.archive.org/web/20160914043922js_/https://js.honeybadger.io/v0.2/honeybadger.min.js"></script> <script> Honeybadger.configure({ api_key: '1f1d2734', // Public API key environment: 'production', disabled: false, onerror: false, ssl: true }); Honeybadger.setContext({ userId: null, serverTime: 1473827962000, clientTime: +new Date(), clientTimeString: (new Date()).toString() }) </script> <script src="//web.archive.org/web/20160914043922js_/https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>  <script> if (typeof jQuery == 'undefined') { document.write(unescape('%3Cscript src="https://web.archive.org/web/20160914043922/https://d13yacurqjgara.cloudfront.net/assets/jquery-1.8.3.min-2354e6d50cb409b198f3260f3a78ccbbfe15a9b16411559b488f592d8f9f1ec9.js">%3C/script>')) } </script> <script src="https://web.archive.org/web/20160914043922js_/https://d13yacurqjgara.cloudfront.net/assets/global-7840132ffbc8ea889a19ad71f2352b10688e9f512b2daba90f41c52442d2f61b.js"></script> <script> new Dribbble.ShareSheet({ selector: "[data-share-shot=2383457]", body: "Login Popup by VibeThemes", imageUrl: "https://web.archive.org/web/20160914043922/https://d13yacurqjgara.cloudfront.net/users/64059/screenshots/2383457/dark_login_popup.png", bodies: { twitter: "Login Popup by @VibeThemes:" } }) </script> <script src="https://web.archive.org/web/20160914043922js_/https://d13yacurqjgara.cloudfront.net/assets/shots-manifest-87cfc2430b5c6faea384b85f29612d16bf046c53bb9f42b9825ecc8c08d72d09.js"></script> <script> loadComments('/shots/2383457-Login-Popup/comments', function() { initComments(); makeCommentsDeleteable(); }, false); var can_see_mentions = false; var current_user_id = 0; var comments_deletable = false; if (Dribbble.isMobile()) { $(".the-shot .single-img").swipe({ fingers: 1, threshold: 200, swipeLeft: Screenshot.Page.next, swipeRight: Screenshot.Page.prev }); } $('.zoomable .single-img').click(Screenshot.Shot.twotimes) Dribbble.Shots.add([{ id: '2383457', ga: [] }]) </script> <script> (function(i,s,o,g,r,a,m){i["GoogleAnalyticsObject"]=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,"script","//web.archive.org/web/20160914043922/https://www.google-analytics.com/analytics.js","ga"); ga("create", "UA-24041469-1", "auto"); </script> <script> if (window.location.pathname == "/") { ga("send", "pageview", "/shots" + location.search); } else { ga("send", "pageview", "/shots/2383457-Login-Popup"); } if ($(".ad.thedeck.target").length > 0) { ga("send", "event", "Deck", "View", "View of a Deck ad", 1); } </script> <div class="thedeck loading-dock hide"> <script> Dribbble.DeckAd.enable(); Dribbble.DeckAd.load(); </script> </div> </body> </html>