Notices
The Basement Non-Honda/Acura discussion. Content should be tasteful and "primetime" safe.

anyone here familiar with editing css style sheets?

Thread Tools
 
Old 09-10-2009, 09:11 AM
  #1  
spanky
I go duffy on dem bitches
Thread Starter
 
spanky's Avatar
 
Join Date: Mar 2001
Location: Gonzales, Louisiana
Posts: 28,247
Likes: 0
Received 0 Likes on 0 Posts
Default anyone here familiar with editing css style sheets?

i'm trying to do a favor for my cousin who's working on setting up a cart for a friend of hers and i'm tryign to figger out how to change some of the colors. i'd wing it if it were mine but it's for someone else so i'd rather make sure i do it right.
Old 09-10-2009, 09:12 AM
  #2  
reno96teg
Moderator
 
reno96teg's Avatar
 
Join Date: Dec 2000
Posts: 21,573
Likes: 0
Received 0 Likes on 0 Posts
Default

ask away...
Old 09-10-2009, 09:12 AM
  #3  
flipped cracka
BOOM goes the dynamite!
 
flipped cracka's Avatar
 
Join Date: Mar 2003
Location: in a van down by the rive
Posts: 27,571
Received 1 Like on 1 Post
Default

yes
Old 09-10-2009, 09:17 AM
  #4  
spanky
I go duffy on dem bitches
Thread Starter
 
spanky's Avatar
 
Join Date: Mar 2001
Location: Gonzales, Louisiana
Posts: 28,247
Likes: 0
Received 0 Likes on 0 Posts
Default

Originally Posted by reno96teg
ask away...
how

can i paste the stylesheet.css here along with the link to the store?



http://www.sgwcreations.com/store/

Code:
/*
 * Main Styles BEGIN
 */
body{
    margin: 0px;
    background-repeat: repeat-x;
    background-color: #C17bC1;
    font-family: Tahoma, Verdana;
    color: #666666;
    font-size: 11px;
    font-weight: normal;
    text-decoration: none;
}

hr.separator{
    height: 1px;
    color: #E5E5E5;
    background-color: #E5E5E5;
    border: 0px;
}

img {
    border: 0;
}

input,
textarea,
select {
    border: 1px solid gray; 
    font-family: Verdana, Arial, sans-serif;
    color: #333333;
    font-size: 11px;
    background-color: #FFEEFF;
}

input[type="checkbox"],
input[type="radio"],
input[type="image"] {
    border: 0;
    background-color: transparent;
}

input[type="button"],
input[type="submit"]{
    border: 1px solid gray; 
    font-family: Verdana, Arial, sans-serif;
    font-size: 11px;
    background-color: #DDDDDD;
}

/* Main Menu Styles */
.MainMenu{
    font-family: Tahoma, Verdana;
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
}

.MainMenu a{
    color: #ffffff;
    text-decoration: none;
}

.MainMenuHighlight{
    font-family: Tahoma, Verdana;
    color: #FB7F93;
    font-size: 12px;
    font-weight: bold;
}

.MainMenuHighlight a{
    color: #FB7F93;
    text-decoration: none;
}

/* Page Title Style */
.PageTitle {
    font-family: Tahoma, Verdana;
    color: #C63983;
    font-size: 12px;
    font-weight: bold;
    text-align: left;
}

/* Your Shopping Cart Text Style */
.ShoppingCartText{
    font-family: Tahoma, Verdana;
    color: #ffffff;
    font-size: 11px;
    font-weight: normal;
}

.ShoppingCartText a{
    color: #ffffff;
    text-decoration: none;
}

/* Required Style */
.Required {
    color: red;
}

/* Error Style */
.Error {
    color: red;
}

/* Store Closed Style */
.StoreClosedText {
    font-family: Tahoma, Verdana;
    color: #C63983;
    font-size: 16px;
    font-weight: bold;
}

/* Larger Image Text Styles */
.LargerImageLink{
    font-family: Tahoma, Verdana;
    color: #666666;
    font-size: 10px;
}

.LargerImageLink a{
    color: #666666;
    text-decoration:underline;
}

.LargerImageLink a:hover{
    color: #999999;
    text-decoration:underline;
}

/* Copyright Text Styles */
.CopyrightText{
    font-family: Tahoma, Verdana;
    color: #333333;
    font-size: 11px;
    font-weight: normal;
}

.CopyrightText a{
    color: #333333;
    text-decoration: none;
}
/*
 * Main Styles END
 */

/*
 * Category Styles BEGIN
 */
.CategoryName{
    font-family: Tahoma, Verdana;
    color: #C63983;
    font-size: 12px;
    font-weight: bold;
}

.CategoryName a{
    color: #C63983;
    text-decoration: underline;
}

.CategoryName a:hover{
    color: #D369A2;
}

.CategoryDescription{
    color: #333333;
    font-family: Tahoma, Verdana;
    font-size: 11px;
    font-weight: normal;
}
/*
 * Category Styles END
 */

/*
 * Product Styles BEGIN
 */
.ProductName{
    font-family: Tahoma, Verdana;
    color: #666666;
    font-size: 11px;
    font-weight: bold;
}
.ProductName a{
    color: #666666;
    text-decoration: none;
}

.ProductName a:hover{
    color: #BBBBBB;
    text-decoration: none;
}

.ProductDescription{
    font-family: Tahoma, Verdana;
    color: #333333;
    font-size: 11px;
    font-weight: normal;
}

.ProductPrice{
    font-family: Tahoma, Verdana;
    color: #CC3399;
    font-size: 11px;
    font-weight: bold;
}

.ProductStockMessage{
    font-family: Tahoma, Verdana;
    color: red;
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
}

.ProductOptionsTitle{
    font-family: Tahoma, Verdana;
    color: #666666;
    font-size: 11px;
    font-weight: bold;
}

.ProductOptions{
    font-family: Tahoma, Verdana;
    color: #333333; 
    font-size: 11px;  
    font-weight: normal;
    text-align: left;
}

.ProductOptions input,
.ProductOptions textarea,
.ProductOptions select{
}
/*
 * Product Styles END
 */

/*
 * Breadcrumb Styles BEGIN
 */
.Breadcrumb {
    padding: 0;
    margin: 0;
    width: 100%;
    background-color: white;
    font-family: Tahoma, Verdana;
    color: #333333;
    font-size: 11px; 
    text-align: left;
}

.Breadcrumb a{
    color: #CD3C53;
    text-decoration: underline;
}

.Breadcrumb a:hover{
    color: #DA7080;
}
/*
 * Breadcrumb Styles END
 */

/*
 * NavigationBar Styles BEGIN
 */
.NavigationBar {
    padding: 0px;
    margin: 2px;
    width: 180px;
    background-color: white;
}

.NavigationBar table td{
    border-top: #E5E5E5 1px solid; 
    border-left: #E5E5E5 1px solid;
    border-right: #E5E5E5 1px solid;
    font-family: Tahoma, Verdana;
    color: #333333;
    font-size: 11px;
    font-weight: normal;
    text-align: left;
}

.NavigationBar table td.Empty {
    padding: 10px;
    font-weight: bold;
    text-align: center;
}

.NavigationBar table td.LevelDefault{
    padding: 1px 0px 7px 60px;
}

.NavigationBar table td.LevelDefault a{
    color: #333333;
    text-decoration: none;
}

.NavigationBar table td.LevelDefault a:hover{
    color: #888888;
}

.NavigationBar table td.Level1{
    padding: 1px 0px 7px 20px;
    font-weight: bold;
}

.NavigationBar table td.Level1 a{
    color: #333333;
    text-decoration: none;
}

.NavigationBar table td.Level1 a:hover{
    color: #888888;
}

.NavigationBar table td.Level2{
    padding: 1px 0px 7px 40px;
}

.NavigationBar table td.Level2 a{
    color: #333333;
    text-decoration: none;
}
.NavigationBar table td.Level2 a:hover{
    color: #888888;
}

.NavigationBar table td.Selected{
    background-color: #E5E5E5;
}

.NavigationBar table td.Selected a{
    color: #C63983;
    text-decoration: none;
}

.NavigationBar table td.Selected a:hover{
    color: #D369A2;
}
/*
 * NavigationBar Styles END
 */


/*
 * Subcategories List Styles BEGIN
 */
.Subcategories{
    padding: 0px;
    margin: 2px;
    width: 100%;
    background-color: white;
    vertical-align: top;
    text-align: center;
}

/* the following styles are inherited from .CategoryName */
.Subcategories .CategoryName{
    padding: 2px;
}

.Subcategories .CategoryName a{
}

.Subcategories .CategoryName a:hover{
}
/*
 * Subcategories List Styles END
 */

/*
 * Product List Styles BEGIN
 */
.ProductList{
    padding: 0px;
    margin: 2px;
    width: 100%;
    background-color: white;
    vertical-align: top;
}

.ProductList table td{
    vertical-align: top;
}

.ProductList .Empty{
    padding: 30px 0px 40px 0px;
    font-family: Tahoma, Verdana;
    color: #C63983;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}

/* the following styles are inherited from Category Styles */
.ProductList .CategoryName{
}

.ProductList .CategoryDescription{
    padding-top: 6px;
}

/* the following styles are inherited from Product Styles */
.ProductList .ProductName{
    padding-top: 7px;
    padding-bottom: 10px;
    text-align: center;
}

.ProductList .ProductDescription{
    padding: 10px;
}

.ProductList .ProductPrice{
    padding: 5px;
    text-align: center;
}
/*
 * Product List Styles END
 */

/*
 * Paginator Dropdown Styles BEGIN
 */
.PaginatorDropdown {
    padding: 0;
    margin: 0;
    width: 100%;
    font-family: Tahoma, Verdana;
    color: #333333;
    font-size: 11px; 
    background-color: white;
}

.PaginatorDropdown select{
}
/*
 * Paginator Dropdown Styles END
 */

/*
 * Paginator Styles BEGIN
 */
.Paginator {
    padding: 0;
    margin: 0;
    margin-bottom: 8px;
    width: 100%;
    font-family: Tahoma, Verdana;
    color: #333333;
    font-size: 11px; 
    background-color: white;
    height: 20px;
    vertical-align: bottom;
}

.Paginator a{
    color: #CD3C53;
    text-decoration: underline;
}

.Paginator a:hover{
    color: #DA7080;
    text-decoration: underline;
}
/*
 * Paginator Styles END
 */

/*
 * Product Images Styles BEGIN
 */
.ProductImages {
    padding: 0px;
    margin: 2px;
    width: 100%;
    border: 1px #E5E5E5 solid;
    font-family: Tahoma, Verdana;
    font-size: 12px;
    color: #666666;
    font-weight: normal;
    background-color: white;
    text-align: left;
}
.ProductImages TH{
    padding: 2px;
    background-color: #E5E5E5;
}
.ProductImages IMG{
    padding: 10px;
    border: 2px solid #FFFFFF;
}
.ProductImages IMG:hover{
    padding: 10px;
    border: 2px solid #E5E5E5;
}
/*
 * Product Images Styles END
 */


/*
 * Related Products Styles BEGIN
 */
.RelatedProducts {
    padding: 0px;
    margin: 2px;
    width: 100%;
    border: 1px #E5E5E5 solid;
    font-family: Tahoma, Verdana;
    font-size: 12px;
    color: #666666;
    font-weight: normal;
    background-color: white;
    text-align: left;
}
.RelatedProducts TH{
    padding: 2px;
    background-color: #E5E5E5;
}
.RelatedProducts IMG{
    padding: 10px;
    border: 2px solid #FFFFFF;
}
.RelatedProducts IMG:hover{
    padding: 10px;
    border: 2px solid #E5E5E5;
}
.RelatedProducts A{
    font-family: Tahoma, Verdana;
    font-size: 11px;
    color: #666666;
    font-weight: normal;
    text-decoration: none;
}
.RelatedProducts A:hover{
    font-family: Tahoma, Verdana;
    font-size: 11px;
    color: #666666;
    font-weight: normal;
    text-decoration: underline;
}

/*
 * Related Products Styles END
 */




/*
 * Product Info Styles BEGIN
 */
.ProductInfo {
    padding: 0px;
    margin: 2px;
    width: 100%;
    border: 1px #E5E5E5 solid;
    font-family: Tahoma, Verdana;
    font-size: 12px;
    color: #666666;
    font-weight: normal;
    background-color: white;
    text-align: left;
}

/* the following styles are inherited from Product Styles */
.ProductInfo .ProductName {
    padding: 6px;
}

.ProductInfo .ProductDescription {
}

.ProductInfo .ProductPrice {
    padding-bottom: 7px;
}
/*
 * Product Info Styles END
 */

/*
 * Shopping Cart Styles BEGIN
 */
.ShoppingCart {
    padding: 0px;
    margin: 2px;
    width: 100%;
    background-color: white;
    font-family: Tahoma, Verdana;
    color: #333333;
    font-size: 11px;
    font-weight: normal;
    text-decoration: none;
}

.ShoppingCart .Empty{
    padding: 30px 0px 40px 0px;
    font-family: Tahoma, Verdana;
    color: #C63983;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}

.ShoppingCart input{
}
/*
 * Shopping Cart Styles END
 */

/*
 * Search Result Styles BEGIN
 */
.SearchResult {
    padding: 0px;
    margin: 2px;
    width: 100%;
    background-color: white;
}

.SearchResult .Empty{
    padding: 30px 0px 40px 0px;
    text-align: left;
    font-family: Tahoma, Verdana; 
    color: #666666;
    font-size: 12px;
    font-weight: bold;
}

.SearchResult .Highight {
    background-color: #F9C6F9;
}

.SearchResult .ProductName {
    padding: 0px;
    padding-bottom: 5px;
    text-align: left;
}

/* the following styles are inherited from Product Styles */
.SearchResult .ProductName a{
}

.SearchResult .ProductName a:hover{
    color: #888888;
}

.SearchResult .ProductDescription {
}

.SearchResult .ProductDescription a {
    color: #333333;
    text-decoration: none;
}

.SearchResult .ProductDescription a:hover {
    color: #888888;
}

.SearchResult .ProductNumber {
    font-family: Tahoma, Verdana;
    color: #666666;
    font-size: 11px;
    font-weight: bold;
}
/*
 * Search Result Styles END
 */

/*
 * Checkout Styles BEGIN
 */
.Checkout {
    padding: 0px;
    margin: 2px;
    width: 100%;
    background-color: white;
    font-family: Tahoma, Verdana;
    color: #333333;
    font-size: 11px;
    font-weight: normal;
    text-decoration: none;
}

.Checkout .Title {
    padding: 12px 0px 5px 15px;
    font-family: Tahoma, Verdana;
    color: #C63983;
    font-size: 12px;
    font-weight: bold; 
    text-align:left;
}

.Checkout .Block {
    padding: 15px;
    border: 1px #E5E5E5 solid;
}

.Checkout .ColumnTitle {
    white-space: nowrap;
    color: #666666;
    font-weight: bold;
}

.Checkout .ColumnValue {
}

.Checkout .TotalLabel {
    white-space: nowrap;
    padding-right: 7px;
    font-weight: bold;
}

.Checkout .TotalValue {
    font-weight: bold;
}

.Checkout .Left {
    text-align:left;
}

.Checkout .Right {
    text-align:right;
}

.Checkout .Center {
    text-align:center;
}

.Checkout input.Normal,
.Checkout textarea.Normal,
.Checkout select.Normal {
}

.Checkout input.Error ,
.Checkout textarea.Error,
.Checkout select.Error {
    border: 1px solid red;
}

.Checkout select.Short {
    width: 100px;
}

.Checkout .Required {
}

.Checkout .Error {
}

.Checkout .Errors {
    padding: 15px;
    color: red;
    text-align: left;
    line-height: 20px;
}

.Checkout .Empty {
    padding: 30px 0px 40px 0px;
    font-family: Tahoma, Verdana;
    color: #C63983;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}

.Checkout .ImpossibleToComputeShippingCost {
    padding: 20px;
    color: #C63983;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
}

.CurrencyNotAppropriateForActivePaymentModules
{
    padding: 20px;
    color: #C63983;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
}

/*
 * Checkout Styles END
 */
 
.OrderInfo .field {
    text-align: right;
    background: #EEF2F8;
    color: #333333;
}

.OrderInfo .value {
    text-align: left;
}

.OrderInfo .products_header {
    color: #333333;
    background: #EEF2F8;
}

.OrderInvoice {
    color: black;
    font-size: 8pt;
}

.OrderInvoice .field {
    font-weight: bold;
    text-align: right;
}

.OrderInvoice .value {
    color: #666666;
    text-align: left;
}

.OrderInvoice .group_header {
    color: black;
    text-decoration: underline;
    font-size: 10pt;
    font-weight: bold;
}

.OrderInvoice .price_field {
    font-weight: normal;
    text-align: right;
    color: black;
}

.OrderInvoice .price_value {
    font-weight: bold;
    color: black;
    text-align: left;
}




/**************************************************
    Manufacturers Filter  
    
***************************************************/

ul.ManufacturersList {
    padding: 0;
    margin: 0;
    padding-left: 20px;
    /* display: inline; */
}

ul.ManufacturersList li {
    list-style: none;
    line-height: 1.8;
    /* display: inline; */
    margin: 5px;
}

ul.ManufacturersList li a {
    color: #5A3333;
}

ul.ManufacturersList li a:HOVER {
    color: #666666;
}




/**************************************************
    ProductListSorter 
    
***************************************************/
div#product-list-sorter, div#product-list-sorter ul {
    display: inline;
    padding: 0px;
    margin: 0px;
}

div#product-list-sorter ul li {
    display: inline;
    padding: 0px;
    margin: 5px;
}

div#product-list-sorter ul li a {
    color: #5A3333;
}

div#product-list-sorter ul li a:HOVER {
    color: #666666;
}

/**************************************************
    Contact Us Page
    
***************************************************/
div#contact-us {
    padding: 10px; 
    line-height: 20px;
}

div#contact-us img {
    float: left;
    margin: 0px 20px 10px 0px;
    width: 200px;
    height: 200px;
    border: 0px;
}

div#contact-us div.Title {
    margin-top: 10px;
    font-weight: bold;
}

div#contact-us div.Text {
    line-height: 14px;
    font-weight: normal;
}

div#contact-us div.Label {
    float: left;
    font-weight: normal;
    width: 45px;
    margin-top: 4px;
}

div#contact-us input {
    margin: 2px;
    width: 385px;
}

div#contact-us input[type="submit"]{
    width: 50px;
}

div#contact-us textarea {
    margin: 2px;
    width: 430px;
    height: 200px;
}
Old 09-10-2009, 09:18 AM
  #5  
k3ifers
k three ifers
 
k3ifers's Avatar
 
Join Date: Jun 2002
Location: Buffalo, NY
Posts: 42,568
Likes: 0
Received 4 Likes on 2 Posts
Default

yup

edit: to the original post. can't read all that right now

Last edited by k3ifers; 09-10-2009 at 09:25 AM.
Old 09-10-2009, 09:18 AM
  #6  
spanky
I go duffy on dem bitches
Thread Starter
 
spanky's Avatar
 
Join Date: Mar 2001
Location: Gonzales, Louisiana
Posts: 28,247
Likes: 0
Received 0 Likes on 0 Posts
Default

the graphics design guy did the logo. i put it up. obviously we'd like the bg/color scheme to match the main banner.
Old 09-10-2009, 09:22 AM
  #7  
reno96teg
Moderator
 
reno96teg's Avatar
 
Join Date: Dec 2000
Posts: 21,573
Likes: 0
Received 0 Likes on 0 Posts
Default

well, you have to find out which elements, that you want to change, are using what style class, and modify those.

in the web document, look for "class="xyz",

e.g.
Code:
<span class="xyz">some text</span>
in the style sheet, find the corresponding class:

Code:
.xyz {
color: #ff0000
}
or, it may be set up via id, such as, in the document:

Code:
<div id="thisDiv">some text</div>
then in the style sheet,

Code:
#thisDiv {
color: #00a0a0
}
it starts to make sense from there.

Last edited by reno96teg; 09-10-2009 at 09:26 AM.
Old 09-10-2009, 09:26 AM
  #8  
k3ifers
k three ifers
 
k3ifers's Avatar
 
Join Date: Jun 2002
Location: Buffalo, NY
Posts: 42,568
Likes: 0
Received 4 Likes on 2 Posts
Default

cascading style sheets style sheets h:
Old 09-10-2009, 09:32 AM
  #9  
shirley
CBOTY 2010
 
shirley's Avatar
 
Join Date: Nov 2004
Location: MI
Posts: 34,786
Likes: 0
Received 0 Likes on 0 Posts
Default

Originally Posted by k3ifers
cascading style sheets style sheets h:
ATM machine
Old 09-10-2009, 09:36 AM
  #10  
flipped cracka
BOOM goes the dynamite!
 
flipped cracka's Avatar
 
Join Date: Mar 2003
Location: in a van down by the rive
Posts: 27,571
Received 1 Like on 1 Post
Default

can't help if we don't know what you're trying to change.



All times are GMT -8. The time now is 02:24 AM.