Some HTML rendering fixes. Most important is the media query is correctly processed when combining style sheets.

This commit is contained in:
Martín Lucas Golini
2026-04-25 20:47:51 -03:00
parent 1970b8bbe9
commit 8a9bc2cd47
13 changed files with 71 additions and 23 deletions

View File

@@ -62,6 +62,10 @@ strong {
font-style: bold;
}
small {
font-size: smaller;
}
u,
ins {
text-decoration: underline;

View File

@@ -239,6 +239,7 @@ enum class PropertyId : Uint32 {
Rows = String::hash( "rows" ),
Cols = String::hash( "cols" ),
InputMode = String::hash( "input-mode" ),
Hidden = String::hash( "hidden" ),
Display = String::hash( "display" ),
Position = String::hash( "position" ),
Top = String::hash( "top" ),

View File

@@ -89,6 +89,8 @@ class EE_API UIPushButton : public UIWidget {
UIPushButton* setExpandTextView( bool expand );
virtual void loadFromXmlNode( const pugi::xml_node& node );
protected:
UIImage* mIcon;
UITextView* mTextBox;

View File

@@ -33,6 +33,8 @@ class EE_API UITextSpan : public UIHTMLWidget {
static UITextSpan* NewCode() { return NewWithTag( "code" ); }
static UITextSpan* NewSmall() { return NewWithTag( "small" ); }
virtual ~UITextSpan();
virtual Uint32 getType() const;

View File

@@ -425,13 +425,14 @@ void StyleSheetSpecification::registerDefaultProperties() {
registerProperty( "cols", "20" ).setType( PropertyType::NumberInt );
registerProperty( "input-mode", "normal" ).setType( PropertyType::String );
registerProperty( "display", "inline" );
registerProperty( "position", "static" );
registerProperty( "top", "auto" );
registerProperty( "right", "auto" );
registerProperty( "bottom", "auto" );
registerProperty( "left", "auto" );
registerProperty( "z-index", "auto" );
registerProperty( "hidden", "" ).setType( PropertyType::Bool );
registerProperty( "display", "inline" ).setType( PropertyType::String );
registerProperty( "position", "static" ).setType( PropertyType::String );
registerProperty( "top", "auto" ).setType( PropertyType::NumberLength );
registerProperty( "right", "auto" ).setType( PropertyType::NumberLength );
registerProperty( "bottom", "auto" ).setType( PropertyType::NumberLength );
registerProperty( "left", "auto" ).setType( PropertyType::NumberLength );
registerProperty( "z-index", "auto" ).setType( PropertyType::NumberInt );
registerProperty( "inner-widget-orientation", "widgeticontextbox" )
.setType( PropertyType::String );

View File

@@ -1670,6 +1670,11 @@ Float UINode::lengthFromValue( const StyleSheetProperty& property,
res.setValue( 1.2f, StyleSheetLength::Unit::Em );
}
return convertLength( res, 0 );
} else if ( property.getValue() == "inherit" ) {
// TODO: FIX inherit value
StyleSheetLength res;
res.setValue( 1, StyleSheetLength::Unit::Em );
return convertLength( res, 0 );
}
}
return lengthFromValue( property.getValue(),

View File

@@ -6,6 +6,9 @@
#include <eepp/ui/uiscenenode.hpp>
#include <eepp/ui/uithememanager.hpp>
#define PUGIXML_HEADER_ONLY
#include <pugixml/pugixml.hpp>
namespace EE { namespace UI {
InnerWidgetOrientation UIPushButton::innerWidgetOrientationFromString( std::string iwo ) {
@@ -739,4 +742,10 @@ bool UIPushButton::applyProperty( const StyleSheetProperty& attribute ) {
return attributeSet;
}
void UIPushButton::loadFromXmlNode( const pugi::xml_node& node ) {
UIWidget::loadFromXmlNode( node );
if ( !node.text().empty() )
setText( node.text().as_string() );
}
}} // namespace EE::UI

View File

@@ -20,7 +20,9 @@ UIHTMLHtml* UIHTMLHtml::New( const std::string& tag ) {
return eeNew( UIHTMLHtml, ( tag ) );
}
UIHTMLHtml::UIHTMLHtml( const std::string& tag ) : UIRichText( tag ) {}
UIHTMLHtml::UIHTMLHtml( const std::string& tag ) : UIRichText( tag ) {
enableReportSizeChangeToChildren();
}
Uint32 UIHTMLHtml::getType() const {
return UI_TYPE_HTML_HTML;

View File

@@ -400,10 +400,21 @@ void UISceneNode::setStyleSheet( const std::string& inlineStyleSheet ) {
void UISceneNode::combineStyleSheet( const CSS::StyleSheet& styleSheet, bool forceReloadStyle,
URI baseURI ) {
mStyleSheet.combineStyleSheet( styleSheet );
bool mediaChanged = false;
if ( !mStyleSheet.isMediaQueryListEmpty() &&
mStyleSheet.updateMediaLists( getMediaFeatures() ) ) {
mediaChanged = true;
}
processStyleSheetAtRules( styleSheet, baseURI );
if ( mRoot && mRoot->getUIStyle() )
mRoot->getUIStyle()->resetGlobalDefinition();
processStyleSheetAtRules( styleSheet, baseURI );
onMediaChanged();
if ( mRoot && mediaChanged )
mRoot->reportStyleStateChangeRecursive( false, false );
if ( forceReloadStyle )
reloadStyle();
}

View File

@@ -742,15 +742,17 @@ bool UITextView::applyProperty( const StyleSheetProperty& attribute ) {
setSelectionBackColor( attribute.asColor() );
break;
case PropertyId::FontFamily: {
Font* font = FontManager::instance()->getByName( attribute.value() );
if ( attribute.value() != "inherit" ) {
Font* font = FontManager::instance()->getByName( attribute.value() );
if ( !mUsingCustomStyling && NULL != font && font->loaded() ) {
setFont( font );
if ( !mUsingCustomStyling && NULL != font && font->loaded() ) {
setFont( font );
}
}
break;
}
case PropertyId::FontSize:
if ( !mUsingCustomStyling )
if ( !mUsingCustomStyling && attribute.value() != "inherit" )
setFontSize( lengthFromValue( attribute ) );
break;
case PropertyId::TextDecoration:

View File

@@ -2248,6 +2248,9 @@ bool UIWidget::applyProperty( const StyleSheetProperty& attribute ) {
unsetFlags( UI_TAB_FOCUSABLE );
}
break;
case PropertyId::Hidden:
setVisible( false );
break;
default:
attributeSet = false;
break;

View File

@@ -126,7 +126,6 @@ void UIWidgetCreator::createBaseWidgetList() {
registeredWidget["hslider"] = UISlider::NewHorizontal;
registeredWidget["vscrollbar"] = UIScrollBar::NewVertical;
registeredWidget["hscrollbar"] = UIScrollBar::NewHorizontal;
registeredWidget["button"] = UIPushButton::New;
registeredWidget["rlay"] = UIRelativeLayout::New;
registeredWidget["tooltip"] = UITooltip::New;
registeredWidget["tv"] = UITextView::New;
@@ -137,6 +136,7 @@ void UIWidgetCreator::createBaseWidgetList() {
registeredWidget["em"] = UITextSpan::NewEmphasis;
registeredWidget["b"] = UITextSpan::NewBold;
registeredWidget["strong"] = UITextSpan::NewBold;
registeredWidget["small"] = UITextSpan::NewSmall;
registeredWidget["i"] = UITextSpan::NewItalics;
registeredWidget["u"] = UITextSpan::NewUnderline;
registeredWidget["ins"] = UITextSpan::NewUnderline;
@@ -186,6 +186,12 @@ void UIWidgetCreator::createBaseWidgetList() {
registeredWidget["td"] = [] { return UIHTMLTableCell::New( "td" ); };
registeredWidget["input"] = HTMLInput::New;
registeredWidget["textarea"] = HTMLTextArea::New;
registeredWidget["button"] = [] {
auto but = UIPushButton::NewWithTag( "button" );
but->setFlags( UI_HTML_ELEMENT );
but->setLayoutSizePolicy( SizePolicy::WrapContent, SizePolicy::WrapContent );
return but;
};
sBaseListCreated = true;
}

View File

@@ -156,14 +156,14 @@ static const auto LAYOUT = R"xml(
</vbox>
</vbox>
<vbox class="right" lw="0" lh="wc" lw8="0.5" lg="center">
<button id="create-new" text="@string(new_file, New File)" />
<button id="create-new-terminal" text="@string(new_terminal, New Terminal)" />
<button id="open-folder" text="@string(open_a_folder, Open a Folder)" />
<button id="open-file" text="@string(open_a_file, Open a File)" />
<button id="recent-folders" text="@string(recent_folders_ellipsis, Recent Folders...)" />
<button id="recent-files" text="@string(recent_files_ellipsis, Recent Files...)" />
<button id="plugin-manager-open" text="@string(plugin_manager, Plugins Manager)" />
<button id="keybindings" text="@string(keybindings, Keybindings)" />
<PushButton id="create-new" text="@string(new_file, New File)" />
<PushButton id="create-new-terminal" text="@string(new_terminal, New Terminal)" />
<PushButton id="open-folder" text="@string(open_a_folder, Open a Folder)" />
<PushButton id="open-file" text="@string(open_a_file, Open a File)" />
<PushButton id="recent-folders" text="@string(recent_folders_ellipsis, Recent Folders...)" />
<PushButton id="recent-files" text="@string(recent_files_ellipsis, Recent Files...)" />
<PushButton id="plugin-manager-open" text="@string(plugin_manager, Plugins Manager)" />
<PushButton id="keybindings" text="@string(keybindings, Keybindings)" />
<widget class="separator" lw="mp" lh="32dp" />
<tv class="bold" text="@string(for_help_please_visit, For help, please visit:)" lg="center" />
<vbox lw="wc" lh="wc" lg="center">