/* * # Semantic - Comment * http://github.com/semantic-org/semantic-ui/ * * * Copyright 2014 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Theme *******************************/ /* ███████╗███████╗███╗ ███╗ █████╗ ███╗ ██╗████████╗██╗ ██████╗ ██╗ ██╗██╗ ██╔════╝██╔════╝████╗ ████║██╔══██╗████╗ ██║╚══██╔══╝██║██╔════╝ ██║ ██║██║ ███████╗█████╗ ██╔████╔██║███████║██╔██╗ ██║ ██║ ██║██║ ██║ ██║██║ ╚════██║██╔══╝ ██║╚██╔╝██║██╔══██║██║╚██╗██║ ██║ ██║██║ ██║ ██║██║ ███████║███████╗██║ ╚═╝ ██║██║ ██║██║ ╚████║ ██║ ██║╚██████╗ ╚██████╔╝██║ ╚══════╝╚══════╝╚═╝ ╚═╝╚═╝ ╚═╝╚═╝ ╚═══╝ ╚═╝ ╚═╝ ╚═════╝ ╚═════╝ ╚═╝ */ /******************************* Folders *******************************/ /* Path to theme packages */ /* Path to site override folder */ /******************************* Themes *******************************/ /* To override a theme for an individual element specify theme name below Be sure to update the user folder name (see README) */ /* Global */ /* Elements */ /* Collections */ /* Modules */ /* Views */ /******************************* Import Directives *******************************/ /*------------------ Load Defaults -------------------*/ /******************************* Site Settings *******************************/ /*------------------- Paths --------------------*/ /*------------------- Fonts --------------------*/ /*------------------- Site Colors --------------------*/ /*--- Colors ---*/ /*--- Light Colors ---*/ /*------------------- Page --------------------*/ /*------------------- Background Colors --------------------*/ /* Used for differentiating neutrals */ /* Used for differentiating layers */ /*------------------- Grid --------------------*/ /*------------------- Breakpoints --------------------*/ /******************************* Power-User *******************************/ /*------------------- Icons --------------------*/ /* Maximum Glyph Width of Icon */ /*------------------- Easing --------------------*/ /*--- Neutrals ---*/ /*--- Colored Backgrounds ---*/ /*--- Colored Text ---*/ /*--- Colored Headers ---*/ /*------------------- Emotive Colors --------------------*/ /* Mood */ /* Status */ /*------------------- Neutral Text --------------------*/ /*------------------- Brand Colors --------------------*/ /*------------------- Borders --------------------*/ /*------------------- Sizes --------------------*/ /*------------------- Transitions --------------------*/ /*------------------- Derived Values --------------------*/ /* Makes sure padded grid can fit at 320px */ /* Used to match floats with text */ /* Positive / Negative Dupes */ /* Header Colors */ /* Responsive */ /* Columns */ /******************************* States *******************************/ /*------------------- Disabled --------------------*/ /*------------------- Hover --------------------*/ /*--- Colors ---*/ /*--- Emotive ---*/ /*--- Neutrals ---*/ /*------------------- Down (:active) --------------------*/ /*--- Colors ---*/ /*--- Emotive ---*/ /*--- Neutrals ---*/ /*------------------- Active --------------------*/ /*--- Standard ---*/ /*--- Emotive ---*/ /*--- Neutrals ---*/ /******************************* Comments *******************************/ /*------------------- View --------------------*/ /*------------------- Elements --------------------*/ /* Comment */ /* Nested Comment */ /* Avatar */ /* Content */ /* Author */ /* Metadata */ /* Text */ /* Actions */ /* Reply */ /*------------------- Variations --------------------*/ /* Threaded */ /* Minimal */ /* Sizes */ /*------------------ Load Theme -------------------*/ /******************************* Site Settings *******************************/ /*------------------- Paths --------------------*/ /*------------------- Fonts --------------------*/ /*------------------- Site Colors --------------------*/ /*--- Colors ---*/ /*--- Light Colors ---*/ /*------------------- Page --------------------*/ /*------------------- Background Colors --------------------*/ /* Used for differentiating neutrals */ /* Used for differentiating layers */ /*------------------- Grid --------------------*/ /*------------------- Breakpoints --------------------*/ /******************************* Power-User *******************************/ /*------------------- Icons --------------------*/ /* Maximum Glyph Width of Icon */ /*------------------- Easing --------------------*/ /*--- Neutrals ---*/ /*--- Colored Backgrounds ---*/ /*--- Colored Text ---*/ /*--- Colored Headers ---*/ /*------------------- Emotive Colors --------------------*/ /* Mood */ /* Status */ /*------------------- Neutral Text --------------------*/ /*------------------- Brand Colors --------------------*/ /*------------------- Borders --------------------*/ /*------------------- Sizes --------------------*/ /*------------------- Transitions --------------------*/ /*------------------- Derived Values --------------------*/ /* Makes sure padded grid can fit at 320px */ /* Used to match floats with text */ /* Positive / Negative Dupes */ /* Header Colors */ /* Responsive */ /* Columns */ /******************************* States *******************************/ /*------------------- Disabled --------------------*/ /*------------------- Hover --------------------*/ /*--- Colors ---*/ /*--- Emotive ---*/ /*--- Neutrals ---*/ /*------------------- Down (:active) --------------------*/ /*--- Colors ---*/ /*--- Emotive ---*/ /*--- Neutrals ---*/ /*------------------- Active --------------------*/ /*--- Standard ---*/ /*--- Emotive ---*/ /*--- Neutrals ---*/ /******************************* Comments *******************************/ /*------------------- View --------------------*/ /*------------------- Elements --------------------*/ /* Comment */ /* Nested Comment */ /* Avatar */ /* Content */ /* Author */ /* Metadata */ /* Text */ /* Actions */ /* Reply */ /*------------------- Variations --------------------*/ /* Threaded */ /* Minimal */ /* Sizes */ /*------------------ Load Site -------------------*/ /******************************* User Global Variables *******************************/ /******************************* User Variable Overrides *******************************/ /*------------------ Override Loader -------------------*/ /******************************* Standard *******************************/ /*-------------- Comments ---------------*/ .ui.comments { margin: 1.5em 0em; max-width: 650px; } .ui.comments:first-child { margin-top: 0em; } .ui.comments:last-child { margin-bottom: 0em; } /*-------------- Comment ---------------*/ .ui.comments .comment { position: relative; background: none; margin: 0.5em 0em 0em; padding: 0.5em 0em 0em; border: none; border-top: none; line-height: 1.2; } .ui.comments .comment:first-child { margin-top: 0em; padding-top: 0em; } /*-------------------- Nested Comments ---------------------*/ .ui.comments .comment .comments { margin: 0em 0em 0.5em 0.5em; padding: 1em 0em 1em 1em; } .ui.comments .comment .comments:before { position: absolute; top: 0px; left: 0px; } .ui.comments .comment .comments .comment { border: none; border-top: none; background: none; } /*-------------- Avatar ---------------*/ .ui.comments .comment .avatar { display: block; width: 2.5em; height: auto; float: left; margin: 0.2em 0em 0em; } .ui.comments .comment img.avatar, .ui.comments .comment .avatar img { display: block; margin: 0em auto; width: 100%; height: 100%; border-radius: 0.25rem; } /*-------------- Content ---------------*/ .ui.comments .comment > .content { display: block; } /* If there is an avatar move content over */ .ui.comments .comment > .avatar ~ .content { margin-left: 3.5em; } /*-------------- Author ---------------*/ .ui.comments .comment .author { font-size: 1em; color: rgba(0, 0, 0, 0.8); font-weight: bold; } .ui.comments .comment a.author { cursor: pointer; } .ui.comments .comment a.author:hover { color: #00b2f3; } /*-------------- Metadata ---------------*/ .ui.comments .comment .metadata { display: inline-block; margin-left: 0.5em; color: rgba(0, 0, 0, 0.4); font-size: 0.875em; } .ui.comments .comment .metadata > * { display: inline-block; margin: 0em 0.5em 0em 0em; } .ui.comments .comment .metadata > :last-child { margin-right: 0em; } /*-------------------- Comment Text ---------------------*/ .ui.comments .comment .text { margin: 0.25em 0em 0.5em; font-size: 1em; word-wrap: break-word; color: rgba(0, 0, 0, 0.8); line-height: 1.3; } /*-------------------- User Actions ---------------------*/ .ui.comments .comment .actions { font-size: 0.875em; } .ui.comments .comment .actions a { cursor: pointer; display: inline-block; margin: 0em 0.75em 0em 0em; color: rgba(0, 0, 0, 0.4); } .ui.comments .comment .actions a:last-child { margin-right: 0em; } .ui.comments .comment .actions a.active, .ui.comments .comment .actions a:hover { color: rgba(0, 0, 0, 0.8); } /*-------------------- Reply Form ---------------------*/ .ui.comments > .reply.form { margin-top: 1em; } .ui.comments .comment .reply.form { width: 100%; margin-top: 1em; } .ui.comments .reply.form textarea { font-size: 1em; height: 12em; } /******************************* State *******************************/ .ui.collapsed.comments, .ui.comments .collapsed.comments, .ui.comments .collapsed.comment { display: none; } /******************************* Variations *******************************/ /*-------------------- Threaded ---------------------*/ .ui.threaded.comments .comment .comments { margin: -1.5em 0 -1em 1.25em; padding: 3em 0em 2em 2.25em; box-shadow: -1px 0px 0px rgba(39, 41, 43, 0.15); } /*-------------------- Minimal ---------------------*/ .ui.minimal.comments .comment .actions { opacity: 0; position: absolute; top: 0px; right: 0px; left: auto; -webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease; -webkit-transition-delay: 0.1s; transition-delay: 0.1s; } .ui.minimal.comments .comment > .content:hover > .actions { opacity: 1; } /*-------------------- Sizes ---------------------*/ .ui.small.comments { font-size: 0.9em; } .ui.comments { font-size: 1em; } .ui.large.comments { font-size: 1.1em; } .ui.huge.comments { font-size: 1.2em; } /******************************* Overrides *******************************/ /******************************* User Variable Overrides *******************************/