help with the "Aqua" skin

[steve51184]

hi there I've been looking for a new skin for a long time and I've found that the aqua skin is very nice but the menus (or columns whatever there called) on the left and right are a little to big so i was wanting to know how do i adjust there width?

thanks for any help :)

[X10tion]

it is by Indiqo.media .. so i think u can check the CSS files for the main site size this usually works .. and in there u MIGHT find the table cell sizes .. if not then u will have to look in the aqua_1.php aqua_2.php aqua_3.php for the Table cell width which should look something like <tr width="200"> so u will just have to change the 200 .. basic HTML stuff i think everyone knows about

but if u were asking if there is an EASY way to do it like from the ACP so no there is none .. just try the CSS first u might find it there

[X10tion]

okay.. just go to styles.css and edit the part where it says :

.width_1
{ width: 225px; }


to whatever size u want .. might be usefull to use % as in width: 20%; just in case u dont want strict sizes

[steve51184]

okay.. just go to styles.css and edit the part where it says :

.width_1
{ width: 225px; }


to whatever size u want .. might be usefull to use % as in width: 20%; just in case u dont want strict sizes

thanks so much for the reply but i've just tried editing that and it didn't seem to do anything?

[steve51184]

ahhh i think i know why...

there's an image as a "header" on all the "blocks" on the left and right menu

http://img341.imageshack.us/img341/575/tb150xw8.jpg

http://img247.imageshack.us/img247/628/aqplugin12jy4.jpg

it's 209x26 so i think that's why there so big

i'll try resizing it and see how that goes :)

[steve51184]

ok well good news and bad news

the good news is it worked i resized it to http://img247.imageshack.us/img247/7315/aqplugin12ip0.jpg and changed the " .width_1" value to the same size of the pic (173)

the bad news is it only worked on the left menu so i'm guessing there's a way to change the right one?

[steve51184]

*bump*

please guys i really need help on this!

[Tobias]

Steve,
have you tried to contact indiqo.media (the author) for assistance ("sycology" on SD.com)?

[steve51184]

i went to his site and sent him an email but he told me to post here lol

[Tobias]

:) well, from reading your earlier post, you found a " .width_1" value,
maybe there is by any chance a " .width_2" value (for the right side)?
Just a hunch, I don't have aqua downloaded. :)

[X10tion]

check if both images r the same ? maybe he cloned the image header with a different name

[steve51184]

:) well, from reading your earlier post, you found a " .width_1" value,
maybe there is by any chance a " .width_2" value (for the right side)?
Just a hunch, I don't have aqua downloaded. :)

nope theres only a .width_1

my styles.css file:


a:link { font-family: "Verdana", Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #FFFFFF; text-decoration: underline; }
a:active { font-family: "Verdana", Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #FFFFFF; text-decoration: underline; }
a:visited { font-family: "Verdana", Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #FFFFFF; text-decoration: underline; }
a:hover { font-family: "Verdana", Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #FFFFFF; text-decoration: none; }

a.copyright:link { font-family: "Verdana", Arial, Helvetica, sans-serif; font-size: 9px; font-weight: normal; color: #FFFFFF; font-stretch:expanded; text-decoration: none; }
a.copyright:active { font-family: "Verdana", Arial, Helvetica, sans-serif; font-size: 9px; font-weight: normal; color: #FFFFFF; font-stretch:expanded; text-decoration: none; }
a.copyright:visited { font-family: "Verdana", Arial, Helvetica, sans-serif; font-size: 9px; font-weight: normal; color: #FFFFFF; font-stretch:expanded; text-decoration: none; }
a.copyright:hover { font-family: "Verdana", Arial, Helvetica, sans-serif; font-size: 9px; font-weight: normal; color: #DCD9D9; font-stretch:expanded; text-decoration: none; }

img { border: 0; }

.width_100
{ width: 100%; }

.width_1
{ width: 173px; }

.width_overall
{ width: 776px; }



body {
margin: 0px;
padding: 0;
text-align:center;

font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
color:#3C4649;

background-color: #0C0C0C;
}

td, table
{ font-size: 10px; color: #FFFFFF; vertical-align: top; text-align:left; }

.pluginname_1
{ font-size: 11px; font-weight: bold; padding: 0px 7px 0px 7px; }

select, option, textarea, input
{ border: 1px #B3D2E1 solid;
color:#FFFFFF;
padding: 1px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
background-color: transparent;
margin: 1px;

overflow:hidden;
}

hr
{ height: 1px;
border: 0px;
color: #88B0C4;
background-color: #88B0C4;
}

.copyright
{ text-align:center;
color:#D9D9D9;
font-stretch:expanded;
font-size: 9px;
padding-top:15px;
}

.main_1
{ width: 100%; margin-left:auto; margin-right:auto; background-color: #498EB2; background-image:url(images/aq_background_1.jpg); background-repeat:repeat-x; background-position: top; }

.main_2
{ width: 50%; height: 80px; background-image:url(images/aq_header_3.jpg); background-repeat:no-repeat; background-position: top right; }

.main_3
{ width: 100%; background-image:url(images/aq_header_1.jpg); background-repeat:repeat-x; background-position: top left; }

.main_4
{ width: 100%; background-image:url(images/aq_header_4.jpg); background-repeat:no-repeat; background-position: top left; }

.main_5
{ width: 60%; height: 80px; vertical-align:middle; }

.main_6
{ width: 40%; background-image:url(images/aq_header_5.jpg); background-repeat:repeat-x; background-position: top right; }

.main_7
{ width: 100%; background-image:url(images/aq_header_6.jpg); background-repeat:no-repeat; background-position: top right; }

.main_8
{ width: 100%; height: 80px; background-image:url(images/aq_header_7.jpg); background-repeat:no-repeat; background-position: top left; text-align:center; padding: 0px 35px 0px 35px; }

.main_9
{ padding-top: 27px; }

.banner_1
{ width: 100%; padding: 5px 0px 1px 0px; }

.footer_1
{ width: 50%; height: 80px; background-image:url(images/aq_header_2.jpg); background-repeat:no-repeat; background-position: top left; }

.footer_2
{ width: 100%; background-image:url(images/aq_footer_1.jpg); background-repeat:repeat-x; background-position: top; border-bottom: 1px solid #1D1D1D; }

.footer_3
{ width: 50%; height: 80px; background-image:url(images/aq_footer_3.jpg); background-repeat:no-repeat; background-position: top right; }

.footer_4
{ width: 100%; background-image:url(images/aq_footer_4.jpg); background-repeat:repeat-x; background-position:top left; }

.footer_5
{ width: 100%; background-image:url(images/aq_footer_5.jpg); background-repeat:no-repeat; background-position: top right; }

.footer_6
{ width: 100%; height: 80px; background-image:url(images/aq_footer_6.jpg); background-repeat:no-repeat; background-position: top left; text-align:center; vertical-align:top; }

.footer_7
{ width: 50%; height: 80px; background-image:url(images/aq_footer_2.jpg); background-repeat:no-repeat; background-position: top left; }


.plugin_1_1
{ width: 100%; padding-bottom: 3px; }

.plugin_1_2
{ width: 100%; background-image:url(images/aq_plugin_1_1.jpg); background-repeat:repeat-x; background-position: top; }

.plugin_1_3
{ width: 100%; height: 26px; background-image:url(images/aq_plugin_1_2.jpg); background-repeat:no-repeat; background-position: top right; vertical-align:middle; }

.plugin_1_4
{ width: 100%; filter:progid:DXImageTransform.Microsoft.AlphaImag eLoader(enabled=true, sizingMethod=scale src='skins/aqua/images/aq_plugin_1_3.png'); background-repeat:repeat; text-align:justify; border-bottom: 1px solid #88B0C4; padding: 2px 8px 4px 7px; }

.plugin_1_4[class]
{ background-image:url(images/aq_plugin_1_3.png); }

.plugin_2_1
{ width: 100%; padding: 1px 3px 0px 3px; }

.plugin_2_1_alt
{ width: 100%; padding: 1px 0px 0px 3px; }

.plugin_2_2
{ width: 100%; border-top: 1px solid #88B0C4; border-bottom: 1px solid #88B0C4; padding: 1px 0px 1px 0px; }

.plugin_2_3
{ width: 100%; height: 20px; background-repeat:repeat; vertical-align:middle; filter:progid:DXImageTransform.Microsoft.AlphaImag eLoader(enabled=true, sizingMethod=scale src='skins/aqua/images/aq_plugin_1_3.png'); }

.plugin_2_3[class]
{ background-image:url(images/aq_plugin_1_3.png); }

.plugin_2_4
{ width: 100%; background-repeat:repeat; text-align:justify; padding: 3px 7px 6px 7px; filter:progid:DXImageTransform.Microsoft.AlphaImag eLoader(enabled=true, sizingMethod=scale src='skins/aqua/images/aq_plugin_2.png'); }

.plugin_2_4[class]
{ background-image:url(images/aq_plugin_2.png); }

[steve51184]

check if both images r the same ? maybe he cloned the image header with a different name

tried but there's only 1 image and when the right menu loads it there's a little blank bit (where i made it smaller) but it "fills" it in with green :(

[X10tion]

any feedback if u got this done yet or not ? sorry i was busy with a MicroCMS project

[steve51184]

no i still have the same problem and still need help :(

[Tobias]

Steve:

Some plugins have "fixed" contents which will stretch the left or right column's width no matter what size you specified in the CSS file. For example this is the case for all plugins that use the "VVC" security check (if active) like the "Contact Form" plugin does. This is due to a fixed image width of 220 pixels.

There are 2 things you should check to be changed:


"inputsize" setting (SD's "character width") in Aqua:
* Open "aqua_1.php"
* In lines 58 and 134 change the values from 38 down to 15 (not less) - these are for the left and right plugin columns of the design.
The same method applies for other design files.
* Save and reupload the file
The inputsize is set by each skin's designfile and serves as a "default" width value for input fields (though the absolute displayed width depends on the browser).
VVC image width
In file "includes/vvc.php" find in line 24:

$imwidth = 220;

Just decrease that pixel value (e.g. 170), but be cautious so that the image is not getting too small to actually display all characters. :)


I tried above myself and works ok for me. :)

HTH,
Tobias

[steve51184]

wow "inputsize" worked like a charm thank you so much!!!!!!!! :)

[steve51184]

ok i have a new little question so i'll ask it here as i got the help i needed last time! :)

how do i set it so the page's width changes for the browser size as people with small screen resolutions are having to scroll a lot?

[steve51184]

guys?????????

[valadri]

can any one point where to download this skin?

[steve51184]

http://www.subdreamer.com/sd_skins/p13_sectionid/2/p13_fileid/150

[jay2kidd]

What do you need help with exactly?

[steve51184]

how do i set it so the page's width changes for the browser size as people with small screen resolutions are having to scroll a lot?

[valadri]

it doesn't let me download, cause i'm not a licensed user