mikromundo Posted December 13, 2019 Share Posted December 13, 2019 Hi, in UniTreeMenu I have a CSS. In RunTime I want to change the background-color: .x-treelist-nav { /* Aqui ira determina a COR DE Fundo do menu */ background-color: [[MENU_COLOR]] !important; //<------ I want to change here } thanks for help !!! Quote Link to comment Share on other sites More sharing options...
belo Posted December 14, 2019 Share Posted December 14, 2019 /* CustomCSS */ .tree_menu .x-treelist-nav { background-color: red; } // RunTime procedure TMainForm.btnAddClick(Sender: TObject); begin UniSession.AddJS('$(''#'+TUniControl(UniTreeMenu1).JSId+''').addClass(''tree_menu'')'); end; procedure TMainForm.btnRemoveClick(Sender: TObject); begin UniSession.AddJS('$(''#'+UniTreeMenu1.JSId+''').removeClass(''tree_menu'')'); end; Best Regards Eduardo Belo 1 Quote Link to comment Share on other sites More sharing options...
mikromundo Posted December 14, 2019 Author Share Posted December 14, 2019 obrigado belo... mas consegui aqui...era isso que queria: UniSession.AddJS('$(''.x-treelist-nav .x-treelist-item-text'').css({ ''color'': ''' + ( ColorToHtml( btnSelColor_MenuFont.Color ) ) + ''' })' ); deu certinho !!! Mas muito obrigado mesmo assim !!! Quote Link to comment Share on other sites More sharing options...
Freeman35 Posted December 14, 2019 Share Posted December 14, 2019 @mikromundo eğer herkes kendi dilinde yazarsa, forum çok karışacak. Quote Link to comment Share on other sites More sharing options...
mikromundo Posted December 14, 2019 Author Share Posted December 14, 2019 You're right @Freeman35 Excuse me. Eduardo Belo is a personal friend and I didn't pay attention to that. Quote Link to comment Share on other sites More sharing options...
Haklin0816 Posted April 23, 2021 Share Posted April 23, 2021 A way to add custom CSS to individual frames and forms: Create a CSS file to override or add classes. If you create a new class and want to assign it to a component put the class name in LayoutConfig.Cls of the component. 1. CSS File example.css: /*Rounded edges on edits*/ .x-textfield .x-input-wrap-el { -webkit-border-radius: 3px; !important; } /*class FormSubmitButton*/ .FormSubmitButton { font: 16px 'Open Sans', 'Helvetica Neue', helvetica, arial, sans-serif; background: #47a404; background-color: #47a404; color: #fff; font-weight: 600; border-radius: 3px; padding-top: 5px; padding-right: 5px; padding-bottom: 5px; padding-left: 5px; } .FormSubmitButton.x-hovered { color: #fff; background: #378003; background-color: #378003; } .FormSubmitButton .x-inner-el { padding: 7px; border: 0px; background-color: #47a404; background-image: none; } .FormSubmitButton.x-hovered .x-inner-el { background: #378003; background-color: #378003; } 2. Set LayoutConfig.Cls of your button to FormSubmitButton 3. Put the following in form/frame OnCreate procedure Ttestframe.UniFrameCreate(Sender: TObject); Var Script:String; begin Script := 'var fileref = document.createElement("link");'+#13#10+ 'fileref.rel = "stylesheet";'+#13#10+ 'fileref.type = "text/css";'+#13#10+ 'fileref.href = "/css/example.css";'+#13#10+ //<-- Path to CSS file 'document.getElementsByTagName("head")[0].appendChild(fileref);'; TUnimForm(Self.OwnerForm).WebForm.Script.Add(Script); //<-- In Frame //Self.WebForm.Script.Add(Script); //<-- In Form end; Quote Link to comment Share on other sites More sharing options...
mikromundo Posted April 24, 2021 Author Share Posted April 24, 2021 Thanks @Haklin0816 Very nice. Quote Link to comment Share on other sites More sharing options...
55143681 Posted April 25, 2021 Share Posted April 25, 2021 On 12/14/2019 at 8:34 AM, belo said: /* CustomCSS */ .tree_menu .x-treelist-nav { background-color: red; } // RunTime procedure TMainForm.btnAddClick(Sender: TObject); begin UniSession.AddJS('$(''#'+TUniControl(UniTreeMenu1).JSId+''').addClass(''tree_menu'')'); end; procedure TMainForm.btnRemoveClick(Sender: TObject); begin UniSession.AddJS('$(''#'+UniTreeMenu1.JSId+''').removeClass(''tree_menu'')'); end; Best Regards Eduardo Belo for cBuilder: void __fastcall TMainForm::UniBitBtn1Click(TObject *Sender) {//修改背景颜色 UniSession->AddJS("$(\"#"+UniTreeMenu1->JSId+ "\").addClass('tree_menu')"); } //--------------------------------------------------------------------------- void __fastcall TMainForm::UniBitBtn2Click(TObject *Sender) {//恢复背景颜色 UniSession->AddJS("$(\"#"+UniTreeMenu1->JSId+ "\").removeClass('tree_menu')"); } //--------------------------------------------------------------------------- Quote Link to comment Share on other sites More sharing options...
55143681 Posted April 25, 2021 Share Posted April 25, 2021 On 4/24/2021 at 7:18 AM, Haklin0816 said: A way to add custom CSS to individual frames and forms: Create a CSS file to override or add classes. If you create a new class and want to assign it to a component put the class name in LayoutConfig.Cls of the component. 1. CSS File example.css: /*Rounded edges on edits*/ .x-textfield .x-input-wrap-el { -webkit-border-radius: 3px; !important; } /*class FormSubmitButton*/ .FormSubmitButton { font: 16px 'Open Sans', 'Helvetica Neue', helvetica, arial, sans-serif; background: #47a404; background-color: #47a404; color: #fff; font-weight: 600; border-radius: 3px; padding-top: 5px; padding-right: 5px; padding-bottom: 5px; padding-left: 5px; } .FormSubmitButton.x-hovered { color: #fff; background: #378003; background-color: #378003; } .FormSubmitButton .x-inner-el { padding: 7px; border: 0px; background-color: #47a404; background-image: none; } .FormSubmitButton.x-hovered .x-inner-el { background: #378003; background-color: #378003; } 2. Set LayoutConfig.Cls of your button to FormSubmitButton 3. Put the following in form/frame OnCreate procedure Ttestframe.UniFrameCreate(Sender: TObject); Var Script:String; begin Script := 'var fileref = document.createElement("link");'+#13#10+ 'fileref.rel = "stylesheet";'+#13#10+ 'fileref.type = "text/css";'+#13#10+ 'fileref.href = "/css/example.css";'+#13#10+ //<-- Path to CSS file 'document.getElementsByTagName("head")[0].appendChild(fileref);'; TUnimForm(Self.OwnerForm).WebForm.Script.Add(Script); //<-- In Frame //Self.WebForm.Script.Add(Script); //<-- In Form end; for cBuilder: void __fastcall TMainmForm::UnimFormCreate(TObject *Sender) { String Script; Script = "var fileref = document.createElement(\"link\");"; Script+="fileref.rel = \"stylesheet\";"; Script+="fileref.type = \"text/css\";"; Script+="fileref.href = \"/css/example.css\";"; //<-- Path to CSS file Script+="document.getElementsByTagName(\"head\")[0].appendChild(fileref);"; //TUnimForm(Self.OwnerForm).WebForm.Script.Add(Script); //<-- In Frame this->WebForm->Script->Add(Script); //<-- In Form } Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.