What would your dream TiddlyWiki look like?

14 views
Skip to first unread message

Dave Gifford - TiddlyWiki in Action

unread,
Feb 21, 2007, 1:04:19 PM2/21/07
to TiddlyWiki
Here is a screenshot of my dream TW:

http://www.giffmex.org/dreamtw.GIF

1. No righthand sidebar. All the sidebar stuff available in the Nested
Sliders lefthand mainmenu.
2. MainMenu that starts at the top left so that the header is off to
the side of it.
3. Independent top menu just to have more menu flexibility.
4. (Not necessarily the color scheme or menu items shown in the
screenshot)

I envy you programmer types. I'm sure this is doable. But it's way
beyond me.

I am interested to hear or see what others of you would have on your
ultimate TW if you know how to do it.

Dave Gifford

elnoi

unread,
Feb 21, 2007, 6:05:45 PM2/21/07
to TiddlyWiki
Here is another screenshot.
http://www.flickr.com/photos/23175746@N00/398093494/
This was my dream TddlyWiki look, but with patience it becomes my real
TiddlyWiki.

Simon Baird

unread,
Feb 21, 2007, 6:33:07 PM2/21/07
to Tiddl...@googlegroups.com
elnoi, wow, that's very nice!
Dave, you're right it is doable. It would be just a few tweaks in StyleSheet and PageTemplate.

Simon Baird <simon...@gmail.com>

Dave Gifford - TiddlyWiki in Action

unread,
Feb 22, 2007, 12:05:25 AM2/22/07
to TiddlyWiki
You know it didn't take me long to figure out the independent topmenu,
eliminating the sidebar and adding the sidebar options and tabbed
lists I use frequently to the mainmenu nested sliders.

I even figured out that by moving mainmenu to the top of the
pagetemplate the mainmenu items move to the top left where I would
like them.

What I tried to figure out and couldn't was how to move the header and
its gradient over to the right of the mainmenu. Currently if I move
the mainmenu up it is covered partly by the header. What is the
solution?

Dave Gifford

On Feb 21, 5:33 pm, "Simon Baird" <simon.ba...@gmail.com> wrote:
> elnoi, wow, that's very nice!
> Dave, you're right it is doable. It would be just a few tweaks in StyleSheet
> and PageTemplate.
>

> On 2/22/07, elnoi <elnoi...@gmail.com> wrote:
>
>
>
> > Here is another screenshot.
> >http://www.flickr.com/photos/23175746@N00/398093494/
> > This was my dream TddlyWiki look, but with patience it becomes my real
> > TiddlyWiki.
>

> --
> Simon Baird <simon.ba...@gmail.com>

Dave Gifford - TiddlyWiki in Action

unread,
Feb 22, 2007, 12:11:12 AM2/22/07
to TiddlyWiki
Here's an actual image of what it looks like currently. I would have
never guessed I could get it so close today...

http://www.giffmex.org/dreamtwpartial.png

Dave Gifford


Daniel Baird

unread,
Feb 22, 2007, 12:12:39 AM2/22/07
to Tiddl...@googlegroups.com
in your pageTemplate, remove the headerShadow and headerForeground
divs, replacing them both with the content of headerForeground.

As in, before:

<div class='header' macro='gradient vert
[[ColorPalette::PrimaryLight]] [[ColorPalette::PrimaryMid]]'>
<div class='headerShadow'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>&nbsp;
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
<div class='headerForeground'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>&nbsp;
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
</div>

after:
<div class='header' macro='gradient vert
[[ColorPalette::PrimaryLight]] [[ColorPalette::PrimaryMid]]'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>&nbsp;
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>

Then you can style the .header div to be whatever height you want.

;Daniel


--
Daniel Baird
http://tiddlyspot.com (free, effortless TiddlyWiki hosting)
http://danielbaird.com (TiddlyW;nks! :: Whiteboard Koala :: Blog ::
Things That Suck)

Dave Gifford - TiddlyWiki in Action

unread,
Feb 22, 2007, 1:32:06 AM2/22/07
to TiddlyWiki
Hi Daniel

Maybe I am misunderstanding you. I know how to change the height of
the header even without your pagetemplate change. What I want to do is
have a header but that begins to the right of the MainMenu, like in
the original screenshot post. I tried what you suggested, but it had
to do with the height.

Anyway, here is what I've done so far, as an empty version. I am
pleased as punch with it

http://www.giffmex.org/Dave'sOrganizerEmpty.html

Dave Gifford

Simon Baird

unread,
Feb 22, 2007, 1:43:20 AM2/22/07
to Tiddl...@googlegroups.com
Try this as a PageTemplate:
 
<!--{{{-->
<div style="left:15em;" class='headerForeground' macro='gradient vert [[ColorPalette::PrimaryLight]] [[ColorPalette::PrimaryMid]]'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>&nbsp;
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
<!-- horizontal MainMenu -->
<div style="margin-left:15em;padding-left:1em;" id='topMenu' refresh='content' tiddler='TopMenu'></div>
<!-- original MainMenu menu -->
<div style="position:absolute;top:0px;" id='mainMenu' refresh='content' tiddler='MainMenu'></div>
</div>
<div id='displayArea'>
<div id='messageArea'></div>
<div id='tiddlerDisplay'></div>
</div>
<!--}}}-->

 

Dave Gifford - TiddlyWiki in Action

unread,
Feb 22, 2007, 2:04:33 AM2/22/07
to TiddlyWiki
Simon, that was it! See the link above for the final product

Dave

On Feb 22, 12:43 am, "Simon Baird" <simon.ba...@gmail.com> wrote:
> Try this as a PageTemplate:
>
> <!--{{{-->
> <div style="left:15em;" class='headerForeground' macro='gradient vert
> [[ColorPalette::PrimaryLight]] [[ColorPalette::PrimaryMid]]'>
> <span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>&nbsp;
> <span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
> </div>
> <!-- horizontal MainMenu -->
> <div style="margin-left:15em;padding-left:1em;" id='topMenu'
> refresh='content' tiddler='TopMenu'></div>
> <!-- original MainMenu menu -->
> <div style="position:absolute;top:0px;" id='mainMenu' refresh='content'
> tiddler='MainMenu'></div>
> </div>
> <div id='displayArea'>
> <div id='messageArea'></div>
> <div id='tiddlerDisplay'></div>
> </div>
> <!--}}}-->
>

> On 2/22/07, Dave Gifford - TiddlyWiki in Action <g...@giffmex.org> wrote:
>
>
>
>
>
> > Hi Daniel
>
> > Maybe I am misunderstanding you. I know how to change the height of
> > the header even without your pagetemplate change. What I want to do is
> > have a header but that begins to the right of the MainMenu, like in
> > the original screenshot post. I tried what you suggested, but it had
> > to do with the height.
>
> > Anyway, here is what I've done so far, as an empty version. I am
> > pleased as punch with it
>
> >http://www.giffmex.org/Dave'sOrganizerEmpty.html
>
> > Dave Gifford
>

> --
> Simon Baird <simon.ba...@gmail.com>

Daniel Baird

unread,
Feb 22, 2007, 4:18:20 AM2/22/07
to Tiddl...@googlegroups.com
The headerForeground has "position: absolute" in its CSS rule that
puts it across the top -- I figured it would be easy to just avoid the
positioning stuff by not using the "headerForeground" class at all.

Perhaps I should have tested it :)

;Daniel

On 22/02/07, Dave Gifford - TiddlyWiki in Action <gi...@giffmex.org> wrote:
>

Dave Gifford - TiddlyWiki in Action

unread,
Feb 22, 2007, 8:03:28 AM2/22/07
to TiddlyWiki
Daniel,

No problem. I suppose I can be extremely forgiving now that I have my
'dream' TiddlyWiki! A dream has come true.

I am going to pay back the TiddlyWiki community in a week or less by
adding some advanced items in my tutorial, like the built in sliders,
how to do topmenus versus mainmenus in pagetemplate, moving stuff
around, adjusting the height and size of objects in the stylesheet,
etc.

The more you guys put up with teaching me, the more will get in the
tutorial so hopefully you don't have to teach the next person.

Dave G


FND

unread,
Feb 24, 2007, 4:27:12 AM2/24/07
to Tiddl...@googlegroups.com

This looks very impressive indeed!
I didn't know about the LaunchApplicationPlugin before

> This was my dream TddlyWiki look, but with patience it becomes my real
> TiddlyWiki.

So you've created this pseudo-screenshot with Photoshop then?

Either way, I'd love to see this added to TiddlyThemes when it's done!


-- F.

elnoi

unread,
Feb 24, 2007, 6:21:25 AM2/24/07
to TiddlyWiki
FND,
This is not a Photoshop creation, it's a real screenshot of my
Tiddlywiki without any modifications.
Note that it's not perfect and I only tested in Firefox (for Windows).
It also uses many images and my modifications to stylesheets are not
clean. This is the reason because i don't distribute, however I can
send anyone the images and stylesheets.
(sorry for my english)

Simon Baird

unread,
Feb 27, 2007, 6:22:56 PM2/27/07
to Tiddl...@googlegroups.com
elnoi, can you make an "empty" version of your beautiful TW and put it up online for others to use? The look and feel could be converted to a theme for http://tiddlythemes.com/ ?

Simon.
--
Simon Baird <simon...@gmail.com>

elnoi

unread,
Mar 2, 2007, 5:16:30 PM3/2/07
to TiddlyWiki
Simon, My "theme" probably it's not really a theme, is like a
distribution because there some images, third party plugins and the
bahaviour is NOT perfect: there is some errors.
My intention is to do a TW distro, but I have a lot of things to
resolve before:
1 I must request the permission of all authors of the plugis to
distribute it
2 The images used are not mine, and I don't know if I can distribute
it. Really this is my principal trouble: I don't know who can I ask
this...

I apreciate your proposal and keep in mind, but I think that my TW
have many bugs for be used as a theme.
However I am preparing a more clear/compatible version with less bugs
for the new TW version 2.2.

Simon Baird

unread,
Mar 4, 2007, 7:46:48 PM3/4/07
to Tiddl...@googlegroups.com

On 3/3/07, elnoi <elno...@gmail.com> wrote:
...

However I am preparing a more clear/compatible version with less bugs
for the new TW version 2.2.

Cool.



--
Simon Baird < simon...@gmail.com>

FND

unread,
Mar 5, 2007, 10:11:27 AM3/5/07
to Tiddl...@googlegroups.com
> ...
> However I am preparing a more clear/compatible version with less bugs
> for the new TW version 2.2.
>
>
> Cool.

Indeed.


-- F.

elnoi

unread,
Mar 5, 2007, 4:08:57 PM3/5/07
to TiddlyWiki
TiddlyWiki Ambient 1.0.1 image preview at http://www.flickr.com/photos/elnoi/411756149/

Reply all
Reply to author
Forward
0 new messages