summaryrefslogtreecommitdiff
path: root/day9/task5/static/css
diff options
context:
space:
mode:
Diffstat (limited to 'day9/task5/static/css')
-rw-r--r--day9/task5/static/css/ContentBoxStyle.css26
-rw-r--r--day9/task5/static/css/FormStyle.css60
-rw-r--r--day9/task5/static/css/NewEntryStyle.css32
-rw-r--r--day9/task5/static/css/TableStyle.css23
4 files changed, 141 insertions, 0 deletions
diff --git a/day9/task5/static/css/ContentBoxStyle.css b/day9/task5/static/css/ContentBoxStyle.css
new file mode 100644
index 0000000..78c37d6
--- /dev/null
+++ b/day9/task5/static/css/ContentBoxStyle.css
@@ -0,0 +1,26 @@
+.contentBox {
+ padding: 20px;
+ width: 500px;
+ height: 520px;
+ background-color: #f0f0f0;
+ border-radius: 10px;
+ box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
+}
+
+.backgroundTint {
+ width: 100vw;
+ height: 100vh;
+ background-color: rgba(0, 0, 0, 0.6);
+}
+
+.shown {
+ display: inline;
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+}
+
+.hidden {
+ display: none;
+} \ No newline at end of file
diff --git a/day9/task5/static/css/FormStyle.css b/day9/task5/static/css/FormStyle.css
new file mode 100644
index 0000000..2659a68
--- /dev/null
+++ b/day9/task5/static/css/FormStyle.css
@@ -0,0 +1,60 @@
+.formRow {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+}
+
+.formRow-label {
+ font-size: 13px;
+ color: #404040;
+}
+
+.formRow-input > input, .formRow-input > select {
+ margin: 3px;
+ width: 100%;
+ border-radius: 5px;
+ border: none;
+ box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
+ padding: 5px;
+
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+}
+
+.formRow-input > input:disabled {
+ background-color: #bebebe;
+ color: #4b4b4b;
+}
+
+.formInput[type="date"], .formInput[type="time"] {
+ padding: 5px;
+ font-size: 1.1em;
+}
+
+.formRow-input > select:hover, .formRow-input > input:not([disabled]):hover {
+ background-color: #fbfbfb;
+}
+
+.formButtons {
+ display: flex;
+ flex-direction: row;
+ margin-top: 5px;
+}
+
+.formButtons > button {
+ margin: 5px;
+ width: 50%;
+ padding: 5px;
+ border: none;
+ border-radius: 7px;
+ box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.4);
+}
+
+.formButtons > button:hover {
+ background-color: #dadada;
+}
+
+.formButtons > button:focus {
+ background-color: #d5d5d5;
+} \ No newline at end of file
diff --git a/day9/task5/static/css/NewEntryStyle.css b/day9/task5/static/css/NewEntryStyle.css
new file mode 100644
index 0000000..e1141b2
--- /dev/null
+++ b/day9/task5/static/css/NewEntryStyle.css
@@ -0,0 +1,32 @@
+.newEntryBtn {
+ overflow: hidden;
+ white-space: nowrap;
+
+ position: fixed;
+ bottom: 50px;
+ left: 50px;
+
+ padding: 5px;
+ border-radius: 20px;
+ width: 40px;
+ height: 40px;
+ border: none;
+ background-color: #2871e2;
+ color: white;
+ font-size: 20px;
+
+ transition-property: width, font-size;
+ transition-duration: 0.6s;
+}
+
+.newEntryBtn:hover {
+ width: 150px;
+ font-size: 15px;
+ background-color: #286bd6;
+}
+
+.newEntryBtn:focus {
+ width: 200px;
+ font-size: 15px;
+ background-color: #2861c3;
+}
diff --git a/day9/task5/static/css/TableStyle.css b/day9/task5/static/css/TableStyle.css
new file mode 100644
index 0000000..61f2f28
--- /dev/null
+++ b/day9/task5/static/css/TableStyle.css
@@ -0,0 +1,23 @@
+table {
+ border-spacing: 0;
+ padding: 0;
+ border: 1px solid black;
+}
+
+thead > tr > th {
+ padding: 6px;
+ font-size: 16px;
+ background-color: #6f6f6f;
+}
+
+td {
+ padding: 3px;
+ font-size: 13px;
+}
+
+.odd { background-color: #dedede; }
+.even { background-color: #c5c5c5; }
+
+.editableField:hover {
+ background-color: rgba(0, 0, 0, 0.3);
+}