Follow us on Twitter X-Cart on Facebook Wiki
Shopping cart software Solutions for online shops and malls

Login & Email subscribe input box color change?...where?

 
Reply
   X-Cart forums > X-Cart 4 > Dev Questions > Changing design
 
Thread Tools Search this Thread
  #1  
Old 12-22-2004, 02:33 PM
 
prai prai is offline
 

Member
  
Join Date: Sep 2004
Posts: 28
 

Default Login & Email subscribe input box color change?...where?

I feel rather stupid asking this. I have spent the last 2 days modifying my xcart store which is running version 4.0.8.

Had no probems with most of the customizations that I have done but am stuck with the following......

On my stores front page within the authenication area (where a customer would login with their username/password), I want to be able to change the background color of the input boxes? right now its an ugly greeny color, the same also applies to the subscribe email dialog box.

I've checked in the css.file...but could not find an option to change this..

Can any resident x-cart god help me with this...i'd really apprieciate it alot.

Peter
__________________
Peter
version 4.0.17
Reply With Quote
  #2  
Old 12-22-2004, 02:47 PM
 
balinor balinor is offline
 

Veteran
  
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 

Default

Unless you have changed it, that is the VertMenuBox style in skin1.css. Change the background-color attribute if you want to modify the color.

The two templates you want to modify if you want to change the style are auth.tpl and authbox.tpl. Have fun!
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #3  
Old 12-22-2004, 04:50 PM
 
prai prai is offline
 

Member
  
Join Date: Sep 2004
Posts: 28
 

Default Login & Email subscribe input box color change?...where?

Thanks Ryan for your reply...

I had not changed the VertmenuBox at all during my customizations.

I have even editied my skin1.css file and changed every colour to a uniform white...#FFFFFF, and guess what i still see the ugly green background in the login and password dialog boxes....everything else is white?

I should mention that I am using the flexy_rectangles_auto skin from xcart as the base skin (not sure if this is the problem), which i am modifying.

I have included the contents of the css.file below. I have not made any changes to the auth.tpl or authbox.tpl

Am very perplexed...where else could these dialog be getting the color information from??


My Skin1.css file below

BODY,DIV,TH,TD,P,INPUT,SELECT,TEXTAREA,TT {
FONT-FAMILY: Verdana, Arial, Helvetica, Sans-serif;
COLOR: #000000; FONT-SIZE: 11px;
}
A:link {
COLOR: #330000; TEXT-DECORATION: none;
}
A:visited {
COLOR: #330000; TEXT-DECORATION: none;
}
A:hover {
COLOR: #550000; TEXT-DECORATION: underline;
}
A:active {
COLOR: #330000; TEXT-DECORATION: none;
}
H1 {
FONT-SIZE: 15px;
}
H2 {
FONT-SIZE: 13px;
}
H3 {
FONT-SIZE: 12px;
}
HR {
COLOR: #DDDDDD; HEIGHT: 1px;
}
BODY {
margin:0 px; BACKGROUND-COLOR: #FFFFFF
}
.HeadBox {
BACKGROUND-COLOR: #FFFBD3;
}
.HeadText {
FONT-SIZE: 12px; FONT-WEIGHT: bold;
}
.HeadLine {
BACKGROUND-COLOR: #FFD44C;
}
.VertMenuBox {
BACKGROUND-COLOR: #FFFFFF;
}
.VertMenuBorder {
BACKGROUND-COLOR: #00FF48;
}
.VertMenuTitle {
BACKGROUND-COLOR: #00FF48; COLOR: #330000; FONT-WEIGHT: bold;
}
.VertMenuItems{
COLOR: #330000; TEXT-DECORATION: none;
}
.VertMenuItems:link {
COLOR: #330000; TEXT-DECORATION: none;
}
.VertMenuItems:visited {
COLOR: #330000; TEXT-DECORATION: none;
}
.VertMenuItems:hover {
COLOR: #550000; TEXT-DECORATION: underline;
}
.VertMenuItems:active {
COLOR: #330000; TEXT-DECORATION: none;
}
.VertMenuHr {
COLOR: #999999;
}
.CategoriesList {
FONT-SIZE: 12px;
}
.DialogBox {
BACKGROUND-COLOR: #FFFFFF;
}
.DialogBorder {
BACKGROUND-COLOR: #1F8600;
}
.DialogTitle {
BACKGROUND-COLOR: #475C74; COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.NumberOfArticles {
COLOR: #000000; FONT-WEIGHT: bold;
}
.TopLabel {
COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.Text {
COLOR: #000000;
}
.DecorTr {
COLOR: #3895AC;
}
.AdminSmallMessage {
COLOR: #FF3300;
}
.AdminTitle {
COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.Line {
BACKGROUND-COLOR: #FF6600;
}
.ProductTitle {
COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductTitleHidden {
COLOR: #666666; FONT-WEIGHT: bold; FONT-SIZE: 11px;
}
.ProductDetailsTitle {
COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductDetails {
COLOR: #000000;
}
.ProductPriceTitle {
COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPriceConverting {
COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPrice {
COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPriceSmall {
COLOR: #FF3300; FONT-WEIGHT: bold;
}
.MarketPrice {
FONT-SIZE: 14px; FONT-FAMILY: Times New Roman;
}
.ItemsList {
COLOR: #330000; FONT-WEIGHT: bold;
}
#Disabled {
COLOR: #909090;
}
.NavigationPath {
COLOR: #6A6A6A; TEXT-DECORATION: none;
}
.NavigationPath:link {
COLOR: #6A6A6A; TEXT-DECORATION: underline;
}
.NavigationPath:visited {
COLOR: #6A6A6A; TEXT-DECORATION: underline;
}
.NavigationPath:hover {
COLOR: #6A6A6A; TEXT-DECORATION: none;
}
.NavigationPath:active {
COLOR: #6A6A6A; TEXT-DECORATION: underline;
}
.NavigationDelim {
COLOR: #ED7300;
}

.FormButton {
COLOR: #330000; FONT-WEIGHT: bold;
}
.Button {
FONT-FAMILY: Tahoma,Arial;
BACKGROUND: URL(images/custom/butbg.gif);
BACKGROUND-COLOR: #766E19;
COLOR: #FFFFFF; FONT-WEIGHT: bold;
FONT-SIZE: 11px;
TEXT-DECORATION: none;
}
.CustomerMessage {
COLOR: #FF3300; FONT-WEIGHT: bold;
}
.ErrorMessage {
COLOR: #FF3300; FONT-WEIGHT: bold;
}
.Star {
COLOR: #FF0000;
}
.HighLight {
BACKGROUND-COLOR: #FFFFCC;
}
.SaveMoneyLabel {
COLOR: #FFFFFF; FONT-WEIGHT: bold;
}
.TableHead {
BACKGROUND-COLOR: #CCCCCC; FONT-WEIGHT: bold;
}
.TableSubHead {
BACKGROUND-COLOR: #EEEEEE;
}
.TableLine {
BACKGROUND-COLOR: #F0F0F0;
}
.SmallNote:link {
COLOR: #7C4C00; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:visited {
COLOR: #7C4C00; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:hover {
COLOR: #7C4C00; TEXT-DECORATION: underline; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:active {
COLOR: #7C4C00; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallText {
COLOR: #7C4C00; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.Bottom {
BACKGROUND-COLOR: #800000; COLOR: #FFFFFF; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.Tab {
BACKGROUND-COLOR: #465D78;
FONT-WEIGHT: bold;
TEXT-TRANSFORM: uppercase;
}
.CatMenuItemOff
{
BACKGROUND-COLOR: transparent;
BORDER-RIGHT: none; /* like "VertMenuBox" */
BORDER-TOP: none; /* like "VertMenuBox" */
BORDER-LEFT: none; /* like "VertMenuBox" */
BORDER-BOTTOM: none; /* like "VertMenuBox" */
MARGIN-BOTTOM: 1px;
MARGIN-TOP: 1px;
MARGIN-LEFT: 2px;
MARGIN-RIGHT: 3px;
CURSOR: pointer;
}
.CatMenuItemOffExp
{
BACKGROUND-COLOR: #ABB8C8;
BORDER-RIGHT: none; /* like "VertMenuBorder" */
BORDER-TOP: none; /* like "VertMenuBorder" */
BORDER-LEFT: none; /* like "VertMenuBorder" */
BORDER-BOTTOM: none; /* like "VertMenuBorder" */
MARGIN-BOTTOM: 1px;
MARGIN-TOP: 1px;
MARGIN-LEFT: 2px;
MARGIN-RIGHT: 3px;

CURSOR: pointer;
}
.CatMenuItemOn
{
BACKGROUND-COLOR: #ABB8C8; /* like "VertMenuTitle" */
BORDER-RIGHT: none; /* like "VertMenuBorder" */
BORDER-TOP: none; /* like "VertMenuBorder" */
BORDER-LEFT: none; /* like "VertMenuBorder" */
BORDER-BOTTOM: none; /* like "VertMenuBorder" */
MARGIN-BOTTOM: 1px;
MARGIN-TOP: 1px;
MARGIN-LEFT: 2px;
MARGIN-RIGHT: 3px;
COLOR: #FFFFFF;
CURSOR: pointer;
}
.CatSubMenu
{
BACKGROUND-COLOR: #465D78; /* like "VertMenuBox" */
BORDER-RIGHT: #465D78 1px solid; /* like "VertMenuBorder" */
BORDER-TOP: #465D78 1px solid; /* like "VertMenuBorder" */
BORDER-LEFT: #465D78 1px solid; /* like "VertMenuBorder" */
BORDER-BOTTOM: #465D78 1px solid; /* like "VertMenuBorder" */
MARGIN-LEFT: 1px;
MARGIN-RIGHT: 2px;
}
.CatMenuItem
{
FONT-SIZE: 12px;
FONT-FAMILY: Arial;
CURSOR: pointer;
}
.CatMenuItem:link
{
COLOR: #330000; /* like "VertMenuItems" */
}
.CatMenuItem:visited
{
COLOR: #330000; /* like "VertMenuItems" */
}
.CatMenuItem:hover
{
COLOR: #330000; /* like "VertMenuTitle" */
}
.CatMenuItem:active
{
COLOR: #330000; /* like "VertMenuItems" */
}
.NavDialogTitle {
font-size: 11px;
font-weight: bold;
color: #330000;
}
.NavDialogBorder {
background-color: #FFCC33;
}
.NavDialogBox {
background-color: #FFFFCC;
}
.PopupHelpLink {
FONT-SIZE: 9px;
COLOR: #330000;
TEXT-DECORATION: none;
}
.SubHeader2 {
COLOR: #666666;
font-size: 11px;
FONT-WEIGHT: bold;
}
.SubHeader2Line {
BACKGROUND-COLOR: #CCCCCC;
}

/* The following styles are related to "Neon Lights-2" skin */

.HeadWelcome {
COLOR: #616A79; FONT-SIZE: 12px; FONT-WEIGHT: bold; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.InfBarPhones {
COLOR: #FFFFFF; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.SpeedBar:link {
COLOR: #000000; FONT-SIZE: 10px; FONT-WEIGHT: bold; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.SpeedBar:visited {
COLOR: #000000; FONT-SIZE: 10px; FONT-WEIGHT: bold; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.SpeedBar:hover {
COLOR: #000000; FONT-SIZE: 10px; FONT-WEIGHT: bold; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.SpeedBar:active {
COLOR: #000000; FONT-SIZE: 10px; FONT-WEIGHT: bold; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.Search {
COLOR: #D9D9D9; FONT-SIZE: 11px; FONT-WEIGHT: bold; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.AdvSearch:link {
COLOR: #D9D9D9; FONT-SIZE: 9px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif; TEXT-DECORATION: underline;
}
.AdvSearch:visited {
COLOR: #D9D9D9; FONT-SIZE: 9px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif; TEXT-DECORATION: underline;
}
.AdvSearch:hover {
COLOR: #D9D9D9; FONT-SIZE: 9px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif; TEXT-DECORATION: none;
}
.AdvSearch:active {
COLOR: #D9D9D9; FONT-SIZE: 9px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif; TEXT-DECORATION: underline;
}
.MainDelimiter {
BACKGROUND-COLOR: #CACACA;
}
.MenuTitle {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.MenuTitleLink:link {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.MenuTitleLink:visited {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.MenuTitleLink:hover {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.MenuTitleLink:active {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.MenuTitleBg {
BACKGROUND-COLOR: #127DEA;
}

.CategoriesList2:link {
COLOR: #424242; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.CategoriesList2:visited {
COLOR: #424242; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.CategoriesList2:hover {
COLOR: #424242; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.CategoriesList2:active {
COLOR: #424242; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.MainImageBackground {
BACKGROUND-COLOR: #030F1E; BACKGROUND-REPEAT: no-repeat;
}
.BackgroundNoRepeat {
BACKGROUND-REPEAT: no-repeat;
}
.BackgroundRepeatX {
BACKGROUND-REPEAT: repeat-x;
}
.BackgroundRepeatY {
BACKGROUND-REPEAT: repeat-y;
}
.BodyFill {
BACKGROUND-COLOR: #FFFFFF;
}
.BottomLink:link {
COLOR: #9299A5; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.BottomLink:visited {
COLOR: #9299A5; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.BottomLink:hover {
COLOR: #9299A5; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.BottomLink:active {
COLOR: #9299A5; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.WelcomeTitleTop {
BACKGROUND-COLOR: #475C74; BACKGROUND-REPEAT: repeat-x;
}
.WelcomeTitle {
BACKGROUND-COLOR: #475C74; COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.WelcomeBox {
BACKGROUND-COLOR: #FFFFFF; BACKGROUND-REPEAT: repeat-y;
}

.DialogTitle_green {
BACKGROUND-COLOR: #766E19; COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.VertMenuBox_green {
BACKGROUND-COLOR: #EBDDA8; BACKGROUND-REPEAT: repeat-y;
}

.left_MenuTitle {
BACKGROUND-COLOR: #21205F; COLOR: #ffffff; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.left_MenuTitleLink:link {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.left_MenuTitleLink:visited {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.left_MenuTitleLink:hover {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.left_MenuTitleLink:active {
COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.left_MenuBorder {
BACKGROUND-COLOR: #FFFFFF;
}
.AuthMenuText {
COLOR: #21205F; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.AuthMenuLink:link {
COLOR: #21205F; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.AuthMenuLink:visited {
COLOR: #21205F; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.AuthMenuLink:hover {
COLOR: #FEEFD0; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.AuthMenuLink:active {
COLOR: #FFFFFF; FONT-SIZE: 11px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
.MiniCartHR {
COLOR: #7E7621;
}
.AuthInp {
BORDER-RIGHT: #FFFFFF 1px solid; BORDER-TOP: #FFFFFF 1px solid; FONT-SIZE: 11px; BORDER-LEFT: #FFFFFF 1px solid; COLOR: #000000; BORDER-BOTTOM: #FFFFFF 1px solid; BACKGROUND-COLOR: #706945; COLOR: #FFFFFF;
}
.SelectLanguage {
COLOR: #D9D9D9; FONT-SIZE: 11px; FONT-WEIGHT: bold; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
}
__________________
Peter
version 4.0.17
Reply With Quote
  #4  
Old 12-22-2004, 08:02 PM
 
prai prai is offline
 

Member
  
Join Date: Sep 2004
Posts: 28
 

Default found the solution to problem

Ryan turns out the problem and answer was indeed in the css.file. as i am using the flex rectangles skin from xcart...theres a whole host of extra enteries in the css file....wrongly stated that it is for the neon 2 skin...hmm..xcart dudes you listening.

In the following snippet from the css.file change the background-color to whatever you want, and the background for the username and password dialog boxes changes.


.AuthInp {
BORDER-RIGHT: #FFFFFF 1px solid; BORDER-TOP: #FFFFFF 1px solid; FONT-SIZE: 11px; BORDER-LEFT: #FFFFFF 1px solid; COLOR: #000000; BORDER-BOTTOM: #FFFFFF 1px solid; BACKGROUND-COLOR: #FFFFFF; COLOR: #000000;

hope this helps.
__________________
Peter
version 4.0.17
Reply With Quote
Reply
   X-Cart forums > X-Cart 4 > Dev Questions > Changing design


Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -8. The time now is 01:25 PM.

   

 
X-Cart forums © 2001-2020