diff --git a/css/style.css b/css/style.css index 6b6a8ee..a020344 100644 --- a/css/style.css +++ b/css/style.css @@ -657,12 +657,15 @@ textarea.splited-post { word-wrap: break-word; } -#post-preview a { - color: #E34F42; +#opt-form-post-preview #post-preview { + width: 76%; + margin-left: 16px; + padding: 8px; } -#post-preview samp { - background-color: #F0EFCC; +#opt-form-post-preview #post-preview .preview-container { + margin-top: 8px; + margin-bottom: -10px; /* to neutralize .image-preview */ } .splited-post-counter { @@ -1051,6 +1054,8 @@ ol.toptrends-list { .post-text samp { background-color: #F0EFCC; + padding-left: 2px; + padding-right: 2px; } .post-context diff --git a/following.html b/following.html index ab4f61e..1a5a81d 100644 --- a/following.html +++ b/following.html @@ -207,7 +207,7 @@
-
+
diff --git a/home.html b/home.html index c06955c..848137f 100644 --- a/home.html +++ b/home.html @@ -299,7 +299,7 @@
-
+
diff --git a/js/interface_common.js b/js/interface_common.js index e2ec064..c25f340 100644 --- a/js/interface_common.js +++ b/js/interface_common.js @@ -486,22 +486,10 @@ function postExpandFunction(e, postLi) { var originalLi = $('
  • ', {class: 'module post original'}).appendTo(itemOl) .append(originalPost); + setPostImagePreview(postExpandedContent, originalPost.find('a[rel="nofollow"]')); + postExpandedContent.slideDown('fast'); - if ($.Options.displayPreview.val === 'enable') { - var previewContainer = postExpandedContent.find('.preview-container')[0]; - /* was the preview added before... */ - if ($(previewContainer).children().length === 0) { - var link = originalPost.find('a[rel="nofollow"]'); - /*is there any link in the post?*/ - for (var i = 0; i < link.length; i++) { - if (/^[^?]+\.(?:jpe?g|gif|png)$/i.test(link[i].href)) { - var url = proxyURL(link[i].href); - $(previewContainer).append($('')); - } - } - } - } // insert 'reply_to' before requestRepliedBefore(originalLi); // insert replies to this post after diff --git a/js/interface_localization.js b/js/interface_localization.js index b8864db..06ad1a6 100644 --- a/js/interface_localization.js +++ b/js/interface_localization.js @@ -107,6 +107,9 @@ if(preferredLanguage == "en"){ "notify_desktop_perm_denied": "Twister cannot perform desktop notification: permission denied.\n\nIf you want to get notifications, allow them for %{this_domain} in settings of your browser.", "notify_desktop_test": "All the twisters gonna twist.\nNow you are welcome too.", "notify_desktop_title": "Watch out, it's twister over here!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Number of blocks in block chain: ", "Number of CPUs to use": "Number of CPUs to use ", "Only alphanumeric and underscore allowed.": "Only alphanumeric and underscore allowed.", @@ -402,6 +405,9 @@ if(preferredLanguage == "es"){ "notify_desktop_perm_denied": "Twister cannot perform desktop notification: permission denied.\n\nIf you want to get notifications, allow them for %{this_domain} in settings of your browser.", "notify_desktop_test": "All the twisters gonna twist.\nNow you are welcome too.", "notify_desktop_title": "Watch out, it's twister over here!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Número de bloques en la cadena de bloques: ", "Number of CPUs to use": "Número de CPUs para utilizar ", "Only alphanumeric and underscore allowed.": "Sólo alfanuméricos y subrayados permitido.", @@ -682,6 +688,9 @@ if(preferredLanguage == "uk"){ "notify_desktop_perm_denied": "Twister не може створити сповіщення на робочому столі: доступ обмежено.\n\nЯкщо ви бажаєте отримувати сповіщення, дозвольте їх виконання в налаштуваннях браузера для %{this_domain}.", "notify_desktop_test": "Є дещо новеньке у стрічці.", "notify_desktop_title": "Погляньте сюди!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Кількість блоків у ланцюгу: ", "Number of CPUs to use": "Кількість CPU до використання ", "Only alphanumeric and underscore allowed.": "Допустимі тільки латинські символи, числа та нижнє підкреслення.", @@ -959,6 +968,9 @@ if(preferredLanguage == "zh-CN"){ "notify_desktop_perm_denied": "Twister 无法发出桌面提醒:权限被拒绝。\n\n如果你想收到提醒,请在你的浏览器设置中允许 %{this_domain} 发出提醒。", "notify_desktop_test": "我们都在用 Twister。\n欢迎你的加入。", "notify_desktop_title": "注意,Twister 在这里!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "区块链中的区块数:", "Number of CPUs to use": "使用CPU数目", "Only alphanumeric and underscore allowed.": "只允许字母和下划线。", @@ -1254,6 +1266,9 @@ if(preferredLanguage == "nl"){ "notify_desktop_perm_denied": "Twister cannot perform desktop notification: permission denied.\n\nIf you want to get notifications, allow them for %{this_domain} in settings of your browser.", "notify_desktop_test": "All the twisters gonna twist.\nNow you are welcome too.", "notify_desktop_title": "Watch out, it's twister over here!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Aantal blocks in block chain: ", "Number of CPUs to use": "Aantal CPUs om te gebruiken ", "Only alphanumeric and underscore allowed.": "Alleen alphanumeriek en underscore toegestaan.", @@ -1533,6 +1548,9 @@ if(preferredLanguage == "it"){ "notify_desktop_perm_denied": "Twister cannot perform desktop notification: permission denied.\n\nIf you want to get notifications, allow them for %{this_domain} in settings of your browser.", "notify_desktop_test": "All the twisters gonna twist.\nNow you are welcome too.", "notify_desktop_title": "Watch out, it's twister over here!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Numero di blocchi nella catena: ", "Number of CPUs to use": "Numero di processori da usare:", "Only alphanumeric and underscore allowed.": "Sono permessi solo caratteri alfanumerici e '_'", @@ -1809,6 +1827,9 @@ if(preferredLanguage == "fr"){ "notify_desktop_perm_denied": "Impossible d'afficher les notifications: autorisation refusée.\n\nSi tu souhaites afficher les notifications, autorise le %{this_domain} dans les paramêtres de ton navigateur.", "notify_desktop_test": "All the twisters gonna twist.\nBienvenue à toi!", "notify_desktop_title": "Youhou! Ça bouge sur ton twister!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Nombre de blocs dans la chaîne de blocs: ", "Number of CPUs to use": "Nombre de processeurs à utiliser", "Only alphanumeric and underscore allowed.": "Seuls les caractères alphanumériques et la barre de soulignement sont permis.", @@ -2090,6 +2111,9 @@ if(preferredLanguage == "ru"){ "notify_desktop_perm_denied": "Твистер не может выполнить уведомление: разрешение не получено.\n\nЧтобы получать уведомления, разрешите их для %{this_domain} в настройках вашего браузера.", "notify_desktop_test": "Одна лягушка сказала:\n'если не буду квакать — лопну'.\nВы нужны нам, берегите себя.", "notify_desktop_title": "Watch out, it's twister over here!", + "post_preview_dummy": 'это *полужирный*, ~курсивный~, -зачёркнутый- и _подчёркнутый_ текст.\n' + + 'экранированный: `*полужирный*, ~курсивный~, -зачёркнутый- и _подчёркнутый_`.\n' + + 'ссылки на [наш потрясный логотип](%{logo}) и наш великолепный сайт: %{site}.', "Number of blocks in block chain:": "Количество блоков в цепочке: ", "Number of CPUs to use": "Сколько использовать ядер процессора", "Only alphanumeric and underscore allowed.": "Разрешены только латинские буквы, цифры и подчеркивания.", @@ -2375,6 +2399,9 @@ if(preferredLanguage == "de"){ "notify_desktop_perm_denied": "Twister kann keine Desktop-Meldungen anzeigen: Keine Berechtigung.\n\nWenn Du Meldungen angezeigt haben möchtest, erlaube sie für %{this_domain} in den Einstellungen Deines Browsers.", "notify_desktop_test": "All die Twisterer werden twisten..\nDu bist nun auch willkommen!", "notify_desktop_title": "Achtung, hier ist Twister am Gange!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Anzahl der Blöcke in der Block-Chain: ", "Number of CPUs to use": "Anzahl der zu benutzenden CPU's ", "Only alphanumeric and underscore allowed.": "Nur Buchstaben, Zahlen und Unterstrich erlaubt.", @@ -2655,6 +2682,9 @@ if(preferredLanguage == "ja"){ "notify_desktop_perm_denied": "Twister cannot perform desktop notification: permission denied.\n\nIf you want to get notifications, allow them for %{this_domain} in settings of your browser.", "notify_desktop_test": "All the twisters gonna twist.\nNow you are welcome too.", "notify_desktop_title": "Watch out, it's twister over here!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "全ブロック数: ", "Number of CPUs to use": "利用するCPUの数", "Only alphanumeric and underscore allowed.": "アルファベットとアンダースコア(_)が利用可能です", @@ -2932,6 +2962,9 @@ if(preferredLanguage == "pt-BR"){ "notify_desktop_perm_denied": "Twister cannot perform desktop notification: permission denied.\n\nIf you want to get notifications, allow them for %{this_domain} in settings of your browser.", "notify_desktop_test": "All the twisters gonna twist.\nNow you are welcome too.", "notify_desktop_title": "Watch out, it's twister over here!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Número de blocos: ", "Number of CPUs to use": "Número de CPUs a serem utilizados ", "Only alphanumeric and underscore allowed.": "Permitido apenas caracteres alfanuméricos e underscore '_'.", @@ -3213,6 +3246,9 @@ if(preferredLanguage == "tr"){ "notify_desktop_perm_denied": "Twister cannot perform desktop notification: permission denied.\n\nIf you want to get notifications, allow them for %{this_domain} in settings of your browser.", "notify_desktop_test": "All the twisters gonna twist.\nNow you are welcome too.", "notify_desktop_title": "Watch out, it's twister over here!", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Blok zincirindeki blok sayısı: ", "Number of CPUs to use": "Kullanılacak CPU sayısı ", "Only alphanumeric and underscore allowed.": "Sadece harf ve alt çizgi kullanılabilir.", @@ -3491,6 +3527,9 @@ if(preferredLanguage == "cs"){ "notify_desktop_perm_denied": "Twisteru se nepodařilo zobrazit upozornění na ploše: přístup byl odepřen.\n\nPokud chcete používat upozornění na ploše, povolte je pro %{this_domain} v nastavení vašeho prohlížeče.", "notify_desktop_test": "Twister to umí pořádně roztočit.\nKaždý je tu vítán.", "notify_desktop_title": "Twister", + "post_preview_dummy": 'here is *bold*, ~italic~, -strike-trough- and _underlined_ text.\n' + + 'same but escaped: `*bold*, ~italic~, -strike-trough- and _underlined_`.\n' + + 'links to [our awesome logo](%{logo}) and our gorgeous site: %{site}.', "Number of blocks in block chain:": "Počet bloků v blockchainu: ", "Number of CPUs to use": "Kolik jader procesoru použít? ", "Only alphanumeric and underscore allowed.": "Povolena jsou jen písmena, čísla a podtržítko.", diff --git a/js/options.js b/js/options.js index 936c5f1..b047087 100644 --- a/js/options.js +++ b/js/options.js @@ -288,9 +288,11 @@ twisterOptions.prototype.add = function (option) { }; twisterOptions.prototype.initControls = function () { + var elem; + for (var option in this) { if (typeof this[option] === 'object') { - var elem = $(this[option].option.selector); + elem = $(this[option].option.selector); if (elem.length) { if (elem.attr('type') && elem.attr('type').toLowerCase() === 'checkbox') elem.prop('checked', /^\s*1|true\s*$/i.test(this[option].val)) @@ -311,6 +313,9 @@ twisterOptions.prototype.initControls = function () { $('#testDesktopNotif').on('click', function() { $.MAL.showDesktopNotif(false, polyglot.t('notify_desktop_test'), false,'twister_notification_test', false, false, function() { alert(polyglot.t('notify_desktop_perm_denied', {'this_domain': document.domain})) }) }); + + tickOptionsPostPreview(); + $('#opt-mod-posts-display').find('select').on('change', tickOptionsPostPreview); }; function twisterOption(option) { @@ -362,3 +367,24 @@ function checkForNumeric(elem) { return false; } } + +function tickOptionsPostPreview() { + var elem = $('#opt-mod-posts-display #post-preview'); + var imgPreviewCont = elem.find('.preview-container'); + + elem.children().first().html(htmlFormatMsg( + polyglot.t('post_preview_dummy', {logo: '/img/twister_mini.png', site: 'http://twister.net.co'}), [])); + + if ($.Options.displayPreview.val === 'enable') { + imgPreviewCont.empty(); + var links = elem.children().first().find('a[rel="nofollow"]'); + if (links.length) { + setPostImagePreview(elem, links); + imgPreviewCont.show(); + } else { + imgPreviewCont.hide(); + } + } else { + imgPreviewCont.hide(); + } +} diff --git a/js/twister_formatpost.js b/js/twister_formatpost.js index 66141e0..52adcad 100644 --- a/js/twister_formatpost.js +++ b/js/twister_formatpost.js @@ -145,7 +145,7 @@ function postToElem( post, kind, promoted ) { postData.attr('data-promoted', 1); postData.attr('data-screen-name', '!' + n); } else { - setPostInfoSent(n,k,elem.find('.post-info-sent')); + setPostInfoSent(userpost["n"], userpost["k"], elem.find('.post-info-sent')); if ($.Options.filterLang.val !== 'disable' && $.Options.filterLangSimulate.val) { // FIXME it's must be stuff from template actually if (typeof(post['langFilter']) !== 'undefined') { @@ -273,6 +273,66 @@ function htmlFormatMsg(msg, mentions) { return false; } + function kindOfL(i) { + if (stopCharsMarkout.indexOf(msg.str[i]) > -1) { + for (var j = i - 1; j > -1; j--) { + if (msg.str[j] === chr) { + return -1; + } else if (stopCharsMarkout.indexOf(msg.str[j]) === -1) { + return whiteSpaces.indexOf(msg.str[j]); + } + } + } else if (msg.str[i] === '<') { + for (var j = i - 1; j > -1; j--) { + if (msg.str[j] === '>') { + if (j === 0) { + return -10; + } else { + if (msg.str[j - 1] === chr) { + return -1; + } else { + return kindOfL(j - 1); + } + } + } + } + } else { + return whiteSpaces.indexOf(msg.str[i]); + } + + return 0; + } + + function kindOfR(i) { + if (stopCharsMarkout.indexOf(msg.str[i]) > -1) { + for (var j = i + 1; j < msg.str.length; j++) { + if (msg.str[j] === chr) { + return -1; + } else if (stopCharsMarkout.indexOf(msg.str[j]) === -1) { + return whiteSpaces.indexOf(msg.str[j]); + } + } + } else if (msg.str[i] === '>') { + for (var j = i + 1; j < msg.str.length; j++) { + if (msg.str[j] === '<') { + if (j === msg.str.length - 1) { + return -10; + } else { + if (msg.str[j + 1] === chr) { + return -1; + } else { + return kindOfR(j + 1); + } + } + } + } + } else { + return whiteSpaces.indexOf(msg.str[i]); + } + + return 0; + } + var i, j, t, l, r, htmlEntityEncoded; var w = false; var p = []; @@ -284,39 +344,20 @@ function htmlFormatMsg(msg, mentions) { if (msg.str[j] !== chr) break; } - if (i === 0) { + + if (i !== 0) { + l = kindOfL(i - 1); + } + if (j !== msg.str.length) { + r = kindOfR(j); + } + if (i === 0 || l === -10) { p.push({i: i, k: j - i, t: -1, w: w, a: -1, p: -1}); w = false; - } else if (j === msg.str.length) { + } else if (j === msg.str.length || r === -10) { p.push({i: i, k: j - i, t: 1, w: w, a: -1, p: -1}); w = false; } else { - if (stopCharsMarkout.indexOf(msg.str[i - 1]) > -1) { - l = 1; - for (t = i - 2; t > -1; t--) { - if (msg.str[t] === chr) { - l = -1; - break; - } else if (stopCharsMarkout.indexOf(msg.str[t]) === -1) { - l = whiteSpaces.indexOf(msg.str[t]); - break; - } - } - } else - l = whiteSpaces.indexOf(msg.str[i - 1]); - if (stopCharsMarkout.indexOf(msg.str[j]) > -1) { - r = 1; - for (t = j + 1; t < msg.str.length; t++) { - if (msg.str[t] === chr) { - r = -1; - break; - } else if (stopCharsMarkout.indexOf(msg.str[t]) === -1) { - r = whiteSpaces.indexOf(msg.str[t]); - break; - } - } - } else - r = whiteSpaces.indexOf(msg.str[j]); if (l > -1) { if (r > -1) { if (j - i > 2) { @@ -665,7 +706,8 @@ function htmlFormatMsg(msg, mentions) { function proxyURL(url) { var proxyOpt = $.Options.useProxy.val; - if (proxyOpt !== 'disable' && !$.Options.useProxyForImgOnly.val) { + if (proxyOpt !== 'disable' && !$.Options.useProxyForImgOnly.val + && url[0] !== '/' && url.indexOf(location.origin) !== 0) { // proxy alternatives may be added to options page FIXME currently not; and we need more fresh proxies if (proxyOpt === 'ssl-proxy-my-addr') { url = 'https://ssl-proxy.my-addr.org/myaddrproxy.php/' + @@ -695,3 +737,19 @@ function reverseHtmlEntities(str) { .replace(/'/g, "'") .replace(/&/g, '&'); } + +function setPostImagePreview(elem, links) { + if ($.Options.displayPreview.val === 'enable') { + var previewContainer = elem.find('.preview-container'); + // was the preview added before... + if (!previewContainer.children().length) { + // is there any links to images in the post? + for (var i = 0; i < links.length; i++) { + if (/^[^?]+\.(?:jpe?g|gif|png)$/i.test(links[i].href)) { + var url = proxyURL(links[i].href); + previewContainer.append($('')); + } + } + } + } +} diff --git a/options.html b/options.html index be7a2f6..f895350 100644 --- a/options.html +++ b/options.html @@ -16,6 +16,7 @@ + @@ -263,8 +264,15 @@
  • -
    +

    Posts display

    +
    +

    Post preview

    +
    +
    +
    +
    +

    Line feeds

    @@ -448,6 +456,15 @@
    + + diff --git a/theme_calm/css/style.css b/theme_calm/css/style.css index 6e3933b..7505ef0 100644 --- a/theme_calm/css/style.css +++ b/theme_calm/css/style.css @@ -786,8 +786,15 @@ textarea.splited-post { word-wrap: break-word; } -#post-preview samp { - background-color: #EEE; +#opt-form-post-preview #post-preview { + width: 76%; + margin-left: 16px; + padding: 8px; +} + +#opt-form-post-preview #post-preview .preview-container { + height: auto; + margin-top: 8px; } .splited-post-counter { @@ -1253,6 +1260,8 @@ textarea.splited-post { .post-text samp { background: #EEE; + padding-left: 2px; + padding-right: 2px; } .post-context @@ -1268,7 +1277,7 @@ textarea.splited-post { } /* external http links */ -.post-text a[href^="http"], #post-preview a[href^="http"] { +.post-text a { font: italic 13px "Open Sans", sans-serif; text-decoration: none; color: #b46e67; @@ -1279,12 +1288,12 @@ textarea.splited-post { transition: all 200ms; } -.post-text a[href^="http"]:hover, #post-preview a[href^="http"]:hover { +.post-text a:hover { color: #e18881; opacity: .8; } -.post-text a[href^="http"]:after, #post-preview a[href^="http"]:after { +.post-text a[href^="http"]:after { content: ''; display: inline-block; position: relative; @@ -1302,12 +1311,11 @@ textarea.splited-post { transition: all 200ms; } -.post-text a[href^="http"]:hover:after, #post-preview a[href^="http"]:hover:after { +.post-text a[href^="http"]:hover:after { opacity: .8; } -.post-text a[href^="#profile"], .follow-suggestions a[href^="#profile"], -#post-preview a[href^="#profile"] { +.post-text a[href^="#profile"], .follow-suggestions a[href^="#profile"] { color: #5e8da4; text-decoration: none; -webkit-transition: all 200ms; @@ -1317,8 +1325,7 @@ textarea.splited-post { transition: all 200ms; } -.post-text a[href^="#profile"]:hover, .follow-suggestions a[href^="#profile"]:hover, -#post-preview a[href^="#profile"]:hover { +.post-text a[href^="#profile"]:hover, .follow-suggestions a[href^="#profile"]:hover { color: #76b2ce; } @@ -1326,8 +1333,7 @@ textarea.splited-post { font-size: 11px; } -.toptrends-list a[href^="#hashtag"], .post-text a[href^="#hashtag"], -#post-preview a[href^="#hashtag"] { +.toptrends-list a[href^="#hashtag"], .post-text a[href^="#hashtag"] { color: #5e72a4; text-decoration: none; -webkit-transition: all 200ms; @@ -1337,8 +1343,7 @@ textarea.splited-post { transition: all 200ms; } -.toptrends-list a[href^="#hashtag"]:hover, .post-text a[href^="#hashtag"]:hover, -#post-preview a[href^="#hashtag"]:hover { +.toptrends-list a[href^="#hashtag"]:hover, .post-text a[href^="#hashtag"]:hover { color: #768fce; } @@ -1357,27 +1362,23 @@ textarea.splited-post { } /* Inpost previw */ -.preview-container -{ - height: 100px; +.preview-container { width: 95%; - margin: 0 auto; - overflow: hidden; - display: none; - -webkit-border-radius: 10px; - -moz-border-radius: 10px; - border-radius: 10px; - /*line-height: 0;*/ + text-align: center; + overflow-y: auto; margin-bottom: 3px; - position: relative; } -.image-preview -{ + +.image-preview { max-height: 500px; max-width: 100%; margin: 0 auto; display: block; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; } + /* video preview */ .vimeo #imgOverlay { diff --git a/theme_nin/css/style.css b/theme_nin/css/style.css index e0d724f..3bc5cdf 100644 --- a/theme_nin/css/style.css +++ b/theme_nin/css/style.css @@ -880,6 +880,8 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, .post-text samp { background-color: #EEE; + padding-left: 2px; + padding-right: 2px; } /* line 138, ../sass/_postboard.sass */ @@ -2279,16 +2281,24 @@ textarea.splited-post { word-wrap: break-word; } -#post-preview a { - color: #AAA; +#opt-form-post-preview { + width: 100%; } -#post-preview a:hover { - color: #B4C669; +#opt-form-post-preview #post-preview { + width: 76%; + margin-left: 16px; + padding: 8px; } -#post-preview samp { - background-color: #EEE; +#opt-form-post-preview #post-preview .preview-container { + background-color: rgba(0, 0, 0, 0.43); + width: 97%; + margin-top: 8px; +} + +#opt-form-post-preview #post-preview .image-preview { + width: auto; } /* line 384, ../sass/style.sass */ diff --git a/theme_nin/sass/_postboard.sass b/theme_nin/sass/_postboard.sass index 8b599da..a027644 100755 --- a/theme_nin/sass/_postboard.sass +++ b/theme_nin/sass/_postboard.sass @@ -136,6 +136,8 @@ padding: 0 samp background-color: #EEE + padding-left: 2px + padding-right: 2px .post-context font-size: 11px diff --git a/theme_nin/sass/style.sass b/theme_nin/sass/style.sass index 8e29cc2..19c6d27 100755 --- a/theme_nin/sass/style.sass +++ b/theme_nin/sass/style.sass @@ -361,12 +361,19 @@ ul.userMenu-search-profiles margin: 4px 0 padding: 4px word-wrap: break-word - a - color: #AAA - a:hover - color: $color-green - samp - background-color: #EEE + +#opt-form-post-preview + width: 100% + #post-preview + width: 76% + margin-left: 16px + padding: 8px + .preview-container + background-color: rgba(0, 0, 0, 0.43) + width: 97% + margin-top: 8px + .image-preview + width: auto #postboard-top clear: both