lib/editor/atto/styles.css

   1 .editor_atto_content_wrap {
   2     background-color: white;
   3     color: #333;
   4 }
   5
   6 .editor_atto_content {
   7     padding: 4px;
   8     resize: vertical;
   9     overflow: auto;
  10 }
  11
  12 .editor_atto_content_wrap,
  13 .editor_atto + textarea {
  14     width: 100%;
  15     padding: 0;
  16     border: 1px solid #bbb;
  17     border-top: none;
  18 }
  19
  20 .editor_atto + textarea {
  21     border-radius: 0;
  22     resize: vertical;
  23     margin-top: -1px;
  24 }
  25
  26 div.editor_atto_toolbar {
  27     display: block;
  28     background: #f2f2f2;
  29     min-height: 35px;
  30     border: 1px solid #bbb;
  31     width: 100%;
  32     padding: 0 0 9px 0;
  33 }
  34
  35 div.editor_atto_toolbar button {
  36     padding: 4px 9px;
  37     background: none;
  38     border: 0;
  39     margin: 0;
  40     border-radius: 0;
  41     cursor: pointer;
  42 }
  43
  44 div.editor_atto_toolbar button + button {
  45     border-left: 1px solid #ccc;
  46 }
  47
  48 div.editor_atto_toolbar button[disabled] {
  49     opacity: .45;
  50     background: none;
  51     cursor: default;
  52 }
  53
  54 .editor_atto_toolbar button:hover {
  55     background-image: radial-gradient(ellipse at center, #fff 60%, #dfdfdf 100%);
  56     background-color: #ebebeb;
  57 }
  58
  59 .editor_atto_toolbar button:active,
  60 .editor_atto_toolbar button.highlight {
  61     background-image: radial-gradient(ellipse at center, #fff 40%, #dfdfdf 100%);
  62     background-color: #dfdfdf;
  63 }
  64
  65 /* Make firefox button sizes match other browsers */
  66 div.editor_atto_toolbar button::-moz-focus-inner {
  67     border: 0;
  68     padding: 0;
  69 }
  70
  71 div.editor_atto_toolbar button .icon {
  72     padding: 0;
  73     margin: 2px 0;
  74 }
  75
  76 div.editor_atto_toolbar div.atto_group {
  77     display: inline-block;
  78     border: 1px solid #ccc;
  79     border-bottom: 1px solid #b3b3b3;
  80     border-radius: 4px;
  81     margin: 9px 0 0 9px;
  82     background: #fff;
  83 }
  84
  85 .editor_atto_content img {
  86     resize: both;
  87     overflow: auto;
  88 }
  89
  90 .atto_hasmenu {
  91     /* IE8 places the images on top of each other if that is not set. */
  92     white-space: nowrap;
  93 }
  94
  95 .atto_menuentry .icon {
  96     width: 16px;
  97     height: 16px;
  98 }
  99
 100 .atto_menuentry {
 101     clear: left;
 102 }
 103
 104 .atto_menuentry h1,
 105 .atto_menuentry h2,
 106 .atto_menuentry p {
 107     margin: 4px;
 108 }
 109
 110 /*.atto_form label.sameline {
 111     display: inline-block;
 112     min-width: 10em;
 113 }*/
 114
 115 .atto_form textarea.fullwidth,
 116 .atto_form input.fullwidth {
 117     width: 100%;
 118 }
 119
 120 .atto_form {
 121     padding: 0.5rem;
 122 }
 123
 124 /*.atto_form label {
 125     display: block;
 126     margin: 0 0 5px 0;
 127 }*/
 128
 129 .atto_control {
 130     position: absolute;
 131     right: -6px;
 132     bottom: -6px;
 133     display: none;
 134     cursor: pointer;
 135 }
 136
 137 .atto_control .icon {
 138     background-color: white;
 139 }
 140
 141 div.editor_atto_content:focus .atto_control,
 142 div.editor_atto_content:hover .atto_control {
 143     display: block;
 144 }
 145
 146 .editor_atto_menu.yui3-menu-hidden {
 147     display: none;
 148 }
 149
 150 /* Get broken images back in firefox */
 151 .editor_atto_content img:-moz-broken {
 152     -moz-force-broken-image-icon: 1;
 153     min-width: 24px;
 154     min-height: 24px;
 155 }
 156
 157 /* Atto menu styling */
 158 .moodle-dialogue-base .editor_atto_menu .moodle-dialogue-content .moodle-dialogue-bd {
 159     padding: 0;
 160     z-index: 1000;
 161 }
 162
 163 .editor_atto_menu .dropdown-menu > li > a {
 164     margin: 3px 14px;
 165 }
 166
 167 .editor_atto_menu .open ul.dropdown-menu {
 168     padding-top: 5px;
 169     padding-bottom: 5px;
 170 }
 171
 172 .editor_atto_wrap {
 173     position: relative;
 174 }
 175 /*rtl:ignore*/
 176 .editor_atto_wrap textarea {
 177     direction: ltr;
 178 }
 179
 180 .editor_atto_notification .atto_info,
 181 .editor_atto_notification .atto_warning {
 182     display: inline-block;
 183     background-color: #f2f2f2;
 184     padding: 0.5em;
 185     padding-left: 1em;
 186     padding-right: 1em;
 187     border-bottom-left-radius: 1em;
 188     border-bottom-right-radius: 1em;
 189 }
 190
 191 .editor_atto_notification .atto_info {
 192     background-color: #f2f2f2;
 193 }
 194
 195 .editor_atto_notification .atto_warning {
 196     background-color: #ffd700;
 197 }
 198
 199 .editor_atto_toolbar,
 200 .editor_atto_content_wrap,
 201 .editor_atto + textarea {
 202     box-sizing: border-box;
 203 }