Browse Source

up

master
apoc 2 months ago
commit
35ca8a3015
7 changed files with 226 additions and 0 deletions
  1. 13
    0
      .editorconfig
  2. 2
    0
      README.md
  3. 22
    0
      commit.md
  4. 51
    0
      index.htm
  5. 54
    0
      pages/advertisement/create.htm
  6. 34
    0
      pages/advertisement/manage.htm
  7. 50
    0
      style.css

+ 13
- 0
.editorconfig View File

@@ -0,0 +1,13 @@
root = true

[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
indent_style = space
indent_size = 4
trim_trailing_whitespace = true

[*.md]
trim_trailing_whitespace = false


+ 2
- 0
README.md View File

@@ -0,0 +1,2 @@
# bazaar-design
web design for the bazaar application

+ 22
- 0
commit.md View File

@@ -0,0 +1,22 @@
Once you're satisfied with the changes you've staged and want to update the project with them, you will can run

```
git commit
```

git will then open your text editor as a prompt for the commit message - you see you have to explain what changes you have made to the project you are working on, this is done via commit messages:

```

# Please enter the commit message for your changes. Lines starting
# with '#' will be ignored, and an empty message aborts the commit.
#
# On branch master
# Your branch is up to date with 'origin/master'.
#
# Changes to be committed:
# modified: index.htm
#
```

The first, empty, line is where you input your commit message.

+ 51
- 0
index.htm View File

@@ -0,0 +1,51 @@
<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' href='style.css'>

</head>
<body>

<div class="container">

<!-- navigation html below this line-->
<header>banner</header>
<nav class='box'>
<h2>navigation</h2>
<ul>
<li><a href="#">home</a></li>
<li><a href="github.com/aste-risk">about</a></li>
<li><a href="#">your advertisements</a></li>
<li><a href="pages/advertisement/create.htm">create advertisement</a></li>
</ul>
</nav>

<!-- home page html below this line-->
<div class='box'>
<h2>catalog</h2>
<section class='content'>

<form method='GET'>
<input type='search' placeholder='search' />
<select>
<option>1</option>
<option>2</option>
</select>
</form>

<p>a catalog-like advertisement listing goes here</p>
<article class='box'>
<h2><a href='advertisement/1'>advertisement nr1</a></h2>
<p class='description'>description of advertisement nr1</p>
</article>
<article class='box'>
<h2><a href='advertisement/2'>advertisement nr2</a></h2>
<p class='description'>advertisement nr2 descriptions</p>
</article>
</section>
</div>

</div>

</body>
</html>

+ 54
- 0
pages/advertisement/create.htm View File

@@ -0,0 +1,54 @@
<!DOCTYPE html>
<html>
<head>
<title>create advertisement page</title>
<link rel='stylesheet' href='../../style.css'>
</head>
<body>
<div class='container'>

<!-- navigation html below this line-->
<header>banner</header>
<nav class='box'>
<h2>navigation</h2>
<ul>
<li><a href="#">home</a></li>
<li><a href="github.com/aste-risk">about</a></li>
<li><a href="#">your advertisements</a></li>
<li><a href="pages/advertisement/create.htm">create advertisement</a></li>
</ul>
</nav>

<!-- home page html below this line-->
<div class='box'>
<h2>create advertisements page</h2>
<section class='content'>

<ul>
select advertisement type:

<li>real estate:
<ul>
<li><a href="#">buying</a></li>
<li><a href="#">renting</a></li>
<li><a href="#">services</a></li>
</ul>
</li>

<li>vehicle:
<ul>
<li><a href="#">buying</a></li>
<li><a href="#">renting</a></li>
<li><a href="#">services</a></li>
</ul>
</li>

<hr />
<a href="./manage.htm">continue</a>

</section>
</div>

</div>
</body>
</html>

+ 34
- 0
pages/advertisement/manage.htm View File

@@ -0,0 +1,34 @@
<!DOCTYPE html>
<html>
<head>
<title>advertisement management</title>
<link rel='stylesheet' href='../../style.css' />
</head>
<body>
<div class='container'>

<header>banner</header>
<nav class='box'>
<h2>navigation</h2>
<ul>
<li><a href="#">a</a></li>
</ul>
</nav>

<div class='box'>
<h2>advertisement management</h2>
<section class='content'>

<form>
<input type='text' />
<input type='submit' />
<hr />
<textarea></textarea>
</form>

</section>
</div>

</div>
</body>
</html>

+ 50
- 0
style.css View File

@@ -0,0 +1,50 @@
body {
margin: 0;
}
.container {
/* properties: spatial properties for the targeted/selected DOM element (.container) */
display: block;
width: 600px;

/* positioning: positional properties of the DOM element, usually in relation to other and parent elements */
margin: 0 auto;
}

header {
/* properties */
padding: 1em;
margin: 0 0 1em 0; /* akin to "margin-bottom: 1em;", goes top-right-bottom-left clockwise*/

/* styling: visual properties of the selected DOM element */
background: #268BD2;
color: #FFF;

/* other: other properties of the selected DOM element */
font-size: 2em;
}

.box {
margin: 1em;
border: 1px solid #AAA;
}

nav li {
/* properties */
display: inline-block; /* a block takes up full width (100% page width), an inline-block take as much as the element is wide */
}

nav li a {
/* styling */
color: #555;
}

.box h2 {
margin: 0;
padding: 3px;

background: #AAA;
color: #555;
}

.box section.content, .box .description {
padding: 1em;

Loading…
Cancel
Save