From b21f8bd3ef368563f2debf4e0debfb319ce763ea Mon Sep 17 00:00:00 2001 From: Aleksander Machniak Date: Tue, 27 May 2014 20:08:36 +0200 Subject: Implemented image selector dialog for TinyMCE, css fixes in classic skin for TinyMCE4 --- skins/larry/styles.css | 93 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 93 insertions(+) (limited to 'skins/larry/styles.css') diff --git a/skins/larry/styles.css b/skins/larry/styles.css index 4cdf0f0f3..5bade1c0c 100644 --- a/skins/larry/styles.css +++ b/skins/larry/styles.css @@ -2599,3 +2599,96 @@ fieldset.tab { padding: 0; margin-left: 0; } + +/*** image selector in HTML editor ***/ +#image-selector-list { + position: absolute; + top: 0; + left: 0; + right: 152px; + height: 100%; + overflow-x: hidden; + overflow-y: auto; +} + +#image-selector-form { + position: absolute; + top: 0; + bottom: 0; + right: 0; + width: 150px; + border: 0; + border: 1px solid #FFF; + border-left: 1px solid #DDD; + background: url(images/filedrop.png) center bottom no-repeat; + text-align: center; + padding-top: 10px; +} + +#image-upload-button { + width: 80%; + height: 30px; +} + +#image-upload-button span { + position: absolute; + width: 100%; + text-align: center; + line-height: 30px; +} + +#image-selector-list li { + line-height: 80px; + padding: 2px 0 2px 3px; + cursor: pointer; + overflow: hidden; + text-overflow: ellipsis; +} + +#image-selector-list li:hover { + background-color: #F0F0F0; +} + +#image-selector-list ul li img { + vertical-align: middle; + max-height: 80px; +} + +#image-selector-list ul li span.name { + vertical-align: middle; + font-weight: bold; + padding-left: 10px; +} + +#image-selector-list ul li span.img { + height: 80px; + width: 80px; + text-align: center; + display: inline-block; + overflow: hidden; + line-height: 80px; +} + +#image-selector-form.droptarget.hover, +#image-selector-form.droptarget.active { + border: 1px solid #019bc6; + box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5); + -moz-box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5); + -webkit-box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5); + -o-box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5); +} + +#image-selector-form.droptarget.hover { + background-color: #d9ecf4; + box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9); + -moz-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9); + -webkit-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9); + -o-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9); +} + +div.mce-abs-end div.hint { + line-height: 50px; + padding-left: 10px; + color: #999; + text-shadow: 0 1px 1px #FFF; +} -- cgit v1.2.3