Black

Website Title Text on Mobile View - Black

Website Title Text on Mobile View

by durangod » Tue Mar 12, 2024 3:33 pm

Hi,

Would you know how to show the website title text on mobile view, there is none? I did move the mobile view icon to the left thinking the text was just out of bounds but nope its not there.

Normal view
normal_view.jpg
Mobile view
notitle_mobileview.jpg
notitle_mobileview.jpg (20.4 KiB) Viewed 45 times

Thanks :)

UPDATE: Got it...

stylesheet.css

Code: Select all

 /* added by dave */ 
  .site-description p {
      display: block;
      font-size:small;
} 

stylesheet.css

Also added this just to move the site description up a bit.

for .logo (under @media) add max-height

original code

Code: Select all


 .logo {
    float: none;
    margin: 0 auto;
    padding: 0;
  }

New code:

Code: Select all

 .logo {
    float: none;
    margin: 0 auto;
    padding: 0;
    max-height: 75px; /* added by dave */
  };

Username is short for durango dave
User avatar
durangod
Registered User
Posts: 817
Joined: Tue Nov 03, 2009 1:26 pm
Location: USA East Texas
Name: Dave

Re: Website Title Text on Mobile View

by cabot » Wed Mar 13, 2024 10:59 am

Hello,

It is not advisable to modify the stylesheet.css file directly as it is a compiled file. And if you recompile the scss files, your changes will be lost.

The style contains two scss files for receiving personalised declarations:
  • _custom_config.scss in which you can customise the variables declared in _config.scss
  • _custom.scss in which you can add anything that does not modify the variables of _config.scss.
    In fact, everything else, everything to do with the CSS rules you want to change or add.

So in terms of the changes you've made in this topic, you could add that to _custom.scss:

Code: Select all

@media (max-width: 700px) {
	.logo {
		max-height: 75px;
	}

	.site-description p {
		display: block;
		font-size: small;
	}
}
And then recompile the scss using the SCSS Compiler extension.

When you update the style, all you have to do is overwrite the original _custom_config.scss and _custom.scss files with your own and then recompile.

In addition, you should know that I've sent a new revision for validation for version 3.3.11, including the red colour variation you're using and changes to the HTML allowing you to configure the display of links.

From now on I'll be in charge of maintaining the style and I'm already thinking of removing the need to use two different images for the logo (desktop/mobile) for future versions, as the widespread use of the svg format means that this feature is no longer necessary. I'll also make sure that the style is compatible with the Change Logo extension.

:)
User avatar
cabot
Jr. Style Validator
Posts: 1010
Joined: Sat Jan 07, 2012 4:16 pm

Re: Website Title Text on Mobile View

by durangod » Wed Mar 13, 2024 11:30 am

Thanks cabot, really kind of you to do all this. :) Thanks for the info, great plans and i feel comfy that i can stick with this theme for a long time.

My plan is to get the stylesheet how i want it (notating all the changes) then ill just have to mod the scss files and comple 1x.
Username is short for durango dave
User avatar
durangod
Registered User
Posts: 817
Joined: Tue Nov 03, 2009 1:26 pm
Location: USA East Texas
Name: Dave