From 6256335ef802e2823ac0118c01c7fe31e38e7287 Mon Sep 17 00:00:00 2001 From: blendoit Date: Wed, 22 Jan 2020 18:17:38 -0800 Subject: Second commit. --- app/static/styles/default.css | 25 ++++++++++++++++++++ app/static/styles/home.css | 50 +++++++++++++++++++++++++++++++++++++++ app/static/styles/no.css | 54 +++++++++++++++++++++++++++++++++++++++++++ app/static/styles/yes.css | 54 +++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 183 insertions(+) create mode 100644 app/static/styles/default.css create mode 100644 app/static/styles/home.css create mode 100644 app/static/styles/no.css create mode 100644 app/static/styles/yes.css (limited to 'app/static') diff --git a/app/static/styles/default.css b/app/static/styles/default.css new file mode 100644 index 0000000..47ba29d --- /dev/null +++ b/app/static/styles/default.css @@ -0,0 +1,25 @@ +:root { + --primary-color: #003B5C; + --secondary-color: #C3D7EE; + --home: rgba(200, 200, 200, 0.7); + --yes: rgba(0, 255, 0, 0.7); + --no: rgba(255, 0, 0, 0.7); +} + +* { + margin: 0; + padding: 0; +} + +body { + font-family: 'Liberation Sans', sans-serif; + line-height: 1.2; +} + +h1 { + +} + +h2 { + +} diff --git a/app/static/styles/home.css b/app/static/styles/home.css new file mode 100644 index 0000000..262b40c --- /dev/null +++ b/app/static/styles/home.css @@ -0,0 +1,50 @@ +.main { + height: 100%; + position: absolute; + left: 3%; + right: 3%; + background: linear-gradient(to top, var(--secondary-color), var(--primary-color)) fixed; +} + +.tab-yes { + height: 100%; + width: 10%; + float: left; + position: fixed; + z-index: -1; + background: var(--yes); +} +.tab-no { + height: 100%; + width: 10%; + float: right; + position: fixed; + z-index: -1; + right: 0; + background: var(--no); +} + +.tab-yes:hover ~ .main { + left: 5%; + transition: 0.2s; +} + +.tab-no:hover ~ .main { + right: 5%; + transition: 0.2s; +} + +.post { + background: white; + border-radius: 14px; + padding: 1rem; + margin: 1rem; + width: 20%; +} + +.post:hover { + background: linear-gradient(to left, var(--no) 50%, var(--yes) 50%); + cursor: pointer; + transition: 0.8s; + color: white; +} diff --git a/app/static/styles/no.css b/app/static/styles/no.css new file mode 100644 index 0000000..09171a6 --- /dev/null +++ b/app/static/styles/no.css @@ -0,0 +1,54 @@ +.main { + height: 100%; + right: 0; + left: 6%; + position: absolute; + z-index: 1; + background: linear-gradient(to top, var(--secondary-color), var(--primary-color)) fixed; +} + +.tab-home { + height: 100%; + width: 3%; + float: left; + position: relative; + z-index: 0; + background: var(--home); +} + +.tab-yes { + height: 100%; + width: 3%; + float: left; + position: relative; + z-index: -1; + background: var(--yes); +} + +.tab-home:hover ~ .main { + left: 9%; + transition: 0.2s; +} + +.tab-home:hover { + width: 6%; + transition: 0.2s; +} + +.tab-yes:hover ~ .main { + left: 9%; + transition: 0.2s; +} + +.tab-yes:hover { + width: 6%; + transition: 0.2s; +} + +.post { + background: white; + border-radius: 14px; + padding: 1rem; + margin: 1rem; + width: 20%; +} diff --git a/app/static/styles/yes.css b/app/static/styles/yes.css new file mode 100644 index 0000000..96443e1 --- /dev/null +++ b/app/static/styles/yes.css @@ -0,0 +1,54 @@ +.main { + height: 100%; + right: 6%; + left: 0; + position: absolute; + z-index: 1; + background: linear-gradient(to top, var(--secondary-color), var(--primary-color)) fixed; +} + +.tab-home { + height: 100%; + width: 3%; + float: right; + position: relative; + z-index: 0; + background: var(--home); +} + +.tab-no { + height: 100%; + width: 3%; + float: right; + position: relative; + z-index: -1; + background: var(--no); +} + +.tab-home:hover ~ .main { + right: 9%; + transition: 0.2s; +} + +.tab-home:hover { + width: 6%; + transition: 0.2s; +} + +.tab-no:hover ~ .main { + right: 9%; + transition: 0.2s; +} + +.tab-no:hover { + width: 6%; + transition: 0.2s; +} + +.post { + background: white; + border-radius: 14px; + padding: 1rem; + margin: 1rem; + width: 20%; +} -- cgit v1.2.3