Styles refactoring (#977)
Boris Sekachev
6 years ago
committed by
Nikita Manovich
parent
4587afe09a
commit
4de8be7b69
@ -0,0 +1,41 @@
|
||||
$header-color: #D8D8D8;
|
||||
$text-color: #303030;
|
||||
$hover-menu-color: rgba(24,144,255,0.05);
|
||||
$completed-progress-color: #61C200;
|
||||
$inprogress-progress-color: #1890FF;
|
||||
$pending-progress-color: #C1C1C1;
|
||||
$border-color-1: #c3c3c3;
|
||||
$border-color-2: #d9d9d9;
|
||||
$border-color-hover: #40a9ff;
|
||||
$background-color-1: white;
|
||||
$background-color-2: #F1F1F1;
|
||||
$transparent-color: rgba(0, 0, 0, 0);
|
||||
$player-slider-color: #979797;
|
||||
$danger-icon-color: #FF4136;
|
||||
$info-icon-color: #0074D9;
|
||||
|
||||
$monospaced-fonts-stack: Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;
|
||||
|
||||
hr {
|
||||
border: none;
|
||||
border-top: 1px solid $border-color-1;
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
.cvat-text-color {
|
||||
color: $text-color;
|
||||
}
|
||||
|
||||
.cvat-title {
|
||||
font-weight: 400;
|
||||
font-size: 21px;
|
||||
color: $text-color;
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
#root {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
display: grid;
|
||||
}
|
||||
@ -0,0 +1,32 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.ant-menu.cvat-actions-menu {
|
||||
box-shadow: 0 0 17px rgba(0,0,0,0.2);
|
||||
|
||||
> li:hover {
|
||||
background-color: $hover-menu-color;
|
||||
}
|
||||
|
||||
.ant-menu-submenu-arrow {
|
||||
width: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-actions-menu-load-submenu-item,
|
||||
.cvat-actions-menu-dump-submenu-item,
|
||||
.cvat-actions-menu-export-submenu-item {
|
||||
&:hover {
|
||||
background-color: $hover-menu-color;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-actions-menu-dump-submenu-item,
|
||||
.cvat-actions-menu-export-submenu-item {
|
||||
> button {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-menu-icon {
|
||||
transform: scale(0.5);
|
||||
}
|
||||
@ -0,0 +1,39 @@
|
||||
@import '../../../base.scss';
|
||||
|
||||
.cvat-annotation-page-canvas-container {
|
||||
background-color: $background-color-1;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-objects-sidebar {
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
left: auto;
|
||||
background-color: $background-color-2;
|
||||
border-left: 1px solid $border-color-1;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-controls-sidebar {
|
||||
background-color: $background-color-2;
|
||||
border-right: 1px solid $border-color-1;
|
||||
|
||||
> div {
|
||||
> i {
|
||||
border-radius: 3.3px;
|
||||
transform: scale(0.65);
|
||||
padding: 2px;
|
||||
|
||||
&:hover {
|
||||
background: $header-color;
|
||||
transform: scale(0.75);
|
||||
}
|
||||
|
||||
&:active {
|
||||
transform: scale(0.65);
|
||||
}
|
||||
|
||||
> svg {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,144 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-annotation-page.ant-layout {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-layout-header.cvat-annotation-page-header {
|
||||
background-color: $background-color-2;
|
||||
border-bottom: 1px solid $border-color-1;
|
||||
height: 54px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group {
|
||||
height: 100%;
|
||||
|
||||
> div {
|
||||
padding: 0px;
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
|
||||
> span {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
> i {
|
||||
transform: scale(0.8);
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
&:hover > i {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
&:active > i {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
|
||||
> * {
|
||||
display: block;
|
||||
line-height: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
> div:first-child {
|
||||
filter: invert(0.9);
|
||||
background: $background-color-1;
|
||||
border-radius: 0px;
|
||||
width: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-group > div {
|
||||
height: 54px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-buttons {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
margin-right: 10px;
|
||||
|
||||
> i {
|
||||
transform: scale(0.6);
|
||||
|
||||
&:hover {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
|
||||
&:active {
|
||||
transform: scale(0.6);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-controls {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
line-height: 27px;
|
||||
|
||||
> div {
|
||||
position: relative;
|
||||
height: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-slider {
|
||||
width: 350px;
|
||||
|
||||
> .ant-slider-rail {
|
||||
background-color: $player-slider-color;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-annotation-header-filename-wrapper {
|
||||
max-width: 180px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-frame-selector {
|
||||
width: 5em;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-right-group {
|
||||
height: 100%;
|
||||
|
||||
> div {
|
||||
height: 54px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
margin-right: 20px;
|
||||
|
||||
> span {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
> i {
|
||||
transform: scale(0.8);
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
&:hover > i {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
&:active > i {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
}
|
||||
|
||||
> div:not(:nth-child(3)) > * {
|
||||
display: block;
|
||||
line-height: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-annotation-header-workspace-selector {
|
||||
width: 150px;
|
||||
}
|
||||
@ -0,0 +1,39 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-create-model-form-wrapper {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
overflow-y: auto;
|
||||
height: 90%;
|
||||
|
||||
> div > span {
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
.cvat-create-model-content {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid $border-color-1;
|
||||
border-radius: 3px;
|
||||
padding: 20px;
|
||||
background: $background-color-1;
|
||||
text-align: initial;
|
||||
|
||||
> div:nth-child(1) > i {
|
||||
float: right;
|
||||
font-size: 20px;
|
||||
color: $danger-icon-color;
|
||||
}
|
||||
|
||||
> div:nth-child(4) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
> div:nth-child(6) > button {
|
||||
margin-top: 10px;
|
||||
float: right;
|
||||
width: 120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,32 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-create-task-form-wrapper {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
overflow-y: auto;
|
||||
height: 90%;
|
||||
|
||||
> div > span {
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
.cvat-create-task-content {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid $border-color-1;
|
||||
border-radius: 3px;
|
||||
padding: 20px;
|
||||
background: $background-color-1;
|
||||
text-align: initial;
|
||||
|
||||
> div:not(first-child) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
> div:nth-child(7) > button {
|
||||
float: right;
|
||||
width: 120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
.cvat-feedback-button {
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.cvat-feedback-button {
|
||||
> i {
|
||||
font-size: 40px;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,8 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-share-tree {
|
||||
height: fit-content;
|
||||
min-height: 10em;
|
||||
max-height: 20em;
|
||||
overflow: auto;
|
||||
}
|
||||
@ -0,0 +1,55 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-header.ant-layout-header {
|
||||
display: flex;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
line-height: 0px;
|
||||
height: 44px;
|
||||
background: $header-color;
|
||||
}
|
||||
|
||||
.cvat-left-header {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cvat-right-header {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.anticon.cvat-logo-icon {
|
||||
> svg {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
}
|
||||
|
||||
.ant-btn.cvat-header-button {
|
||||
color: $text-color;
|
||||
padding: 0px 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
|
||||
.ant-dropdown-trigger.cvat-header-menu-dropdown {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-left: 1px solid $border-color-1;
|
||||
padding: 0px 20px;
|
||||
}
|
||||
|
||||
.anticon.cvat-header-account-icon {
|
||||
> svg {
|
||||
transform: scale(0.4);
|
||||
}
|
||||
}
|
||||
|
||||
.anticon.cvat-header-menu-icon {
|
||||
margin-left: 16px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
@ -0,0 +1,86 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
textarea.ant-input.cvat-raw-labels-viewer {
|
||||
border-color: $border-color-2;
|
||||
box-shadow: none;
|
||||
border-top: none;
|
||||
border-radius: 0px 0px 5px 5px;
|
||||
min-height: 9em;
|
||||
font-family: $monospaced-fonts-stack;
|
||||
|
||||
&:focus {
|
||||
border-color: $border-color-2;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-color: $border-color-2;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer {
|
||||
border: 1px solid $border-color-2;
|
||||
box-shadow: none;
|
||||
border-top: none;
|
||||
border-radius: 0px 0px 5px 5px;
|
||||
padding: 5px;
|
||||
display: flex;
|
||||
overflow-y: auto;
|
||||
min-height: 9em;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer-item {
|
||||
height: fit-content;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 2px 10px;
|
||||
border-radius: 2px;
|
||||
margin: 2px;
|
||||
margin-left: 8px;
|
||||
user-select: none;
|
||||
border: 1px solid $transparent-color;
|
||||
opacity: 0.6;
|
||||
|
||||
> span {
|
||||
margin-left: 5px;
|
||||
color: white;
|
||||
|
||||
> i:hover {
|
||||
filter: invert(1);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer-new-item {
|
||||
height: fit-content;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 2px 10px;
|
||||
border-radius: 2px;
|
||||
margin: 2px;
|
||||
margin-left: 8px;
|
||||
user-select: none;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.cvat-label-constructor-creator,
|
||||
.cvat-label-constructor-updater
|
||||
{
|
||||
> form:first-child {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-attribute-constructor-form > div:first-child > div:nth-child(4) {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.cvat-delete-attribute-button:hover > i {
|
||||
color: $danger-icon-color;
|
||||
}
|
||||
@ -0,0 +1,13 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-run-model-dialog > div:not(first-child) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-run-model-dialog-info-icon {
|
||||
color: $info-icon-color;
|
||||
}
|
||||
|
||||
.cvat-run-model-dialog-remove-mapping-icon {
|
||||
color: $danger-icon-color;
|
||||
}
|
||||
@ -0,0 +1,82 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-models-page {
|
||||
padding-top: 30px;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
|
||||
> div:nth-child(1) {
|
||||
margin-bottom: 10px;
|
||||
|
||||
> div:nth-child(1) {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
> div:nth-child(2) {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-empty-models-list {
|
||||
/* empty-models icon */
|
||||
> div:nth-child(1) {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
/* No models uploaded yet */
|
||||
> div:nth-child(2) > div {
|
||||
margin-top: 20px;
|
||||
|
||||
> span {
|
||||
font-size: 20px;
|
||||
color: $text-color;
|
||||
}
|
||||
}
|
||||
|
||||
/* To annotate your task automatically */
|
||||
> div:nth-child(3) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-models-list {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.cvat-models-list-item {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
border: 1px solid $border-color-1;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 15px;
|
||||
padding: 15px;
|
||||
background: $background-color-1;
|
||||
|
||||
&:hover {
|
||||
border: 1px solid $border-color-hover;
|
||||
}
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
> div:nth-child(2) > span {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
> div:nth-child(3) > span {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
#cvat-create-model-button {
|
||||
padding: 0 30px;
|
||||
}
|
||||
@ -0,0 +1,120 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-task-details-wrapper {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
|
||||
.cvat-task-details {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid $border-color-1;
|
||||
border-radius: 3px;
|
||||
padding: 20px;
|
||||
background: $background-color-1;
|
||||
|
||||
> div:nth-child(2) {
|
||||
> div:nth-child(2) {
|
||||
padding-left: 20px;
|
||||
|
||||
> div:not(:first-child) {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> div > div > div > button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-dataset-repository-url {
|
||||
> a {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
> .ant-tag-red {
|
||||
user-select: none;
|
||||
opacity: 0.4;
|
||||
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
> .ant-tag > i {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-task-job-list {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid $border-color-1;
|
||||
border-radius: 3px;
|
||||
margin-top: 20px;
|
||||
padding: 20px;
|
||||
background: $background-color-1;
|
||||
|
||||
> div:nth-child(1) > div:nth-child(1) {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-task-top-bar {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.cvat-task-preview-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
overflow: hidden;
|
||||
margin-bottom: 20px;
|
||||
|
||||
> .cvat-task-preview {
|
||||
max-width: 252px;
|
||||
max-height: 144px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-user-selector {
|
||||
margin-left: 10px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.cvat-open-bug-tracker-button {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.ant-typography.cvat-jobs-header {
|
||||
margin-bottom: 0px;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Pagination in center */
|
||||
.cvat-task-jobs-table > div > div {
|
||||
text-align: center;
|
||||
|
||||
> .ant-table-pagination.ant-pagination {
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-job-completed-color {
|
||||
color: $completed-progress-color;
|
||||
}
|
||||
|
||||
.cvat-job-validation-color {
|
||||
color: $inprogress-progress-color;
|
||||
}
|
||||
|
||||
.cvat-job-annotation-color {
|
||||
color: $pending-progress-color;
|
||||
}
|
||||
@ -0,0 +1,160 @@
|
||||
@import '../../base.scss';
|
||||
|
||||
.cvat-tasks-page {
|
||||
padding-top: 15px;
|
||||
height: 100%;
|
||||
|
||||
> div:nth-child(1) {
|
||||
margin-bottom: 10px;
|
||||
|
||||
div > {
|
||||
span {
|
||||
color: $text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> div:nth-child(2) {
|
||||
> div:nth-child(1) {
|
||||
display: flex;
|
||||
|
||||
> span:nth-child(2) {
|
||||
width: 200px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
> div:nth-child(2) {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
> div:nth-child(3) {
|
||||
height: 83%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
> div:nth-child(4) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
/* empty-tasks icon */
|
||||
.cvat-empty-tasks-list {
|
||||
> div:nth-child(1) {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
> div:nth-child(2) {
|
||||
> div {
|
||||
margin-top: 20px;
|
||||
|
||||
/* No tasks created yet */
|
||||
> span {
|
||||
font-size: 20px;
|
||||
color: $text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* To get started with your annotation project .. */
|
||||
> div:nth-child(3) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-tasks-pagination {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cvat-tasks-list {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.cvat-tasks-list-item {
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
border: 1px solid $border-color-1;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 15px;
|
||||
padding-top: 20px;
|
||||
background: $background-color-1;
|
||||
|
||||
/* description */
|
||||
> div:nth-child(2) {
|
||||
word-break: break-all;
|
||||
max-height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* open, actions */
|
||||
div:nth-child(4) {
|
||||
> div {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
/* actions */
|
||||
> div:nth-child(2) {
|
||||
margin-right: 5px;
|
||||
margin-top: 10px;
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border: 1px solid $border-color-hover;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.cvat-task-item-preview-wrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
margin: 20px;
|
||||
margin-top: 0px;
|
||||
|
||||
> .cvat-task-item-preview {
|
||||
max-width: 140px;
|
||||
max-height: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-task-progress {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cvat-task-completed-progress {
|
||||
color: $completed-progress-color;
|
||||
fill: $completed-progress-color;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.cvat-task-completed-progress {
|
||||
div.ant-progress-bg {
|
||||
background: $completed-progress-color !important; /* csslint allow: important */
|
||||
}
|
||||
}
|
||||
|
||||
.cvat-task-progress-progress {
|
||||
color: $inprogress-progress-color;
|
||||
fill: $inprogress-progress-color;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.cvat-task-pending-progress {
|
||||
color: $pending-progress-color;
|
||||
fill: $pending-progress-color;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
#cvat-create-task-button {
|
||||
padding: 0 30px;
|
||||
}
|
||||
@ -1,867 +0,0 @@
|
||||
hr {
|
||||
border: 0;
|
||||
height: 0;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.cvat-header.ant-layout-header {
|
||||
display: flex;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
line-height: 0px;
|
||||
height: 44px;
|
||||
background: #D8D8D8;
|
||||
}
|
||||
|
||||
.cvat-left-header {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cvat-right-header {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cvat-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cvat-flex-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cvat-black-color {
|
||||
color: #363435;
|
||||
}
|
||||
|
||||
.cvat-feedback-button {
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.cvat-feedback-button > i {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.anticon.cvat-logo-icon > svg {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
|
||||
.ant-btn.cvat-header-button {
|
||||
color: black;
|
||||
padding: 0px 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
|
||||
.ant-dropdown-trigger.cvat-header-menu-dropdown {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-left: 1px solid #c3c3c3;
|
||||
padding: 0px 20px;
|
||||
}
|
||||
|
||||
.anticon.cvat-header-account-icon > svg {
|
||||
transform: scale(0.4);
|
||||
}
|
||||
|
||||
.anticon.cvat-header-menu-icon {
|
||||
margin-left: 16px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.cvat-title {
|
||||
font-weight: 400;
|
||||
font-size: 21px;
|
||||
color: black;
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.cvat-tasks-page {
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.cvat-tasks-page > div:nth-child(1) {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.cvat-tasks-page > div:nth-child(1) > div > span {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.cvat-tasks-page > div:nth-child(2) > div:nth-child(1) {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cvat-tasks-page > div:nth-child(2) > div:nth-child(2) {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cvat-tasks-page > div:nth-child(2) > div:nth-child(1) > span:nth-child(2) {
|
||||
width: 200px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.cvat-tasks-page > span.ant-typography {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.cvat-tasks-page {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.cvat-tasks-page > div:nth-child(4) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-tasks-page > div:nth-child(3) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/* > 1280 */
|
||||
@media only screen and (min-height: 1280px) {
|
||||
.cvat-tasks-page > div:nth-child(3) {
|
||||
height: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 769 => 1280 */
|
||||
@media only screen and (max-height: 1280px) {
|
||||
.cvat-tasks-page > div:nth-child(3) {
|
||||
height: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 0 => 768 */
|
||||
@media only screen and (max-height: 768px) {
|
||||
.cvat-tasks-page > div:nth-child(3) {
|
||||
height: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
/* empty-tasks icon */
|
||||
.cvat-empty-task-list > div:nth-child(1) {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.cvat-empty-task-list > div:nth-child(2) > div {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* No tasks created yet */
|
||||
.cvat-empty-task-list > div:nth-child(2) > div > span {
|
||||
font-size: 20px;
|
||||
color: #4A4A4A;
|
||||
}
|
||||
|
||||
/* To get started with your annotation project .. */
|
||||
.cvat-empty-task-list > div:nth-child(3) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.ant-pagination.cvat-tasks-pagination {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cvat-task-list {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.cvat-tasks-list-item {
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
border: 1px solid #c3c3c3;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 15px;
|
||||
padding-top: 20px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.cvat-tasks-list-item:hover {
|
||||
border: 1px solid #40a9ff;
|
||||
}
|
||||
|
||||
.cvat-tasks-list-item > div:nth-child(2) {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.cvat-tasks-list-item > div:nth-child(4) > div {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.cvat-tasks-list-item > div:nth-child(4) > div:nth-child(2) {
|
||||
margin-right: 5px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-tasks-list-item > div:nth-child(4) > div:nth-child(2) > div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cvat-task-item-menu-icon > img {
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.cvat-task-item-menu-icon > img:hover {
|
||||
filter: invert(0.5);
|
||||
}
|
||||
|
||||
.ant-menu.cvat-actions-menu {
|
||||
box-shadow: 0 0 17px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
.cvat-actions-menu > hr {
|
||||
border: 0.5px solid #D6D6D6;
|
||||
}
|
||||
|
||||
.cvat-actions-menu > *:hover {
|
||||
background-color: rgba(24,144,255,0.05);
|
||||
}
|
||||
|
||||
.cvat-actions-menu-load-submenu-item:hover {
|
||||
background-color: rgba(24,144,255,0.05);
|
||||
}
|
||||
|
||||
.cvat-actions-menu-dump-submenu-item > button {
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.cvat-actions-menu-export-submenu-item:hover {
|
||||
background-color: rgba(24,144,255,0.05);
|
||||
}
|
||||
|
||||
.cvat-actions-menu-export-submenu-item > button {
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.cvat-actions-menu-dump-submenu-item:hover {
|
||||
background-color: rgba(24,144,255,0.05);
|
||||
}
|
||||
|
||||
.cvat-actions-menu > li:nth-child(2) > div > span {
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.cvat-actions-menu > .ant-menu-submenu-vertical > .ant-menu-submenu-title .ant-menu-submenu-arrow {
|
||||
width: 0px;
|
||||
}
|
||||
|
||||
.cvat-task-item-preview {
|
||||
max-width: 140px;
|
||||
max-height: 80px;
|
||||
}
|
||||
|
||||
.cvat-task-item-preview-wrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
margin: 20px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.cvat-task-progress {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cvat-task-completed-progress {
|
||||
color: #61C200;
|
||||
fill: #61C200;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.cvat-task-completed-progress > div > div > div > div.ant-progress-bg {
|
||||
background: #52c41a !important; /* csslint allow: important */
|
||||
}
|
||||
|
||||
.cvat-task-progress-progress {
|
||||
color: #1890FF;
|
||||
fill: #1890FF;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.cvat-task-pending-progress {
|
||||
color: #C1C1C1;
|
||||
fill: #C1C1C1;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.cvat-task-details-wrapper {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.cvat-task-details {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid #c3c3c3;
|
||||
border-radius: 3px;
|
||||
padding: 20px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.cvat-task-details > div:nth-child(2) > div:nth-child(2) {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.cvat-task-details > div:nth-child(2) > div:nth-child(2) > div:not(:first-child) {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.cvat-dataset-repository-url > a {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.cvat-dataset-repository-url > .ant-tag-red {
|
||||
user-select: none;
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
.cvat-dataset-repository-url > .ant-tag-red:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.cvat-dataset-repository-url > .ant-tag-red:active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.cvat-task-job-list {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid #c3c3c3;
|
||||
border-radius: 3px;
|
||||
margin-top: 20px;
|
||||
padding: 20px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.cvat-task-job-list > div:nth-child(1) > div:nth-child(1) {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cvat-task-top-bar {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.cvat-task-preview {
|
||||
max-width: 252px;
|
||||
max-height: 144px;
|
||||
}
|
||||
|
||||
.cvat-task-preview-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
overflow: hidden;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.cvat-user-selector {
|
||||
margin-left: 10px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.cvat-open-bug-tracker-button {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
textarea.ant-input.cvat-raw-labels-viewer {
|
||||
border-color: #d9d9d9;
|
||||
box-shadow: none;
|
||||
border-top: none;
|
||||
border-radius: 0px 0px 5px 5px;
|
||||
min-height: 9em;
|
||||
font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;
|
||||
}
|
||||
|
||||
.cvat-raw-labels-viewer:focus {
|
||||
border-color: #d9d9d9;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.cvat-raw-labels-viewer:hover {
|
||||
border-color: #d9d9d9;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer {
|
||||
border: 1px solid #d9d9d9;
|
||||
box-shadow: none;
|
||||
border-top: none;
|
||||
border-radius: 0px 0px 5px 5px;
|
||||
padding: 5px;
|
||||
display: flex;
|
||||
overflow-y: auto;
|
||||
min-height: 9em;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer-item {
|
||||
height: fit-content;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 2px 10px;
|
||||
border-radius: 2px;
|
||||
margin: 2px;
|
||||
margin-left: 8px;
|
||||
user-select: none;
|
||||
border: 1px solid rgba(0, 0, 0, 0);
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer-item > span {
|
||||
margin-left: 5px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer-item > span > i:hover {
|
||||
color: #111111;
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer-item:hover {
|
||||
opacity: 1;
|
||||
border: 1px solid rgba(0, 0, 0, 255);
|
||||
}
|
||||
|
||||
.cvat-constructor-viewer-new-item {
|
||||
height: fit-content;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 2px 10px;
|
||||
border-radius: 2px;
|
||||
margin: 2px;
|
||||
margin-left: 8px;
|
||||
user-select: none;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.labels-editor-new-label-button > i {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.labels-editor-new-label-button > i:hover {
|
||||
color: #111111;
|
||||
}
|
||||
|
||||
.cvat-label-constructor-creator > form:first-child {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-label-constructor-updater > form:first-child {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-attribute-constructor-form > div:first-child > div:nth-child(4) {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.cvat-save-attribute-button:hover > i {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.cvat-delete-attribute-button:hover > i {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.ant-typography.cvat-jobs-header {
|
||||
margin-bottom: 0px;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Pagination in center */
|
||||
.cvat-task-jobs-table > div > div {
|
||||
text-align: center;
|
||||
}
|
||||
.cvat-task-jobs-table > div > div > .ant-table-pagination.ant-pagination {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.cvat-job-completed-color {
|
||||
color: #61C200;
|
||||
}
|
||||
|
||||
.cvat-job-validation-color {
|
||||
color: #1890FF;
|
||||
}
|
||||
|
||||
.cvat-job-annotation-color {
|
||||
color: #C1C1C1;
|
||||
}
|
||||
|
||||
.cvat-create-task-form-wrapper {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
overflow-y: auto;
|
||||
height: 90%;
|
||||
}
|
||||
|
||||
.cvat-create-task-form-wrapper > div > span {
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
.cvat-create-task-content {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid #c3c3c3;
|
||||
border-radius: 3px;
|
||||
padding: 20px;
|
||||
background: white;
|
||||
text-align: initial;
|
||||
}
|
||||
|
||||
.cvat-create-task-content > div:not(first-child) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-create-task-content > div:nth-child(7) > button {
|
||||
float: right;
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.cvat-share-tree {
|
||||
height: fit-content;
|
||||
min-height: 10em;
|
||||
max-height: 20em;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.cvat-models-page {
|
||||
padding-top: 30px;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.cvat-models-page > div:nth-child(1) {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.cvat-models-page > div:nth-child(1) > div:nth-child(1) {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cvat-models-page > div:nth-child(1) > div:nth-child(2) {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
/* empty-models icon */
|
||||
.cvat-empty-models-list > div:nth-child(1) {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.cvat-empty-models-list > div:nth-child(2) > div {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* No models uploaded yet */
|
||||
.cvat-empty-models-list > div:nth-child(2) > div > span {
|
||||
font-size: 20px;
|
||||
color: #4A4A4A;
|
||||
}
|
||||
|
||||
/* To annotate your task automatically */
|
||||
.cvat-empty-models-list > div:nth-child(3) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-models-list {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.cvat-models-list-item {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
border: 1px solid #c3c3c3;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 15px;
|
||||
padding: 15px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.cvat-models-list-item:hover {
|
||||
border: 1px solid #40a9ff;
|
||||
}
|
||||
|
||||
.cvat-models-list-item > div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cvat-models-list-item > div:nth-child(2) > span {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.cvat-models-list-item > div:nth-child(3) > span {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.cvat-menu-icon {
|
||||
transform: scale(0.5);
|
||||
}
|
||||
|
||||
.cvat-create-model-form-wrapper {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
overflow-y: auto;
|
||||
height: 90%;
|
||||
}
|
||||
|
||||
.cvat-create-model-form-wrapper > div > span {
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
.cvat-create-model-content {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid #c3c3c3;
|
||||
border-radius: 3px;
|
||||
padding: 20px;
|
||||
background: white;
|
||||
text-align: initial;
|
||||
}
|
||||
|
||||
.cvat-create-model-content > div:nth-child(1) > i {
|
||||
float: right;
|
||||
font-size: 20px;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.cvat-create-model-content > div:nth-child(4) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-create-model-content > div:nth-child(6) > button {
|
||||
margin-top: 10px;
|
||||
float: right;
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.cvat-run-model-dialog > div:not(first-child) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.cvat-run-model-dialog-info-icon {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
.cvat-run-model-dialog-remove-mapping-icon {
|
||||
color: red;
|
||||
}
|
||||
|
||||
#root {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
display: grid;
|
||||
}
|
||||
|
||||
#cvat-create-task-button {
|
||||
padding: 0 30px;
|
||||
}
|
||||
|
||||
#cvat-create-model-button {
|
||||
padding: 0 30px;
|
||||
}
|
||||
|
||||
/* Annotation view */
|
||||
.cvat-annotation-page.ant-layout {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-layout-header.cvat-annotation-page-header {
|
||||
background-color: #F1F1F1;
|
||||
border-bottom: 1px solid #D7D7D7;
|
||||
height: 54px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group > div {
|
||||
padding: 0px;
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group > div:first-child {
|
||||
filter: invert(0.9);
|
||||
background: white;
|
||||
border-radius: 0px;
|
||||
width: 70px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group > div > * {
|
||||
display: block;
|
||||
line-height: 0px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group > div > span {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group > div > i {
|
||||
transform: scale(0.8);
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group > div:hover > i {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
.cvat-annotation-header-left-group > div:active > i {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-group > div {
|
||||
height: 54px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-buttons {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-buttons > i {
|
||||
transform: scale(0.6);
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-buttons > i:hover {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-buttons > i:active {
|
||||
transform: scale(0.6);
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-controls {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
line-height: 27px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-controls > div {
|
||||
position: relative;
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-slider {
|
||||
width: 350px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-player-slider > .ant-slider-rail {
|
||||
background-color: #979797;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-filename-wrapper {
|
||||
max-width: 180px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-frame-selector {
|
||||
width: 5em;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-right-group {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-right-group > div {
|
||||
height: 54px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-right-group > div:not(:nth-child(3)) > * {
|
||||
display: block;
|
||||
line-height: 0px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-right-group > div > span {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-right-group > div > i {
|
||||
transform: scale(0.8);
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.cvat-annotation-header-right-group > div:hover > i {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
.cvat-annotation-header-right-group > div:active > i {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
|
||||
.cvat-annotation-header-workspace-selector {
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-controls-sidebar {
|
||||
background-color: #F1F1F1;
|
||||
border-right: 1px solid #D7D7D7;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-objects-sidebar {
|
||||
background-color: #F1F1F1;
|
||||
border-left: 1px solid #D7D7D7;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-canvas-container {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-objects-sidebar {
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
left: auto;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-controls-sidebar > div > i {
|
||||
border-radius: 3.3px;
|
||||
transform: scale(0.65);
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-controls-sidebar > div > i:hover {
|
||||
background: #D8D8D8;
|
||||
transform: scale(0.75);
|
||||
}
|
||||
|
||||
.cvat-annotation-page-controls-sidebar > div > i:active {
|
||||
background: #C3C3C3;
|
||||
}
|
||||
|
||||
.cvat-annotation-page-controls-sidebar > div > i > svg {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
Loading…
Reference in New Issue