YOLO funnel template

This template removes most of the UI so that people in the funnel don't get distracted.

	modified:   static/theme/meta/css/meta.css
	new file:   templates/meta-base-funnel.j2
This commit is contained in:
russellballestrini 2018-08-17 21:52:45 -04:00
parent cda25e165a
commit 28f17d77e8
2 changed files with 69 additions and 9 deletions

View file

@ -192,33 +192,33 @@ input.button-small {
.green-button {
background-color: rgba(var(--green), .8);
border-color: rgba(var(--green), .8);
border-color: rgba(var(--green), .8) !important;
color: #FFFFFF !important;
}
.red-button {
background-color: rgba(var(--red), .8);
border-color: rgba(var(--red), .8);
border-color: rgba(var(--red), .8) !important;
color: #FFFFFF !important;
}
.blue-button {
background-color: rgba(var(--blue), .8);
border-color: rgba(var(--blue), .8);
border-color: rgba(var(--blue), .8) !important;
color: #FFFFFF !important;
}
.button-white {
color: rgba(var(--black), .50);
border-color: rgba(var(--black), .30);
border-width: 1px;
background-color: rgba(var(--white), .60);
border-color: rgba(var(--black), .30) !important;
color: rgba(var(--black), .50) !important;
border-width: 1px;
}
.button-white:hover {
color: rgba(var(--black), 0.8);
border-color: rgba(var(--black), 0.6);
background-color: rgba(var(--white), 1.0);
border-color: rgba(var(--black), 0.6) !important;
color: rgba(var(--black), 0.8) !important;
}
#payment-form,
@ -239,7 +239,7 @@ input.button-small {
}
#mc_embed_signup .button, .red {
background-color: #AA0000;
border-color: #AA0000;
border-color: #AA0000 !important;
color: #FFFFFF !important;
}
#mc_embed_signup .button:hover, .red:hover {

View file

@ -0,0 +1,60 @@
{%- import 'snippets/snippets.j2' as snippets with context -%}
{% include 'snippets/owner-key-comment.j2' %}
<!DOCTYPE html>
<html lang="en">
<head>
<title>{% block title %}{{ request.app_domain }}{% endblock %}</title>
<meta charset="utf-8" />
<!-- this makes mobile pretty... -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#D40000">
{% include 'snippets/stylesheet-includes.j2' %}
<link rel="stylesheet" href="/static/theme/meta/css/normalize.css">
<link rel="stylesheet" href="/static/theme/meta/css/skeleton.css">
<link rel="stylesheet" href="/static/theme/meta/css/meta.css">
<link rel="stylesheet" href="/static/theme/meta/css/diff.css">
{% include 'snippets/javascript-includes.j2' %}
</head>
<body class="remarkbox-body has-docked-nav">
<noscript>
<style>
.js-only {display: none;}
</style>
</noscript>
<style>
#alerts {
position: relative;
top: 0px;
}
</style>
<div class="container main" style="max-width: 430px; margin-top: 90px;">
<center>
<a href="{{ request.marketing_url }}" style="opacity: 1.0;"><img src="/static/theme/meta/img/remarkbox-minified.png" alt="Remarkbox Logo" style="width: 320px; margin-bottom: 50px;"/></a>
</center>
{% include 'snippets/flash-alerts.j2' %}
<div class="row">
<div class="main">
{% block content %}
{% endblock %}
</div>
<!-- end of row -->
</div>
<!-- end of container -->
</div>
</body>
</html>