Friday, February 5, 2010

Development 6

The page elements from this template were rounded at the corners with images like this put on top of them. Now that the background and header-background picture were set, these corners were no longer usable (because the width and colors did not match) . I wanted to get rid of them, but I did not want to lose them. I started surrounding the part of the code that consisted them with /* */, which makes it inactive. While I was doing this, I accidentally found out that the sidebars do not need to have a background different from the patterned one. I really liked the sidebar transparent and left it this way.

Development 5

I decided to make it more interesting and put a pattern on the background. I typed "patt" in Google Images and started plugging in URL-s in the code here:
body {
background:url("http://free4illustrator.com/wp-content/uploads/1%282%29.jpg");
margin:0;
text-align:center;
line-height: 1.5em;
font: x-small Trebuchet MS, Verdana, Arial, Sans-serif;
color:$mainTextColor;
font-size/* */:/**/small;
font-size: /**/small;
}

Then I figured I should narrow down the search and choose green color from the search options. I found this pattern and really liked it, because of the 3D effect.

Thursday, February 4, 2010

Photo Essay

You can see my Photo Essay here
Enjoy! :)

Development 4

I uploaded an image as header background. First, I changed the width of the outer-wrap to 1000px (I did it because I wanted to add another sidebar). I cropped the photo I wanted to put there and resided it to be 1000px wide. I uploaded it on the dada.cca.edu (using FileZilla btw). Then I copied the URL in the code: #header {
background:url("http://dada.cca.edu/~eivanova/header_pic1.jpg") no-repeat $startSide bottom;
padding:50px 15px 8px;
}
The top and the bottom of the image were cut off and I had to play around with the padding for the text to fix it.

When I uploaded a header-background image through Layout/Page Elements it was not centered.