Hello R Studio Community,
I've been developing an app in Shiny and it's be great. I have one simple question.
As different browsers have different widths, is there a way to set the rule on resizing the Shiny dashboard based on the following:
1) If browser width is more than x, limit to width to x and center the entire dashboard
2) If browser width is less than x, follow default autosizing
3) Not essential. But how do I set the blank space color to the left and right of the dashboard
The motivation is that I need a fixed width so that some pictures are scaled correctly. I hope my request can be done through some div tag on the dashboardPage.
This is the current behavior which I do NOT want.
Shiny dashboard stretches to fit window
Cheers,
Donny
Hi to achive what you are asking for just add the following code to the beginning of your dashboardBody. something like this
dashboardBody(
tags$head(
tags$style(
"body{
min-height: 611px;
height: auto;
max-width: 800px;
margin: auto;
}"
)
),
... #the rest of you ui code
hope this helps
Related
I want to change default front page sensenet slider,which should cover full page of browser.I changed height of slides to 100% in file system and content explorer i also added li{height:100%} and img{height:100%}enter image description here
I also want to hide/remove by default slider name which show on images.
There're two things to modify:
Open /Root/Global/renderers/Slider.ascx and change 'snmaxheight' in the slider config (line 117.)
snmaxheight: window.innerHeight
Add the following to the slider .css file (/Root/Global/styles/snSlider.css)
.orbit-container li .text {
display: none;
}
Image Link: http://i.stack.imgur.com/XdGAg.jpg
I am getting full with for banner images. I did set 100% width for container class
You may want to set background-size in your css as
background-size: cover;
For more info read this Mozilla docs or follow this post
I am new to foswiki, and have it spun up running on a vm at my companies datacenter.
I have most of the baseline config down, but am wondering about some more customization.
Specifically I am looking for some documentation on how to customize the sidebar. Any documentation or tips ya'll hit me back with would be appreciated!
Thanks!
I assume you are using the default theme 'PatternSkin'
One Example of modifying the Sidebar is to change the width:
to do this create a attachment 'SidebarCustomWidth.css' with the following css
#patternOuter {
margin-left: 8em;
}
#patternSideBar {
width: 8em;
margin-left: -8em;
/*background-color: rgb(200, 200, 255);*/
}
/* remove padding */
#patternSideBarContents {
padding-right: 0;
padding-left: 0;
}
then you can use it with
* Set USERSTYLEURL = %PUBURLPATH{topic="TheWebname.TopicWithAttachment" "SidebarCustomWidth.css"}%
you can find this example at
https://foswiki.org/Sandbox/StefanKr%C3%BCger/PatternSkinCssCookbookSidebarCustomWidth
and some more Documentation and Examples at
https://foswiki.org/System/PatternSkinCssCookbook
Other Options to customize the Content of the Sidebar can be found at
https://foswiki.org/System/PatternSkin#Top_44_Bottom_and_Left_Bar_customization
regarding the Sidebar you can look for WebLeftBar.
every web has its own Topic WebLeftBar. you can change this to your needs. If a Web has no WebLeftBar Topic and no WebLeftBarExample Topic (thats the fallback) the Sidebar does not render.
if you want to change the defaults for new webs you can do this in the _default web.
I recently used shinyBS to create a modal window, as in
bsModal(id, title, trigger, ..., size)
The size argument is either 'small' or 'large' (or absent).
As you can see, even the large window is pretty small and things get packed in pretty tightly:
Is there any possible hack anyone out there has found that can help to customize the size of the window?
I know this topice is old but since I found a solution I post it for the person going here to find an answer.
You can do it by changing the CSS style. At the begging of your app just precise :
.modal-lg {
width: 4000px;
}
or
.modal-lg {
width: 95%;
}
To change the size of the size = "large"argument in the modal or
.modal-sm {
width: 40px;
}
to change for the small one. Of course change the px to change the size as you want to.
In your application, put the code here to have it available for your app:
dashboardBody(
tags$head(tags$style(HTML('
.modal-lg {
width: 4000px;
}
'))),
#ALL YOUR APP GOES HERE
)
Does anybody know how to change the size of the fonts appearing in tags of the tag-it plug in? I went over the stylesheet but it does not seam obvious to me how to do it.
It is in the color specifc css file, tagit-stylish-yellow.css for example.
Look for
ul.tagit { cursor: text; font-size: 14px; color: #333; }
and change the font-size.
I found this by going to the demo site in Chrome, start the inspector by pressing F12, selecting the tag and looking at the css directives that affect it.