From 10084b7eb9ff6217c7692c60ad697f87dfce57c8 Mon Sep 17 00:00:00 2001 From: Jon Lambson Date: Wed, 6 Sep 2017 14:17:42 -0600 Subject: [PATCH] added stuff --- css/styles.css | 119 +++++++++++++++++++++++++++++++++- templates/splash-page.html | 2 +- templates/website.html | 128 +++++++++++++++++++++++++++++++++++++ 3 files changed, 245 insertions(+), 4 deletions(-) diff --git a/css/styles.css b/css/styles.css index 7dd4293..fe41340 100644 --- a/css/styles.css +++ b/css/styles.css @@ -58,11 +58,12 @@ align-items: center; } .button-container.active .side-menu-button { - background: steelblue; - color: white; + color: #fff; + background-color: #286090; + border-color: #122b40; } .button-container.active .button-title { - color: steelblue; + color: #286090; } .button-container a:hover { text-decoration: none; @@ -148,3 +149,115 @@ overflow: hidden; background-color: #e5e5e5; } + +.demo-title { + text-align: center; + font-size: 3rem; + margin-bottom: 50px; +} +.invite-option { + border: 1px solid #e5e5e5; +} +.invite-card-container { + display: table; + width: 100%; +} +.invite-card-container .invite-option { + width: 28%; + background: white; + float: left; + padding: 2%; + text-align: center; + -webkit-transition: all .3s ease-in-out; + transition: all .3s ease-in-out; +} +.invite-card-container .invite-option:nth-child(even) { + margin: 0 2%; +} +.invite-card-container .invite-option:hover { + cursor: pointer; + box-shadow: 0px 2px 30px rgba(0, 0, 0, 0.3); + -webkit-transform: scale(1.04); + transform: scale(1.04); +} +.invite-card-container .invite-option:hover i, .invite-card-container .invite-option:hover h1, .invite-card-container .invite-option:hover span, .invite-card-container .invite-option:hover b { + color: #286090; +} +.invite-card-container .invite-option:hover .front { + opacity: 0; + visibility: hidden; +} +.invite-card-container .invite-option:hover .back { + opacity: 1 !important; + visibility: visible !important; +} +.invite-card-container .invite-option:hover .back a.button { + -webkit-transform: translateY(0px) !important; + transform: translateY(0px) !important; +} +.invite-card-container .invite-option hr { + border: none; + border-bottom: 1px solid #F0F0F0; +} +.invite-card-container .invite-option i { + font-size: 3rem; + color: #D8D8D8; + -webkit-transition: all .3s ease-in-out; + transition: all .3s ease-in-out; +} +.invite-card-container .invite-option h1 { + margin: 10px 0; + color: #212121; + -webkit-transition: all .3s ease-in-out; + transition: all .3s ease-in-out; +} +.invite-card-container .invite-option p { + color: #999; + padding: 0 10px; + line-height: 1.3; +} +.invite-card-container .invite-option .price { + position: relative; +} +.invite-card-container .invite-option .price .front span.price { + font-size: 2rem; + text-transform: uppercase; + margin-top: 20px; + display: block; + font-weight: 700; + position: relative; +} +.invite-card-container .invite-option .price .front span.price b { + position: absolute; + font-size: 1rem; + margin-left: 2px; + font-weight: 600; +} +.invite-card-container .invite-option .price .back { + opacity: 0; + visibility: hidden; + -webkit-transition: all .3s ease-in-out; + transition: all .3s ease-in-out; +} +.invite-card-container .invite-option .price .back a.button { + background: #286090; + padding: 15px 20px; + display: inline-block; + text-decoration: none; + color: white; + position: absolute; + font-size: 13px; + top: -5px; + left: 0; + right: 0; + width: 150px; + margin: auto; + text-transform: uppercase; + -webkit-transform: translateY(20px); + transform: translateY(20px); + -webkit-transition: all .3s ease-in-out; + transition: all .3s ease-in-out; +} +.invite-card-container .invite-option .price .back a.button:hover { + background: #286090; +} diff --git a/templates/splash-page.html b/templates/splash-page.html index 83c8c3d..75cb110 100644 --- a/templates/splash-page.html +++ b/templates/splash-page.html @@ -3,7 +3,7 @@

Sign in

-
Resume with {{ profile.email }}
+
Resume with {{ profile.email }} | {{ profile.issuer }}
diff --git a/templates/website.html b/templates/website.html index aad5aa6..76e5b2b 100644 --- a/templates/website.html +++ b/templates/website.html @@ -1,3 +1,131 @@ +
+
+

Create a new Website

+ + + +
+
+ + +
+
+

Invite Code

+
+ +
+
+
+   +
+ +
+
+
+ + +
+

Your Websites

+
+

example.com

+
+
+
+ +
+ +
+
+
+
+ + + + +