i have to reduce size of pagination icons and fonts in order to fit into a slickgrid
attached screenshot for ref-
enter image description here
Changing the CSS style of the Pagination buttons is not going to help much, it will barely give you back couple of pixels, if you want to do that then I added a couple more SASS variables if you want to play with them
with SASS, you can lower these 2 variables (defaults are shown below, for more take a look at all the SASS variables)
$pagination-button-height: 32px; // around 28px
$pagination-button-padding: 6px 12px; // around 4px 8px
Another thing you could maybe try is to change the English translation for "items per page" and remove the word "items" (via Translations (Wiki) or Locale File (Wiki) file depending on what you use).
{
"ITEMS_PER_PAGE": "items per page" // --> "per page"
}
The last option would be to create your own Custom Pagination but that would require much more effort but someone did just that and you can see it in this Example - Custom Pagination
Related
I would like to scale an image that is saved in Shared Components so that the right side of it is exactly on the right end of the screen.
How is that possible?
I am using Oracle APEX 5.1.
I am assuming you are displaying the image in a Display Image page item.
In the item properties, under Advanced, set the Custom Attributes property to:
style="width: 100%"
This screenshot shows two Display Image items based on the same small picture (held as a static application file). The second has the style property:
See my demo page on apex.oracle.com
Alternatively, this could be done using CSS defined in a file or in page inline CSS like this:
#P123_MY_IMAGE_ITEM {
width: 100%;
}
Or you could set the item's CSS Classes property to e.g. "full-width" and define the CSS as:
.full-width {
width: 100%;
}
This is probably the best option if you will do this to many images.
Is there a way in Oracle Apex to have report tables have a different color for every other row? For example, like this. Colors would alternate for readability (the user would better know which line he/she is reading).
You can always include CSS in you oracle apex application. To show you how simple it can be done. See sample here
Easy Way
Edit your page
In CSS -> Inline section enter code:
table.apexir_WORKSHEET_DATA tr.odd td {
background-color: #def !important;
border-bottom: 1px solid #cef !important;
}
Now you can take it to new level adding custom css to you application. See here how to.
In several of my mvc pages, I have disable certain fields like textarea and input boxes with the "disabled" attribute that are uneditable fields. But users are complaining about the text/font being hard to read. It looks blurred and too light.
Anyone have recommendation to make diabled fields more readable?
Well, you can use CSS style for that. I suggest you to use the :disabled selector.
As an example, you can do something like this to change the color for example :
input:disabled { color: #FF0000; background: #ccc; }
You can find a good tutorial here.
I am using DOMPDF library to generate invoices dynamically. My use-case scenario is to leave around 3 inches of space on top of each page. On the first page i created it using a blank div with appropriate height.
Now on second page, it doesn't take the required height from very beginning for obvious reasons. any suggestions?
Instead of spacer divs just set the page margins in css with:
#page { margin-top: 3in; }
If I open the following HTML e-mail in Gmail or Outlook it renders as it should:
<img src="img.png" />
However, if I open it in Outlook and then forward it to Gmail, it adds extra garbage HTML that makes the area taller than it should be (the 'p' tag is responsible for the added height - 3px specifically):
<p class="MsoNormal">
<span style="font-size:10.0pt">
<img src="img.png">
<u></u>
<u></u>
</span>
</p>
There are lots of solutions for fixing spacing issues in Gmail, like adding display:block to the image, setting the font-size and line-height to 0, etc. I've tried over a dozen methods and none have worked because of behind the scenes HTML modification that I have no control over - styles and attributes getting stripped, tags with their own properties getting added, etc.
Is there is a work around to allow the original formatting to always be preserved? I will gladly provide any additional details needed, just let me know.
There is no fix for this, but there are ways to limit and hide the size of the separation. I'll refer to it as separation, but it is really the top cell expanding due to Outlook applying the mso-normal p tag. Here is a related article.
Between tables creates a bigger gap (about 15px) than between table rows (2px). It is more complex, but try and put everything that you can't afford separating into one big table. Colspans and rowspans can be complex, but they work if set up correctly.
To hide the separation, wrap all the tables in a master-content table with the bgcolor set. For example, make one big content pane set to white. When sending from Outlook, all your child tables will then move, but the gaps will remain white, stopping unwanted lines appearing in your email body.
A trick for footers - As the last child table of your main white panel, when this separates, it will create a white line underneath it. Either remove the footer table from the main panel or set the cell bgcolor to the same as your email background to hide this separation.
I managed to change this situation by changing the MsoNormal class
<style>
td p.MsoNormal {margin: -4px !important}
/* ou */
.MsoNormal {
margin: -4px !important;
}
</style>