Calender Prototype

2023-05-04 16:41:21 +02:00
parent 87e34e7a2e
commit 88fe8b84e3
4 changed files with 163 additions and 2 deletions
@@ -181,3 +181,76 @@ Popup
  justify-content: end;
  gap: 5px;
 }
+
+/*
+Calender View
+ */
+
+.calender-container
+{
+  margin-top: 100px;
+  max-height: 300px;
+  overflow: scroll;
+}
+
+.calender-view
+{
+  /*
+  Test
+   */
+  width: 500px;
+  height: 1110px;
+  /*
+  End Test
+   */
+  background-color: #5d606e;
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  border-radius: 5px;
+  justify-content: stretch;
+  gap: 2px;
+  padding: 2px;
+}
+
+.calender-view .spalte
+{
+  border-radius: 5px;
+  width: 100px;
+  background-color: white;
+  display: grid;
+  grid-template-columns: 100%;
+  grid-template-rows: repeat(370, 3px);
+}
+
+.spalte .wochen-tag
+{
+  text-align: center;
+  background-color: #f80000;
+  width: 100%;
+  color: white;
+  border-radius: 5px 5px 0 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  grid-row-start: 1;
+  grid-row-end: 10;
+}
+
+.entry
+{
+  background-color: #dc910b;
+  border-radius: 5px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding: 2px;
+  align-items: center;
+}
+
+.entry p
+{
+  color: white;
+  font-size: 10px;
+}