customize the terminal looks

[csrgxtu]

Hi, this project is awsome. if I want to customize the looks of the terminal, is it the static/style.css where I should modify.

[thatkookooguy]

No. There are two files that take care of any user modifications to tty.js including javascript and css changes.
The files are located in tty.js/static/ (if they are not there, just create them)
the files are:
user.js, &
user.css

So, for example, changing the terminal's background color to Ubuntu's deep purple, you can create a user.css file, and add this to it:
.terminal {
background-color: #300A24 !important;
}

The important is necessary in this case since the terminal background color is set in the style attribute of .terminal and changing the actual class's background won't win over the style attribute.

Most of the things on tty.js besides the terminal itself (terminal title, webpage background, etc.) can be done without the !important thing.

You can also customize the tty.js interface a bit with javascript. for example, making tty.js open up a terminal in fullscreen as soon as you log in, can be done by adding my gists user.js.
https://gist.github.com/Thatkookooguy/a08f447bf491e091e5e4

[nickgs]

Hello, there is also a 'static' configuration option. You can use that to point to your own content to be served.

You could do something like this:

var app = tty.createServer({
  shell: 'bash',
  users: {
    foo: 'bar'
  },
  static: './app',
  port: 8000
});

Now the app directory can contain your own markup, js, and css without touching the files in this projects static directory.

[yunliang-ding]

否。有两个文件负责用户对tty.js的任何修改，包括javascript和css更改。
这些文件位于tty.js / static /中（如果不存在，只需创建它们），
这些文件是：
user.js和
user.css

因此，例如，将终端的背景颜色更改为Ubuntu的深紫色，您可以创建一个user.css文件，并将其添加到其中：
.terminal {
background-color：＃300A24！important;
}

在这种情况下，重要的是必要的，因为终端背景色是在.terminal的样式属性中设置的，并且更改实际类的背景不会赢得样式属性的影响。

除了终端本身之外，tty.js上的大多数事情（终端标题，网页背景等）都可以不用！important来完成。

您也可以使用javascript自定义tty.js接口。例如，通过添加我的要点user.js可以使tty.js在您登录后立即全屏打开终端。
https://gist.github.com/Thatkookooguy/a08f447bf491e091e5e4

I can't open this link, could you tell me how to do it? That's exactly what I need.

[yunliang-ding]

setTimeout(() => {
window.tty = new window.tty.Window()
window.tty.maximize()
window.theme.setDark()
setTimeout(()=>{
let myEvent = new Event('resize');
window.dispatchEvent(myEvent);
},100)
}, 1000)

否。有两个文件负责用户对tty.js的任何修改，包括javascript和css更改。
这些文件位于tty.js / static /中（如果不存在，只需创建它们），
这些文件是：
user.js和
user.css

因此，例如，将终端的背景颜色更改为Ubuntu的深紫色，您可以创建一个user.css文件，并将其添加到其中：
.terminal {
background-color：＃300A24！important;
}

在这种情况下，重要的是必要的，因为终端背景色是在.terminal的样式属性中设置的，并且更改实际类的背景不会赢得样式属性的影响。

除了终端本身之外，tty.js上的大多数事情（终端标题，网页背景等）都可以不用！important来完成。

您也可以使用javascript自定义tty.js接口。例如，通过添加我的要点user.js可以使tty.js在您登录后立即全屏打开终端。
https://gist.github.com/Thatkookooguy/a08f447bf491e091e5e4

I open the terminal by default in this way, but it doesn't feel very good.
user.js
setTimeout(() => {
window.tty = new window.tty.Window()
window.tty.maximize()
setTimeout(()=>{
let myEvent = new Event('resize');
window.dispatchEvent(myEvent);
},100)
}, 1000)