7 replies [Last post]
FASTraining
FASTraining's picture
Offline
newbie
Everywhere
Last seen: 9 years 26 weeks ago
Everywhere
Timezone: GMT-4
Joined: 2013-05-07
Posts: 7
Points: 9

I cannot seem to locate where to change the font color for the blog comment form when a user is going to make a comment on a blog post on a site made in weebly. http://www.fitandshreddedtraining.com/fitness-blog.html

I can manipulate most other text attributes but not in this form and the headings are black like the page so a user cannot see what they are being prompted to enter. Here is the full CSS code:

/* Resets
--------------------------------------------------------------------------------*/
 
ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote, fieldset, input {
	margin: 0;
	padding: 0;
}
 
a img {
	border: 0;
}
 
a {
	color: #7eaaa2;
	text-decoration: none;
}
 
a:hover {
	color: #377e71;
}
 
/* General Styling and Structure
--------------------------------------------------------------------------------*/
 
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #272822;
	background: #000000;
	margin: 0;
	padding: 0;
}
 
h2 {
	font-size: 1.6em;
	margin: 0;
	padding: .3em 0;
	line-height: 1.2;
	font-family: "Belgrano", Arial, Helvetica, sans-serif;
	font-weight: normal;
	-webkit-text-stroke-width: 0.3px;
}
 
#content h2 {
	color: #9aaaa7;
}
 
p {
	font-size: 1em;
	line-height: 1.5;
	margin: 0;
	padding: .5em 0;
}
 
blockquote {
	font-style:italic;
	border-left:4px solid #7eaaa2;
	margin:10px 0 10px 0;
	padding-left:20px;
	line-height:1.5;
	color:#888;
}
 
 
#content p {
	color: #797979;
}
 
#content abbr {
	border-bottom: 1px dotted #8f8f8f;
}
 
#page {
	margin: 0 auto;
	width: 960px;
}
 
#main-wrap {
  margin: 0 auto;
  width: 960px;
}
 
#header-wrap,
 
#main-wrap,  {
}
 
#footer-wrap, 
 
#header-wrap {
	background: #ffffff;
}
 
#header {
	padding: 0 0 0 25px;
	margin: 0 0 7px;
}
 
.wsite-logo,
.wsite-logo a {
	color: #fff;
	margin: 0;
	padding: 0;
	text-decoration: none;
}
 
.wsite-logo,
.wsite-logo a:hover {
	color: #fff;
}
 
#header .wsite-logo {
	font-size: 36px;
	color: #fff;
	margin: 0;
	font-weight: normal;
	padding: 0;
	float: left;
	font-family: "Baumans", Arial, Helvetica, sans-serif;
	-webkit-text-stroke-width: 0.3px;
}
 
#header-right a {
	color: #7eaaa2;
}
 
#header-right a:hover {
	color: #78cfbf;
}
 
/* Header Area
----------------------------------------------------------------------------*/
 
#header {
	width: 100%;
	height: 78px;
}
 
#header,
#header table {
	border-collapse: collapse;
	border-spacing: 0;
}
 
#header td {
	vertical-align: middle;
	text-align: left;
}
 
#logo {
	padding: 25px 0;
	text-shadow: 0 0 1px rgba(255, 255, 255, 0.3);
}
 
#header-right {
	padding: 0 0 0 5px;
}
 
#header-right table {
	float: right;
	width: 1px;
}
 
#header-right td {
	padding: 0;
}
 
/* TOP RIGHT: Phone Number
--------------------------------------------------------------------------------*/
 
#header-right .phone-number .wsite-text {
	color: #858585;
	font-size: 12px;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	display: block;
	white-space: nowrap;
	margin: 1px 0 0 15px;
}
 
/* TOP RIGHT: Social Links
--------------------------------------------------------------------------------*/
 
#header-right .wsite-social {
	vertical-align: middle;
	margin: 1px 0 0 12px;
}
 
.wsite-social-item {
	width: 20px;
	height: 20px;
	margin: 0 0 0 3px;
	background-image:url(social-slate.png);
}
 
.wsite-social-facebook {background-position:0 0;}
	.wsite-social-facebook:hover {background-position:0 -20px;}
	.wsite-social-facebook:active {background-position:0 -40px;}
.wsite-social-pinterest {background-position:-20px 0;}
	.wsite-social-pinterest:hover {background-position:-20px -20px;}
	.wsite-social-pinterest:active {background-position:-20px -40px;}
.wsite-social-twitter {background-position:-40px 0;}
	.wsite-social-twitter:hover {background-position:-40px -20px;}
	.wsite-social-twitter:active {background-position:-40px -40px;}
.wsite-social-linkedin {background-position:-60px 0;}
	.wsite-social-linkedin:hover {background-position:-60px -20px;}
	.wsite-social-linkedin:active {background-position:-60px -40px;}
.wsite-social-mail {background-position:-80px 0;}
	.wsite-social-mail:hover {background-position:-80px -20px;}
	.wsite-social-mail:active {background-position:-80px -40px;}
.wsite-social-rss {background-position:-100px 0;}
	.wsite-social-rss:hover {background-position:-100px -20px;}
	.wsite-social-rss:active {background-position:-100px -40px;}
.wsite-social-flickr {background-position:-120px 0;}
	.wsite-social-flickr:hover {background-position:-120px -20px;}
	.wsite-social-flickr:active {background-position:-120px -40px;}
.wsite-social-plus {background-position:-140px 0;}
	.wsite-social-plus:hover {background-position:-140px -20px;}
	.wsite-social-plus:active {background-position:-140px -40px;}
.wsite-social-vimeo {background-position:-160px 0;}
	.wsite-social-vimeo:hover {background-position:-160px -20px;}
	.wsite-social-vimeo:active {background-position:-160px -40px;}
.wsite-social-yahoo {background-position:-180px 0;}
	.wsite-social-yahoo:hover {background-position:-180px -20px;}
	.wsite-social-yahoo:active {background-position:-180px -40px;}
.wsite-social-youtube {background-position:-200px 0;}
	.wsite-social-youtube:hover {background-position:-200px -20px;}
	.wsite-social-youtube:active {background-position:-200px -40px;}
 
 
/* TOP RIGHT: Search Box
--------------------------------------------------------------------------------*/
 
#header-right .search {
}
 
#header-right .wsite-search {
	margin: 0 0 0 15px;
	vertical-align: middle;
}
 
#header-right .wsite-search-input {
	width: 137px;
	height: 16px;
	border: none;
	padding: 8px 7px 8px 10px !important;
	color: #585858;
	font-size: 12px;
	background: url(input-bg-slate.png) no-repeat;
}
 
#header-right .wsite-search-button {
	position: relative;
	width: 26px;
	height: 32px;
	color: #010101;
	font-size: 12px;
	border: none;
	margin: 0;
	padding: 0;
	background: url(submit-bg-slate.png) no-repeat;
}
 
/* Navigation
--------------------------------------------------------------------------------*/
 
#nav-wrap {
	background: #ececec url(nav-bg.png) repeat-x;
	margin: 0 0 7px;
}
 
#topnav {
	clear: both;
}
 
#topnav ul {
	list-style: none;
	float: left;
}
 
#topnav ul li {
	list-style: none;
	float: left;
}
 
#topnav a {
	float: left;
	display: block;
	color: #7a7a7a;
	text-decoration: none;
	font-family: 'Brawler', Arial, Helvetica, sans-serif;
	padding: 13px 13px 12px;
	border: 0;
	outline: 0;
	list-style-type: none;
	font-size: 1.1em;
	text-transform: uppercase;
}
 
#topnav li#active a,
#topnav a:hover {
	color: #fff;
	background: #acbcb9;
	border: 0;
}
 
/****************************** flyout menus ******************************/
 
#wsite-menus .wsite-menu li a {
	font-family: Arial, Helvetica, sans-serif;
	padding: 10px;
	color: #acbcb9;
	background: #272727;
	border: 0;
	border-bottom: 1px solid #272727;
}
 
#wsite-menus .wsite-menu li a:hover {
	color: #fff;
	background: #4f4f4f;
	border-bottom: 1px solid #343434;
}
 
/* main  */
 
#main-wrap {
}
 
#main {
}
 
#content {
	min-height: 400px;
	padding: 35px 0;
}
 
#banner {
	position: relative;
}
 
/* PAGE TYPE: banner-tall
--------------------------------------------------------------------------------*/
 
.tall-header-page .wsite-header {
	width: 960px;
	height: 289px;
	background: url(banner-tall.jpg) no-repeat;
}
 
/* PAGE TYPE: banner-short
--------------------------------------------------------------------------------*/
 
.short-header-page .wsite-header {
	width: 960px;
	height: 159px;
	background: url(banner-short.jpg) no-repeat;
}
 
.no-header-page #content {
	padding-top: 15px;
}
 
/* PAGE TYPE: banner-landing
--------------------------------------------------------------------------------*/
 
.landing-page #banner {
	background: #272727;
	overflow: hidden;
}
 
#bannerleft {
	float: right;
	padding: 0;
	position: relative;
}
 
.landing-page .wsite-header {
	width: 585px;
	height: 349px;
	background: url(banner-landing.jpg) no-repeat;
}
 
.landing-banner-outer {
	display: table;
	#position: relative;
	overflow: hidden;
}
 
.landing-banner-mid {
	#position: absolute;
	#top: 50%;
	display: table-cell;
	vertical-align: middle;
}
 
.landing-banner-inner {
	#position: relative;
	#top: -50%;
}
 
#bannerright {
	float: left;
	width: 307px;
	height: 349px;
	padding: 0 32px 0 35px;
}
 
#bannerright h2 {
	color: #fff;
	font-size: 2em;
	font-family: "Belgrano", "Myriad Pro", Arial, Helvetica, sans-serif;
	padding: 0px;
	line-height: 100%;
}
 
#bannerright p {
	color: #acbcb9;
	font-size: 1em;
	padding: 20px 0px;
	line-height: 140%;
	margin: 0;
}
 
#bannerright a:hover {
	color:#fff;
}
 
#bannerright .wsite-button {
	margin: 0;
}
 
/* PAGE TYPE: splash
--------------------------------------------------------------------------------*/
 
.splash-page #header {
	width: 532px;
}
 
.splash-page #banner {
	width: 527px;
	height: 161px;
	padding: 6px 4px 4px 6px;
	background: url(banner-splash-bg.png) no-repeat;
}
 
.splash-page .wsite-header {
	width: 515px;
	height: 149px;
	background: url(banner-splash.jpg) no-repeat;
}
 
.splash-page #content-container {
	width: 528px;
}
 
.splash-page #content {
	width: 528px;
}
 
.splash-page #footer {
	width: 524px;
}
 
/* Footer
--------------------------------------------------------------------------------*/
 
#footer {
	border-top: 0px solid #ececec;
	padding: 0px 0 0px;
	font-size: 12px;
	color: #ffffff;
	font-family: Arial, Helvetica, sans-serif;
	text-align: right;
	background: #ffffff;
}
 
#footer h2 {font-size:1.3em; border-bottom:1px solid #ccc; padding:.3em 0 .5em 0;}
 
#footer blockquote {font-size:11px;}
 
#footer p {
	color: #111111;
	font-size: 12px;
}
 
#footer a {
	color: #7eaaa2;
}
 
#footer a:hover {
	color: #377e71;
}
 
#footer .wsite-social-item {
	margin-right:2px;
}
 
.wsite-footer {  /* make sure enough space between element footer and attribution */
	margin-bottom: 0px;
}
 
 
/* Form Customization
--------------------------------------------------------------------------------*/
 
.wsite-form-label {
	display: inline-block;
	color: #797979;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	padding: 12px 0 5px 0;
}
 
.form-radio-container {
	color: #797979;
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
}
 
.wsite-form-input, .wsite-search-element-input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #797979;
	background: #fff url(field.png) repeat-x;
	border: 1px solid #d4d4d4;
	padding: 8px 4px 5px !important;
	line-height: 1;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
 
.form-select {
	color: #797979;
	background: url#fff (field.png);
	border: 1px solid #d4d4d4;
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
	padding: 3px 4px;
	width: 320px;
	height: 27px;
	line-height: 27px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
 
/* Footer Form Customization
--------------------------------------------------------------------------------*/
 
.wsite-form-container {
	margin-top:0px !important;
	text-align:left;
}
 
.wsite-footer .wsite-form-label {
	font-size: 1em;
	padding: 5px 0 2px 0;
}
 
.wsite-footer .wsite-form-field {
	width:300px !important;
}
 
.wsite-footer .form-radio-container {
	font-size:1em;
}
 
.wsite-footer .wsite-form-input {
	font-size: 1em;
	width: 100% !important;
 
}
 
.wsite-footer .form-select {
	width: 100%;
}
/* Buttons
--------------------------------------------------------------------------------*/
 
/*
  Buttons are styled with background image sprites. There are 4 unique image files:
   - small & normal-colored  (button_small_grey.png)
   - large & normal-colored  (button_large_grey.png)
   - small & highlight-colored  (button_small_orange.png)
   - large & highlight-colored  (button_large_orange.png)
 
  Each of these 4 types of buttons must define a :hover state (when user's mouse is over)
  as well as an :active state (when the user presses down).
 
  Look at the CSS (especially the inner .wsite-button-inner wrapper), as well as the
  image files to understand how the liquid-width nature of these buttons work.
 */
 
/* small */
 
.wsite-button {
	color: #fff !important;
	font-family: Arial, Helvetica, sans-serif;
	height: 34px;
	display: inline-block;
	font-size: 12px;
	border: none;
	font-weight: bold;
	font-size: 13px;
	text-decoration: none;
	padding: 0 15px 0 0;
	background: url(button_slate.png) no-repeat 100% -105px;
	text-shadow:0 -1px 0 rgba(0,0,0,0.9);
}
 
.wsite-button:hover {
	background-position: 100% -140px;
}
 
.wsite-button:active {
	background-position: 100% -175px;
}
 
.wsite-button-inner {
	height: 34px;
	line-height: 34px;
	display: block;
	font-size: 14px;
	font-weight: bold;
	border: none;
	text-decoration: none;
	padding: 0 10px 0 25px;
	background: url(button_slate.png) no-repeat 0 0;
}
 
.wsite-button:hover .wsite-button-inner {
	background-position: 0 -35px;
}
 
.wsite-button:active .wsite-button-inner {
	background-position: 0 -70px;
}
 
/* large */
 
.wsite-button-large {
	height: 41px;
	background: url(button_large_slate.png) no-repeat 100% -126px;
	padding: 0 15px 0 0;
}
 
.wsite-button-large:hover {
	background-position: 100% -168px;
}
 
.wsite-button-large:active {
	background-position: 100% -210px;
}
 
.wsite-button-large .wsite-button-inner {
	height: 41px;
	line-height: 41px;
	padding: 0 10px 0 25px;
	background: url(button_large_slate.png) no-repeat 0 0;
}
 
.wsite-button-large:hover .wsite-button-inner {
	background-position: 0 -42px;
}
 
.wsite-button-large:active .wsite-button-inner {
	background-position: 0 -84px;
}
 
/* highlight */
 
/*
Making the highlighted versions of the buttons is easy because we just need
to switch out the background images. This works because the different button
states (normal, :hover, :active) have their sprite coordinates in the same places.
*/
 
.wsite-button-large.wsite-button-highlight {
	background-image: url(button_large_highlight_slate.png);
}
 
.wsite-button-large.wsite-button-highlight .wsite-button-inner {
	background-image: url(button_large_highlight_slate.png);
}
 
.wsite-button-highlight {
	background-image: url(button_highlight_slate.png);
}
 
.wsite-button-highlight .wsite-button-inner {
	background-image: url(button_highlight_slate.png);
}

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 39 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

This?

#commentPostDiv .field label {
  color: white;
  display: block;
  font: bold 13px Helvetica;
  margin: 0 0 6px;
  }

Found at common-v2.css, line 754.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

FASTraining
FASTraining's picture
Offline
newbie
Everywhere
Last seen: 9 years 26 weeks ago
Everywhere
Timezone: GMT-4
Joined: 2013-05-07
Posts: 7
Points: 9

Thanks Gary, is there any way

Thanks Gary, is there any way to add this to the main CSS sheet. I just discovered that using Weebly's limited platform only allows for one style sheet.

Stuck?

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 39 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

You can't edit or set

You can't edit or set configuration for this: cdn1.editmysite.com/editor/images/common/common-v2.css?buildTime=1369952487?

In that case, to your main stylesheet, add this:

#commentPostDiv .field label {
  color: white;
  }
If that doesn't work, this should (though it's an ugly baby, even to its mama)
#commentPostDiv .field label {
  color: white !important;
  }

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

FASTraining
FASTraining's picture
Offline
newbie
Everywhere
Last seen: 9 years 26 weeks ago
Everywhere
Timezone: GMT-4
Joined: 2013-05-07
Posts: 7
Points: 9

I cannot. I tried both

I cannot. I tried both snippets though in the Main CSS and the pic attached is still the result. The titles of the form are just too dark to make out, especially on a mobile device. I even tried taking a section of code from your link and adding it-no go. Then I tried the entire code which drastically altered the appearance of the site in a negative way.

Do you or anyone in the forum ever access sites directly?

https://skydrive.live.com/redir?resid=234E4D7E31E28C0!4479&authkey=!AHDSlVxWpSpyzxM

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 39 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

I see 5 stylesheets plus

I see 5 stylesheets plus embedded styles. Where, exactly did you put the edit?

<link rel="stylesheet" href="//cdn2.editmysite.com/css/sites.css?buildTime=1369868668" type="text/css" /><link rel='stylesheet' type='text/css' href='http://cdn1.editmysite.com/editor/libraries/fancybox/fancybox.css?1369868668' />
<link rel='stylesheet' type='text/css' href='/files/main_style.css?1369946147' title='wsite-theme-css' />
<link href='http://fonts.googleapis.com/css?family=Belgrano' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Baumans' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Brawler' rel='stylesheet' type='text/css' />
<style type='text/css'>...</style>

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

FASTraining
FASTraining's picture
Offline
newbie
Everywhere
Last seen: 9 years 26 weeks ago
Everywhere
Timezone: GMT-4
Joined: 2013-05-07
Posts: 7
Points: 9

Through the Weebly interface

Through the Weebly interface the only one it let's you make changes to is main_style.css. The code in original post is the entire code that it allows me to edit. I tried under general settings and then at the very end of the code. I also tried copying all blog related code from your post and applied to the end of the original code and attempted to make color changes.

Thanks for your help, I know these wysiwyg editors are limited but they are cost effective for initially building something.

Nick

FASTraining
FASTraining's picture
Offline
newbie
Everywhere
Last seen: 9 years 26 weeks ago
Everywhere
Timezone: GMT-4
Joined: 2013-05-07
Posts: 7
Points: 9

Cleared cache and opened new browser and...

It's working and has nice legible white text. Sorry for the confusion. I tried Shift+F5 but I am having problems with Chrome so I opened in Firefox and it looks good.

Thank you very much for all of your time and help