CSS

README.md

@@ -1,15 +1,15 @@
-# squip_notes
+# squip_tasks
 
-This is a basic notes-taking program. It uses python with flask and pickle, to give a really light and simple web interface for note taking.
+This is a basic todo program. It uses python with flask and pickle, to give a really light and simple web interface for task taking.
 
 It uses the [dracula](https://github.com/dracula/dracula-theme) colors.
 ![dark theme screenshot](./ssdark.png)
 ![light theme screenshot](./sslight.png)
-![Screenshot of the application](./squipnotes.png)
+![Screenshot of the application](./squiptasks.png)
 
 # Features
 * No accounts : this is made to be used as a single page (you can't have multiple user accounts). This is best suited as a personnal, self-hosted application in your own network (or it could also work for a work team).
-* Simplicity: Simply get on the page and start writing. The notes syntax is markdown.
+* Simplicity: Simply get on the page and start writing. The tasks syntax is markdown.
 * Themes : As for now, there is a default dark theme (dracula), and an optionnal light theme (loosely based on solarized light). They can be selected via the interface.
 
 # Themes (adding your own)
@@ -34,7 +34,7 @@ pygmentize -S dracula -f html -a .codehilite > styles.css
 
 ## Run with Docker
 ### Using traefik
-If you use traefik, you only have to change the url in the label "traefik.http.routers.sqnotes.rule". You can also modify the labels to rename the service from "sqnotes" to anything else.
+If you use traefik, you only have to change the url in the label "traefik.http.routers.sqtasks.rule". You can also modify the labels to rename the service from "sqtasks" to anything else.
 
 Then start the service. It will create the image and start it for you:
 ```bash

docker-compose.yml

@@ -4,17 +4,17 @@ networks:
     external: true
 
 services:
-  sqnotes:
+  sqtasks:
     build: .
-    image: sqnotes
+    image: sqtasks
     volumes:
       - ./data:/app/data
     restart: always
       #ports:
       #- 8080:8080
     labels:
-      - "traefik.http.routers.sqnotes.rule=Host(`notes.squi.fr`)"
+      - "traefik.http.routers.sqtasks.rule=Host(`tasks.squi.fr`)"
-      - "traefik.http.services.sqnotes.loadbalancer.server.port=8080"
+      - "traefik.http.services.sqtasks.loadbalancer.server.port=8080"
       - "traefik.docker.network=traefik_traefik"
     networks:
       traefik_traefik:

src/app.py

@@ -81,19 +81,6 @@ def rawtasks():
     #No theme in export
     return render_template("export.html", rawtasks = exporttasks())
 
-#Read mode
-@app.route('/readmode', methods=['GET','POST'])
-def readmode():
-    #theme
-    csslink = request.cookies.get('csslink')
-
-
-    #Render page
-    if request.method == 'GET':
-        tasknumber = request.args.get("task")
-        mytask = findtask(int(tasknumber))
-    return render_template("read.html", task=mytask.flaskrender(), csslink = csslink)
-
 
 #Edition mode
 @app.route('/edit', methods=['GET', 'POST'])
@@ -133,7 +120,8 @@ def edit():
         rightnow = int(time.time())
         newtask = task(createtime=tasknumber, modtime=rightnow, title=tasktitle, text=tasktext, done=taskdone, priority=taskpriority)
         addtask(newtask)
-        return render_template("read.html", task=newtask.flaskrender(), csslink = csslink)
+        return render_template("homepage.html", ntodo = todotasks(gettasks()), ndone = donetasks(gettasks()), csslink = csslink)
+
 
 
 #Basic route, allows task creation

src/classes.py

@@ -41,12 +41,11 @@ class task:
 
         rendered = f"""
         <hr>
-        <div class="tasktitle">{Markup.escape(self.title)}</div>
+        <div class="tasktitle">{self.donemark} {Markup.escape(self.title)}</div>
-        <div class="priority">Priority: {self.priority}</div>
-        <div class="donemark">{self.donemark}</div>
         <form action="." method="GET" name="{self.createtime}">
         <button type="submit" name="toswitch" value="{self.createtime}" class "taskbutton">Done/Todo</button>|<button type="submit" name="delete" value="{self.createtime}" class="taskbutton" onclick="return confirm('Really ?')">Delete</button>|<button type="submit" name="edit" value="{self.createtime}" class="taskbutton">Edit</button>|<a href="{ url_for('render') }" class="backlink">Back</a>
         </form>
+        <div class="tasktime">Priority: {self.priority}</div>
         <div class="tasktime">Created : {self.rendertime(self.createtime)}
         <br>Modified : {self.rendertime(self.modtime)}</div><br>
         <div class="tasktext">{markdown.markdown(self.text, extensions=['fenced_code', 'codehilite', 'nl2br', 'smarty'])}</div><br>

src/static/styles/0-dracula.css

@@ -157,6 +157,55 @@ a {
 	white-space: pre-wrap;
 }
 
+.priorityinput {
+	background-color: #22242e;
+	color: #f8f8f2;
+	border-radius: 5px;
+	border-style: none;
+	border-width: 1px;
+	width: 40px;
+}
+
+label {
+	background-color: transparent;
+	border: none;
+	color: #8be9fd;
+	padding: 1px 2px;
+	text-align: left;
+	text-decoration: none;
+	display: inline-block;
+	font-size: 1em;
+	font-style: normal;
+	cursor: pointer;
+}
+/* Hide priority select arrows
+Chrome, Safari, Edge, Opera */
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* Firefox */
+input[type=number] {
+  -moz-appearance: textfield;
+}
+
+.donemarkselect {
+	background-color: #22242e;
+	color: #f8f8f2;
+	border-radius: 5px;
+	border-style: inset;
+	border-color: #ff79c6;
+	border-width: 1px;
+	width: 40px;
+}
+
+.separator {
+	text-align: center;
+}
+
+
 /* Syntax highlighting */
 pre { line-height: 125%; }
 td.linenos .normal { color: #f1fa8c; background-color: #44475a; padding-left: 5px; padding-right: 5px; }

src/static/styles/1-light.css

@@ -135,7 +135,7 @@ a {
 	border-style: none;
 	outline: none;
 	border-width: 1px;
-	height: 80%;
+	height: 40%;
 	font-size: 15px;
 	-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);
 }
@@ -158,6 +158,55 @@ a {
 	white-space: pre-wrap;
 }
 
+.priorityinput {
+	background-color: #eee8d5;
+	color: #586e75;
+	border-radius: 5px;
+	border-style: none;
+	border-width: 1px;
+	width: 40px;
+}
+
+label {
+	background-color: transparent;
+	border: none;
+	color: #2aa198;
+	padding: 1px 2px;
+	text-align: left;
+	text-decoration: none;
+	display: inline-block;
+	font-size: 1em;
+	font-style: normal;
+	cursor: pointer;
+}
+/* Hide priority select arrows
+Chrome, Safari, Edge, Opera */
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* Firefox */
+input[type=number] {
+  -moz-appearance: textfield;
+}
+
+.donemarkselect {
+	background-color: #eee8d5;
+	color: #586e75;
+	border-radius: 5px;
+	border-style: inset;
+	border-color: #ff79c6;
+	border-width: 1px;
+	width: 40px;
+}
+
+.separator {
+	text-align: center;
+}
+
+
 /* Syntax highlighting */
 pre { line-height: 125%; }
 td.linenos .normal { color: #93a1a1; background-color: #eee8d5; padding-left: 5px; padding-right: 5px; }

src/templates/homepage.html

@@ -13,16 +13,20 @@
 		</div>
 		<form action="." method="POST">
 			<input type="text" name="title" class="title" placeholder="Title"><br>
-			<label for="priority">Priority(0-10): </label>
-			<input type="number" name="priority" class="priorityinput" id="priority" min="0" max="10">
 			<textarea type="text" name="text" rows = "5" cols = "60*" class="text" placeholder="Text"></textarea><br>
+			<label for="priority">Priority</label>
+			<input type="number" name="priority" class="priorityinput" id="priority" min="0" max="10" value="5"><br>
 			<button type="submit" name="submit">Post</button>
 			<div class="tasktime">Note : you can drag the textbox to make it bigger. Scroll down to see your previous tasks.</div>
 		</form>
 		<br>
-  <h2>Todo</h2>
+  <hr>
+  <h2 class="separator">Todo</h2>
+  <hr>
 	{{ ntodo }}
-  <h2>Done</h2>
+  <hr>
+  <h2 class="separator">Done</h2>
+  <hr>
   	{{ ndone }}
 
   </body>