TW5 - Buttons, Links, and Opacity

[K]

Hello,

So. I like the concept of tiddlywiki, but for some reason, using it seems to give me headaches. I figured that it was the ratio of colors; the tiddlers were to bright or the colors were too contrasted. I then did some fiddling.

I've managed to make everything look good except for the buttons in the tools sidebar. Looking at some of the code,  I have a problem trying to modify the background color have opacity (rgba). I know it has something to do with "tv-config-toolbar-class". Can anyone help?

Ps: Also, is there a way to make links not be in italics? It looks bad with Garamond.

Thanks.

[Tobias Beer]

Hi K,

That's a real nice exploration as to theming TiddlyWiki.

There haven't been all too many undertaken in that direction as of yet.

Perhaps provide a test-wiki to play with?

That way it is much easier to give you feedback in terms of solutions.

Best wishes,

— tb

[Jeremy Ruston]

Hi K

You can remove the italics for links to missing tiddlers with the following CSS:

html body.tc-body a.tc-tiddlylink-missing {

font-style: normal;

}

To change the background colours of the buttons in the “Tools” tab of the sidebar, try this:

html body.tc-body .tc-sidebar-lists button {

background: transparent;

}

To use those fragments of CSS you’ll need to put them in a tiddler with the tag $:/tags/Stylesheet.

Best wishes

Jeremy.

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/c5af71bf-1fac-41b4-b3f2-04d9efba0af9%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
<Sample.png>

[K]

Sure I can distribute it. (Just need to remove a few private tiddlers.) How do I do this? Mostly it looks good, except when I use tiddlymap. I have to switch themes to use it, but for general viewing purposes, its eye candy. I managed to make buttons readable, but they look a bit tacky. Needs some more tweaking before its good.

Thanks for help on the italics for links and buttons. While doing it, I noticed I messed something up while trying to hook ckeditor as the default editor. Managed to fix it though. Its good if you have long pages to write and want to edit full screen. You can always switch to the standard wiki if you want to use tiddlywiki functions.

[K]

On Tuesday, November 10, 2015 at 10:24:17 AM UTC-8, K wrote:

Sure I can distribute it. (Just need to remove a few private tiddlers.) How do I do this? Mostly it looks good, except when I use tiddlymap. I have to switch themes to use it, but for general viewing purposes, its eye candy. I managed to make buttons readable, but they look a bit tacky. Needs some more tweaking before its good.

Thanks for help on the italics for links and buttons. While doing it, I noticed I messed something up while trying to hook ckeditor as the default editor. Managed to fix it though. Its good if you have long pages to write and want to edit full screen. You can always switch to the standard wiki if you want to use tiddlywiki functions.

   Another problem I encountered is that ckeditor (when editing source) is white, so I have to switch to edit. My extent at coding knowledge is AP computer science (java), so I was able to modify the existing code without understanding too much, but is there a way to make ck editor's ui and editing background use rgba?  The less you need to change themes, the faster you can edit and get things done. Also, ckeditor saves hours of editing because it lets you render long articles faster, so any help with this would be nice.

For example, one complex topic I wrote about took 20 tiddlers, and required a lot of time transcluding them to make them look pretty. After that, I just decided to format the wiki so I can make it similar to wikipedia's display.

Same thing with tiddlymap. I have little to no knowledge of css besides copy and paste and modification of what's already there.

Also, on it's first iteration ckeditor doesn't fit correctly, but if I close the edit and click the edit button again it fits nicely.

[K]

Here it is. I have attached the wiki.

[BJ]

Hi K,

On Tuesday, November 10, 2015 at 6:46:33 PM UTC, K wrote:

On Tuesday, November 10, 2015 at 10:24:17 AM UTC-8, K wrote:

Sure I can distribute it. (Just need to remove a few private tiddlers.) How do I do this? Mostly it looks good, except when I use tiddlymap. I have to switch themes to use it, but for general viewing purposes, its eye candy. I managed to make buttons readable, but they look a bit tacky. Needs some more tweaking before its good.

Thanks for help on the italics for links and buttons. While doing it, I noticed I messed something up while trying to hook ckeditor as the default editor. Managed to fix it though. Its good if you have long pages to write and want to edit full screen. You can always switch to the standard wiki if you want to use tiddlywiki functions.

   Another problem I encountered is that ckeditor (when editing source) is white, so I have to switch to edit. My extent at coding knowledge is AP computer science (java), so I was able to modify the existing code without understanding too much, but is there a way to make ck editor's ui and editing background use rgba?  The less you need to change themes, the faster you can edit and get things done. Also, ckeditor saves hours of editing because it lets you render long articles faster, so any help with this would be nice.

When you build your version of ckeditor online (at the ckeditor website), you can select the 'div area editor' plugin and remove the 'iframe area editor' plugin. The will allow the editor to use the correct styles in tiddlywiki whilst editing.

 

[K]

Thanks BJ,

But when I tried this, Tiddlywiki threw this error: TypeError: ev.editor.dataProcessor.writer.setRules is not a function

[K]

2.0 Version Out. Still looking for a way to seamlessly integrate ckeditor. Is there a reference I can use for css? I looked at the wiki, but could not find a list of elements to change. I don't know if I'm doing something wrong or not :).

One thing I also want to change is to make headings use serrif for headings to make it look better. I used advice from site design and the content I put on the wiki is now easier to absorb. I got a headache using vanilla tiddlywiki during the first few days.

[BJ]

I have this workin on xubuntu 14.04 with chrome and firefox, what is your setup?

[K]

I'm sorry; can you clarify your question?

[BJ]

I would like to fix any errors there are with my (ckeditor ) plugin.You had a problem with the div editor version of  ckeditor - I have not been able to reproduce this error on my setup (my computer is setup with linux xubuntu 14.04). If you could let me know what software you are using (windows, mac linux?) and what browser, I would like to see if I can fix the problem.

Cheers

BJ

[K]

Sure :). I'm running windows 8.1 and I'm running Firefox.

[BJ]

Hi K,
in order to set ckeditor to use black text you can put

 .tc-tiddler-edit-frame .tw-ckeditor-instance{
    color: black;

}

into a tiddler tagged $:/tags/Stylesheet

all the best
BJ

On Tuesday, November 10, 2015 at 6:46:33 PM UTC, K wrote: