From 3c3a27e6e0fc76b414ff28d774584b1764219836 Mon Sep 17 00:00:00 2001
From: Yigit Sever
Date: Sat, 17 Apr 2021 20:28:25 +0300
Subject: Add news ticker
---
site/static/site.css | 44 ++++++++++++++++++++++++++++++++++++++++++++
1 file changed, 44 insertions(+)
(limited to 'site/static')
diff --git a/site/static/site.css b/site/static/site.css
index 3c9bc03..6c79aa9 100644
--- a/site/static/site.css
+++ b/site/static/site.css
@@ -11,3 +11,47 @@
li p {
margin: 2px;
}
+
+/* OUTER CONTAINER */
+.tcontainer {
+ width: 100%;
+ overflow: hidden; /* Hide scroll bar */
+}
+
+/* MIDDLE CONTAINER */
+.ticker-wrap {
+ width: 100%;
+ padding-left: 100%; /* Push contents to right side of screen */
+ background-color: #eee;
+}
+
+/* INNER CONTAINER */
+@keyframes ticker {
+ 0% { transform: translate3d(0, 0, 0); }
+ 100% { transform: translate3d(-100%, 0, 0); }
+}
+
+.ticker-move {
+ /* Basically move items from right side of screen to left in infinite loop */
+ display: inline-block;
+ white-space: nowrap;
+ padding-right: 100%;
+ animation-iteration-count: infinite;
+ animation-timing-function: linear;
+ animation-name: ticker;
+ animation-duration: 30s;
+}
+
+.ticker-move:hover{
+ animation-play-state: paused; /* Pause scroll on mouse hover */
+}
+
+/* ITEMS */
+.ticker-item {
+ display: inline-block; /* Lay items in a horizontal line */
+ padding: 0 5px;
+}
+
+.ticker-item::before {
+ content: " ✑ ";
+}
--
cgit v1.2.3-70-g09d2