ForumsTips & Tricks[UserStyles] Toodledo Focus


[UserStyles] Toodledo Focus
Author Message
twangus

Posted: Dec 15, 2010
Score: 0 Reference
Here's a Safari extension that wraps the css file. Just download and double-click and Safari should apply the theme.

http://focus.yamara.org/ToodledoFocus.safariextz
piyush_soni

Posted: Dec 15, 2010
Score: 0 Reference
I don't know if it's just me, but on my 1200 x 800 laptop the task list goes out of the screen bounds (horizontally) so have to use scrollbars when I really shouldn't need to. Even the 'Add a Task' button is completely out of the screen. When I disable the theme, it doesn't happen. At first I assumed you would be using a fixed width for the '#main' div, but looking into the code it seems you aren't. I noted if I remove the

right: auto !important;

it fits the main div exactly in my screen. But I'm certainly not good in these CSS things so leave it to the expert.

Thanks...
twangus

Posted: Dec 15, 2010
Score: 0 Reference
@piyush_soni, are you using grid mode or multi-line mode?

In grid mode, the width of the table is hardcoded into the HTML based on the width of columns you drag. The grid in this style should be in about the same place (horizontally) as the grid w/o the theme when the toodledo bar is open.

In multi-line mode, which I don't use myself, the default behavior is to have the table be 800px wide when all tasks are closed, and then to have it expand to fit all fields when any are open. I can see that when people have a lot of fields, that probably doesn't make sense (especially since the "Add Task" button is tied to the right side of the main panel, so it gets pushed off-screen). Instead, you'd probably prefer that the main panel fit within the screen and that the fields wrap to a second line (like @PeterW suggested). I'm still working on a way to get that working without breaking the widths in grid mode or in all the other pages on the Toodledo site. I'll update it if I can figure anything out.


This message was edited Dec 15, 2010.
dg

Posted: Dec 16, 2010
Score: 0 Reference
+1 on making this the standard Toodledo interface

The Toodledo team hasn't made any significant UI changes in the 2 years I've used it. Yet, scripts like this indicate changes are not that hard to make.

Soooo.....
piyush_soni

Posted: Dec 17, 2010
Score: 0 Reference
@twangus,
I am using the standard Grid Mode, and I now know what was the reason of it going out of my screen only when this style is enabled.

Yes, I probably had set the columns width manually by dragging, but I mostly keep the todo bar hidden so it didn't go out of the screen. With the theme enabled the tab names come to the left so it adds to the total width making my tasks list go out of the screen. I reduced the overall width of all columns now to take care of this.

One change you can do is : without the theme, even if the tasks table goes out of the screen horizontally, the 'Add a Task' link still always stays at the right top corner, while in your style it is sort of bound to the #main Div, which could be corrected.

Thanks for the great work anyway!
Kurt

Posted: Dec 17, 2010
Score: 0 Reference
LOVE on Focus - great work. Small bug: when I go to search - then multi-edit and change the due date, the dialog box for due date pops up behind the main dialog, making it invisible.

Thanks
AJS

Posted: Dec 17, 2010
Score: 0 Reference
I really like the style but for the past few weeks I've settle on the theme by Vintom called "A little Mac like". While I prefer the look of Focus I really like the way Vintom's Mac theme handles tasks which are completed as they "ghost" out leaving the undone tasks clearly visible while retaining a record of the tasks done.

Focus handles completed tasks similarly to most other themes in that you see a small green tick in the box which isn't as effective visually. Otherwise looks-wise the best skin so far for me.
PeterW 

Posted: Dec 17, 2010
Score: 0 Reference
@AJS - you could easily tweak the Focus script to gray-out completed tasks (and use a line-through font also).
twangus

Posted: Dec 17, 2010
Score: 0 Reference
I rarely display my completed tasks, so I didn't change anything from the default behavior. But that all makes sense. I'll look into it and make some changes so that they "ghost" -- it should be really easy.
AJS

Posted: Dec 18, 2010
Score: 0 Reference
Posted by PeterW:
@AJS - you could easily tweak the Focus script to gray-out completed tasks (and use a line-through font also).


Yes I did manage to tweak some settings on another theme, but being a non-techie I find it all a bit hit and miss. I look forward to twangus making the necessary changes, both this and the new MacOSX theme are top quality.
mahmoodadeel

Posted: Dec 20, 2010
Score: 0 Reference
Awesome work. I was really getting sick of TD UI and you just solved the issue.

However i feel there is a lot of space wasted on the right. Is there a way to extend this to cover the whole screen
Nick Wild

Posted: Dec 21, 2010
Score: 0 Reference
Hi,

Great work!

How would I mod the code to work in Fluid on a Mac so I can create an app?

TIA

NIck
earnjam

Posted: Dec 21, 2010
Score: 0 Reference
1) Download Fluid and create a Fluid app for Toodledo.
2) With your Toodledo Fluid app open, click the scripts icon in the top menu and select Open Userscripts Folder.
3) Download this JavaScript file to that folder: http://userstyles.org/styles/userjs/40980/Toodledo%20Focus.user.js
4) Click the scripts menu icon again and click the Toodledo Focus style
5) Refresh the app (Cmd+R)
Nick Wild

Posted: Dec 21, 2010
Score: 0 Reference
Perfect. As other peeps have said, this should indeed be the default skin and works like a dream with fluid.

Who needs Omnifocus!

Many thanks earnjam you rock!
twangus

Posted: Dec 21, 2010
Score: 0 Reference
@mahmoodadeel, what mode are you using? (grid or multi-line?)

For grid-mode, the main section should be as wide as it needs to fit all the data and no more. I agree I don't like wasted space, but I'm not sure what else could go there if you can already see every field.

For multi-line mode, I can try to make it so that it takes up the whole screen whatever the screen size. But I'll need to see if that's possible with the CSS (it's definitely possible to do that kind of layout, but it can be hard sometimes for the CSS to tell what mode the user is in).

But thanks for the feedback! I've got some changes in progress on my computer, but probably won't be able to upload them until after the holidays.
mahmoodadeel

Posted: Dec 22, 2010
Score: 0 Reference
Posted by twangus:
@mahmoodadeel, what mode are you using? (grid or multi-line?)

For grid-mode, the main section should be as wide as it needs to fit all the data and no more. I agree I don't like wasted space, but I'm not sure what else could go there if you can already see every field.

For multi-line mode, I can try to make it so that it takes up the whole screen whatever the screen size. But I'll need to see if that's possible with the CSS (it's definitely possible to do that kind of layout, but it can be hard sometimes for the CSS to tell what mode the user is in).

But thanks for the feedback! I've got some changes in progress on my computer, but probably won't be able to upload them until after the holidays.


I have a 24" screen and felt that if i could expand the main body to the whole screen. Something like the Mac OS user style. I will have a go at it my self.

I must say the theme should be default for toodledo. Great work.
earnjam

Posted: Dec 22, 2010
Score: 0 Reference
If you want the tasks to spread to the full window size, on the #main div:

1) Delete the line that says "right:auto !important;"
2) Change "margin-right:auto !important;" to "margin-right:5px !important;" (This just adds a little space on the right side to get it away from the scrollbar once it is full-screen...eliminates an unnecessary bottom scroll bar)
mttmllns

Posted: Jan 03, 2011
Score: 0 Reference
First day using Toodledo and first time using Stylish!

Your style definitely stood out from the others. I made one modification that you might consider throwing in. It indents the note field more. The default margin really bothers me for some reason. I also decreased the font-size for notes from .9 to .8em and decreased the width because I keep accidentally clicking the note field and editing it:

.note {
font-size: 0.8em !important;
}

.note, .ednote {
margin-left: 75px !important;
width: 500px !important;
}

I'll probably color the priorities, too. I really should be spending more time playing with Toodledo itself instead of tweaking the UI....but man the default one was the biggest reason I was hesitant picking Toodledo.

Thanks again for the great style!
breevans

Posted: Feb 27, 2011
Score: 0 Reference
When I install this on Firefox 3.5.16, the tasks themselves look correct, but everything else (incl. column headers and folder list) are all black font on a dark blue background. Have I done something wrong?
PeterW 

Posted: Feb 27, 2011
Score: 0 Reference
Check that you don't have two themes active at once. Just click the Stylish icon and if something else has a checkmark next to it, uncheck it.
You cannot reply yet

U Back to topic home

R Post a reply

Skip to Page:  1   2   3      Next

To participate in these forums, you must be signed in.