external css not working in 6.1 beta?

Q&A about the latest versions
Post Reply
multimaps360.19
Posts: 18
Joined: Thu Apr 25, 2019 5:23 pm

external css not working in 6.1 beta?

Post by multimaps360.19 » Thu Sep 12, 2019 12:00 pm

Hello,
it's possible to include external css file to a tour in the new 6.1 beta version ... but it's not working. If I output the same project in 6.0.6 with the same css file, it works fine.
Why?
Thanks for information,
Alex

User avatar
Hopki
Gnome
Posts: 9446
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Re: external css not working in 6.1 beta?

Post by Hopki » Thu Sep 12, 2019 2:12 pm

Hi Alex,
Pano2VR 6.1 is different from all the other previous versions of Pano2VR as the CSS is now in the skin.
I am going to assume you mean fonts, as if you just add an external file with formatting then this will work.
In the skin editor you will see the default font used:

Code: Select all

.ggskin { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px;}
so ggskin is the class so any test boxes etc will use the above fonts.

The best thing to do is to copy the style sheet here and stack the class.
As an example, if you want to create a class for tooltips, then the class would be .ggskin.tooltip.

If you want to use only fonts in an external style sheet then in the skin change it to

Code: Select all

.ggskin {}
In the next beta, beta 4 you will be able to just delete the code in the skin.


The advantage of adding your style to the skin is if you do not specify a class you end up with the browser default font.
If you add it to the skin and keep the default class as well as add your own then text boxes without a class will still use the skin default and not the browser.

Example:

Code: Select all

.ggskin { 
               font-family: Verdana, Arial, Helvetica, sans-serif; 
               font-size: 14px;
               }

.ggskin.tooltip {
               font-family: "Times New Roman", Times, serif;
               }

So for tooltip text boxes, you enter the class tooltip
Any others will use the ggskin class.

Regards,
Hopki

multimaps360.19
Posts: 18
Joined: Thu Apr 25, 2019 5:23 pm

Re: external css not working in 6.1 beta?

Post by multimaps360.19 » Thu Sep 12, 2019 2:56 pm

Hello Hopki,
thanks a lot - it works fine ...

I only thought I can use my old css file because the possibilty to include external css is still available in html ...

Alex

User avatar
Hopki
Gnome
Posts: 9446
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Re: external css not working in 6.1 beta?

Post by Hopki » Thu Sep 12, 2019 4:07 pm

Hi Alex,
Yes, you could still use it, but as said you would need to use, ggskin {}, in the skin before it would read it.
Regards,
Hopki

User avatar
Tony
Posts: 747
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: external css not working in 6.1 beta?

Post by Tony » Fri Sep 13, 2019 3:15 am

Hi Martin,

How would I go about adding the following CSS. I've tried a couple of things but I can't get it working.

Code: Select all

.myButton {
	-moz-box-shadow: 4px 3px 7px -4px #ff0000;
	-webkit-box-shadow: 4px 3px 7px -4px #ff0000;
	box-shadow: 4px 3px 7px -4px #ff0000;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f5c4c4), color-stop(1, #bd2a2a));
	background:-moz-linear-gradient(top, #f5c4c4 5%, #bd2a2a 100%);
	background:-webkit-linear-gradient(top, #f5c4c4 5%, #bd2a2a 100%);
	background:-o-linear-gradient(top, #f5c4c4 5%, #bd2a2a 100%);
	background:-ms-linear-gradient(top, #f5c4c4 5%, #bd2a2a 100%);
	background:linear-gradient(to bottom, #f5c4c4 5%, #bd2a2a 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5c4c4', endColorstr='#bd2a2a',GradientType=0);
	background-color:#f5c4c4;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	border:1px solid #fa0303;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:19px;
	padding:6px 31px;
	text-decoration:none;
	text-shadow:0px 1px 0px #092b04;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #bd2a2a), color-stop(1, #f5c4c4));
	background:-moz-linear-gradient(top, #bd2a2a 5%, #f5c4c4 100%);
	background:-webkit-linear-gradient(top, #bd2a2a 5%, #f5c4c4 100%);
	background:-o-linear-gradient(top, #bd2a2a 5%, #f5c4c4 100%);
	background:-ms-linear-gradient(top, #bd2a2a 5%, #f5c4c4 100%);
	background:linear-gradient(to bottom, #bd2a2a 5%, #f5c4c4 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bd2a2a', endColorstr='#f5c4c4',GradientType=0);
	background-color:#bd2a2a;
}
.myButton:active {
	position:relative;
	top:1px;
}
cheers,

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/

Post Reply

Who is online

Users browsing this forum: No registered users and 30 guests