The forum of the forums
Welcome on Forumotion Support Forum.

To take full advantage of everything offered by our forum, thank you to log in if you are already a member or join our community if you're not yet....



Create a free forum like this one.

Customize attachments frame

Post new topic   Reply to topic

View previous topic View next topic Go down

Customize attachments frame

Post by Typlo on March 30th 2010, 9:53 am

Customize attachments frame


Following the update last week, Forumotion provides this trick so you can customize the attachments:

Note


The effect only appears
for members using
browsers:

  • Firefox
  • Safari
  • Google Chrome


CSS addition

Admin panel Display Colors CSS Stylesheet


Add this code :

Code:
.attachbox{
background-color: #191919;
background-image: url('http://i65.servimg.com/u/f65/11/95/30/70/fond12.jpg');
border: 1px solid #888888;
-moz-border-radius-topleft: 15px;
-webkit-border-radius-topleft: 15px;
-moz-border-radius-topright: 15px;
-webkit-border-radius-topright: 15px;
-moz-border-radius-bottomright: 0px;
-webkit-border-radius-bottomright: 0px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-radius-bottomleft: 0px;
color:#ffffff;
}
 
.attachbox dl.file{
background-color: #212121;
margin-top: 8px;
padding: 5px;
border: 1px solid #fff;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
}




Summary of CSS properties:



.attachbox
>> Part A
background-color: #191919; >> Background color
background-image:
url('http:image.address');
>> Background image
border: 1px solid #888888; >> Part A border
-moz-border-radius-topleft: 15px;
-webkit-border-radius-topleft: 15px;
-moz-border-radius-topright: 15px;
-webkit-border-radius-topright: 15px;
-moz-border-radius-bottomright: 0px;
-webkit-border-radius-bottomright: 0px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-radius-bottomleft: 0px;
>> The 4 corners
color:#ffffff; >> Part A text color
.attachbox dl.file
>> Part B
background-color: #212121; >> Background color
margin-top: 8px; >> the outer margin high (top)
(See image B)
padding: 5px; >> The inner margin
(See image B)
border: 1px solid #fff; >> Border color
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
>> The 4 corners



Image B


This tutorial has been made by the French staff

No reproduction possible without our agreement, pursuant to Article L122-1 of the ICC.


Last edited by Typlo on April 1st 2010, 9:30 am; edited 2 times in total

Typlo
Administrator
Administrator

Male
Posts: 3021
Age: 24
Language: French, English
Country:
Join date: 2007-09-04

Back to top Go down

View previous topic View next topic Back to top


Permissions of this forum:
You cannot reply to topics in this forum