public/src/css/style.css

   1 /* Common */
   2 body {
   3     width: 100%;
   4     height: 100%;
   5 }
   6
   7 @media(min-width:992px) {
   8     .navbar {
   9         -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
  10         -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
  11         transition: background .5s ease-in-out,padding .5s ease-in-out;
  12     }
  13
  14     .top-nav-collapse {
  15         padding: 0;
  16     }
  17 }
  18
  19 .modal {
  20   text-align: center;
  21 }
  22
  23 @media screen and (min-width: 992px) {
  24   .modal:before {
  25     display: inline-block;
  26     vertical-align: middle;
  27     content: " ";
  28     height: 100%;
  29   }
  30 }
  31
  32 .badge {
  33     background-color: #337ab7;
  34 }
  35
  36 /* Modal Dialog */
  37 .modal-dialog {
  38     display: inline-block;
  39     text-align: center;
  40     vertical-align: middle;
  41 }
  42
  43 /* Main Navigator Bar */
  44 .navbar-brand {
  45     padding: 10px 15px;
  46 }
  47
  48 #tic-brand-img {
  49     display: inline;
  50 }
  51
  52 .tic-page-scroll {
  53     font-size: 16px;
  54 }
  55
  56 /* Login and Logout Menu */
  57 #tic-page-login-dropdown-menu, #tic-page-logout-dropdown-menu {
  58     min-width: 250px;
  59     padding: 14px 14px 0;
  60     overflow: hidden;
  61     background-color: rgba(255,255,255,.8);
  62 }
  63
  64 #tic-page-login-dropdown-menu .help-block, #tic-page-logout-dropdown-menu .help-block {
  65     font-size: 12px;
  66 }
  67
  68 #tic-page-login-dropdown-menu .bottom, #tic-page-logout-dropdown-menu .bottom {
  69     background-color: rgba(255,255,255,.8);
  70     border-top: 1px solid #ddd;
  71     clear: both;
  72     padding: 14px;
  73 }
  74
  75 #tic-page-login-dropdown-menu .social-buttons, #tic-page-logout-dropdown-menu .social-buttons {
  76     margin: 12px 0;
  77 }
  78
  79 #tic-page-login-dropdown-menu .social-buttons a, #tic-page-logout-dropdown-menu .social-buttons a {
  80     width: 49%;
  81 }
  82
  83 #tic-page-login-dropdown-menu .form-group, #tic-page-logout-dropdown-menu .form-group {
  84     margin-bottom: 10px;
  85 }
  86
  87 @media(max-width:768px) {
  88     #tic-page-login-dropdown-menu, #tic-page-logout-dropdown-menu {
  89         background-color: inherit;
  90         color: #fff;
  91     }
  92     #tic-page-login-dropdown-menu .bottom, #tic-page-logout-dropdown-menu .bottom {
  93         background-color: inherit;
  94         border-top:0 none;
  95     }
  96 }
  97
  98 /* Package Page */
  99 #tic-package-section {
 100     height: 100%;
 101     padding-top: 70px;
 102     background: #e1e1e1;
 103 }
 104
 105 #tic-package-left-col-tree-toolbar, #tic-package-left-col-tree {
 106     padding-top: 10px;
 107 }
 108
 109 #tic-package-left-col-tree {
 110     height: calc(100vh - 200px);
 111     overflow: auto;
 112 }
 113
 114 #tic-package-left-col-tree .list-group-item {
 115     padding: 3px 10px;
 116 }
 117
 118 /* Package Toolbar filter-clear button */
 119 ::-ms-clear {
 120     display: none;
 121 }
 122 .form-control-clear {
 123     z-index: 10;
 124     pointer-events: auto;
 125     cursor: pointer;
 126 }
 127
 128 #tic-package-info-table, #tic-package-summary {
 129     height: calc(50vh - 183px);
 130     display: inline-block;
 131     overflow: auto;
 132 }
 133
 134 /* Job Page */
 135 #tic-job-section {
 136     height: 100%;
 137     padding-top: 70px;
 138     background: #e1e1e1;
 139 }
 140 #tic-job-list {
 141     height: calc(100vh - 210px);
 142     display: inline-block;
 143     width: 100%;
 144 }
 145 #tic-job-section .panel-heading .pull-right {
 146     margin-top: -20px;
 147 }
 148 #tic-job-section .navbar-form {
 149     padding: 0px;
 150 }
 151 #tic-job-section .table {
 152     margin-bottom: 0px;
 153 }
 154 #tic-job-list .tic-job-list-btn {
 155     float: right;
 156     min-width: 10px;
 157     padding: 3px 7px;
 158     font-size: 12px;
 159     font-weight: bold;
 160     line-height: 1;
 161     color: #fff;
 162     text-align: center;
 163     white-space: nowrap;
 164     vertical-align: middle;
 165     border-radius: 10px;
 166     background-color: rgba(47, 45, 45, 0.48);
 167 }
 168 #tic-job-list .btndownload {
 169     background-color: #337ab7;
 170 }
 171 #tic-job-list .btnnotactive {
 172     pointer-events: none;
 173     cursor: defulat;
 174     background-color: rgba(47, 45, 45, 0.48);
 175     opacity: 0.6;
 176 }
 177 #tic-job-list .btncancel {
 178     background-color: #020202;
 179 }
 180 .extended_job_table_row {
 181     border: 1px solid #eee;
 182     border-radius: 3px;
 183     line-height: 12vh;
 184     overflow: scroll;
 185     font-size: 12px;
 186     background-color: rgba(13, 19, 14, 0.71);
 187     color: #ddd;
 188     text-align: left;
 189 }
 190 td.extended_job_table_container > div {
 191     width: 100%;
 192     height: 100%;
 193     overflow: auto;
 194 }
 195 td.extended_job_table_container {
 196     height: 10vh;
 197 }
 198 tr.extended_job_table_row:hover {
 199     background-color: rgba(13, 19, 14, 0.71);
 200 }
 201 tr.extended_job_table_row:hover td {
 202     background-color: transparent;
 203 }
 204 #tic-job-table {
 205     height: calc(100vh - 320px);
 206     text-overflow: ellipsis;
 207     text-align: center;
 208 }
 209 #tic-job-filter {
 210     width: 100%;
 211     float: left;
 212 }
 213
 214 #tic-job-list-pagination {
 215     float: right;
 216     text-align: center;
 217 }
 218
 219 /* Image Page */
 220 #tic-image-section {
 221     height: 100%;
 222     padding-top: 70px;
 223     background: #e1e1e1;
 224 }
 225 #tic-image-new-container {
 226     height: calc(50vh - 183px);
 227     display: inline-block;
 228     overflow: auto;
 229 }
 230 #tic-image-list {
 231     height: calc(100vh - 320px);
 232     display: inline-block;
 233     overflow: auto;
 234     text-overflow: ellipsis;
 235     width: 100%;
 236 }
 237 #tic-image-filter {
 238         width: 100%;
 239     float: left
 240 }
 241
 242 /* Image List Item */
 243 .image-list-name {
 244     font-weight: bold;
 245     text-overflow: ellipsis;
 246     white-space:nowrap;
 247     display:inline-block;
 248     min-width: 350px;
 249     overflow: hidden;
 250     width: 97%;
 251     color: #31708f;
 252 }
 253 .image-list-detail {
 254     padding-left: 10px;
 255     font-size: smaller;
 256     text-overflow: ellipsis;
 257     white-space:nowrap;
 258     display:inline-block;
 259     overflow: hidden;
 260     width: 85%;
 261 }
 262 .image-list-btndownload {
 263     float: right;
 264     min-width: 10px;
 265     padding: 3px 7px;
 266     font-size: 12px;
 267     font-weight: bold;
 268     line-height: 1;
 269     color: #fff;
 270     text-align: center;
 271     white-space: nowrap;
 272     vertical-align: middle;
 273     background-color: #337ab7;
 274     border-radius: 10px;
 275 }
 276 .image-item {
 277     overflow: hidden;
 278     height: 10vh;
 279 }
 280 .image-item-title {
 281     width: 100%;
 282 }
 283 .image-item-info {
 284     width: 60%;
 285
 286 }
 287 .image-item-btnbox {
 288     width: 40%;
 289     float: right;
 290     height: 100%;
 291     position: absolute;
 292     top: 20px;
 293     right: 20px;
 294 }
 295
 296 /* Settings Page */
 297 #tic-settings-section {
 298     height: 100%;
 299     padding-top: 70px;
 300     background: #e1e1e1;
 301 }
 302
 303 #tic-repository-toolbar {
 304     margin-bottom: 10px;
 305 }
 306
 307 /* Sortable Repo List */
 308 .dragged {
 309     position: absolute;
 310     opacity: 0.5;
 311     z-index: 2000;
 312 }
 313 #tic-repository-list li {
 314     cursor: move;
 315     display: block;
 316     padding: 5px;
 317     border: 1px solid #CCC;
 318     color: #08c;
 319     background: #eee;
 320     max-width: 100%;
 321 }
 322 #tic-repository-list li.placeholder {
 323     position: relative;
 324     margin: 0;
 325     padding: 0;
 326     border: none;
 327     content: "";
 328 }
 329 #tic-repository-list li.placeholder:before {
 330     position: absolute;
 331     content: "";
 332     width: 0;
 333     height: 0;
 334     margin-top: -5px;
 335     left: -5px;
 336     top: -4px;
 337     border: 5px solid transparent;
 338     border-left-color: #f00;
 339     border-right: none;
 340 }
 341 .tic-repository-url {
 342     overflow: hidden;
 343     white-space: nowrap;
 344     text-overflow: ellipsis;
 345     width: 90%;
 346     display: inline-block;
 347     vertical-align: middle;
 348 }