MediaWiki:ModernCommentsSection.css

@import url('//justleafy.wikia.com/load.php?debug=false&lang=en&mode=articles&articles=u:justleafy:MediaWiki:CommentsPagination/code.css&only=styles');

/* ConsistentCommentsHeader */

h1#article-comments-counter-header { font: bold medium Helvetica, sans-serif; text-transform: uppercase; }

text-transform: uppercase; font-weight: bold; font-family: Helvetica; }
 * 1) article-comments-counter-recent {

/* Modernizing Comments */ /* Loading Throbbers */ .WikiaArticleComments .MiniEditorWrapper .loading-indicator .loading-message .loading-text, .WikiaArticleComments #article-comments > .MiniEditorWrapper .buttons .throbber, .WikiaArticleComments .throbber { display: none !important; } .WikiaArticleComments.loading, background: url('https://images.wikia.nocookie.net/speedit/images/0/0b/Spinner.svg') no-repeat center / 64px !important; animation: rotator .5s linear infinite; border: none !important; } .oasis-dark-theme #article-comm-form .loading-throbber, .oasis-dark-theme .WikiaArticleComments.loading { background: url('https://images.wikia.nocookie.net/speedit/images/a/a8/Spinner-white.svg') no-repeat center / 64px !important; animation: rotator .5s linear infinite; border: none !important; } /* Icons */
 * 1) article-comm-form .loading-throbber {

background-color: black; background-image: none !important; width: 24px; height: 24px; transform: scale(0.75) }
 * 1) WikiaArticleComments .cke_button_bold .cke_icon,
 * 2) WikiaArticleComments .cke_button_italic .cke_icon,
 * 3) WikiaArticleComments .cke_button_link .cke_icon,
 * 4) WikiaArticleComments .RTEImageButton .cke_icon,
 * 5) WikiaArticleComments .RTEVideoButton .cke_icon {

.WikiaArticleComments .MiniEditorWrapper .toolbar a.cke_button { border: none !important; background: none !important; padding: 0.5em !important; margin-top: 5px !important; }

.WikiaArticleComments .MiniEditorWrapper .toolbar .cke_buttons .cke_toolbar_separator { margin-top: 10px; margin-left: 5px; background-color: white !important; }

.WikiaArticleComments .MiniEditorWrapper .toolbar a.cke_button .cke_button_icon.cke_button__bold_icon, .WikiaArticleComments .MiniEditorWrapper .toolbar a.cke_button .cke_button_icon.cke_button__italic_icon, .WikiaArticleComments .MiniEditorWrapper .toolbar a.cke_button .cke_button_icon.cke_button__link_icon, .WikiaArticleComments span.cke_button_icon.cke_button__modewysiwyg_icon, .WikiaArticleComments span.cke_button_icon.cke_button__modesource_icon { background-image: none !important; background-color: white !important; }

.WikiaArticleComments .MiniEditorWrapper .toolbar a.cke_button .cke_button_icon.cke_button__bold_icon { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-bold.svg); }

.WikiaArticleComments .MiniEditorWrapper .toolbar a.cke_button .cke_button_icon.cke_button__italic_icon { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-italics.svg); }

.WikiaArticleComments .MiniEditorWrapper .toolbar a.cke_button .cke_button_icon.cke_button__link_icon { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-link.svg); }

.WikiaArticleComments span.cke_button_icon.cke_button__modewysiwyg_icon { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-eye.svg); }

.WikiaArticleComments .MiniEditorWrapper .toolbar .cke_button.cke_button_disabled { opacity: 1 !important; border-bottom: 2px solid white !important; border-radius: 0; }

.WikiaArticleComments .MiniEditorWrapper .toolbar a.cke_button:hover { background: none !important; }

.oasis-dark-theme .WikiaArticleComments .MiniEditorWrapper .editarea textarea { background: #000 !important; }

span.cke_button_icon.cke_button__modesource_icon { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-preformat.svg); }

-webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-bold.svg); }   -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-italics.svg); }   -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-link.svg); }   -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-image.svg); }   -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-video.svg); } .oasis-dark-theme #WikiaArticleComments .cke_button_bold .cke_icon, .oasis-dark-theme #WikiaArticleComments .cke_button_italic .cke_icon, .oasis-dark-theme #WikiaArticleComments .cke_button_link .cke_icon, .oasis-dark-theme #WikiaArticleComments .RTEImageButton .cke_icon, .oasis-dark-theme #WikiaArticleComments .RTEVideoButton .cke_icon { background-color: white; } .WikiaArticleComments .MiniEditorWrapper .toolbar .cke_button .cke_icon { background-image: none; } .WikiaArticleComments .MiniEditorWrapper .toolbar .cke_button > a { border: none !important; background-color: transparent; padding: 0.5em; }
 * 1) WikiaArticleComments .cke_button_bold .cke_icon {
 * 1) WikiaArticleComments .cke_button_italic .cke_icon {
 * 1) WikiaArticleComments .cke_button_link .cke_icon {
 * 1) WikiaArticleComments .RTEImageButton .cke_icon {
 * 1) WikiaArticleComments .RTEVideoButton .cke_icon {

.WikiaArticleComments .MiniEditorWrapper .toolbar .cke_button > a { border: none !important; border-radius: 0; padding: 0.5em 1.1em 1.1em 0.5em; margin: 1px; background: rgba(255,255,255,0.25); }

.oasis-dark-theme .WikiaArticleComments .MiniEditorWrapper .toolbar .cke_button > a { background: rgba(0,0,0,0.25); }

.WikiaArticleComments .MiniEditorWrapper .toolbar .cke_button.cke_button_big > a { width: 20px; padding: 0.7em 1.1em 0.9em 0.7em; } /* Mini Editor */ .WikiaArticleComments .MiniEditorWrapper .editarea textarea, .WikiaArticleComments .MiniEditorWrapper .editarea { border: none !important; background-color: transparent; } .article-comm-input-text .editarea .wikiaEditor { height: 50px !important; } .WikiaArticleComments .MiniEditorWrapper .editarea { border-bottom: 1px solid black !important; } .WikiaArticleComments .MiniEditorWrapper.focused .editarea { box-shadow: none !important; border-bottom: 3px solid black !important; } .oasis-dark-theme .WikiaArticleComments .MiniEditorWrapper .editarea { border-bottom: 1px solid white !important; } .oasis-dark-theme .WikiaArticleComments .MiniEditorWrapper.focused .editarea { box-shadow: none !important; border-bottom: 3px solid white !important; } .WikiaArticleComments .MiniEditorWrapper .toolbar .cke_button .cke_icon { background-image: none !important; } input#article-comm-submit { padding: 0 12px; height: 35px; font-size: 10px; font-weight: bold; text-transform: uppercase; border-radius: 0 !important; background-image: none !important; } input#article-comm-submit:hover { transition: .3s; } span.cke_button.cke_button_bold { border-radius: 0; } .WikiaArticleComments #article-comments > .MiniEditorWrapper .session img { border-radius: 50%; }
 * 1) article-comm,

.SpeechBubble .article-comm-input-text input { float: right; margin-left: 10px; height: 35px; padding: 0 12px; background-image: none !important; font-size: x-small; font-weight: bold; border-radius: 0; text-transform: uppercase; } /* Rounding Avatars */ border-radius: 50%; }   height: 50px; width: 50px; padding: 0; } /* Comment Links and Buttons */ .SpeechBubble .buttons { bottom: -10px; } a.article-comm-delete:hover, .article-comm-edit.actionButton:hover, .WikiaArticleComments .article-comm-history:hover { text-decoration: none !important; } .article-comm-reply.wikia-button.secondary.actionButton { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-reply-small.svg); background-color: currentColor; height: 18px; mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-reply-small.svg); width: 18px !important; -webkit-mask-repeat: no-repeat; -mask-repeat: no-repeat; background-image: none; border: none; margin-right: -20px; margin-top: 4px; } .article-comm-delete, .article-comm-edit.actionButton, .WikiaArticleComments .article-comm-history { background-color: #3a3a3a; background-image: none !important; height: 18px; width: 18px; -webkit-mask-repeat: no-repeat; -mask-repeat: no-repeat; text-indent: -9999999px; margin-bottom: 6px; margin-top: 2px; }
 * 1) article-comments-ul > .SpeechBubble .speech-bubble-avatar > a > img.avatar {
 * 1) article-comments-ul > .SpeechBubble .speech-bubble-avatar {

.oasis-dark-theme .article-comm-delete, .oasis-dark-theme .article-comm-edit.actionButton, .oasis-dark-theme .WikiaArticleComments .article-comm-history { background-color: #d5d4d4; } .article-comm-history { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-eye-small.svg); -mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-eye-small.svg); -mask: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-eye-small.svg); } .article-comm-edit.actionButton { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-pencil-small.svg); -mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-pencil-small.svg); -mask: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-pencil-small.svg); } .article-comm-delete { -webkit-mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-trash-small.svg); -mask-image: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-trash-small.svg); -mask: url(/extensions/wikia/DesignSystem/node_modules/design-system/dist/svg/wds-icons-trash-small.svg); } .SpeechBubble .tools img { display: none; } .SpeechBubble .permalink { opacity: .75; } .SpeechBubble .permalink:hover { text-decoration: none; }

.SpeechBubble .tools { visibility: visible !important; }

.SpeechBubble .tools a { margin-right: 3px; display: inline-block; }

.WikiaArticleComments .article-comm-input .MiniEditorWrapper form input[type="submit"]:not(.wds-button).secondary { text-transform: uppercase; border-radius: 0; background-color: transparent; border-color: currentColor; color: currentColor; } /* Comments Style */ .WikiaArticleComments .sub-comments { border: none; } .WikiaArticleComments .SpeechBubble { border: none; background-color: rgba(213, 212, 212, 0.25); padding: 1em; box-shadow: 0px 5px 5px 2px rgba(17, 17, 17, .06); border-radius: 4px; }

.SpeechBubble .speech-bubble-message { background: none !important; border: none !important; }

.oasis-dark-theme .WikiaArticleComments .SpeechBubble { background-color: rgba(58,58,58,0.25); }

color: #3a3a3a; opacity: .75; }
 * 1) WikiaArticleComments .edited-by a {

.oasis-dark-theme #WikiaArticleComments .edited-by a { color: #d5d4d4; } .SpeechBubble.even .speech-bubble-message, .SpeechBubble.owner .speech-bubble-message, .SpeechBubble .speech-bubble-message, .SpeechBubble .speech-bubble-message.current { background: transparent; border-radius: 0; border: 0; } .SpeechBubble .speech-bubble-message:before, .SpeechBubble.even .speech-bubble-message:after, .SpeechBubble.owner .speech-bubble-message:after, .SpeechBubble:after, .SpeechBubble .speech-bubble-message:after { display: none !important; }

.WikiaArticleComments .comments .article-comm-text { margin-bottom: -10px; } .SpeechBubble .speech-bubble-message p { margin-bottom: 1.75em; } .SpeechBubble .speech-bubble-message.current { border-left: 5px red solid; margin: -12px; padding: 2em 8em; transition: .3s ease out; }

.SpeechBubble .speech-bubble-message.current .buttons { margin: 12px; } /* Fix */ border: none; } /* Use this code only if you use CommentPreview by Fngplg */ input.cp-button.cp-button-preview.wikia-button.secondary { border: 1px currentColor solid; padding: 0 12px; background-color: transparent; height: 35px; color: currentColor; font-size: 10px; font-weight: bold; text-transform: uppercase; border-radius: 0 !important; background-image: none !important; } /* Discussions About Module */
 * 1) Wall.Thread .comments > .message > .replies .new-reply .speech-bubble-avatar {

.RelatedForumDiscussion { margin-bottom: 30px; } .RelatedForumDiscussion > h2 { font-weight: bold; font-size: 16px; }

.RelatedForumDiscussion .forum-discussions .forum-thread .talk-two { display: none; }

.RelatedForumDiscussion .forum-discussions .forum-thread { padding: 1em 0.5em; border-bottom-style: solid; }

.RelatedForumDiscussion .forum-see-more a { border: 1px solid currentColor; padding: 11px 12px 11px 0; color: currentColor; font-weight: bold; text-transform: uppercase; font-size: 10px; display: block; width: 136px; float: right; }

.forum-see-more a:hover { text-decoration: none; }

.RelatedForumDiscussion .forum-replies .forum-reply .forum-user-avatar { border: none; border-radius: 50%; }

.RelatedForumDiscussion .forum-replies .forum-reply .forum-timestamp { margin-left: 0; }

.RelatedForumDiscussion .forum-replies .forum-reply .forum-timestamp:before { content: "• "; }

.RelatedForumDiscussion .forum-see-more a { border: 1px solid currentColor; padding: 11px 12px; color: currentColor; font-weight: bold; text-transform: uppercase; font-size: 10px; }

.RelatedForumDiscussion h2 .forum-new-post { border-radius: 0; background-image: none; padding: 0 12px; font-size: 10px; font-weight: bold; text-transform: uppercase; }

/* Use this code only if you use CommentPreview by Fngplg */

/* Button styling */ input.cp-button.cp-button-preview.wikia-button.secondary { border: 1px currentColor solid; padding: 0 12px; background-color: transparent; height: 35px; color: currentColor; font-size: 10px; font-weight: bold; text-transform: uppercase; border-radius: 0 !important; background-image: none !important; }

/* Preview modal design fix */

/* Comment Preview Styling */

.cp-header h1 { font-weight: bold; font-size: 16px; }

a.cp-xcancel:hover { text-decoration: none; }

a.cp-xcancel { color: black; background-color: black; background-image: none !important; width: 24px; height: 24px; -webkit-mask-image: url(/extensions/wikia/DesignSystem/bower_components/design-system/dist/svg/wds-icons-cross.svg); }

.oasis-dark-theme a.cp-xcancel { color: white; background-color: white; }

.cp-content { padding: 1em; border: none !important; height: 275px !important; }

.cp-window { background-color: rgba(200,200,200,1) !important; }

.oasis-dark-theme .cp-window { background-color: rgba(50,50,50,1) !important; }

.cp-header { background-color: #ddd; margin: -5px -20px !important; padding: 1em 2em; }

.oasis-dark-theme .cp-header, .oasis-dark-theme .cp-footer { background-color: #222; }

.cp-footer { background-color: #ddd; margin: 0 !important; padding: 1em 2em; }

.cp-button.cp-button-cancel.wikia-button.secondary { padding: 0 12px; height: 35px; border-radius: 0; background: none; font-weight: bold; text-transform: uppercase; font-size: 10px; border-color: currentColor; color: currentColor; }

.cp-button.cp-button-publish.wikia-button { padding: 0 12px; height: 35px; border-radius: 0; background-image: none; font-weight: bold; text-transform: uppercase; font-size: 10px; }