Text [Idea] @ [Your Name] to 01887 451 030
-diff --git a/README.md b/README.md
index 87bfdda..40c2ee9 100644
--- a/README.md
+++ b/README.md
@@ -26,7 +26,7 @@ To run the site using a different livereload port (default is `35729`), use the
## Testing
-Uses [karma](http://karma-runner.github.io/) and [jasmine](http://pivotal.github.io/jasmine/).
+Uses [karma](http://karma-runner.github.io/) and [jasmine](https://jasmine.github.io/).
Karma is run automatically when `grunt` is called. To run it manually
diff --git a/app/public/css/ideas.css b/app/public/css/ideas.css
index 97d8a9e..c8ef6f2 100644
--- a/app/public/css/ideas.css
+++ b/app/public/css/ideas.css
@@ -1,4 +1,86 @@
-.ideas {
+main[role='idea-container'] {
+ margin-top: 100px;
+}
+
+main[role='idea-container'] .ideas {
+ overflow: hidden;
+ max-height: 480px;
+}
+
+main[role='idea-container'] .idea {
+ border-radius: 3px;
+ background: #C0C6D3;
+ height: 100px;
+ margin-bottom: 20px;
+}
+
+main[role='idea-container'] .idea .delete {
+ position: absolute;
+ top: 0;
+ right: 0;
+ font-size: 0.5em;
+ color: #C7C6CC;
+ text-decoration: none;
+}
+
+.ideas-include.ng-enter {
+ -webkit-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -moz-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -ms-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -o-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+}
+
+.ideas-include.ng-enter {
+ opacity: 0;
+}
+
+.ideas-include.ng-enter-active {
+ opacity: 1;
+}
+
+.idea-inner.ng-enter,
+.idea-inner.ng-leave {
+ -webkit-transition: 1000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -moz-transition: 1000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -ms-transition: 1000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -o-transition: 1000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ transition: 1000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+}
+
+.idea-inner.ng-enter {
+ opacity: 0;
+ height: 0;
+}
+
+.idea-inner.ng-enter-active {
+ opacity: 1;
+ height: 100px;
+}
+
+.idea-inner.ng-enter-stagger {
+ -webkit-transition-delay: 3s;
+ transition-delay: 3s;
+}
+
+.idea-inner.ng-leave {
+ opacity: 1;
+ height: 100px;
+}
+
+.idea-inner.ng-leave-active {
+ opacity: 0;
+ height: 0;
+}
+
+.idea p {
+ padding: 15px;
+ margin: 0;
+ font-size: 26px;
+ color: #29313D;
+}
+
+/*.ideas {
position: static;
max-width: 1920px;
margin-top: 100px;
@@ -16,4 +98,4 @@
padding: 0 28px;
font-weight: 500;
font-size: 28px;
-}
\ No newline at end of file
+}*/
diff --git a/app/public/css/nav.css b/app/public/css/nav.css
index df7ed81..b8a71d5 100644
--- a/app/public/css/nav.css
+++ b/app/public/css/nav.css
@@ -8,24 +8,18 @@ nav[role='navigation'] {
background-image: url('/images/nav-bg.svg');
background-position: bottom;
background-repeat: no-repeat;
- height: 150px;
+ min-height: 150px;
max-width: 1920px;
margin: 0 auto;
color: #fff;
}
nav[role='navigation'] .logo {
- width: 50%;
+ padding-top: 25px;
height: 100px;
- float: left;
-}
-
-nav[role='navigation'] .logo a {
display: block;
- position: relative;
- top: 50%;
- -webkit-transform: translateY(-50%);
- transform: translateY(-50%);
+ margin: 0 auto;
+
}
nav[role='navigation'] .logo.pebblecode {
@@ -35,3 +29,21 @@ nav[role='navigation'] .logo.pebblecode {
nav[role='navigation'] .logo.az {
text-align: right;
}
+
+.nav-include.ng-enter {
+ -webkit-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -moz-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -ms-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -o-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+}
+
+.nav-include.ng-enter {
+ opacity: 0;
+ top: -300px;
+}
+
+.nav-include.ng-enter-active {
+ opacity: 1;
+ top: 0;
+}
diff --git a/app/public/css/popup.css b/app/public/css/popup.css
index 4821d08..f016ac4 100644
--- a/app/public/css/popup.css
+++ b/app/public/css/popup.css
@@ -17,11 +17,56 @@ div[role='popup'] {
right: 0;
z-index: 1000;
height: 150px;
- width: 1140px;
margin: 0 auto;
background-color: #29ABE2;
+ border-top-left-radius: 3px;
+ border-top-right-radius: 3px;
}
+div[role='popup'].second {
+ background-color: #EE5080;
+}
+
+div[role='popup'] .img,
+div[role='popup'] .text {
+ text-align: center;
+ height: 150px;
+}
+
+div[role='popup'] .text {
+ color: #fff;
+ font-weight: 900;
+ font-size: 34px;
+ letter-spacing: 1px;
+}
+
+div[role='popup'].second .text {
+ font-style: italic;
+}
+
+div[role='popup'] .text p {
+ margin: 0 0 0 -15px;
+ line-height: 150px;
+}
+
+.popup-container.ng-enter {
+ -webkit-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -moz-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -ms-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -o-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+}
+
+.popup-container.ng-enter {
+ bottom: -400px;
+ opacity: 0;
+}
+
+.popup-container.ng-enter-active {
+ bottom: 0;
+ opacity: 1;
+}
+/*
div[role='popup'] .img {
width: 150px;
height: 150px;
@@ -41,7 +86,7 @@ div[role='popup'] .text {
font-weight: 900;
font-size: 30px;
text-align: center;
-}
+}*/
div[role='popup'].ng-enter,
div[role='popup'].ng-leave
@@ -66,3 +111,8 @@ div[role='popup'].ng-leave {
div[role='popup'].ng-leave-active{
bottom: -200px;
}
+
+.phone {
+ float: left;
+ margin: 15px;
+}
diff --git a/app/public/css/slide.css b/app/public/css/slide.css
index 60ce6a3..ae44119 100644
--- a/app/public/css/slide.css
+++ b/app/public/css/slide.css
@@ -1,11 +1,11 @@
-.vote-caster {
+/*.vote .container {
position: fixed;
width: 100%;
height: 100%;
-}
+}*/
-.vote-caster.ng-enter,
-.vote-caster.ng-leave
+.vote .container.ng-enter,
+.vote .container.ng-leave
{
-webkit-transition: 1000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
-moz-transition: 1000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
@@ -14,30 +14,30 @@
transition: 1000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
}
-.vote-caster.yes.ng-enter {
+.vote .container.ng-enter {
left: 2000px;
}
-.vote-caster.yes.ng-enter-active {
+.vote .container.ng-enter-active {
left: 0;
}
-.vote-caster.yes.ng-leave {
+.vote .container.ng-leave {
left: 0;
}
-.vote-caster.yes.ng-leave-active{
+.vote .container.ng-leave-active{
left: 2000px;
}
-.vote-caster.no.ng-enter {
+.vote .container.ng-enter {
right: 2000px;
}
-.vote-caster.no.ng-enter-active {
+.vote .container.ng-enter-active {
right: 0;
}
-.vote-caster.no.ng-leave {
+.vote .container.ng-leave {
right: 0;
}
-.vote-caster.no.ng-leave-active{
+.vote .container.ng-leave-active{
right: 2000px;
-}
\ No newline at end of file
+}
diff --git a/app/public/css/vote.css b/app/public/css/vote.css
index 23e6a37..0745bcb 100644
--- a/app/public/css/vote.css
+++ b/app/public/css/vote.css
@@ -1,21 +1,71 @@
-.vote {
+/*.vote {
position: static;
max-width: 1920px;
}
+*/
+
+.vote {
+ width: 100%;
+ position: fixed;
+ right: 0;
+}
+.vote.ng-enter,
+.vote.ng-leave {
+ -webkit-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -moz-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -ms-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -o-transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ transition: 4000ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+}
+.vote.ng-enter {
+ opacity: 0;
+}
+.vote.ng-enter-active {
+ opacity: 1;
+}
+
+.yes-vote,
+.no-vote {
+ -webkit-transition: 500ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -moz-transition: 500ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -ms-transition: 500ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ -o-transition: 500ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+ transition: 500ms cubic-bezier(0.445, 0.050, 0.550, 0.950) all;
+}
+
+.yes-vote {
+ opacity: 0;
+ right: -1700px;
+}
+
+.no-vote {
+ opacity: 0;
+ right: 1700px;
+}
+
+.vote .vote-caster {
+ width: 100%;
+ position: relative;
+}
.vote .idea-text {
background-color: #EE5080;
color: #fff;
- height: 200px;
+ height: 195px;
font-weight: 900;
font-style: italic;
font-size: 40px;
text-transform: uppercase;
text-align: center;
+ line-height: 1.1;
+ padding-top: 32px;
}
.vote .vote-button {
height: 200px;
+ width: 150px;
+ position: absolute;
+ margin-top: -3px;
}
.vote .vote-button.no {
@@ -23,6 +73,7 @@
background-image: url('/images/no-2.svg');
background-repeat: no-repeat;
background-position: 12px center;
+ left: 280px;
}
.vote .vote-button.yes {
@@ -30,4 +81,5 @@
background-image: url('/images/yes-2.svg');
background-repeat: no-repeat;
background-position: -12px center;
-}
\ No newline at end of file
+ right: 240px;
+}
diff --git a/app/public/includes/ideas-list.html b/app/public/includes/ideas-list.html
new file mode 100644
index 0000000..af12756
--- /dev/null
+++ b/app/public/includes/ideas-list.html
@@ -0,0 +1,11 @@
+ {{idea.text}}
+
+
+
+
Text your idea to 01887 451 030
+Text [Idea] @ [Your Name] to 01887 451 030
-