Latest Posts

Topic: Make Codeblocks more different from normal text

kaputtnik
Avatar
Topic Opener
Joined: 2013-02-18, 20:48
Posts: 2433
OS: Archlinux
Version: current master
Ranking
One Elder of Players
Location: Germany
Posted at: 2014-12-06, 17:46

Code Blocks in Forum and Wiki look like normal text, so it is sometimes hard to difference between them. Take a look at https://wl.widelands.org/wiki/WikiSyntax/ where this screen shows my adjustments:

Code in Wiki

In Forum it will look like this:

Code in Forum

In the first post the contrast isn't very well, but could be seen anyway.

What do think about this? If you like it, i will place a bugreport on launchpad with the appropiate adjustments.


Fight simulator for Widelands:
https://wide-fighter.netlify.app/

Top Quote
wl-zocker

Joined: 2011-12-30, 17:37
Posts: 495
Ranking
Tribe Member
Location: Germany
Posted at: 2014-12-06, 18:04

I think it makes sense to distinguish code blocks better from the background. I think with the current forum color, the difference is already pretty good.

What is about code blocks for some single words (syntax: grave accent `)? Could you give an example of how this would look?


"Only few people know how much one has to know in order to know how little one knows." - Werner Heisenberg

Top Quote
GunChleoc
Avatar
Joined: 2013-10-07, 15:56
Posts: 3324
Ranking
One Elder of Players
Location: RenderedRect
Posted at: 2014-12-07, 10:57

I would also give code blocks a black border.

Another thing I noticed in your screenshot is that the padding above headings is smaller than the padding below headings. It should be the other way around. This would be a different fix though.


Busy indexing nil values

Top Quote
kaputtnik
Avatar
Topic Opener
Joined: 2013-02-18, 20:48
Posts: 2433
OS: Archlinux
Version: current master
Ranking
One Elder of Players
Location: Germany
Posted at: 2014-12-07, 14:19

wl-zocker wrote: What is about code blocks for some single words (syntax: grave accent `)? Could you give an example of how this would look?

Good point. Because backticks and codeblocks are parsed different into html, we could make different formats to each possibility. Assuming the backticks are used to format a word in a sentence, we could make it as follow:

Screenshot:

pre_code

End Screenshot

The changes in base.css are:

In section pre add the missing lines and add a new section p > code:

pre {
    white-space: pre-wrap;
    background-image: url("../img/black50.png" );
    padding: 5px 10px;
    margin: 5px 10px;
    display: inline-block
}

p > code {
    background-image: url("../img/black50.png" );
    padding: 0px 3px;
}

padding: x y puts a little space between backgroundborder and innertext. x=top/bottom; y=left/right
margin: x y is for little space around the box. The meaning for x and y are the same as by padding.

The selector p > code catch only those "code" elements which are after a p-Element (when code is child of p). This is the case to all text in backticks.


Fight simulator for Widelands:
https://wide-fighter.netlify.app/

Top Quote
wl-zocker

Joined: 2011-12-30, 17:37
Posts: 495
Ranking
Tribe Member
Location: Germany
Posted at: 2014-12-07, 15:18

The direct comparision makes it clear: Your new idea is definitely an improvement. I also like how the text in backticks looks like. We now have to hope that people use this syntax to highlight their code.


"Only few people know how much one has to know in order to know how little one knows." - Werner Heisenberg

Top Quote
kaputtnik
Avatar
Topic Opener
Joined: 2013-02-18, 20:48
Posts: 2433
OS: Archlinux
Version: current master
Ranking
One Elder of Players
Location: Germany
Posted at: 2014-12-07, 22:35

While quoting the codeblock works not correct:

quoting

But this is a failure from the parser... I don't know if this is a main stopper for my suggestion. For the wiki we could allways implement it imho

Edited: 2014-12-07, 22:37

Fight simulator for Widelands:
https://wide-fighter.netlify.app/

Top Quote
GunChleoc
Avatar
Joined: 2013-10-07, 15:56
Posts: 3324
Ranking
One Elder of Players
Location: RenderedRect
Posted at: 2014-12-07, 22:58

Nevermind, I see what you mean now.

Edited: 2014-12-07, 22:59

Busy indexing nil values

Top Quote
kaputtnik
Avatar
Topic Opener
Joined: 2013-02-18, 20:48
Posts: 2433
OS: Archlinux
Version: current master
Ranking
One Elder of Players
Location: Germany
Posted at: 2015-01-07, 15:43

Because of the failure while quoting do allready today exist, i've made anyway a new branch with this feature and a merge request.

This branch will also fix some failures with smileys. Screens how it would look like:

Codeblock in Wiki:

wiki

Smiley's in wiki:

wiki

The above shown possibility couldn't be made today, because smileys are ever replaced, even if they are in a codeblock.

This picture shows, that codeblocks will also work in the forum (dark background)

wiki


Fight simulator for Widelands:
https://wide-fighter.netlify.app/

Top Quote
kaputtnik
Avatar
Topic Opener
Joined: 2013-02-18, 20:48
Posts: 2433
OS: Archlinux
Version: current master
Ranking
One Elder of Players
Location: Germany
Posted at: 2015-01-07, 15:49

Ah, i forgot: I tested also codehighlighting like in https://wl.widelands.org/docs/wl/tutorial/#hello-world But i think here in the forum it isn't needed (no such bugreport or whishlist). So i ommited codehighlighting.


Fight simulator for Widelands:
https://wide-fighter.netlify.app/

Top Quote
wl-zocker

Joined: 2011-12-30, 17:37
Posts: 495
Ranking
Tribe Member
Location: Germany
Posted at: 2015-01-07, 18:26

smileys are ever replaced, even if they are in a codeblock

Which causes sometimes strange results. Nice that you fix it.

Code higlighting: I have never written such big code blocks in the forum that this would have been necessary.


"Only few people know how much one has to know in order to know how little one knows." - Werner Heisenberg

Top Quote