mirror of
https://github.com/dawidolko/Website-Templates.git
synced 2026-02-04 01:30:03 +00:00
Website templates
This commit is contained in:
Dawid Olko
BIN
relic-portal/blue.gif
Normal file
BIN
relic-portal/blue.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 464 B |
BIN
relic-portal/fox.gif
Normal file
BIN
relic-portal/fox.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
relic-portal/green.gif
Normal file
BIN
relic-portal/green.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 465 B |
BIN
relic-portal/header.jpg
Normal file
BIN
relic-portal/header.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.8 KiB |
183
relic-portal/index.html
Normal file
183
relic-portal/index.html
Normal file
@@ -0,0 +1,183 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html lang="en">
|
||||
<head>
|
||||
|
||||
<title>Relic</title>
|
||||
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="style.css" />
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<div id="top">
|
||||
|
||||
<h1>Relic</h1>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div id="wrapper">
|
||||
|
||||
|
||||
|
||||
<!-- LEFT COLUMN -->
|
||||
<div id="left">
|
||||
|
||||
|
||||
|
||||
<h1>Left column</h1>
|
||||
|
||||
<p> You could use this column as some sort of
|
||||
news box, link list, or a second navigation. It would also
|
||||
be quite feasable to move this to the right and have the
|
||||
navigation here.</p>
|
||||
|
||||
<h1>Custom designs</h1>
|
||||
|
||||
<p>Schools out, and I don't have too much on the go right now,
|
||||
so if you want a custom design made, give me a shout, and I'll
|
||||
make you a template for a very fair price.
|
||||
</p>
|
||||
|
||||
<h1>About the Author</h1>
|
||||
|
||||
<p>My name is Kevin Cannon. I live just outside of Vancouver,
|
||||
Canada. I've been dabbling in web design for a while, and this is
|
||||
my fourth template submitted to OSWD. Most of my work, no wait ...
|
||||
<b>all</b> of my work has been done for free so far. Maybe I will do
|
||||
web design for a living, but probably not.</p>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- MIDDLE COLUMN -->
|
||||
<div id="middle">
|
||||
|
||||
|
||||
|
||||
|
||||
<h1>Relic</h1>
|
||||
|
||||
<p>Welcome to Relic, my most ambitious template yet.
|
||||
This is a fluid, 3-column design. No matter which column is tallest, the design
|
||||
will not fail, and the footer will always stay at the bottom of the page. The columns
|
||||
have widths based in percentages, so the template will smoothly transfer to different
|
||||
screen resolutions. This is all achieved through pure Css, no javascript at all. Sorry for all that
|
||||
tech-talk, its really much simpler than it sounds</p>
|
||||
|
||||
|
||||
|
||||
<h1>Simplicity</h1>
|
||||
|
||||
<p>Because of the use of CSS and Xhtml in place of tables, you will find
|
||||
this template incredibly easy to modify. To help you out even more, the
|
||||
Css and Xhtml is clearly labeled with comments throughout.</p>
|
||||
|
||||
|
||||
|
||||
|
||||
<h1>The design</h1>
|
||||
<p> Its July, so I chose a light summer
|
||||
colour scheme with greens and blues. The header is off of the stock x-change,
|
||||
and is not included in the zip file, otherwise it would be over 100kb. Instead
|
||||
I've hosted it externally. You will probably want to use your own header,
|
||||
but if you really like this one it can be found <a href="http://img240.echo.cx/img240/4435/header2vv.gif">here</a>. If you need
|
||||
any help at all with this template, don't hesitate to contact me through OSWD,
|
||||
or email - kmcannon [at] telus [dot] net.</p>
|
||||
|
||||
|
||||
|
||||
<h1>Images</h1>
|
||||
<a href="http://www.mozilla.org/products/firefox/central.html">
|
||||
<img class="left" src="fox.gif" alt="firefox" height="90" width="95"></img></a>
|
||||
<p>This template is very image-friendly, and through the use of classes,
|
||||
you can have your images floating in either side of the text. The images are controlled
|
||||
externally with CSS.
|
||||
You can also have images as links, like the firefox logo in the corner.
|
||||
And, again through CSS, you can have mouseover effects. If you're using
|
||||
firefox, put your cursor over the logo. But for some reason IE doesn't like
|
||||
image rollover effects. Its not that big of a deal.</p>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- RIGHT COLUMN -->
|
||||
|
||||
|
||||
<div id="right">
|
||||
|
||||
|
||||
<h1>In the News</h1>
|
||||
|
||||
<a href="#">Deep impact smashes comet</a>
|
||||
|
||||
<a href="#">3 Florida shark attacks in a week</a>
|
||||
|
||||
<a href="#">Mad Cow originated in Texas</a>
|
||||
|
||||
<a href="#">G8 summit in Scotland</a>
|
||||
|
||||
|
||||
<h1>Latest posts</h1>
|
||||
|
||||
|
||||
<a href="#">Relic</a> - 07/04/05<br />
|
||||
|
||||
<a href="#">Simplicity</a> - 07/03/05<br />
|
||||
|
||||
<a href="#">The Design</a> - 07/02/05<br />
|
||||
|
||||
<a href="#">Images</a> - 07/01/05<br />
|
||||
|
||||
|
||||
<h1>Search the Archives</h1>
|
||||
|
||||
<input class="text" type="text" name="search" />
|
||||
<input class="go" type="submit" value="Go" />
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<!--DO NOT ERASE THE NEXT PART-->
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- FOOTER -->
|
||||
<div id="footer">
|
||||
|
||||
<p class="footer">
|
||||
<a href="#">Xhtml Valid</a> |
|
||||
<a href="#">CSS Valid</a> |
|
||||
© 2005 your name
|
||||
<br />
|
||||
Design by Kevin Cannon<br />
|
||||
|
||||
<!--This theme is free for distriubtion, so long as link to openwebdesing.org and florida-villa.com stay on the theme-->
|
||||
Courtesy <a href="http://www.openwebdesign.org" target="_blank">Open Web Design</a><a href="http://www.dubaiapartments.biz" target="_blank"><img src="spacer.gif" width="5" height="5" border="0"/></a> Thanks
|
||||
to <a href="http://www.florida-villa.com" target="_blank">Florida Vacation Homes</a></p>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
5
relic-portal/readme.md
Normal file
5
relic-portal/readme.md
Normal file
@@ -0,0 +1,5 @@
|
||||
## Project Description
|
||||
|
||||
* [live example](https://learning-zone.github.io/website-templates/relic-portal/)
|
||||
|
||||
|
||||
155
relic-portal/style.css
Normal file
155
relic-portal/style.css
Normal file
@@ -0,0 +1,155 @@
|
||||
/**************************************************************************
|
||||
**************************************************************
|
||||
|
||||
Welcome to the CSS for Relic, coded by Kevin Cannon.
|
||||
The CSS is pretty straight forward. There are a few
|
||||
small hacks however, with one line controlling firefox
|
||||
and the other IE. These are clearly labled. If you need
|
||||
any help with the template, email me at kmcannon@telus.net
|
||||
|
||||
***************************************************************
|
||||
***********************************************************************/
|
||||
body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
font-family:verdana, arial, times, georgia, sans-serif;
|
||||
}
|
||||
|
||||
a {
|
||||
color:#59BF3F;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color:#40A7D6;
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
img.left {
|
||||
float:left;
|
||||
padding:3px;
|
||||
margin-right:6px;
|
||||
border:1px solid #c4c4c4;
|
||||
}
|
||||
|
||||
img.right {
|
||||
float:right;
|
||||
padding:3px;
|
||||
margin-right:6px;
|
||||
border:1px solid #c4c4c4;
|
||||
}
|
||||
|
||||
img:hover {
|
||||
border:1px solid #4BA9E9;
|
||||
background:#EbF1F5;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
height:100%;
|
||||
margin:auto;
|
||||
width:90%;
|
||||
}
|
||||
/********************* Search form ******************/
|
||||
.text {
|
||||
height:14px;
|
||||
width:110px;
|
||||
}
|
||||
|
||||
.go {
|
||||
height:21px;
|
||||
background:#65A8C9;
|
||||
color:#fff;
|
||||
font-family:helvetica;
|
||||
font-weight:bold;
|
||||
}
|
||||
/***************** TEXT IN THE HEADER **************************/
|
||||
#top h1 {
|
||||
font-family:Century Gothic, georgia, helvetica, times, sans-serif;
|
||||
font-weight:normal;
|
||||
font-size:35px;
|
||||
text-transform:uppercase;
|
||||
margin-top:20px;
|
||||
margin-left:2%;
|
||||
}
|
||||
/*************************** HEADER PROPERTIES ************************/
|
||||
#top {
|
||||
margin:0 auto;
|
||||
padding:10px;
|
||||
height:70px;
|
||||
background:url(header.jpg) no-repeat top center;
|
||||
width:93%;
|
||||
}
|
||||
/************************ LEFT SIDE COLUMN *****************/
|
||||
#left {
|
||||
float:left;
|
||||
padding:10px;
|
||||
width:22%;
|
||||
}
|
||||
|
||||
#left h1, #right h1 {
|
||||
font-size:15px;
|
||||
padding-top:5px;
|
||||
font-family:helvetica, arial, georgia, times, sans-serif;
|
||||
border-bottom:1px dotted #c4c4c4;
|
||||
}
|
||||
|
||||
#left p {
|
||||
font-size:10px;
|
||||
padding-bottom:10px;
|
||||
margin-top:-3px !important; /***** FIREFOX *****/
|
||||
margin-top:-14px; /***** INTERNET EXLORER *****/
|
||||
color:#404040;
|
||||
}
|
||||
/************************** MAIN CONTENT IN MIDDLE ******************/
|
||||
|
||||
#middle {
|
||||
float:left;
|
||||
width:46%;
|
||||
line-height:1.01em;
|
||||
padding-left:3.5%;
|
||||
padding-right:3.5%;
|
||||
}
|
||||
|
||||
#middle p, p {
|
||||
font-size:11px;
|
||||
color:#404040;
|
||||
}
|
||||
|
||||
#middle h1 {
|
||||
font-family:"Century Gothic", verdana, arial, times, sans-serif;
|
||||
font-size:21px;
|
||||
font-weight:normal;
|
||||
border-bottom:1px solid #c4c4c4;
|
||||
padding-bottom:3px;
|
||||
margin-top:24px;
|
||||
}
|
||||
/*************************** RIGHT COLUMN *********************/
|
||||
#right {
|
||||
float:left;
|
||||
padding-top:10px;
|
||||
font-size:11px;
|
||||
width:22%;
|
||||
line-height:1.6em;
|
||||
}
|
||||
|
||||
#right a {
|
||||
line-height:2em;
|
||||
|
||||
}
|
||||
|
||||
#right br {
|
||||
line-height:0.7em;
|
||||
}
|
||||
/******************************************** FOOTER *****************/
|
||||
#footer {
|
||||
border-top:1px solid #c4c4c4;
|
||||
padding-top:5px;
|
||||
text-align:center;
|
||||
width:90%;
|
||||
margin:0 auto;
|
||||
clear:both;
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-top:-2px;
|
||||
}
|
||||
BIN
relic-portal/thumbs.db
Normal file
BIN
relic-portal/thumbs.db
Normal file
Binary file not shown.
Reference in New Issue
Block a user