From bf40f6293a89262a39188d0aa1375dbe8ab1a970 Mon Sep 17 00:00:00 2001 From: Anon Ray Date: Sun, 6 Oct 2013 06:56:43 +0530 Subject: [PATCH] Revamped the UI Revamped the UI. Trying to make it more meaningful. --- mouchak/server.py | 4 + mouchak/static/css/editor.css | 30 ++-- mouchak/static/js/editor.js | 9 +- mouchak/templates/404.html | 304 +++++++++++++++++++++-------------------- mouchak/templates/editor.html | 27 ++-- 5 files changed, 203 insertions(+), 171 deletions(-) diff --git a/mouchak/server.py b/mouchak/server.py index 579877c..5c2bc7a 100644 --- a/mouchak/server.py +++ b/mouchak/server.py @@ -40,6 +40,10 @@ def getContent(): return {'content': content, 'menu': menu} +@app.errorhandler(404) +def pageNotFound(e): + return flask.render_template('404.html'), 404 + @app.route('/', methods=['GET']) def index(): diff --git a/mouchak/static/css/editor.css b/mouchak/static/css/editor.css index 0460f07..ca23566 100644 --- a/mouchak/static/css/editor.css +++ b/mouchak/static/css/editor.css @@ -1,5 +1,20 @@ -.page { +body { + background-color: #EEE; +} +.prettybox-lg { + background-color: #FFF; + border: 1px solid #999; + border-radius: 6px; + box-shadow: 1px 1px 9px #333; +} +.prettybox-side { border: 1px solid #999; + background-color: #FFF; + border-radius: 4px; + box-shadow: 0 0 5px #999; +} + +.page { padding: 30px; padding-bottom: 10px; width: 600px; @@ -8,15 +23,13 @@ position: absolute; left: 20px; top: 20px; - border: 1px solid #999; padding: 10px; width: 300px; - /*height: 80%;*/ } #page { position: absolute; - left: 400px; - top: 40px; + left: 420px; + top: 20px; } #pagelist { padding: 10px; @@ -36,10 +49,9 @@ padding: 3px; } #contentview { - border: 1px solid #999; - padding: 30px; + padding: 35px; margin: 10px; - width: 85%; + width: 88%; } .contentview { } @@ -76,3 +88,5 @@ opacity: 0.7; display: none; } +#hud { +} diff --git a/mouchak/static/js/editor.js b/mouchak/static/js/editor.js index 6bb5557..f380694 100644 --- a/mouchak/static/js/editor.js +++ b/mouchak/static/js/editor.js @@ -3,7 +3,7 @@ /* view to manage list of pages - add, remove and show them */ var PageListView = Backbone.View.extend({ tagName: 'div', - className: '', + className: 'prettybox-side', id: 'pages', events: { 'click .pagename .disp': 'showPage', @@ -101,6 +101,7 @@ * add content, remove and show content, and update the page */ var PageView = Backbone.View.extend({ tagName: 'div', + className: 'prettybox-lg', id: 'page', events: { 'click #updatePage': 'updatePage', @@ -270,9 +271,11 @@ /* view to manage, render and update each content */ var ContentView = Backbone.View.extend({ id: 'contentview', + className: 'prettybox-lg', events: { 'click #done': 'done', 'click #updateContent': 'update', + 'click #back' : 'back', 'click #edit-type button' : 'editTypeChanged', 'change .contentview select': 'typeChanged' }, @@ -388,12 +391,16 @@ done: function() { this.update(); this.cleanUp(); + }, + back: function() { + this.cleanUp(); } }); /* view to configure custom navigation menu */ var MenuConfigView = Backbone.View.extend({ tagName: 'div', + className: 'prettybox-lg', id: 'page', events: { 'change #custom-menu': 'customMenuChange', diff --git a/mouchak/templates/404.html b/mouchak/templates/404.html index 71ce557..6330693 100644 --- a/mouchak/templates/404.html +++ b/mouchak/templates/404.html @@ -1,153 +1,157 @@ - - - Page Not Found :( - - - -
-

Not found :(

-

Sorry, but the page you were trying to view does not exist.

-

It looks like this was the result of either:

- -
- + + + Page Not Found :( + + + +
+

Not found :(

+

Sorry, but the page you were trying to view does not exist.

+

It looks like this was the result of either:

+ +
+
+ Mouchak +
+
+ diff --git a/mouchak/templates/editor.html b/mouchak/templates/editor.html index 31ef797..f03398c 100644 --- a/mouchak/templates/editor.html +++ b/mouchak/templates/editor.html @@ -130,7 +130,10 @@ -- 1.7.10.4