waveterm/frontend/app/view/term/term.less

135 lines
2.7 KiB
Plaintext
Raw Normal View History

// Copyright 2024, Command Line Inc.
// SPDX-License-Identifier: Apache-2.0
.view-term {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
overflow: hidden;
border-left: 4px solid transparent;
padding-left: 4px;
position: relative;
.term-header {
display: flex;
flex-direction: row;
padding: 4px 10px;
height: 35px;
gap: 10px;
align-items: center;
flex-shrink: 0;
border-bottom: 1px solid var(--border-color);
}
.term-connectelem {
flex-grow: 1;
min-height: 0;
overflow: hidden;
line-height: 1;
}
.term-htmlelem {
display: flex;
flex-direction: column;
width: 100%;
flex-grow: 1;
min-height: 0;
overflow: hidden;
.term-htmlelem-focus {
height: 0;
width: 0;
input {
width: 0;
height: 0;
opacity: 0;
pointer-events: none;
}
}
.term-htmlelem-content {
display: flex;
flex-direction: row;
width: 100%;
flex-grow: 1;
min-height: 0;
overflow: hidden;
}
}
&.term-mode-term {
.term-connectelem {
display: flex;
}
.term-htmlelem {
display: none;
}
}
&.term-mode-html {
.term-connectelem {
display: none;
}
.term-htmlelem {
display: flex;
}
.ijson iframe {
width: 100%;
height: 100%;
border: none;
}
}
.term-stickers {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: var(--zindex-termstickers);
pointer-events: none;
.term-sticker-image {
img {
object-fit: contain;
width: 100%;
height: 100%;
}
}
.term-sticker-svg {
svg {
object-fit: contain;
width: 100%;
height: 100%;
}
}
}
2024-07-09 07:31:38 +02:00
.terminal {
*::-webkit-scrollbar {
width: 4px;
height: 4px;
}
*::-webkit-scrollbar-track {
background-color: var(--scrollbar-background-color);
}
*::-webkit-scrollbar-thumb {
display: none;
background-color: var(--scrollbar-thumb-color);
border-radius: 4px;
margin: 0 1px 0 1px;
}
&:hover {
*::-webkit-scrollbar-thumb {
display: block;
}
}
}
}