Closed FaresKi closed 1 year ago
Terminal width is set to 100% by default. Is the issue only with the height? (Height is set to 600px by default).
It is impossible to override height. Is it possible for you to change the default height to 100% so the terminal height would be controlled by the element that contains it?
@antanasramana There is not a great way to override the height right now. It would require a small update to make it easier.
If anyone's still looking for a work around, I solved the problem by using a useEffect
hook as follows:
useEffect(() => {
if (wrapperDiv === undefined) {
wrapperDiv = document.getElementsByClassName('react-terminal-wrapper')[0];
wrapperDiv.setAttribute('style', `height: ${HEIGHT};`);
}
});
However, I think a better solution would be to allow a height
prop to be passed to the Terminal
component that sets the wrapper-div's height
@jonmbake.
@jonmbake the height
prop should be applied to the outermost div (the one who's class is react-terminal-wrapper
), not the one inside it I think.
@drageelr I basically moved height from the .react-terminal
style.css rule to a prop.
It seems to work from my testing:
<Terminal name='React Terminal UI' colorMode={ colorMode } onInput={ onInput } height="1000px">
{lineData}
</Terminal>
Renders a 1000px
height terminal:
Can you upgrade to v1.0.1 and try it out?
Yes, tested it out. It's working. Great job!
Is your feature request related to a problem? Please describe. I'm trying to make my terminal full screen, unlike the way it currently is:
Describe the solution you'd like From a quick glance in your repo, it seems that the style.css limits the width and the height for the terminal itself, I'd like to have the option to provide a css or at least properties with the Terminal component. Describe alternatives you've considered Tried providing my own css, it got overridden by the default one.