Im using fullCalendar 1.6.4 and am having a problem setting custom colors for the weekends and today's cell.
After some searching I found that using the following styling to set background color of the weekend cells would work:
.fc-sat, .fc-sun {
background-color: #CCCCCC;
}
But it doesn't completely. On the month view it only highlights a couple of pixels at the top and bottom of each weekend cell. in the week and day view it works better by highlighting the entire column with the exception of about 3.5 hours in the middle of the calendar. Even if i scroll the unhighlighted section remains a constant in the middle.
With regards to changing the background color of today, im using the following code:
dayRender: function (date, cell) {
var today = new Date();
if (date.getDate() === today.getDate()) {
cell.css("background-color", "#FF4D4D");
}
}
This change only works for a fraction of a second when the calendar loads, i can see the change in color very quickly before the original/standard color overrides the change.
Please advise as to what is going on and how i can fix either of these issues.
Thanks in advance,
Grant
I haven't looked into the dayRender event, but there should be no problem using plain old CSS to change the colors:
.fc-today{
background-color: green;
}
.fc-sat, .fc-sun{
background-color: yellow;
}
See jsfiddle for example, there must be something else conflicting with your styles.
Try right clicking on the day and click "Inspect Element" (on Chrome, others may vary). Look at the td with the class you are trying to style and see whats overwriting your styles.
Related
I've been trying to modify the Projects (PM301000) screen summary area to change the font color of the totals to red when it's in negative value but I can't make it work. I've tried several javascript codes and saw that this is working on a button Dynamically Change Button Color
but I can't make it work on the PXNumericEdit control specifically the totals in the Projects screen.
Projects screenshot
Any idea on how to make it work? Thank you.
You should try changing the CSS via an event handler in the aspx code behind file. See this article
How can I get the visible date interval in AnyGantt? I need to add two buttons to move back and forth the gantt, but I can't find how to do it. I was thinking on reading current start and end dates and then zooming the gantt to the new values...
Thanks.
I'm glad to inform you that new version of AnyGantt 8.1.0 provides new methods to get max and min of visible range.
You may learn more about them and find example on the following page
Mendi,
In this case zooming the gantt to the new values is one of available ways to do it.
Check this example which demonstrates using html buttons and zoomTo() method to scroll timeline :
https://jsfiddle.net/Shestac92/9zzhw472/3/
chart.zoomTo(start, end);
Also you may use out-of-the-box method to add similar buttons to horizontal scroll bar, check example in Anychart Playground:
https://playground.anychart.com/api/7.14.3/core/ui/anychart.core.ui.ScrollBar.buttonsVisible-plain
scrollBar.buttonsVisible(true);
Hope this will help you!
DataViews really provide almost everything I want in Xpages views EXECPT that I cannot control how extra columns appear. They are always right aligned. Is there a way to make them left aligned? I don't want a tremendous amount of space between the summary column and the extra columns.
The column sizing seems in that way, because the width of the Summary columnn is set by renderer (100% for usual dataview).
If you could remove that width: 100% style, the sizing of column would be usual.
There are a couple of ways to do that but neither is elegant.
Using CSS will not be a nice technique, but it will work. Since we can't address that specific column with a class name and width style is inline, we can define myRowStyle as the rowStyleClass for our dataview control and use the following rule:
tr.myRowStyle td { width: auto !important; }
Now, we will consider some problems of course. Any inline or CSS definition for other columns will be overridden by this rule. Also if you use any table within these columns, they will be effected too.
You can define a more specific selector for minimum side effect, but this will not work for older browsers (e.g. IE8):
tr.myRowStyle > td:nth-child(2) { width: auto !important; }
Alternative way is to write a short dojo script which finds the second TD within every row and remove width property. You might put such as a script just after the data view. For browsers with a slow connection might see a flickering on rendering stage for this case.
I'm working in a project and use LWUIT, I want to make a custom style for Combobox and Successfully after a lot of search I have made it by changing the cell renderer and the look and feel to change arrow icon
the problem now that the white space around my items I want to remove them, how can I do that please
You should start setting the padding/margin entries for various styles to 0, we changed the styles here a bit at Codename One so i don't quite recall everything but try PopupList, PopupItem, ComboBoxPopupList, etc.
I'm trying to sort out my netbeans color theme and I'm almost there apart from one annoying highlight I can't seem to find anywhere! It only shows it self in HTML and CSS that I have seen so far!
Its the highlighting that happens when you click on an Id or class value for html elements, or elements in css
Have a look at the picture below and see if you can identify the option that defines the highlight below!
It appears to be the Cascading Style Sheet color for Mark Occurrences.
Tools|Options|Fonts & Colors, Select Language: Cascading Style Sheet, Select Category: Mark Occurrences.
It appears to be related to (but not exactly the same as) NetBeans bug 189963, and may be worth noting on that bug that the highlight color suffers the same problem as the base color.
BTW, When I changed the color value for that one and clicked on OK, it did not immediately update the editor window. I had to select something else for it to mark occurrences of, and as soon as I did that I saw the new color.