You are here

Home » API reference » CKEditor Images Gallery 8

ckeditor-images-gallery.dialog.css in CKEditor Images Gallery 8 

.cke_dialog_body  .cke-ig-edit-list {
  height: 400px;
  overflow-y: auto;
}
.cke_dialog_body  .cke-ig-edit-list img {
  width: 100%;
  max-height: 100%;
}
.cke_dialog_body  .cke-ig-edit-list .item {
  display: grid;
  grid-template-columns: 30% 70%;
  border: 1px dashed #9e9191;
  margin: 2px 0;
}
.cke_dialog_body  .cke-ig-edit-list .item .img-wrap {
  grid-column: 1;
  padding: 5px;
}
.cke_dialog_body  .cke-ig-edit-list .item .attr-wrap {
  grid-column: 2;
  padding: 5px;
}
.cke_dialog_body  .cke-ig-edit-list .item input[type="text"] {
  width: 100%;
}
.cke_dialog_body  .cke-ig-edit-list .item.selected {
  border: 2px dashed red;
  outline: none;
}
.cke_dialog_body  .cke-ig-edit-list .item.selected.typing {
  border: 2px dashed #9e9191;
}

File

css/ckeditor-images-gallery.dialog.css
View source 
  1. .cke_dialog_body  .cke-ig-edit-list {

  2.   height: 400px;

  3.   overflow-y: auto;

  4. }

  5. .cke_dialog_body  .cke-ig-edit-list img {

  6.   width: 100%;

  7.   max-height: 100%;

  8. }

  9. .cke_dialog_body  .cke-ig-edit-list .item {

  10.   display: grid;

  11.   grid-template-columns: 30% 70%;

  12.   border: 1px dashed #9e9191;

  13.   margin: 2px 0;

  14. }

  15. .cke_dialog_body  .cke-ig-edit-list .item .img-wrap {

  16.   grid-column: 1;

  17.   padding: 5px;

  18. }

  19. .cke_dialog_body  .cke-ig-edit-list .item .attr-wrap {

  20.   grid-column: 2;

  21.   padding: 5px;

  22. }

  23. .cke_dialog_body  .cke-ig-edit-list .item input[type="text"] {

  24.   width: 100%;

  25. }

  26. .cke_dialog_body  .cke-ig-edit-list .item.selected {

  27.   border: 2px dashed red;

  28.   outline: none;

  29. }

  30. .cke_dialog_body  .cke-ig-edit-list .item.selected.typing {

  31.   border: 2px dashed #9e9191;

  32. }