126 lines
No EOL
2.8 KiB
SCSS
126 lines
No EOL
2.8 KiB
SCSS
body {
|
|
background: #97cfca;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.terminal-window {
|
|
text-align: left;
|
|
width: 37.5rem;
|
|
height: 22.5rem;
|
|
border-radius: .625rem;
|
|
margin: auto;
|
|
position: relative;
|
|
top: 10.5rem;
|
|
header {
|
|
background: #E0E8F0;
|
|
height: 1.875rem;
|
|
border-radius: .5rem .5rem 0 0;
|
|
padding-left: .625rem;
|
|
|
|
.button {
|
|
width: .75rem;
|
|
height: .75rem;
|
|
margin: .625rem .25rem 0 0;
|
|
display: inline-block;
|
|
border-radius: .5rem;
|
|
|
|
&.green {
|
|
background: #3BB662;
|
|
}
|
|
&.red {
|
|
background: #E75448;
|
|
}
|
|
&.yellow {
|
|
background: #E5C30F;
|
|
}
|
|
}
|
|
}
|
|
section.terminal {
|
|
color: white;
|
|
font-family: Menlo, Monaco, "Consolas", "Courier New", "Courier";
|
|
font-size: 11pt;
|
|
background: #30353A;
|
|
padding: .625rem;
|
|
box-sizing: border-box;
|
|
position: absolute;
|
|
width: 100%;
|
|
top: 1.875rem;
|
|
bottom: 0;
|
|
overflow: auto;
|
|
|
|
.typed-cursor {
|
|
opacity: 1;
|
|
-webkit-animation: blink 0.7s infinite;
|
|
-moz-animation: blink 0.7s infinite;
|
|
animation: blink 0.7s infinite;
|
|
}
|
|
}
|
|
}
|
|
|
|
@keyframes blink{
|
|
0% { opacity:1; }
|
|
50% { opacity:0; }
|
|
100% { opacity:1; }
|
|
}
|
|
@-webkit-keyframes blink{
|
|
0% { opacity:1; }
|
|
50% { opacity:0; }
|
|
100% { opacity:1; }
|
|
}
|
|
@-moz-keyframes blink{
|
|
0% { opacity:1; }
|
|
50% { opacity:0; }
|
|
100% { opacity:1; }
|
|
}
|
|
|
|
.terminal-data { display: none; }
|
|
.terminal-window {
|
|
.gray {
|
|
color: gray;
|
|
}
|
|
|
|
.green {
|
|
color: green;
|
|
}
|
|
}
|
|
|
|
/*Media for mobile responsive viewing*/
|
|
@media only screen and (max-width: 600px) {
|
|
.terminal-window {
|
|
text-align: left;
|
|
width: 37.5vmin;
|
|
height: 22.5vmin;
|
|
border-radius: .625vmin;
|
|
margin: auto;
|
|
position: relative;
|
|
top: 30.5vmin;
|
|
|
|
header {
|
|
background: #E0E8F0;
|
|
height: 1.875vmin;
|
|
border-radius: .5vmin .5vmin 0 0;
|
|
padding-left: 1vmin;
|
|
|
|
.button {
|
|
width: .75vmin;
|
|
height: .75vmin;
|
|
margin: .625vmin .25vmin 0 0;
|
|
display: inline-block;
|
|
border-radius: .5vmin;
|
|
}
|
|
}
|
|
section.terminal {
|
|
color: white;
|
|
font-family: Menlo, Monaco, "Consolas", "Courier New", "Courier";
|
|
font-size: .6875vmin;
|
|
background: #30353A;
|
|
padding: .625vmin;
|
|
box-sizing: border-box;
|
|
position: absolute;
|
|
width: 100%;
|
|
top: 1.875vmin;
|
|
bottom: 0;
|
|
overflow: auto;
|
|
}
|
|
}
|
|
} |