Background color and fonts - Canvas- photography demo

9 replies · opened Apr 17, 2020

JjaquecafilmsApr 17, 2020

Hi guys,

I'm working on a very simple photography template lay out up to my capabilities

I would like to adjust/change:

  • background color for the logo on cellphones/ipad as per pic attached now is grey.
  • Background of the menu now in red/orange
  • Font of text on slider pictures.
  • And if posible the items from the albun always show un full color (not faded)

¿Where can I find the codes to change those details?, sorry for the inconvenience...I'm very amateur.

I'm thinking on having an English version...how would you suggest to solve for the photograpy template?
http://jaquecafilms.com/prueba/index.html

Looking forward to your comments

Best

SSemicolon WebSTAFFApr 17, 2020

Hello,

You can use the Responsive Classes or Media Queries to change or modify the CSS Properties of the Default CSS Classes. The Responsive Classes are as follows:

.device-xl – Class for Large Devices >=1200px

.device-lg – Class for Medium Devices >=992px to 1199px

.device-md – Class for Tablets

.device-sm – Class for Landscape Mobiles or Phablets.

.device-xs – Class for Portrait Mobiles

  1. Based on the Above Classes, you can consider suing the following code:

.device-xs #header,
.device-xs #header-wrap {
	background-color: #HEX !important;
}
  1. You can use the following CSS Code to change the Header Color:

@media (min-width: 992px) {
	.side-header #header.dark {
		background-color: rgba(200, 94, 81, 0.95);
	}
}
  1. Use the following CSS Code to change the Font Family on the Slider Caption:

.swiper-slide .slider-text h3 {
	font-family: 'Your Font Name', sans-serif;
}
  1. Simply remove the .img-grayscale Class from the .grid-item > a Element.

Additionally, we currently do not provide Customization related Support according to the Item Support Policy: https://themeforest.net/page/item_support_policy . You will need to manually code this or Hire a Freelancer to help you out with Design Customizations.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

JjaquecafilmsApr 18, 2020

Thanks for your help...

i believe I succeceded with everything but in color changes for these:

  1. Based on the Above Classes, you can consider suing the following code:

.device-xs #header,
.device-xs #header-wrap {
background-color: #HEX !important;
}

which file should I modify in order to make the above modification? photography.css, index.html...? please advise.

I also want to make all background black...there is asection namend #Author...that remains grey...where can i change/remove that background color?

thanks for your help

SSemicolon WebSTAFFApr 19, 2020

Hello,

Make sure that you the css/custom.css File to add all your Custom CSS Codes. Complete Instructions on how to use this File has been provided in the Documentation > Start > Customization Section.

You can simply add the style="background-color: #HEX;" Attribute to this Element or add the CSS Block to the css/custom.css File.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

JjaquecafilmsApr 20, 2020

Hi,

i did copy the command:

.device-xs #header,
.device-xs #header-wrap {
background-color: #HEX !important;

inside the css/custom.css file and saved changes

followingcomplete Instructions on how to use this File as per Documentation > Start > Customization Section.

I included the line 31 on the index.html file (as per attachment) to activate custom.css file...correct?.

for whatever reasons ...it is not working...can you advice what am I doing wrong?

SSemicolon WebSTAFFApr 20, 2020

Hello,

Apologies about the Inconveniences caused!

Please provide us with an updated Live URL so that we can check out the exact issue and provide you with more assistance on this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

JjaquecafilmsApr 20, 2020

There you go

http://www.jaquecafilms.com/

now my only challenge the background color to black of the gray menu for portrait mobile as per attachment

Thanks for you help

SSemicolon WebSTAFFApr 20, 2020

Hello,

We have just checked out your Custom CSS File: http://www.jaquecafilms.com/css/custom.css which has Invalid Codes. Simply fix this and your issue should be automatically resolved.

Additionally, also make sure that you change the #HEX to your required CSS HEX Color.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

JjaquecafilmsApr 21, 2020

Great!!! thanks for your help and patience!!!!

SSemicolon WebSTAFFApr 21, 2020

Hello,

Glad that your issues were resolved. Very Happy to Help!

Do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard