aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/app/_elements/playlist/playlist.component.css
diff options
context:
space:
mode:
authorDanijel Anđelković <adanijel99@gmail.com>2022-04-19 02:28:18 +0200
committerDanijel Anđelković <adanijel99@gmail.com>2022-04-19 02:28:18 +0200
commitbcd4852ea7964e15f4ad7d0061522da42d866d37 (patch)
tree9224e50477741f75c2c84c631f9a37870ce6bb1d /frontend/src/app/_elements/playlist/playlist.component.css
parent56fbc59007fe5064168af33c9770a0d378343b85 (diff)
Dodao komponentu za prikaz dataseta sa tabelama. Promenio scrollbar i home stranicu. Zapoceo trening stranicu.
Diffstat (limited to 'frontend/src/app/_elements/playlist/playlist.component.css')
-rw-r--r--frontend/src/app/_elements/playlist/playlist.component.css57
1 files changed, 57 insertions, 0 deletions
diff --git a/frontend/src/app/_elements/playlist/playlist.component.css b/frontend/src/app/_elements/playlist/playlist.component.css
new file mode 100644
index 00000000..7ce320d9
--- /dev/null
+++ b/frontend/src/app/_elements/playlist/playlist.component.css
@@ -0,0 +1,57 @@
+.ns-wrapper {
+ width: 100%;
+ max-width: 800px;
+ max-height: 600px;
+ height: 100%;
+ transform-style: preserve-3d;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ align-items: center;
+}
+
+.ns-cards {
+ position: relative;
+ width: 300%;
+ height: 36rem;
+ margin-bottom: 20px;
+}
+
+.ns-card {
+ position: absolute;
+ width: 60%;
+ height: 100%;
+ left: 0;
+ right: 0;
+ margin: auto;
+ transition: transform 0.4s ease;
+ cursor: pointer;
+}
+
+input[type=radio] {
+ display: none;
+}
+
+#item-1:checked~.ns-cards #view-item-3,
+#item-2:checked~.ns-cards #view-item-1,
+#item-3:checked~.ns-cards #view-item-2 {
+ transform: translatex(-40%) scale(0.8);
+ opacity: 0.4;
+ z-index: 0;
+}
+
+#item-1:checked~.ns-cards #view-item-2,
+#item-2:checked~.ns-cards #view-item-3,
+#item-3:checked~.ns-cards #view-item-1 {
+ transform: translatex(40%) scale(0.8);
+ opacity: 0.4;
+ z-index: 0;
+}
+
+#item-1:checked~.ns-cards #view-item-1,
+#item-2:checked~.ns-cards #view-item-2,
+#item-3:checked~.ns-cards #view-item-3 {
+ transform: translatex(0) scale(1);
+ opacity: 1;
+ z-index: 1;
+} \ No newline at end of file