[tw5] dynamic width

[J]

I have tried looking for a post that makes tw5 adapt to the screen width of the browser preferably where the Tiddler area takes more space.  Unfortunately, I have not found any that I got to work or is accessible to me.  

Please help.

Thank you in advance.

Regards,

j

[BurningTreeC]

Hi J, a lot can be accomplished with pure css

A media query allows to define styles if the browser width is below/above a certain value:

@media (max-width: 960px) {

.myclass {

width: 50px;

}

}

@media (min-width: 960px) {

.myclass {

width: 500px;

}

}

alternativelly, if media queries are not enough, there's the dynaview plugin that stores the browser-window width and height in state tiddlers (if you check the checkbox in the dynaview-plugin's config)

I use it in combination with the formulas plugin to reveal styles when the value stored is lower/higher than a certain value... and it's handy if one wants to set conditions based on the browser-width and height using the list widget

[J]

BurningTreeC,

I apologize but I am not close to being a Web Developer.  Forgive me if my next statement sounds noobish.

I tried looking for "@media" but cannot find the code you had quoted.  Moreover, I also installed dynaview but it did not really make the wiki adapt to the width of my browser even after enabling the checkbox.

Help.

Please be patient with me.  :)

Regards,

J

[Jan]

Hi J
that code is not specific to TW5 but it is a css-standart for mediaqueries:
"The @media rule is used in media queries to apply different styles for different media types/devices"
For more information

https://www.w3schools.com/cssref/css3_pr_mediaquery.asp


Yours Jan

Am 19.06.2018 um 17:46 schrieb J:

BurningTreeC,

I apologize but I am not a Web Developer.  I trying looking for "@media" but cannot find the code you had quoted.  Moreover, I also installed dynaview but it did not really made the wiki adapt to the width of my browser even after enabling the checkbox.

Control Panel is also stuck.  It always shows now even after I had uninstalled dynaview.

Help.

Regards,

J

On Tuesday, June 19, 2018 at 7:49:03 AM UTC-7, BurningTreeC wrote:

Hi J, a lot can be accomplished with pure css

A media query allows to define styles if the browser width is below/above a certain value:

@media (max-width: 960px) {

.myclass {

width: 50px;

}

}

@media (min-width: 960px) {

.myclass {

width: 500px;

}

}

alternativelly, if media queries are not enough, there's the dynaview plugin that stores the browser-window width and height in state tiddlers (if you check the checkbox in the dynaview-plugin's config)

I use it in combination with the formulas plugin to reveal styles when the value stored is lower/higher than a certain value... and it's handy if one wants to set conditions based on the browser-width and height using the list widget

--
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 https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/475e6104-7fc2-41b4-a8db-8287993aaf7a%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[J]

Jan,

Thank you for the explanation, perhaps I do not need to tweak it after all.  Prior to reading your message, I was playing around with Theme Tweaks and found that setting the Sidebar layout field to "Fluid story, fixed sidebar" seem to satisfy my need.

[BurningTreeC]

@J, sorry, I assumed you need a bit more detailed explanation

My solutions would involve CSS as Jan says, but for your use-case it's not needed

glad the Controlpanel settings work for you!

BTC

[J]

BTC,

Thank you as well.   :)

Regards,

j

[TonyM]

J,

Some friendly advice, your post is titled "dynamic width"

Perhaps next time it should have a little more information, like "dynamic width of TiddyWiki in browser"

No harm if you don't of course but there is a pile of us here ready to help and there will be others in future looking for the same answers. Clearer headings will help us all.

Thanks

Tony