I am facing a problem, I have an observable collection which is hiding/showing the button and changing the text as well according to situation. Everything is working fine.
But now I want to change the background color and foreground color of the button from the code behind at runtime OR I want to set the Style from the code behind. Is it possible or if possible then how?
I tried to create a Style Property in my observable collection and tried to set, but it didn't work, please help me what and where I am going wrong ?
style from code behind can be set easily like this
Note: I am supposing that the style is being created in page resources.
btn.Style = (Style)this.Resources["Style Name"];
Related
I have a toolbar of buttons that are gray by default but when one button is clicked on that button is made white to indicate that that is the page you are on. This is achieved using a class and the below css.
.btn-details:focus {
color: #fff;
}
This works fine except when I change windows and then go back. For example, if I have my page open it is working find, then I switch to an Excel window and then back to my page the white highlighting is now gone. How can I keep the button in focus even when the window is changed?
Unfortunately I think you need to take your time to focus on how CSS works.
You are using the: focus selector. Know that it does what you asked it to. If the button loses focus and your style no longer holds.
I think this is exactly what happens when you use other apps.
I advise you to add a CSS class on the button clicked and to remove this same class on the other buttons.
If you have difficulty implementing this, please come back to me. I would make a small example depending on your level.
See you soon !
As i am new to drupal 8 , i couldn't able to find the CSS code written for the particular grid in drupal 8
Once logged in then click on class Export a gridview will appear.
I needed a slight adjustment to the last row elements which i have highlighted below.
I need to remove the light blue background color and make the font style black.
BUt i cannot able to trace the location of the css / html file to make the neccessary changes.
Is it possible to change the button color? or is it a inbuilt functionality where we cannot make any changes?
Any help Appreciated
In my project I'm working on styling some overlays. Because of the nested component structure I'm running into some problems here. The intended solution is to move the overlay somewhere closer to the app root while preserving data bindings, making the css styling less restricted.
I've managed to set up a prototype using Renderer2.appendChild(...). When the overlay is shown, the ngOnInit of the overlay appends the overlay to another DOM element.
With my current code I can either get the input or output binding to work (but not both), based on moving an empty comment <!----> found directly in front of the overlay.
From my understanding (Empty comments in Angular application) Angular needs this comment, but Renderer2.appendChild does not account for it (maybe it's not meant to be used for components, only for 'raw' html?).
Demo:
Here's the prototype presenting both issues I am stuck on: https://stackblitz.com/edit/angular-pg24om
Visibility of the overlays (shown below the labels) can be toggled with a button. The submit buttons inside the overlay logs the input to the console using an #Output event emitter. Pressing change text changes an #Input property.
Without moving the overlay, input and output binding works like expected.
Incorrect input binding: If I choose to move the empty <!----> comment together with the overlay, my input binding seems to stop working. Pressing Change text does not change the random number I pass to the component. Output binding still works fine in this scenario.
Incorrect destruction: If I don't move the empty comment, Angular fails to clean up the component when the visibility is hidden using the Toggle visiblity button. That said, while the component is alive both input and output binding remains functional.
If anyone knows how to get this to work, I'd greatly appreciate some help. I did see other methods of creating overlays using factory resolvers and detaching views, but being able to move the component while preserve bindings in the HTML template will save us a lot of time otherwise spent on changing a lot of components.
Edit: I forgot to mention that the error Error: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. occurs when attempting to remove the overlay without the moved comment. Angular is attempting to delete a #comment element from the overlay, but it fails to do so because the comment is still in the div where the overlay template resides. That's the reason I tried to move the comment together with the overlay.
anyone please help me, I use spectrum color picker in popup modal, but the spectrum color picker is behind of popup modal, I want color picker in front of popup modal. I use z-index but not working, I define z-index: 9999999 !important;, but after build project use gulp build, value of z-index to be z-index: 9 !important;, I use angularJS.
How to solve this problem ?
thanks.
I'm going to make a guess and assume that you're using cssnano to minify your CSS. There's a little configuration option that you should set to true to avoid z-index rebasing: http://cssnano.co/options/#optionssafe-bool.
In your gulpfile.js, you need to set this option, like so: cssnano({safe: true}).
I am wondering how to create dynamic elements in a JSP webpage? For example, what I want to do is that I have a Selection Box, in which a user selects an image. Upon clicking a button (or possibly after selecting an item), the image will 'slide down' (like how PPT slides slide down when changing slides) and rest on the center of the screen.
Or at least another simpler case would be, when clicking a button, a text box will appear each time you click the button. So far, the only idea I have of this is by using visibility but that will limit me.
Can you help me on how to do these things or if it is possible to do these with only JSP? Additionally, is it possible for elements to 'pop up' (like in facebook photo viewer) without refreshing the page?
Thank you!
You want things to happen on the client, so you need to be focusing on the HTML, CSS and JavaScript. The fact you generate the HTML using JSP is irrelevant.
Build on things that work
Write JS logic for adding new content based on the form options
Write JS logic for manipulating the CSS to do the animation
Consider using a library such as YUI or jQuery to help with the JS, and using CSS 3 Transitions for the animation.