I can't seem to find a way to style the page buttons on a dashboard table. I want to make the page buttons at the bottom of the table bigger if that is possible?
you can try increasing the font-size
add the following CSS...
.google-visualization-table-page-number {
font-size: 16px !important;
}
Related
I want to create custom Full screen Loader component in Ionic2. But my modal div do not cover the header/navbar area. I want it to be like Ionic LoadingComponent covering everything in my app and also have my template variable. Please have a look at image.
My modal css is
#modal{
width: 100%;
height:100%;
position: absolute;
z-index: 100;
background: red;
top: 0px;
left: 0;
}
Please help.
EDIT
My ModalPage has navbar
<ion-header>
<ion-navbar primary>
<button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Hello Ionic</ion-title>
</ion-navbar>
</ion-header>
EDIT
I found a workaround for this. I just use Ionic2 Popover, Popover gives 100% width+height, full screen. I called the modal popover on button click and dismiss it on 100% download.
You don't need that style rule to make the modal be fullscreen. Please take a look at this plunker.
Like you can se there, the HomePage contains a navbar, but the ModalPage html code is just
<ion-content></ion-content>
With that, and just changing the background-color
ion-page.modal-page ion-content {
background-color: red;
}
The modal should be fullscreen, without showing a navbar.
I have a fixed menu, I always want it at the top of my page:
.fixed-menu{
position: fixed;
height: 75px;
width: 100%;
background: tomato;
}
I also want an off canvas menu.
The problem I am having is that when you open the off canvas menu, the fixed menu is no longer fixed.
After playing with the issue, it's something to do with 3d transform, but I cannot find a fix.
Here is a JSFiddle
If you do it this way, the page is essentially locked when the menu is open http://codepen.io/rafibomb/pen/hApKk
Basically wrapping the content and making it overflowY: scroll;
article {
overflow-y: auto;
}
For number based fields in django a incrementor widget is placed to the righ in each textbox. How can I remove this?
Apparently it is an html5 thing and is called a spinner. It can be solved with this css:
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
/* display: none; <- Crashes Chrome on hover */
-webkit-appearance: none;
margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
Referenced from: Can I hide the HTML5 number input’s spin box?
I am quite new to zurb, infact just found it yesterday. I am liking it so far, but I can't seem to figure out something simple. I can do this using css but I wanted to know if there is another out-of-the-box approach to this.
I want to be able to set the width and height of a text area. The way it is on this fiddle.
http://jsfiddle.net/bwZbh/
`<textarea id="content" placeholder="Nothing yet!!" class="large-12" style="margin: 0px -275.672px 0px 0px; height: 319px; width: 580px;"
it's a small bug in foundation
open up your css, and add the following
textarea {
height: auto;
}
then you will be able to style your textarea as you wish, and rows will work as well
example
<textarea rows="5" name="textareaname" cols="50"></textarea>
UPDATE:
This bug is now fixed in Foundation 5
I'm trying to customize the facebook like box, and I need to alter the image size slightly. I've been reading around and it seems to be difficult. Does anyone know a way?
You can change the css by adding your own style for
.connect_widget .connect_widget_image{
width: ##px !important;
height: ##px !important;
}
and also
.connect_widget .connect_widget_sample_connection{
width: ##px !important;
}
Did not try but that how I would do it.
Although I think it's not very recommended to change CSS of like button...