[geeklog-devtalk] geeklog-devel digest, Vol 1 #440 - 1 msg
geeklog-devel-request at lists.geeklog.net
geeklog-devel-request at lists.geeklog.net
Wed Dec 1 13:00:02 EST 2004
Send geeklog-devel mailing list submissions to
geeklog-devel at lists.geeklog.net
To subscribe or unsubscribe via the World Wide Web, visit
http://lists.geeklog.net/listinfo/geeklog-devel
or, via email, send a message with subject or body 'help' to
geeklog-devel-request at lists.geeklog.net
You can reach the person managing the list at
geeklog-devel-admin at lists.geeklog.net
When replying, please edit your Subject line so it is more specific
than "Re: Contents of geeklog-devel digest..."
Today's Topics:
1. Suggested CSS standards for plugins (Blaine Lang)
--__--__--
Message: 1
From: "Blaine Lang" <geeklog at langfamily.ca>
To: <geeklog-modules at lists.geeklog.net>, <geeklog-devel at lists.geeklog.net>
Date: Tue, 30 Nov 2004 21:04:06 -0500
Subject: [geeklog-devel] Suggested CSS standards for plugins
Reply-To: geeklog-devel at lists.geeklog.net
This is a multi-part message in MIME format.
------=_NextPart_000_005E_01C4D720.21070510
Content-Type: text/plain;
charset="iso-8859-1"
Content-Transfer-Encoding: quoted-printable
I would like to suggest a common set of CSS declarations that plugins =
and GL components would use and it would make it a lot easier for GL =
site admin's to theme their sites and components. I have been re-working =
the CSS that I use over and over the past year and have been re-using a =
more common set of declarations.
I'd like to propose that we consider these declarations and possibly add =
them to the core theme CSS (after any required discussion).
This CSS is what I am using in the new forum plugin look (shown on =
mysite). I think the CSS buttons work well and can easily be themed.
The CSS has a lot of options for use and for theming your projects and =
should provide the needed design flexiblity.
I'm still refining this CSS and have to pass it thru the standards =
verification but wanted to get any input as interest in this idea.
Blaine
/* New Plugin CSS Declarations */
.pluginBG { background-color: #1C1E2D; }
.pluginTitle { color: #1C1E2D; background-color:#EFEFEF; =
font-weight: bold; font-size: 11px; font-family: Verdana, sans-serif; }
.pluginHeader { color: #FFFFFF; font-weight: bold; font-size: =
100%; background-color: #767D8D; }
.pluginFooter { background-color:#EFEFEF; }
.pluginAlert { padding:5px 15px 5px 15px; color:#D8010E; =
background-color: #FEF1B4; font-weight:bold;}
.pluginSolidOutline { background-color: #396998; }
.pluginSolidFill { background-color: #1A3955; }
.pluginCellTitle { color: #1C1E2D; font-weight: bold; font-size: =
10px; font-family: Verdana, sans-serif; background-color: #E5E5EA; }
.pluginCellFill { background-color: #E5E5EA; }
.pluginCellText { color: #000; font-weight: plain; font-size: =
75%; font-family: Verdana, sans-serif; background-color: #F7F7F7; }
.pluginTinyText { font-size:70%; }
.pluginSmallText { font-size:80%; }
.pluginMediumText { font-size:85%; }
.pluginLargeText { font-size:90%; }
.pluginRow1 { background-color: #F7F7F7; }
.pluginRow2 { background-color: #E5E5EA; }
.pluginRollOver { color: #1C1E2D; background-color: #E5E5EA; =
text-align: left; font-weight: plain; font-size: 100%; font-family: =
Verdana, sans-serif; }
.pluginRollOut { color: #1C1E2D; background-color: #F7F7F7; =
text-align: left; font-weight: plain; font-size: 100%; font-family: =
Verdana, sans-serif; }
.pluginLinks A:link { color: #0000FF; font-style: normal; =
font-weight: plain; text-decoration: none }
.pluginLinks A:visited { color: #1E1E8E; font-style: normal; =
font-weight: plain; text-decoration: none }
.pluginLinks A:hover { color: #0000FF; font-style: normal; =
font-weight: plain; text-decoration: underline }
.pluginBreadCrumbs, .pluginBreadCrumbs A:link { color: #EFEFEF; =
font-style: normal; font-weight: plain; text-decoration: none }
.pluginBreadCrumbs A:visited { color: #EFEFEF; font-style: normal; =
font-weight: plain; text-decoration: none }
.pluginBreadCrumbs A:hover { color: gold; font-style: normal; =
font-weight: plain; text-decoration: none }
A.pluginButton:link, A.pluginButton:visited {
color: #000;
text-align: center;
padding-top: 2px;
display: block;
height: 19px;
text-decoration: none;
background-color: transparent;
}
A.pluginButton:hover {=20
color: blue;=20
text-align: center;=20
padding-top: 2px;=20
background: center url(navbar/images/button_over.gif);=20
background-repeat: repeat-x;=20
display: block;=20
height: 19px;=20
text-decoration: none;=20
background-color:=20
transparent;
}
------=_NextPart_000_005E_01C4D720.21070510
Content-Type: text/html;
charset="iso-8859-1"
Content-Transfer-Encoding: quoted-printable
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META http-equiv=3DContent-Type content=3D"text/html; =
charset=3Diso-8859-1">
<META content=3D"MSHTML 6.00.2900.2523" name=3DGENERATOR>
<STYLE></STYLE>
</HEAD>
<BODY bgColor=3D#ffffff>
<DIV><FONT face=3DArial size=3D2>I would like to suggest a common set of =
CSS=20
declarations that plugins and GL components would use and it would =
make it=20
a lot easier for GL site admin's to theme their sites and components. I =
have=20
been re-working the CSS that I use over and over the past year and have =
been=20
re-using a more common set of declarations.</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>I'd like to propose that we consider =
these=20
declarations and possibly add them to the core theme CSS (after any =
required=20
discussion).</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>This CSS is what I am using in the new =
forum plugin=20
look (shown on mysite). I think the CSS buttons work well and can =
easily be=20
themed.</FONT></DIV>
<DIV><FONT face=3DArial size=3D2>The CSS has a lot of options for use =
and for=20
theming your projects and should provide the needed design=20
flexiblity.</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>I'm still refining this CSS and have to =
pass it=20
thru the standards verification but wanted to get any input as interest =
in this=20
idea.</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>Blaine</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>/* New Plugin CSS Declarations=20
*/<BR>.pluginBG &nbs=
p; =20
{ background-color: #1C1E2D;=20
}<BR>.pluginTitle &n=
bsp; {=20
color: #1C1E2D; background-color:#EFEFEF; font-weight: bold; font-size: =
11px;=20
font-family: Verdana, sans-serif;=20
}<BR>.pluginHeader =
{=20
color: #FFFFFF; font-weight: bold; font-size: 100%; background-color: =
#767D8D;=20
}<BR>.pluginFooter =
{=20
background-color:#EFEFEF;=20
}<BR>.pluginAlert &n=
bsp; {=20
padding:5px 15px 5px 15px; color:#D8010E; background-color: #FEF1B4;=20
font-weight:bold;}</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>.pluginSolidOutline { =
background-color: #396998;=20
}<BR>.pluginSolidFill { =
background-color:=20
#1A3955; }<BR>.pluginCellTitle { =
color:=20
#1C1E2D; font-weight: bold; font-size: 10px; font-family: Verdana, =
sans-serif;=20
background-color: #E5E5EA;=20
}<BR>.pluginCellFill {=20
background-color: #E5E5EA;=20
}<BR>.pluginCellText { color: =
#000;=20
font-weight: plain; font-size: 75%; font-family: Verdana, sans-serif;=20
background-color: #F7F7F7;=20
}<BR>.pluginTinyText { =
font-size:70%;=20
}<BR>.pluginSmallText { =
font-size:80%;=20
}<BR>.pluginMediumText { font-size:85%;=20
}<BR>.pluginLargeText { =
font-size:90%;=20
}</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial=20
size=3D2>.pluginRow1  =
; =20
{ background-color: #F7F7F7;=20
}<BR>.pluginRow2 &nb=
sp; =20
{ background-color: #E5E5EA; }</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial=20
size=3D2>.pluginRollOver =
{ color:=20
#1C1E2D; background-color: #E5E5EA; text-align: left; font-weight: =
plain;=20
font-size: 100%; font-family: Verdana, sans-serif;=20
}<BR>.pluginRollOut =
{=20
color: #1C1E2D; background-color: #F7F7F7; text-align: left; =
font-weight: plain;=20
font-size: 100%; font-family: Verdana, sans-serif; }</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>.pluginLinks =
A:link {=20
color: #0000FF; font-style: normal; font-weight: plain; text-decoration: =
none=20
}<BR>.pluginLinks A:visited { color: #1E1E8E; font-style: normal;=20
font-weight: plain; text-decoration: none }<BR>.pluginLinks=20
A:hover { color: #0000FF; font-style: normal; =
font-weight:=20
plain; text-decoration: underline }<BR>.pluginBreadCrumbs, =
.pluginBreadCrumbs=20
A:link { color: #EFEFEF; font-style: normal;=20
font-weight: plain; text-decoration: none }<BR>.pluginBreadCrumbs=20
A:visited { color: #EFEFEF; font-style: normal; font-weight: =
plain;=20
text-decoration: none }<BR>.pluginBreadCrumbs A:hover =
{ color:=20
gold; font-style: normal; font-weight: plain; text-decoration: none=20
}</FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>A.pluginButton:link, =
A.pluginButton:visited=20
{<BR> color: #000;<BR> text-align:=20
center;<BR> padding-top: 2px;<BR> =
display:=20
block;<BR> height: 19px;<BR> =20
text-decoration: none;<BR> background-color:=20
transparent;<BR>}<BR>A.pluginButton:hover { <BR> =
color: blue;=20
<BR> text-align: center; <BR> =
padding-top:=20
2px; <BR> background: center=20
url(navbar/images/button_over.gif); <BR> =
background-repeat:=20
repeat-x; <BR> display: block; <BR> =
height:=20
19px; <BR> text-decoration: none; =
<BR> =20
background-color: <BR> =
transparent;<BR>}<BR></FONT></DIV>
<DIV><FONT face=3DArial size=3D2></FONT> </DIV></BODY></HTML>
------=_NextPart_000_005E_01C4D720.21070510--
--__--__--
_______________________________________________
geeklog-devel mailing list
geeklog-devel at lists.geeklog.net
http://lists.geeklog.net/listinfo/geeklog-devel
End of geeklog-devel Digest
More information about the geeklog-devtalk
mailing list