Can not see the css styles in WWB, if you select "Live HTML rendering".

This section can be used to submit suggestions for Extension Builder.
Note that this section is not monitored for support.
Forum rules
This forum section can be used to submit suggestions for Extension Builder.
Note that this section is not monitored for support.
Post Reply
User avatar
spoon
 
 
Posts: 96
Joined: Thu Oct 26, 2017 9:23 am

Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by spoon »

Hello, please tell me, why do not see the css styles in WWB?
CSS styles placed in Between<style>tag
The HTML code put Between<body>and</body>tags
Photo 1 showed the extension settings.
Photo 2 showed the extension where you can see css properties, in my css extension is not visible
https://drive.google.com/file/d/1W1YYba ... sp=sharing
User avatar
Pablo
 
Posts: 21511
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by Pablo »

Only code in 'Render HTML' will be rendered in the preview.
User avatar
spoon
 
 
Posts: 96
Joined: Thu Oct 26, 2017 9:23 am

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by spoon »

But in photo 3 styles can be seen immediately and the styles are not 'Render HTML', if you place the css styles in 'Render HTML' you will see just text.
photo 3
User avatar
Pablo
 
Posts: 21511
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by Pablo »

I'm sorry it is unclear what you have done.

Note that there is no support on extension development.
User avatar
spoon
 
 
Posts: 96
Joined: Thu Oct 26, 2017 9:23 am

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by spoon »

What should I do to see the css styles in the extension?
User avatar
Pablo
 
Posts: 21511
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by Pablo »

You will need to add the style to the 'Render HTML' code.
User avatar
spoon
 
 
Posts: 96
Joined: Thu Oct 26, 2017 9:23 am

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by spoon »

I'm sorry, If you place the css code in the "Render HTML" I see the text (number 1 on photo), not the style (number 2 on photo). I need to show the css style (number 2 on photo). photo What you need to do to show the style in WWB as the photo number 2 ?
User avatar
Pablo
 
Posts: 21511
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by Pablo »

You will need to place styles between <style> tags.
User avatar
spoon
 
 
Posts: 96
Joined: Thu Oct 26, 2017 9:23 am

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by spoon »

I'm sorry, does not work))
example
User avatar
Pablo
 
Posts: 21511
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by Pablo »

There is no HTML code in the Render HTML section!
All code should be there!

Note that there is no support on extension development.
User avatar
spoon
 
 
Posts: 96
Joined: Thu Oct 26, 2017 9:23 am

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by spoon »

I realized that there is no support for the extension, so I apologize for the annoying)) but I did as you said but it does not work)
example
User avatar
Pablo
 
Posts: 21511
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by Pablo »

Sorry, but your code is still wrong.
There should not be <html>, <head> <body> tags. The page already has these tags!
Note $ID$ is not valid in the context of the preview.
Also :focus and :hover will not be useful in a static preview.

The correct 'Render HTML' is:

Code: Select all

<style>
.button-preview {
       width: 100%;
       height: 100%;
       display: block;
       border: $a$px $b$ $c$;
      	background: $d$;
       color: $text2$;
       font-size: $text4$px;
       font-family: $text1$;
       font-weight: $text3$;
	vertical-align: middle;
	position: relative;
	border-radius: $r$px;
       outline: none;
       overflow: hidden;
       cursor: pointer;
	-webkit-backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale; 
       z-index: 1;  
}
.button-preview:focus {
	outline: none;
}
.button-preview > span {
	vertical-align: middle;
}
.btn--texthover:hover {
    font-size: $ss$px;
    font-family: $dd$;
    font-weight: $gg$;
}
</style>

$svg$
$teg$<button type="$e$" class="button-preview button--$efect$ btn--texthover" data-text="$textpsevdo$">
$plus$
$textvid$
</button>
$teg1$

User avatar
spoon
 
 
Posts: 96
Joined: Thu Oct 26, 2017 9:23 am

Re: Can not see the css styles in WWB, if you select "Live HTML rendering".

Post by spoon »

many thanks Pablo :)
Post Reply