Change to mkdocs
parent
7d44f60311
commit
991a2d6961
|
|
@ -0,0 +1,9 @@
|
|||
FROM python:3.7
|
||||
|
||||
|
||||
RUN pip install pipenv
|
||||
|
||||
WORKDIR /app
|
||||
COPY . /app
|
||||
|
||||
RUN pipenv install --system --deploy --ignore-pipfile
|
||||
4
Pipfile
4
Pipfile
|
|
@ -8,9 +8,7 @@ autopep8 = "*"
|
|||
pylint = "*"
|
||||
|
||||
[packages]
|
||||
flask = "*"
|
||||
frozen-flask = "*"
|
||||
markdown2 = "*"
|
||||
mkdocs = "*"
|
||||
|
||||
[requires]
|
||||
python_version = "3.7"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"_meta": {
|
||||
"hash": {
|
||||
"sha256": "79b68d0ec55be365cc035492817a2cc21bfdb3970441e08c23a13766e7bc4e5d"
|
||||
"sha256": "d94cad0dc30488627958d67d89ddc51fed636a03f30aa583585e6ee8247086f5"
|
||||
},
|
||||
"pipfile-spec": 6,
|
||||
"requires": {
|
||||
|
|
@ -23,29 +23,6 @@
|
|||
],
|
||||
"version": "==7.0"
|
||||
},
|
||||
"flask": {
|
||||
"hashes": [
|
||||
"sha256:ad7c6d841e64296b962296c2c2dabc6543752985727af86a975072dea984b6f3",
|
||||
"sha256:e7d32475d1de5facaa55e3958bc4ec66d3762076b074296aa50ef8fdc5b9df61"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==1.0.3"
|
||||
},
|
||||
"frozen-flask": {
|
||||
"hashes": [
|
||||
"sha256:0a7a71334210ce84f8cbd1dc23c8b265d3e21748805c09c77d0e6fbcc4faab14",
|
||||
"sha256:83858d6ed8b9d3fa7fc9523e415e65fb86b99352798d7695f63cffbd59a56269"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==0.15"
|
||||
},
|
||||
"itsdangerous": {
|
||||
"hashes": [
|
||||
"sha256:321b033d07f2a4136d3ec762eac9f16a10ccd60f53c0c91af90217ace7ba1f19",
|
||||
"sha256:b12271b2047cb23eeb98c8b5622e2e5c5e9abd9784a153e9d8ef9cb4dd09d749"
|
||||
],
|
||||
"version": "==1.1.0"
|
||||
},
|
||||
"jinja2": {
|
||||
"hashes": [
|
||||
"sha256:065c4f02ebe7f7cf559e49ee5a95fb800a9e4528727aec6f24402a5374c65013",
|
||||
|
|
@ -53,13 +30,19 @@
|
|||
],
|
||||
"version": "==2.10.1"
|
||||
},
|
||||
"markdown2": {
|
||||
"livereload": {
|
||||
"hashes": [
|
||||
"sha256:7ff88e00b396c02c8e1ecd8d176cfa418fb01fe81234dcea77803e7ce4f05dbe",
|
||||
"sha256:882d3607fc023cdea0ac2cd0e1147617fcb0361cb1133d3ff095417f995ff270"
|
||||
"sha256:78d55f2c268a8823ba499305dcac64e28ddeb9a92571e12d543cd304faf5817b",
|
||||
"sha256:89254f78d7529d7ea0a3417d224c34287ebfe266b05e67e51facaf82c27f0f66"
|
||||
],
|
||||
"index": "pypi",
|
||||
"version": "==2.3.8"
|
||||
"version": "==2.6.1"
|
||||
},
|
||||
"markdown": {
|
||||
"hashes": [
|
||||
"sha256:2e50876bcdd74517e7b71f3e7a76102050edec255b3983403f1a63e7c8a41e7a",
|
||||
"sha256:56a46ac655704b91e5b7e6326ce43d5ef72411376588afa1dd90e881b83c7e8c"
|
||||
],
|
||||
"version": "==3.1.1"
|
||||
},
|
||||
"markupsafe": {
|
||||
"hashes": [
|
||||
|
|
@ -94,12 +77,48 @@
|
|||
],
|
||||
"version": "==1.1.1"
|
||||
},
|
||||
"werkzeug": {
|
||||
"mkdocs": {
|
||||
"hashes": [
|
||||
"sha256:865856ebb55c4dcd0630cdd8f3331a1847a819dda7e8c750d3db6f2aa6c0209c",
|
||||
"sha256:a0b915f0815982fb2a09161cb8f31708052d0951c3ba433ccc5e1aa276507ca6"
|
||||
"sha256:17d34329aad75d5de604b9ed4e31df3a4d235afefdc46ce7b1964fddb2e1e939",
|
||||
"sha256:8cc8b38325456b9e942c981a209eaeb1e9f3f77b493ad755bfef889b9c8d356a"
|
||||
],
|
||||
"version": "==0.15.4"
|
||||
"index": "pypi",
|
||||
"version": "==1.0.4"
|
||||
},
|
||||
"pyyaml": {
|
||||
"hashes": [
|
||||
"sha256:57acc1d8533cbe51f6662a55434f0dbecfa2b9eaf115bede8f6fd00115a0c0d3",
|
||||
"sha256:588c94b3d16b76cfed8e0be54932e5729cc185caffaa5a451e7ad2f7ed8b4043",
|
||||
"sha256:68c8dd247f29f9a0d09375c9c6b8fdc64b60810ebf07ba4cdd64ceee3a58c7b7",
|
||||
"sha256:70d9818f1c9cd5c48bb87804f2efc8692f1023dac7f1a1a5c61d454043c1d265",
|
||||
"sha256:86a93cccd50f8c125286e637328ff4eef108400dd7089b46a7be3445eecfa391",
|
||||
"sha256:a0f329125a926876f647c9fa0ef32801587a12328b4a3c741270464e3e4fa778",
|
||||
"sha256:a3c252ab0fa1bb0d5a3f6449a4826732f3eb6c0270925548cac342bc9b22c225",
|
||||
"sha256:b4bb4d3f5e232425e25dda21c070ce05168a786ac9eda43768ab7f3ac2770955",
|
||||
"sha256:cd0618c5ba5bda5f4039b9398bb7fb6a317bb8298218c3de25c47c4740e4b95e",
|
||||
"sha256:ceacb9e5f8474dcf45b940578591c7f3d960e82f926c707788a570b51ba59190",
|
||||
"sha256:fe6a88094b64132c4bb3b631412e90032e8cfe9745a58370462240b8cb7553cd"
|
||||
],
|
||||
"version": "==5.1.1"
|
||||
},
|
||||
"six": {
|
||||
"hashes": [
|
||||
"sha256:3350809f0555b11f552448330d0b52d5f24c91a322ea4a15ef22629740f3761c",
|
||||
"sha256:d16a0141ec1a18405cd4ce8b4613101da75da0e9a7aec5bdd4fa804d0e0eba73"
|
||||
],
|
||||
"version": "==1.12.0"
|
||||
},
|
||||
"tornado": {
|
||||
"hashes": [
|
||||
"sha256:1174dcb84d08887b55defb2cda1986faeeea715fff189ef3dc44cce99f5fca6b",
|
||||
"sha256:2613fab506bd2aedb3722c8c64c17f8f74f4070afed6eea17f20b2115e445aec",
|
||||
"sha256:44b82bc1146a24e5b9853d04c142576b4e8fa7a92f2e30bc364a85d1f75c4de2",
|
||||
"sha256:457fcbee4df737d2defc181b9073758d73f54a6cfc1f280533ff48831b39f4a8",
|
||||
"sha256:49603e1a6e24104961497ad0c07c799aec1caac7400a6762b687e74c8206677d",
|
||||
"sha256:8c2f40b99a8153893793559919a355d7b74649a11e59f411b0b0a1793e160bc0",
|
||||
"sha256:e1d897889c3b5a829426b7d52828fb37b28bc181cd598624e65c8be40ee3f7fa"
|
||||
],
|
||||
"version": "==6.0.2"
|
||||
}
|
||||
},
|
||||
"develop": {
|
||||
|
|
@ -117,6 +136,14 @@
|
|||
"index": "pypi",
|
||||
"version": "==1.4.4"
|
||||
},
|
||||
"colorama": {
|
||||
"hashes": [
|
||||
"sha256:05eed71e2e327246ad6b38c540c4a3117230b19679b875190486ddd2d721422d",
|
||||
"sha256:f8ac84de7840f5b9c4e3347b3c1eaa50f7e49c2b07596221daec5edaabbd7c48"
|
||||
],
|
||||
"markers": "sys_platform == 'win32'",
|
||||
"version": "==0.4.1"
|
||||
},
|
||||
"isort": {
|
||||
"hashes": [
|
||||
"sha256:c40744b6bc5162bbb39c1257fe298b7a393861d50978b565f3ccd9cb9de0182a",
|
||||
|
|
|
|||
25
app.py
25
app.py
|
|
@ -1,25 +0,0 @@
|
|||
from flask import Flask, render_template, Markup, redirect
|
||||
import markdown2
|
||||
import os
|
||||
|
||||
app = Flask(__name__)
|
||||
|
||||
templates = [x for x in os.listdir("data") if x not in ["index.md"]]
|
||||
print(templates)
|
||||
@app.route("/")
|
||||
def main():
|
||||
return render_template("index.html", content=Markup(markdown2.markdown_path("data/index.md")), extras=["cuddled-lists"])
|
||||
|
||||
|
||||
@app.route("/<md>/")
|
||||
def render(md):
|
||||
return render_template("index.html", content=Markup(markdown2.markdown_path(f"data/{md}.md")))
|
||||
|
||||
|
||||
@app.route("/<md>")
|
||||
def redir(md):
|
||||
return redirect(f"/{md}/",)
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
app.run("0.0.0.0", 8080)
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
# The story so far
|
||||
> Our friendly IT guy John has set up a hidden service to control his VM's.
|
||||
> The only problem is that his rival in the company, Dave, kind of wants to screw John over.
|
||||
> This is not an issue for John, he is quite capable with coding and knows exactly which commands to use. This is quite useful when he wants to hide the commands from Dave.
|
||||
> Dave did however figure out where the server is hosted: [wsecho.voidcorp.nl](https://wsecho.voidcorp.nl)!
|
||||
> Now dave wants to find John's password to really screw him over. He knows dave so it probably isn't hidden too well...
|
||||
|
||||
## Your mission
|
||||
1. Hack into the server
|
||||
2. Read the hidden password (format=`flag{xxx}`)
|
||||
3. Report back to Dave (aka the sender of this mission) with the password!
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
# Voidcorp Challenges
|
||||
This site has some CTF challenges, all have different levels of challenge.
|
||||
|
||||
## Beginner
|
||||
> These challenges are of beginner level. They are rather easy.
|
||||
|
||||
## Intermediate
|
||||
> These challenges are a bit harder, they also won't explain too much about how to use them
|
||||
|
||||
* A small [Hidden Service](/hidden_service/) used by an admin.
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
# About
|
||||
So yeah, I got bored one day and decided to make some challenges for fun. These can be CTF related or just general "find the flag" kind of challenges. Sometimes multiple challenges are linked together in a way that they form a story.
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
# Easy challenges
|
||||
> These challenges are considered easy, they basically guide you to what to do. Do remember to read everything correctly okay?
|
||||
|
||||
## Finally
|
||||
You are not a master yet, but you can get closer [here](/medium)
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
# Hard
|
||||
> These challenges simply don't tell you what to do at all, these are supposed to be hard for first/second year CSE students.
|
||||
|
||||
## Finally
|
||||
Yeah, you are a master now, and I hope you had fun! - J
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
# Are you up for the challenge?
|
||||
Hello and welcome to Voidcorp Challenges! On this site I will post challenges from time to time to teach people about CTF's, ethical hacking and that sort of fun stuff.
|
||||
|
||||
## Levels
|
||||
There are different levels of challenges, easy, medium and hard. The premise of what I concider easy, medium or hard are on the respected pages, but if you have 0 experience with hacking or Linux, I'd suggest starting at Easy.
|
||||
|
||||
## Prerequisites
|
||||
It can be useful to know a bit about Linux commands and the like, things like `ls` and `cd` are quite useful to know how to use. It is also recommended to use a Linux VM or actual install to do these challenges, since all the challenges are ran in Linux VM's.
|
||||
|
||||
## Are you ready?
|
||||
[Aye aye, captain!](/easy)
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
# Medium
|
||||
> These challenges are not too hard, but also not too easy. Sometimes they provide instructions on how to start.
|
||||
|
||||
## Socks to be you
|
||||
### The story so far
|
||||
Our friendly IT guy John has set up a hidden service to control his VM's.
|
||||
The only problem is that his rival in the company, Dave, kind of wants to screw John over.
|
||||
This is not an issue for John, he is quite capable with coding and knows exactly which commands to use. This is quite useful when he wants to hide the commands from Dave.
|
||||
Dave did however figure out where the server is hosted: [wsecho.voidcorp.nl](https://wsecho.voidcorp.nl)!
|
||||
Now dave wants to find John's password to really screw him over. He knows dave so it probably isn't hidden too well...
|
||||
|
||||
#### Your mission
|
||||
1. Hack into the server
|
||||
2. Read the hidden password (format=`flag{xxx}`)
|
||||
3. Report back to Dave (aka the sender of this mission) with the password!
|
||||
|
||||
|
||||
## Finally
|
||||
Getting closer to being considered a master, but you'll have to get the rank [here](/hard)!
|
||||
17
freeze.py
17
freeze.py
|
|
@ -1,17 +0,0 @@
|
|||
from flask_frozen import Freezer
|
||||
from app import app, templates
|
||||
|
||||
|
||||
# app.config["FREEZER_IGNORE_MIMETYPE_WARNINGS"] = True
|
||||
freezer = Freezer(app)
|
||||
|
||||
|
||||
@freezer.register_generator
|
||||
def render():
|
||||
for p in templates:
|
||||
p = p.rpartition(".")[0]
|
||||
yield {"md": p}
|
||||
|
||||
|
||||
if __name__ == '__main__':
|
||||
freezer.freeze()
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
site_name: Voidcorp Challenges
|
||||
nav:
|
||||
- Home: index.md
|
||||
- Easy: easy.md
|
||||
- Medium: medium.md
|
||||
- Hard: hard.md
|
||||
- About: about.md
|
||||
theme:
|
||||
name: mkdocs
|
||||
shortcuts:
|
||||
help: 191 # ?
|
||||
next: 78 # n
|
||||
previous: 80 # p
|
||||
search: 83 # s
|
||||
repo_url: https://gitlab.voidcorp.nl/jdejeu/ctf-site
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
[{000214A0-0000-0000-C000-000000000046}]
|
||||
Prop3=19,2
|
||||
[InternetShortcut]
|
||||
IDList=
|
||||
URL=http://www.html5webtemplates.co.uk/
|
||||
HotKey=0
|
||||
IconFile=C:\Windows\system32\SHELL32.dll
|
||||
IconIndex=277
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
Thanks for downloading this template from HTML5WebTemplates.co.uk
|
||||
|
||||
I hope that it suits your needs.
|
||||
|
||||
If you wish to remove the footer link (to http://www.html5webtemplates.co.uk/) I ask that you make a donation of £15 via Paypal.
|
||||
|
||||
You can make a donation at the following address:http://www.html5webtemplates.co.uk/faqs.html
|
||||
|
||||
If you have any questions please feel free to e-mail me at contact@html5webtemplates.co.uk
|
||||
|
||||
Best regards,
|
||||
|
||||
HTML5WebTemplates.co.uk
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
[InternetShortcut]
|
||||
URL=http://www.html5webtemplates.co.uk/faqs.html
|
||||
IDList=
|
||||
HotKey=0
|
||||
IconFile=C:\Windows\system32\SHELL32.dll
|
||||
IconIndex=44
|
||||
|
|
@ -1,75 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>black_white - another page</title>
|
||||
<meta name="description" content="website description" />
|
||||
<meta name="keywords" content="website keywords, website keywords" />
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||
<link rel="stylesheet" type="text/css" href="style/style.css" title="style" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="main">
|
||||
<div id="header">
|
||||
<div id="logo">
|
||||
<div id="logo_text">
|
||||
<!-- class="logo_colour", allows you to change the colour of the text -->
|
||||
<h1><a href="index.html">black<span class="logo_colour">_white</span></a></h1>
|
||||
<h2>Simple. Contemporary. Website Template.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menubar">
|
||||
<ul id="menu">
|
||||
<!-- put class="selected" in the li tag for the selected page - to highlight which page you're on -->
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="examples.html">Examples</a></li>
|
||||
<li><a href="page.html">A Page</a></li>
|
||||
<li class="selected"><a href="another_page.html">Another Page</a></li>
|
||||
<li><a href="contact.html">Contact Us</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="site_content">
|
||||
<div class="sidebar">
|
||||
<!-- insert your sidebar items here -->
|
||||
<h3>Latest News</h3>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<p></p>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<h3>Useful Links</h3>
|
||||
<ul>
|
||||
<li><a href="#">link 1</a></li>
|
||||
<li><a href="#">link 2</a></li>
|
||||
<li><a href="#">link 3</a></li>
|
||||
<li><a href="#">link 4</a></li>
|
||||
</ul>
|
||||
<h3>Search</h3>
|
||||
<form method="post" action="#" id="search_form">
|
||||
<p>
|
||||
<input class="search" type="text" name="search_field" value="Enter keywords....." />
|
||||
<input name="search" type="image" style="border: 0; margin: 0 0 -9px 5px;" src="style/search.png" alt="Search" title="Search" />
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
<div id="content">
|
||||
<!-- insert the page content here -->
|
||||
<h1>Another Page</h1>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
Copyright © black_white | <a href="http://validator.w3.org/check?uri=referer">HTML5</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> | <a href="http://www.html5webtemplates.co.uk">Free CSS Templates</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>black_white - contact us</title>
|
||||
<meta name="description" content="website description" />
|
||||
<meta name="keywords" content="website keywords, website keywords" />
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||
<link rel="stylesheet" type="text/css" href="style/style.css" title="style" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="main">
|
||||
<div id="header">
|
||||
<div id="logo">
|
||||
<div id="logo_text">
|
||||
<!-- class="logo_colour", allows you to change the colour of the text -->
|
||||
<h1><a href="index.html">black<span class="logo_colour">_white</span></a></h1>
|
||||
<h2>Simple. Contemporary. Website Template.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menubar">
|
||||
<ul id="menu">
|
||||
<!-- put class="selected" in the li tag for the selected page - to highlight which page you're on -->
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="examples.html">Examples</a></li>
|
||||
<li><a href="page.html">A Page</a></li>
|
||||
<li><a href="another_page.html">Another Page</a></li>
|
||||
<li class="selected"><a href="contact.html">Contact Us</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="site_content">
|
||||
<div class="sidebar">
|
||||
<!-- insert your sidebar items here -->
|
||||
<h3>Latest News</h3>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<p></p>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<h3>Useful Links</h3>
|
||||
<ul>
|
||||
<li><a href="#">link 1</a></li>
|
||||
<li><a href="#">link 2</a></li>
|
||||
<li><a href="#">link 3</a></li>
|
||||
<li><a href="#">link 4</a></li>
|
||||
</ul>
|
||||
<h3>Search</h3>
|
||||
<form method="post" action="#" id="search_form">
|
||||
<p>
|
||||
<input class="search" type="text" name="search_field" value="Enter keywords....." />
|
||||
<input name="search" type="image" style="border: 0; margin: 0 0 -9px 5px;" src="style/search.png" alt="Search" title="Search" />
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
<div id="content">
|
||||
<!-- insert the page content here -->
|
||||
<h1>Contact Us</h1>
|
||||
<p>Below is an example of how a contact form might look with this template:</p>
|
||||
<form action="#" method="post">
|
||||
<div class="form_settings">
|
||||
<p><span>Name</span><input class="contact" type="text" name="your_name" value="" /></p>
|
||||
<p><span>Email Address</span><input class="contact" type="text" name="your_email" value="" /></p>
|
||||
<p><span>Message</span><textarea class="contact textarea" rows="8" cols="50" name="your_enquiry"></textarea></p>
|
||||
<p style="padding-top: 15px"><span> </span><input class="submit" type="submit" name="contact_submitted" value="submit" /></p>
|
||||
</div>
|
||||
</form>
|
||||
<p><br /><br />NOTE: A contact form such as this would require some way of emailing the input to an email address.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
Copyright © black_white | <a href="http://validator.w3.org/check?uri=referer">HTML5</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> | <a href="http://www.html5webtemplates.co.uk">Free CSS Templates</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,135 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>black_white - examples</title>
|
||||
<meta name="description" content="website description" />
|
||||
<meta name="keywords" content="website keywords, website keywords" />
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||
<link rel="stylesheet" type="text/css" href="style/style.css" title="style" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="main">
|
||||
<div id="header">
|
||||
<div id="logo">
|
||||
<div id="logo_text">
|
||||
<!-- class="logo_colour", allows you to change the colour of the text -->
|
||||
<h1><a href="index.html">black<span class="logo_colour">_white</span></a></h1>
|
||||
<h2>Simple. Contemporary. Website Template.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menubar">
|
||||
<ul id="menu">
|
||||
<!-- put class="selected" in the li tag for the selected page - to highlight which page you're on -->
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li class="selected"><a href="examples.html">Examples</a></li>
|
||||
<li><a href="page.html">A Page</a></li>
|
||||
<li><a href="another_page.html">Another Page</a></li>
|
||||
<li><a href="contact.html">Contact Us</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="site_content">
|
||||
<div class="sidebar">
|
||||
<!-- insert your sidebar items here -->
|
||||
<h3>Latest News</h3>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<p></p>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<h3>Useful Links</h3>
|
||||
<ul>
|
||||
<li><a href="#">link 1</a></li>
|
||||
<li><a href="#">link 2</a></li>
|
||||
<li><a href="#">link 3</a></li>
|
||||
<li><a href="#">link 4</a></li>
|
||||
</ul>
|
||||
<h3>Search</h3>
|
||||
<form method="post" action="#" id="search_form">
|
||||
<p>
|
||||
<input class="search" type="text" name="search_field" value="Enter keywords....." />
|
||||
<input name="search" type="image" style="border: 0; margin: 0 0 -9px 5px;" src="style/search.png" alt="Search" title="Search" />
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
<div id="content">
|
||||
<!-- insert the page content here -->
|
||||
<h1>Examples</h1>
|
||||
<p>This page contains examples of all the styled elements available as part of this design. Use this page for reference, whilst you build your website.</p>
|
||||
<h2>Headings</h2>
|
||||
<p>These are the different heading formats:</p>
|
||||
<h1>Heading 1</h1>
|
||||
<h2>Heading 2</h2>
|
||||
<h3>Heading 3</h3>
|
||||
<h4>Heading 4</h4>
|
||||
<h5>Heading 5</h5>
|
||||
<h6>Heading 6</h6>
|
||||
<h2>Text</h2>
|
||||
<p>The following examples show how the text (within '<p></p>' tags) will appear:</p>
|
||||
<p><strong>This is an example of bold text</strong></p>
|
||||
<p><i>This is an example of italic text</i></p>
|
||||
<p><a href="#">This is a hyperlink</a></p>
|
||||
<h2>Lists</h2>
|
||||
<p>This is an unordered list:</p>
|
||||
<ul>
|
||||
<li>Item 1</li>
|
||||
<li>Item 2</li>
|
||||
<li>Item 3</li>
|
||||
<li>Item 4</li>
|
||||
</ul>
|
||||
<p>This is an ordered list:</p>
|
||||
<ol>
|
||||
<li>Item 1</li>
|
||||
<li>Item 2</li>
|
||||
<li>Item 3</li>
|
||||
<li>Item 4</li>
|
||||
</ol>
|
||||
<h2>Images</h2>
|
||||
<p>images can be placed on the left, in the center or on the right:</p>
|
||||
<span class="left"><img src="style/graphic.png" alt="example graphic" /></span>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
|
||||
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
|
||||
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
|
||||
irure dolor in reprehenderit in voluptate velit esse cillum.
|
||||
</p>
|
||||
<span class="center"><img src="style/graphic.png" alt="example graphic" /></span>
|
||||
<span class="right"><img src="style/graphic.png" alt="example graphic" /></span>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
|
||||
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
|
||||
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
|
||||
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
|
||||
pariatur.
|
||||
</p>
|
||||
<h2>Tables</h2>
|
||||
<p>Tables should be used to display data and not used for laying out your website:</p>
|
||||
<table style="width:100%; border-spacing:0;">
|
||||
<tr><th>Item</th><th>Description</th></tr>
|
||||
<tr><td>Item 1</td><td>Description of Item 1</td></tr>
|
||||
<tr><td>Item 2</td><td>Description of Item 2</td></tr>
|
||||
<tr><td>Item 3</td><td>Description of Item 3</td></tr>
|
||||
<tr><td>Item 4</td><td>Description of Item 4</td></tr>
|
||||
</table>
|
||||
<h2>Form Elements</h2>
|
||||
<form action="#" method="post">
|
||||
<div class="form_settings">
|
||||
<p><span>Form field example</span><input type="text" name="name" value="" /></p>
|
||||
<p><span>Textarea example</span><textarea rows="8" cols="50" name="name"></textarea></p>
|
||||
<p><span>Checkbox example</span><input class="checkbox" type="checkbox" name="name" value="" /></p>
|
||||
<p><span>Dropdown list example</span><select id="id" name="name"><option value="1">Example 1</option><option value="2">Example 2</option></select></p>
|
||||
<p style="padding-top: 15px"><span> </span><input class="submit" type="submit" name="name" value="button" /></p>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
Copyright © black_white | <a href="http://validator.w3.org/check?uri=referer">HTML5</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> | <a href="http://www.html5webtemplates.co.uk">Free CSS Templates</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,80 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>black_white</title>
|
||||
<meta name="description" content="website description" />
|
||||
<meta name="keywords" content="website keywords, website keywords" />
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||
<link rel="stylesheet" type="text/css" href="/static/style/style.css" title="style" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="main">
|
||||
<div id="header">
|
||||
<div id="logo">
|
||||
<div id="logo_text">
|
||||
<!-- class="logo_colour", allows you to change the colour of the text -->
|
||||
<h1><a href="index.html">black<span class="logo_colour">_white</span></a></h1>
|
||||
<h2>Simple. Contemporary. Website Template.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menubar">
|
||||
<ul id="menu">
|
||||
<!-- put class="selected" in the li tag for the selected page - to highlight which page you're on -->
|
||||
<li class="selected"><a href="index.html">Home</a></li>
|
||||
<li><a href="examples.html">Examples</a></li>
|
||||
<li><a href="page.html">A Page</a></li>
|
||||
<li><a href="another_page.html">Another Page</a></li>
|
||||
<li><a href="contact.html">Contact Us</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="site_content">
|
||||
<div class="sidebar">
|
||||
<!-- insert your sidebar items here -->
|
||||
<h3>Latest News</h3>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<p></p>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<h3>Useful Links</h3>
|
||||
<ul>
|
||||
<li><a href="#">link 1</a></li>
|
||||
<li><a href="#">link 2</a></li>
|
||||
<li><a href="#">link 3</a></li>
|
||||
<li><a href="#">link 4</a></li>
|
||||
</ul>
|
||||
<h3>Search</h3>
|
||||
<form method="post" action="#" id="search_form">
|
||||
<p>
|
||||
<input class="search" type="text" name="search_field" value="Enter keywords....." />
|
||||
<input name="search" type="image" style="border: 0; margin: 0 0 -9px 5px;" src="style/search.png" alt="Search" title="Search" />
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
<div id="content">
|
||||
<!-- insert the page content here -->
|
||||
<h1>Welcome to the black_white template</h1>
|
||||
<p>This standards compliant, simple, fixed width website template is released as an 'open source' design (under a <a href="http://creativecommons.org/licenses/by/3.0">Creative Commons Attribution 3.0 Licence</a>), which means that you are free to download and use it for anything you want (including modifying and amending it). All I ask is that you leave the 'design from HTML5webtemplates.co.uk' link in the footer of the template, but other than that...</p>
|
||||
<p>This template is written entirely in <strong>HTML5</strong> and <strong>CSS</strong>, and can be validated using the links in the footer.</p>
|
||||
<p>You can view more free HTML5 web templates <a href="http://www.html5webtemplates.co.uk">here</a>.</p>
|
||||
<p>This template is a fully functional 5 page website, with an <a href="examples.html">examples</a> page that gives examples of all the styles available with this design.</p>
|
||||
<h2>Browser Compatibility</h2>
|
||||
<p>This template has been tested in the following browsers:</p>
|
||||
<ul>
|
||||
<li>Internet Explorer 9</li>
|
||||
<li>FireFox 25</li>
|
||||
<li>Google Chrome 31</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
Copyright © black_white | <a href="http://validator.w3.org/check?uri=referer">HTML5</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> | <a href="http://www.html5webtemplates.co.uk">Free CSS Templates</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,75 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>black_white - a page</title>
|
||||
<meta name="description" content="website description" />
|
||||
<meta name="keywords" content="website keywords, website keywords" />
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||
<link rel="stylesheet" type="text/css" href="style/style.css" title="style" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="main">
|
||||
<div id="header">
|
||||
<div id="logo">
|
||||
<div id="logo_text">
|
||||
<!-- class="logo_colour", allows you to change the colour of the text -->
|
||||
<h1><a href="index.html">black<span class="logo_colour">_white</span></a></h1>
|
||||
<h2>Simple. Contemporary. Website Template.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menubar">
|
||||
<ul id="menu">
|
||||
<!-- put class="selected" in the li tag for the selected page - to highlight which page you're on -->
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="examples.html">Examples</a></li>
|
||||
<li class="selected"><a href="page.html">A Page</a></li>
|
||||
<li><a href="another_page.html">Another Page</a></li>
|
||||
<li><a href="contact.html">Contact Us</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="site_content">
|
||||
<div class="sidebar">
|
||||
<!-- insert your sidebar items here -->
|
||||
<h3>Latest News</h3>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<p></p>
|
||||
<h4>New Website Launched</h4>
|
||||
<h5>July 1st, 2014</h5>
|
||||
<p>2014 sees the redesign of our website. Take a look around and let us know what you think.<br /><a href="#">Read more</a></p>
|
||||
<h3>Useful Links</h3>
|
||||
<ul>
|
||||
<li><a href="#">link 1</a></li>
|
||||
<li><a href="#">link 2</a></li>
|
||||
<li><a href="#">link 3</a></li>
|
||||
<li><a href="#">link 4</a></li>
|
||||
</ul>
|
||||
<h3>Search</h3>
|
||||
<form method="post" action="#" id="search_form">
|
||||
<p>
|
||||
<input class="search" type="text" name="search_field" value="Enter keywords....." />
|
||||
<input name="search" type="image" style="border: 0; margin: 0 0 -9px 5px;" src="style/search.png" alt="Search" title="Search" />
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
<div id="content">
|
||||
<!-- insert the page content here -->
|
||||
<h1>A Page</h1>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
Copyright © black_white | <a href="http://validator.w3.org/check?uri=referer">HTML5</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> | <a href="http://www.html5webtemplates.co.uk">Free CSS Templates</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 36 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 989 B |
Binary file not shown.
|
Before Width: | Height: | Size: 7.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 911 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB |
|
|
@ -1,292 +0,0 @@
|
|||
html
|
||||
{ height: 100%;}
|
||||
|
||||
*
|
||||
{ margin: 0;
|
||||
padding: 0;}
|
||||
|
||||
body
|
||||
{ font: normal .80em 'trebuchet ms', arial, sans-serif;
|
||||
background: #F0EFE2 url(background.png) repeat;
|
||||
color: #000;}
|
||||
|
||||
p
|
||||
{ padding: 0 0 20px 0;
|
||||
line-height: 1.7em;}
|
||||
|
||||
img
|
||||
{ border: 0;}
|
||||
|
||||
h1, h2, h3, h4, h5, h6
|
||||
{ font: normal 175% 'century gothic', arial, sans-serif;
|
||||
color: #000;
|
||||
margin: 0 0 15px 0;
|
||||
padding: 15px 0 5px 0;}
|
||||
|
||||
h2
|
||||
{ font: normal 175% 'century gothic', arial, sans-serif;}
|
||||
|
||||
h4, h5, h6
|
||||
{ margin: 0;
|
||||
padding: 0 0 5px 0;
|
||||
font: normal 120% arial, sans-serif;}
|
||||
|
||||
h5, h6
|
||||
{ font: italic 95% arial, sans-serif;
|
||||
padding: 0 0 15px 0;}
|
||||
|
||||
a, a:hover
|
||||
{ outline: none;
|
||||
text-decoration: underline;
|
||||
color: #000;}
|
||||
|
||||
a:hover
|
||||
{ text-decoration: none;}
|
||||
|
||||
.left
|
||||
{ float: left;
|
||||
width: auto;
|
||||
margin-right: 10px;}
|
||||
|
||||
.right
|
||||
{ float: right;
|
||||
width: auto;
|
||||
margin-left: 10px;}
|
||||
|
||||
.center
|
||||
{ display: block;
|
||||
text-align: center;
|
||||
margin: 20px auto;}
|
||||
|
||||
blockquote
|
||||
{ margin: 20px 0;
|
||||
padding: 10px 20px 0 20px;
|
||||
border: 1px solid #E5E5DB;
|
||||
background: #FFF;}
|
||||
|
||||
ul
|
||||
{ margin: 2px 0 22px 17px;}
|
||||
|
||||
ul li
|
||||
{ list-style-type: circle;
|
||||
margin: 0 0 6px 0;
|
||||
padding: 0 0 4px 5px;}
|
||||
|
||||
ol
|
||||
{ margin: 8px 0 22px 20px;}
|
||||
|
||||
ol li
|
||||
{ margin: 0 0 11px 0;}
|
||||
|
||||
#main, #logo, #menubar, #site_content, #footer
|
||||
{ margin-left: auto;
|
||||
margin-right: auto;}
|
||||
|
||||
#header
|
||||
{ background: transparent;
|
||||
height: 202px;}
|
||||
|
||||
#logo
|
||||
{ width: 898px;
|
||||
position: relative;
|
||||
height: 148px;
|
||||
border-bottom: 2px solid #FFF;}
|
||||
|
||||
#logo #logo_text
|
||||
{ position: absolute;
|
||||
top: 20px;
|
||||
left: 0;}
|
||||
|
||||
#logo h1, #logo h2
|
||||
{ font: normal 300% 'century gothic', arial, sans-serif;
|
||||
border-bottom: 0;
|
||||
text-transform: none;
|
||||
margin: 0;}
|
||||
|
||||
#logo_text h1, #logo_text h1 a, #logo_text h1 a:hover
|
||||
{ padding: 22px 0 0 0;
|
||||
color: #FFF;
|
||||
letter-spacing: -1px;
|
||||
text-decoration: none;}
|
||||
|
||||
#logo_text h1 a .logo_colour
|
||||
{ color: #FFF;}
|
||||
|
||||
#logo_text h2
|
||||
{ font-size: 100%;
|
||||
padding: 4px 0 0 0;
|
||||
color: #FFF;}
|
||||
|
||||
#menubar
|
||||
{ width: 898px;
|
||||
height: 52px;
|
||||
padding: 0;
|
||||
background: #000;}
|
||||
|
||||
ul#menu, ul#menu li
|
||||
{ float: left;
|
||||
margin: 0;
|
||||
padding: 0;}
|
||||
|
||||
ul#menu li
|
||||
{ list-style: none;}
|
||||
|
||||
ul#menu li a
|
||||
{ letter-spacing: 0.1em;
|
||||
font: normal 100% arial, sans-serif;
|
||||
display: block;
|
||||
float: left;
|
||||
height: 17px;
|
||||
margin: 10px 0 0 10px;
|
||||
padding: 9px 26px 6px 26px;
|
||||
text-align: center;
|
||||
color: #FFF;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
background: transparent;}
|
||||
|
||||
ul#menu li a:hover, ul#menu li.selected a, ul#menu li.selected a:hover
|
||||
{ color: #FFF;
|
||||
background: transparent url(transparent_light.png) repeat;}
|
||||
|
||||
#site_content
|
||||
{ width: 854px;
|
||||
overflow: hidden;
|
||||
margin: 0 auto 0 auto;
|
||||
padding: 0 24px 20px 20px;
|
||||
background: #FFF;}
|
||||
|
||||
.sidebar
|
||||
{ float: right;
|
||||
width: 210px;
|
||||
padding: 0 15px 20px 15px;}
|
||||
|
||||
.sidebar ul
|
||||
{ width: 198px;
|
||||
padding: 4px 0 0 0;
|
||||
margin: 4px 0 30px 0;}
|
||||
|
||||
.sidebar li
|
||||
{ list-style: none;
|
||||
padding: 0 0 7px 0; }
|
||||
|
||||
.sidebar li a, .sidebar li a:hover
|
||||
{ padding: 0 0 0 40px;
|
||||
display: block;
|
||||
background: transparent url(link.png) no-repeat left center;}
|
||||
|
||||
.sidebar li a.selected
|
||||
{ color: #7E2451;
|
||||
text-decoration: none;}
|
||||
|
||||
#content
|
||||
{ text-align: left;
|
||||
float: left;
|
||||
width: 595px;
|
||||
padding: 0;}
|
||||
|
||||
#content ul
|
||||
{ margin: 2px 0 22px 0px;}
|
||||
|
||||
#content ul li
|
||||
{ list-style-type: none;
|
||||
background: url(bullet.png) no-repeat;
|
||||
margin: 0 0 6px 0;
|
||||
padding: 0 0 4px 25px;
|
||||
line-height: 1.5em;}
|
||||
|
||||
#footer
|
||||
{ width: 898px;
|
||||
font: normal 100% 'lucida sans unicode', arial, sans-serif;
|
||||
height: 33px;
|
||||
padding: 24px 0 5px 0;
|
||||
text-align: center;
|
||||
background: transparent;
|
||||
color: #FFF;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.1em;}
|
||||
|
||||
#footer a
|
||||
{ color: #FFF;
|
||||
text-decoration: none;}
|
||||
|
||||
#footer a:hover
|
||||
{ color: #FFF;
|
||||
text-decoration: underline;}
|
||||
|
||||
.search
|
||||
{ color: #5D5D5D;
|
||||
border: 1px solid #BBB;
|
||||
width: 134px;
|
||||
padding: 4px;
|
||||
font: 100% arial, sans-serif;}
|
||||
|
||||
#colours
|
||||
{ height: 0px;
|
||||
text-align: right;
|
||||
padding: 66px 16px 0px 300px;}
|
||||
|
||||
.form_settings
|
||||
{ margin: 15px 0 0 0;}
|
||||
|
||||
.form_settings p
|
||||
{ padding: 0 0 4px 0;}
|
||||
|
||||
.form_settings span
|
||||
{ float: left;
|
||||
width: 200px;
|
||||
text-align: left;}
|
||||
|
||||
.form_settings input, .form_settings textarea
|
||||
{ padding: 5px;
|
||||
width: 299px;
|
||||
font: 100% arial;
|
||||
border: 1px solid #E5E5DB;
|
||||
background: #FFF;
|
||||
color: #47433F;}
|
||||
|
||||
.form_settings .submit
|
||||
{ font: 100% arial;
|
||||
border: 1px solid;
|
||||
width: 99px;
|
||||
margin: 0 0 0 212px;
|
||||
height: 33px;
|
||||
padding: 2px 0 3px 0;
|
||||
cursor: pointer;
|
||||
background: #000;
|
||||
color: #FFF;}
|
||||
|
||||
.form_settings textarea, .form_settings select
|
||||
{ font: 100% arial;
|
||||
width: 299px;}
|
||||
|
||||
.form_settings select
|
||||
{ width: 310px;}
|
||||
|
||||
.form_settings .checkbox
|
||||
{ margin: 4px 0;
|
||||
padding: 0;
|
||||
width: 14px;
|
||||
border: 0;
|
||||
background: none;}
|
||||
|
||||
.separator
|
||||
{ width: 100%;
|
||||
height: 0;
|
||||
border-top: 1px solid #D9D5CF;
|
||||
border-bottom: 1px solid #FFF;
|
||||
margin: 0 0 20px 0;}
|
||||
|
||||
table
|
||||
{ margin: 10px 0 30px 0;}
|
||||
|
||||
table tr th, table tr td
|
||||
{ background: #3B3B3B;
|
||||
color: #FFF;
|
||||
padding: 7px 4px;
|
||||
text-align: left;}
|
||||
|
||||
table tr td
|
||||
{ background: #F0EFE2;
|
||||
color: #47433F;
|
||||
border-top: 1px solid #FFF;}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 199 B |
Binary file not shown.
|
Before Width: | Height: | Size: 147 B |
|
|
@ -1,17 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Voidcorp challenges!</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
|
||||
</header>
|
||||
<main>
|
||||
{{content}}
|
||||
</main>
|
||||
<footer>
|
||||
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue