nlphub/src/main/webapp/css/custom.css

505 lines
7.0 KiB
CSS
Raw Normal View History

[type="checkbox"]+label {
margin-right: 15px !important;
}
.alg-info-p {
float:left;
margin-left: 3px;
cursor: pointer;
}
.alg-info-p:hover {
color: #4CAF50;
}
.alg-info-p::after {
content: "";
clear: both;
display: table;
}
.alg-info {
width: 18px;
heigth: auto;
}
.my-textarea {
border: 1px solid #555;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 4px;
height: 100px;
}
pre {
padding: 5px;
margin: 5px;
}
.string {
color: green;
}
.number {
color: darkorange;
}
.boolean {
color: blue;
}
.null {
color: magenta;
}
.key {
color: red;
}
.column {
margin-left: 1px;
float: left;
}
.half-width {
width: 48%;
}
.margin-left-10px {
margin-left: 10px;
}
.margin-right-10px {
margin-right: 10px;
}
.clearfix::after {
content: "";
clear: both;
display: table;
}
.fixed-height {
min-height: 200px;
}
.margin-3 {
margin: 2px;
}
.text-align-left {
text-align: left;
}
.text-align-right {
text-align: right;
}
.align-left {
float: left;
width: 80%;
}
.align-left-33 {
float: right;
width: 33%;
}
.centered {
margin-left: auto;
margin-right: auto;
}
.full-width {
width: 100%;
}
.vscrollable {
height: 220px;
overflow-y: auto;
}
.ajax-file-upload {
float: left;
margin: 10px;
color: white;
background-color: #4CAF50; /*!important;*/
padding: 0.6rem;
text-transform: uppercase;
vertical-align: middle;
border-radius: 2px;
display: inline-block;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
cursor: pointer;
}
#execute-button {
margin: 10px;
color: white;
padding: 0.6rem;
text-transform: uppercase;
vertical-align: middle;
border-radius: 2px;
display: inline-block;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
cursor: pointer;
}
.green-button {
margin: 10px;
background-color: #4CAF50;
color: white;
padding: 0.6rem;
text-transform: uppercase;
vertical-align: middle;
border-radius: 2px;
display: inline-block;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
cursor: pointer;
}
#reset-upload {
color: white;
background-color: #4CAF50;
padding: 0.2rem;
text-transform: uppercase;
vertical-align: middle;
border-radius: 2px;
display: inline-block;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
cursor: pointer;
}
.ajax-file-upload-statusbar {
height: 1.3em;
width: 100% !important;
/*display: none !important;*/
}
.ajax-upload-dragdrop {
float: right;
border: solid 1px #dfdfdf;
width: 200px !important;
}
#file-info {
/*float: right;
margin-left: 10px;*/
}
.ajax-file-upload-progress {
height: 2em !important;
}
.full-width-bar {
width: 100%;
border-bottom: solid 1px gray;
}
.title-box {
width: 69%;
float: right;
padding-left: 3em;
}
.logo {
width: 100%;
}
#logo-image {
width: 200px;
height: auto;
cursor: pointer;
}
.ajax-file-upload-container {
display: none !important;
float: right;
margin-left: 10px;
}
select {
display: block;
visibility: visible;
}
.hidden-div {
display: none;
}
.progress-circular-div {
position: absolute;
z-index: 100;
border: solid 1px gray;
padding: 10px;
background: white;
margin:0 auto;
left:50%;
top:50%;
transform: translate(-50%, -50%);
}
.popup-text {
display: none;
position: absolute;
z-index: 100;
border: solid 14px #4CAF50;
border-radius: 5px;
background: white;
margin:0 auto;
left:50%;
top:50%;
transform: translate(-50%, -50%);
padding: 20px;
}
.close {
float: right;
/*border: solid 1px #bbbbbb;
padding: 3px;
text-align: center;*/
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
font-weight: bold;
cursor: pointer;
}
#progress-caption {
margin-top: 3px;
margin-left: auto;
margin-right: auto;
}
.float-right-div {
float: right;
margin-left: 10px;
}
.left-side {
float: left;
width: 70%;
border: 1px solid silver;
height: 60vh;
margin: 2px;
}
.right-side {
float: left;
width: 29%;
border: 1px solid silver;
height: 60vh;
margin: 2px;
overflow-y: auto;
}
#ner-result-accordion {
height: 60vh;
margin: 2px;
}
.left-side-half {
float: left;
width: 49%;
height: 3vh;
margin: 1px;
}
.right-side::after {
content: "";
clear: both;
display: table;
}
.left-side-half::after {
content: "";
clear: both;
display: table;
}
.header-side {
float: left;
width: 100%;
margin-top: 1px;
margin-bottom: 1px;
padding: 5px;
}
@media (max-width: 600px) {
.left-side {
width: 100%;
height: 100%;
}
.right-side {
width: 100%;
height: 100%;
}
.left-side-half {
height: 4vh;
}
}
@media (width: 600px) {
.left-side {
width: 100%;
height: 100%;
}
.right-side {
width: 100%;
height: 100%;
}
.left-side-half {
height: 4vh;
}
}
@media (max-width: 430px) {
.left-side {
width: 100%;
height: 100%;
}
.right-side {
width: 100%;
height: 100%;
}
.left-side-half {
height: 6vh;
}
}
@media (width: 430px) {
.left-side {
width: 100%;
height: 100%;
}
.right-side {
width: 100%;
height: 100%;
}
.left-side-half {
height: 6vh;
}
}
@media (max-width: 300px) {
.left-side {
width: 100%;
height: 100%;
}
.right-side {
width: 100%;
height: 100%;
}
.left-side-half {
height: 8vh;
}
}
@media (width: 300px) {
.left-side {
width: 100%;
height: 100%;
}
.right-side {
width: 100%;
height: 100%;
}
.left-side-half {
height: 8vh;
}
}
@media (max-width: 250px) {
.left-side {
width: 100%;
height: 100%;
}
.right-side {
width: 100%;
height: 100%;
}
.left-side-half {
height: 10vh;
}
}
@media (width: 250px) {
.left-side {
width: 100%;
height: 100%;
}
.right-side {
width: 100%;
height: 100%;
}
.left-side-half {
height: 10vh;
}
}
#algorithm-param_div {
font-size: 12px !important;
}
#result-text-div {
overflow-y: auto;
}
#result-params-div {
overflow-y: auto;
}
.collapsible-body {
padding-left: 2px !important;
padding-right: 2px !important;
}
.collapsible-header {
color: white;
background-color: #4CAF50;
}
/*
input[type="checkbox"]:not(:checked){
position: unset !important;
opacity: unset !important;
padding: 3px;
}
input[type="checkbox"]:checked {
position: unset !important;
opacity: unset !important;
padding: 3px;
}
*/
.input-field label {
pointer-events: auto;
}
.collapsible {
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;;
box-shadow: none !important;;
}
/*
#result-params-div input[type="checkbox"]:not(:checked){
position: unset !important;
opacity: unset !important;
padding: 3px;
}
#result-params-div input[type="checkbox"]:checked {
position: unset !important;
opacity: unset !important;
padding: 3px;
}
*/