Jump to content
TNG Community
Figi4

How to change color of Calendar year date?

Recommended Posts

Figi4

I am using template 13 on TNG version 12.1 if that means anything.  I am trying to figure out what to change in order for the Calendar to display the year in a different color.  As you can see in my attachment, the year that appears next to the person's name is in white and barely visible.  

I opened the css titled Calendar.css and thought it would be an easy find.  But I cannot figure out which line to change.  I tried adding a line to the acal.Event, but that did not seem to change it.

 

/* calendar */
#calHeader {
	font-size: 14pt;
	font-weight: bold;
	text-align: center;
}

#calLegend {
	background-color:#D6E7FF;
	border: 1px solid #5576BE;
	font-size: 9pt;
	font-weight: bold;
	margin-top: 8px;
	padding: 4px;
	text-align: center;
}

#calWrapper {
	width: 100%;
}

a.calDate {
	color: #000;
	float: left;
	font-size: 11pt;
	font-weight: bold;
}

a.calMore {
	font-size: 8pt;
	line-height: 24px;
	margin-left: 16px;
}

a.calEvent {
	font-size: 8pt;
}

a.hidden {
	background-color:silver;
	font-style:italic;
	padding:2px;
}

a.nothidden {
	padding:2px;
}

div.calEvents {
	margin-left: 16px;
	position: relative;
	top: -14px;
}

div.calKey {
	margin: 8px;
	font-weight: bold;
}

img.calIcon {
	margin: 2px;
	position: relative;
	top: 2px;
}

table.calTip {
	background-color: #fff;
	border: 1px solid #5576BE;
	padding: 0;
}

table.calendar {
	background-color: #eee;
	border: 1px solid #6687CD;
	margin: 4px 0px;
}

td.calDay {
	background-color: #fff;
	border-top: 1px solid #5576BE;
	border-left: 1px solid #5576BE;
	border-bottom: 2px solid #5576BE;
	border-right: 2px solid #5576BE;
	height: 110px;
	margin: 4px;
	padding: 2px;
	text-align: left;
	vertical-align: top;
	width: 14%;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}

th.calDay {
	font-size: 10pt;
	font-weight: bold;
	text-align: center;
}

td.calSkip {
	height: 110px;
	width: 14%;
}

td.calToday {
	background-color:#FFF5E4;
	border-top: 1px solid #5576BE;
	border-left: 1px solid #5576BE;
	border-bottom: 2px solid #5576BE;
	border-right: 2px solid #5576BE;
	height: 110px;
	margin: 4px;
	padding: 2px;
	text-align: left;
	vertical-align: top;
	width: 14%;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}

li.flat {
	display: inline;
	list-style: none;
	margin: 0px 8px;
}

ul.flat {
	display: inline;

Thank you

Calendar Year.JPG

Share this post


Link to post
Share on other sites
Newfloridian

Not sure if I can help much here. I don't look at the Calendar that often. However, when looking at the Calendar on my website this morning, mine doesn't display a date in any colour - let alone white. I still use TNG 10.1.3 The calendar appears to have been incorporated into TNG  in version 8.

calendar.php on my site includes the following comment:

/*
 * tngCalendar - An addon calendar for TNG
 * http://www.tngforum.us/index.php?showtopic=779
 *
 * @author CJ Niemira <siege (at) siege (dot) org>
 * @copyright 2006,2008
 * @license GPL
 * @version 2.0
 */

Might be worth checking your own to see if there have been any later mods added since this one.

Alan

 

 

 

 

Share this post


Link to post
Share on other sites
klooster

The displayed year does not have a unique class or id in the calendar css. There is a #text Id in calendar css, but that only defines the height and with of the rectangle wherein the year is displayed, not the text itself.

Share this post


Link to post
Share on other sites
cfj

You can try to add something like this in mytngstyle.css:

.calEvents{color:blue!important; font-size:14px!important;}

Tested in Firefox Web Developer

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×