ASP en stylesheets (maybe a little bit of toppic)

[bart plessers]

Hello,

I am making a website where the user can choose a 'skin'.
This works with asp en stylesheets.

In the stylesheet, a number of tags are (re)defined.
The main idea is to have a limited number of colors (lets say 4) and use
only these colors to color up every tag.

However, with a long list of (custom) styles, it is a lot of work to scan
every item in the stylesheet and assign the correct color definition.

So I am wondering,
is it possible to use variables or something like that to give a name to
custom color
and use this name for the rest of the style sheet?

In example:
ThemeColor1 = #012345
ThemeColor2 = #678901
ThemeColor3 = #234567
ThemeColor4 = #890123


and then
BODY
{
BACKGROUND: <%=ThemeColor1%>;
color:<%=ThemeColor2%>;
}
etc...





can this be done in stylesheets?
can this be done in ASP?

tia

bart plessers

--

==========================================
Hyper A.R.T.
bart plessers
Paul Van Ostaijenlaan 4
3001 Heverlee
BELGIUM
tel: +32 (16) 23.40.85
fax: +32 (16) 23.41.06
==========================================

 

[Ken Schaefer]

You can do the first if you give your stylesheet a .asp extension, and call
it like so:

<link rel="stylesheet" href="/css/myStyleSheet.asp" type="text/css" />

or, you could just define several stylesheets and do:

<link rel="stylesheet" href="<%=StyleSheet%>" type="text/css" />

Cheers
Ken


: Hello,
:
: I am making a website where the user can choose a 'skin'.
: This works with asp en stylesheets.
:
: In the stylesheet, a number of tags are (re)defined.
: The main idea is to have a limited number of colors (lets say 4) and use
: only these colors to color up every tag.
:
: However, with a long list of (custom) styles, it is a lot of work to scan
: every item in the stylesheet and assign the correct color definition.
:
: So I am wondering,
: is it possible to use variables or something like that to give a name to
: custom color
: and use this name for the rest of the style sheet?
:
: In example:
: ThemeColor1 = #012345
: ThemeColor2 = #678901
: ThemeColor3 = #234567
: ThemeColor4 = #890123
:
:
: and then
: BODY
: {
: BACKGROUND: <%=ThemeColor1%>;
: color:<%=ThemeColor2%>;
: }
: etc...
:
:
:
:
:
: can this be done in stylesheets?
: can this be done in ASP?
:
: tia
:
: bart plessers
:
: --
:
: ==========================================
: Hyper A.R.T.
: bart plessers
: Paul Van Ostaijenlaan 4
: 3001 Heverlee
: BELGIUM
: tel: +32 (16) 23.40.85
: fax: +32 (16) 23.41.06
: ==========================================
:
:
:
:
:
:
:

 

[Rob Meade]

"bart plessers" ...

[snip]

You could always have a screen where you list the items that they can
configure, and allow them to select a colour (perhaps from a drop down menu
or something) - when they've done this they can 'save' that as their own
skin - you simply write the values to a .css file with the relevant name of
their 'skin' - change the value in the page to use the name of the skin
they've created - and bingo bango - done )

Hope this helps

Regards

Rob

 

[Adrienne]

and now my head hurts. have you done this?

I just did it to test it, and it does not work.

I did something very simple:

**** testcss.asp ****
<% if request.querystring("id") = "1" then %>
body {background-color: blue;}
<% else %>
body {background-color: red;}
<%end if%>

**** testcsspage.asp ****
<link type="text/css" rel="stylesheet" href="textcss.asp" />

If the id is 1 the background color is red, if there is no querystring, the
background is red, if the id is something other than 1, the background
color is still red. The stylesheet does not retrieve the value of the
querystring, so it uses the default, red. If you give the stylesheet the
querystring testcss.asp?id=1 then the stylesheet source will show blue.

Here's a link:
http://www.intraproducts.com/testcsspage.asp

 

[Adrienne]

try this (nearly as simple):

http://williamtasso.com/usenet/testcsspage.asp

asp:
<%
if request.querystring("id") <> "" then
session("id") = request.querystring("id")
end if
%>

css:
<%id = session("id")%> <% if id = "1" then %> body {background-color:
blue;} <% else %> body {background-color: red;} <%end if%>

needs refining perhaps (you may need to refresh/reload)

Yes, that does work. <voice accent="German" actor="Arte Johnson">Very
Interesting</voice> ... giving me some ideas I'll have to play around with.

 

[Ken Schaefer]

It doesn't work because the request for textcss.asp is here:
<link type="text/css" rel="stylesheet" href="textcss.asp" />
and there is *no* querystring value appended. See href="textcss.asp"

What you'd need to do is something like:

<link type="text/css" rel="stylesheet" href="textcss.asp?id=1" />
-or-
<link type="text/css" rel="stylesheet"
href="textcss.asp?id=<%=Request.Querystring("id")%>" />
if Request.QueryString("id") is coming from the calling page.

Cheers
Ken

: Gazing into my crystal ball I observed "William Tasso" <[email protected]>
: writing in :
: > Ken Schaefer wrote:
: >> : >>> ...
: >>> is it possible to use variables or something like that to give a
: >>> name to custom color
: >>> and use this name for the rest of the style sheet?
: >> You can do the first if you give your stylesheet a .asp extension, and
: >> call it like so:
: >>
: >> <link rel="stylesheet" href="/css/myStyleSheet.asp" type="text/css" />
: >> ...
: >
: > and now my head hurts. have you done this?
: >
:
: I just did it to test it, and it does not work.
:
: I did something very simple:
:
: **** testcss.asp ****
: <% if request.querystring("id") = "1" then %>
: body {background-color: blue;}
: <% else %>
: body {background-color: red;}
: <%end if%>
:
: **** testcsspage.asp ****
: <link type="text/css" rel="stylesheet" href="textcss.asp" />
:
: If the id is 1 the background color is red, if there is no querystring,
the
: background is red, if the id is something other than 1, the background
: color is still red. The stylesheet does not retrieve the value of the
: querystring, so it uses the default, red. If you give the stylesheet the
: querystring testcss.asp?id=1 then the stylesheet source will show blue.
:
: Here's a link:
: http://www.intraproducts.com/testcsspage.asp
:
: --
: Adrienne Boswell
: Please respond to the group so others can share
: http://www.intraproducts.com
: Developer

 

[Bart Plessers \(artabel\)]

Here is my solution:
I have 3 files:
contents.asp (the actually file)
stylesheet.asp (the color definitions)
theme.css (stylesheet where colors are replaced by asp vars)

all are linked (see below)

this works perfect for me:
just define colors in stylesheet.asp, and everything is theme.css is
modified accordingly


thanx all for your input

regards,
bartp



CONTENTS.ASP
++++++++++++++++++++++++++++++++++++++++++++++++++++++
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="stylesheet.asp" rel="stylesheet" type="text/css">
</head>

<body>
<h1>STYLES...</h1>
<p>This page has a style sheet link to an ASP page with vars.</p>
<p>&nbsp;</p>
</body>
</html>

++++++++++++++++++++++++++++++++++++++++++++++++++++++


STYLESHEET.ASP
++++++++++++++++++++++++++++++++++++++++++++++++++++++
<%
'THEME 1
'ThemeColor01 ="#CAFF27" 'foreground
'ThemeColor02 ="#FF8D27" 'background

'THEME 2
ThemeColor01 ="#CAFF27" 'foreground
ThemeColor02 ="#C09E00" 'background

%>
<!--#include file="theme.css" -->

++++++++++++++++++++++++++++++++++++++++++++++++++++++


THEME.CSS
++++++++++++++++++++++++++++++++++++++++++++++++++++++
body {
color: <%=ThemeColor01%>;
background-color: <%=ThemeColor02%>;
font-family: 'Arial', 'Century Gothic', 'Trebuchet MS';
padding: 0;
margin-top: 10;
margin-left: 10;
margin-right:10;
margin-bottom:10;
}
++++++++++++++++++++++++++++++++++++++++++++++++++++++