Hello, on my internal project portfolio page the images are small. See the link of your demo and see my website. It should take up all the screen space.
Thanks for the Ylli comeback. The problem is that my client does not want the fullscreen gallery (he does not like the image glued to the top and right side). He wants to keep this gap at the top and right side of the photo (see the link below).
In the definition of the Kalium theme for PORTFOLIO SIDE there is the option GALLERY TYPE (Inline with the content). In this option the GAP to the right of the photo is very large (see image below). The gap is large and the menu is without side alignment.
An image portfolio site, the bigger the picture on the screen the better. Do you agree? To decrease the GAP, to the right of the photo we use this code below.
Sorry but this option is not available somewhere on our theme, if you want the images to be "glued" you can only do the changes as on that demo link that you send to us.
But I will try to help you this time even if this is a very customization related question.
After you select the option to show images as on the demo link that you send you can add this code on that portfolio page Parameters and Options > Custom CSS area:
Thanks for the help Ylli. Like I said, the problem is just on the device. On the desktop it's perfect. On the device the images remain smaller with a blank space on the sides. It's important that they get bigger on the devices. See below how they look.
The problem that you wrote is not happening because of any theme issue but from the modifications that you have made. On your Custom CSS you have added this code (please see the video http://drops.laborator.co/hoars) and that is creating those problems for you.
P.S: You are modifying your theme too much and I'm afraid that you are creating problems and will have problems on future updates because of those modifications.
Please be aware as by doing customization if something happens like miss-editing the responsibility is yours and we wont support you on finding the problem, as we are only guiding you how to get the results you need.
You're right Ylli. I will remove 100% of the custom CSS code I have added and I will observe. But these codes have been added to try to improve an aspect that I think is important for the project. I'll explain some other time.
There is little left. But I need your help to conclude.
Ylli, how are you? I was analyzing this code below. It moves the text block to align with the mark. Perfect. But it also increases, somewhat the image, the one on the left side, causing a lateral gap in the images on the device.
Hello, on my internal project portfolio page the images are small. See the link of your demo and see my website. It should take up all the screen space.
LINMO DEMO
Https://demo.kaliumtheme.com/architecture/portfolio/penthouse-boston/
LINK MY SITE
Http://valencaevalenca.profissional.ws/valencachild/casa-04-ba/
Note: I will remove all CSS code from LABORATOR. I did this so I did not have a conflict.
Hi Marcelo,
Those are the options that we use on that portfolio project http://drops.laborator.co/Z1JKSz
Thanks for the Ylli comeback. The problem is that my client does not want the fullscreen gallery (he does not like the image glued to the top and right side). He wants to keep this gap at the top and right side of the photo (see the link below).
http://valencaevalenca.profissional.ws/valencachild/casa-04-ba/
How can I just leave the largest gallery on the devices? On the desktop is as it likes.
I'll try to help with the explanation below.
In the definition of the Kalium theme for PORTFOLIO SIDE there is the option GALLERY TYPE (Inline with the content). In this option the GAP to the right of the photo is very large (see image below). The gap is large and the menu is without side alignment.
http://d.pr/i/trctsU
An image portfolio site, the bigger the picture on the screen the better. Do you agree? To decrease the GAP, to the right of the photo we use this code below.
/*GAP INCREASE RIGHT SIDE*/
body.single-portfolio .col-md-offset-1.gallery-column-env {
width: 75%;
margin-left: 0px;
}
.portfolio-template-default .wrapper>.container {
width: 100%;
padding-left: 60px;
padding-right: 60px;
}
It was great on the desktop, but the devices did not have a big gap to the right of the photo. (view image below).
http://d.pr/i/4YS9oW
Have you given it now?
How do I solve this?
Hi again,
Sorry but this option is not available somewhere on our theme, if you want the images to be "glued" you can only do the changes as on that demo link that you send to us.
But I will try to help you this time even if this is a very customization related question.
After you select the option to show images as on the demo link that you send you can add this code on that portfolio page Parameters and Options > Custom CSS area:
.single-portfolio-holder.alt-one .gallery { margin-top: 0px !important; }This will show your gallery "glued" on side but not on top.
Thanks for the help Ylli. Like I said, the problem is just on the device. On the desktop it's perfect. On the device the images remain smaller with a blank space on the sides. It's important that they get bigger on the devices. See below how they look.
MY DEVICE AND TABLET
https://d.pr/i/O0mg06 (wideview)
https://d.pr/i/gzEydS (vertical view)
NOTE:
I just added that to your code and did not see any changes.
.single-portfolio-holder.alt-one .gallery { margin-top: 0px !important; }Hi Marcelo,
The problem that you wrote is not happening because of any theme issue but from the modifications that you have made. On your Custom CSS you have added this code (please see the video http://drops.laborator.co/hoars) and that is creating those problems for you.
P.S: You are modifying your theme too much and I'm afraid that you are creating problems and will have problems on future updates because of those modifications.
Please be aware as by doing customization if something happens like miss-editing the responsibility is yours and we wont support you on finding the problem, as we are only guiding you how to get the results you need.
Will set this ticket as closed from here.
You're right Ylli. I will remove 100% of the custom CSS code I have added and I will observe. But these codes have been added to try to improve an aspect that I think is important for the project. I'll explain some other time.
There is little left. But I need your help to conclude.
I removed all the CSS and just added that your code. It worked.
I had commented below that there was no effect with this code. Be sure that it worked now.
.single-portfolio-holder.alt-one .gallery { margin-top: 0px !important; }I will send a message to the private for you Ylli, Art and Eroll. OK? I will remove all the extra CSS for testing. Be right back
Hi Marcelo,
Glad to hear that!
Will set this ticket as solved from here.
Ylli, how are you? I was analyzing this code below. It moves the text block to align with the mark. Perfect. But it also increases, somewhat the image, the one on the left side, causing a lateral gap in the images on the device.
/*THIS CODE MOVE TEXT BLOCK*/
.single-portfolio .container {
width: 100%;
padding: 0 30px;
}
@media screen and (max-width: 991px) {
body.single-portfolio .col-md-offset-1.gallery-column-env {
width: 100% !important;
}
}
http://valencaevalenca.profissional.ws/valenca/casa-06-ba/
Should not this code just move the block of text? If you only do this shift the image on the device will be perfect.
What do you think?
NOTE: I removed all CSS CUSTOM from LABORATOR. And I just inserted that cosine below.