diff options
| -rw-r--r-- | web_src/css/index.css | 1 | ||||
| -rw-r--r-- | web_src/css/modules/comment.css | 103 | ||||
| -rw-r--r-- | web_src/fomantic/build/semantic.css | 311 | ||||
| -rw-r--r-- | web_src/fomantic/semantic.json | 1 |
4 files changed, 104 insertions, 312 deletions
diff --git a/web_src/css/index.css b/web_src/css/index.css index 1723de3a2d..c7701809c0 100644 --- a/web_src/css/index.css +++ b/web_src/css/index.css @@ -11,6 +11,7 @@ @import "./modules/modal.css"; @import "./modules/breadcrumb.css"; @import "./modules/card.css"; +@import "./modules/comment.css"; @import "./code/linebutton.css"; @import "./markup/content.css"; @import "./markup/codecopy.css"; diff --git a/web_src/css/modules/comment.css b/web_src/css/modules/comment.css new file mode 100644 index 0000000000..1593c39b7f --- /dev/null +++ b/web_src/css/modules/comment.css @@ -0,0 +1,103 @@ +/* These are the remnants of the fomantic comment module */ +/* TODO: remove all of these rules */ + +.ui.comments { + margin: 1.5em 0; + max-width: 650px; +} + +.ui.comments:first-child { + margin-top: 0; +} + +.ui.comments:last-child { + margin-bottom: 0; +} + +.ui.comments .comment { + position: relative; + background: none; + margin: 0.5em 0 0; + padding: 0.5em 0 0; + border: none; + border-top: none; + line-height: 1.2; +} + +.ui.comments .comment:first-child { + margin-top: 0; + padding-top: 0; +} + +.ui.comments .comment > .comments { + margin: 0 0 0.5em 0.5em; + padding: 1em 0 1em 1em; +} + +.ui.comments .comment > .comments::before { + position: absolute; + top: 0; + left: 0; +} + +.ui.comments .comment > .comments .comment { + border: none; + border-top: none; + background: none; +} + +.ui.comments .comment .avatar { + display: block; + width: 2.5em; + height: auto; + float: left; + margin: 0.2em 0 0; +} + +.ui.comments .comment img.avatar, +.ui.comments .comment .avatar img { + display: block; + margin: 0 auto; + width: 100%; + height: 100%; + border-radius: 0.25rem; +} + +.ui.comments .comment > .content { + display: block; +} + +.ui.comments .comment > .avatar ~ .content { + margin-left: 3.5em; +} + +.ui.comments .comment .author { + font-size: 1em; + font-weight: 500; +} + +.ui.comments .comment a.author { + cursor: pointer; +} + +.ui.comments .comment .metadata { + display: inline-block; + margin-left: 0.5em; + font-size: 0.875em; +} + +.ui.comments .comment .metadata > * { + display: inline-block; + margin: 0 0.5em 0 0; +} + +.ui.comments .comment .metadata > :last-child { + margin-right: 0; +} + +.ui.comments .comment .text { + margin: 0.25em 0 0.5em; + font-size: 1em; + word-wrap: break-word; + line-height: 1.3; +} diff --git a/web_src/fomantic/build/semantic.css b/web_src/fomantic/build/semantic.css index 33d5311014..ef864dadf2 100644 --- a/web_src/fomantic/build/semantic.css +++ b/web_src/fomantic/build/semantic.css @@ -5423,317 +5423,6 @@ Site Overrides *******************************/ /*! - * # Fomantic-UI - Comment - * http://github.com/fomantic/Fomantic-UI/ - * - * - * Released under the MIT license - * http://opensource.org/licenses/MIT - * - */ - -/******************************* - Standard -*******************************/ - -/*-------------- - Comments ----------------*/ - -.ui.comments { - margin: 1.5em 0; - max-width: 650px; -} - -.ui.comments:first-child { - margin-top: 0; -} - -.ui.comments:last-child { - margin-bottom: 0; -} - -/*-------------- - Comment ----------------*/ - -.ui.comments .comment { - position: relative; - background: none; - margin: 0.5em 0 0; - padding: 0.5em 0 0; - border: none; - border-top: none; - line-height: 1.2; -} - -.ui.comments .comment:first-child { - margin-top: 0; - padding-top: 0; -} - -/*-------------------- - Nested Comments ----------------------*/ - -.ui.comments .comment > .comments { - margin: 0 0 0.5em 0.5em; - padding: 1em 0 1em 1em; -} - -.ui.comments .comment > .comments:before { - position: absolute; - top: 0; - left: 0; -} - -.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 0 0; -} - -.ui.comments .comment img.avatar, -.ui.comments .comment .avatar img { - display: block; - margin: 0 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.87); - font-weight: 500; -} - -.ui.comments .comment a.author { - cursor: pointer; -} - -.ui.comments .comment a.author:hover { - color: #1e70bf; -} - -/*-------------- - 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: 0 0.5em 0 0; -} - -.ui.comments .comment .metadata > :last-child { - margin-right: 0; -} - -/*-------------------- - Comment Text ----------------------*/ - -.ui.comments .comment .text { - margin: 0.25em 0 0.5em; - font-size: 1em; - word-wrap: break-word; - color: rgba(0, 0, 0, 0.87); - 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: 0 0.75em 0 0; - color: rgba(0, 0, 0, 0.4); -} - -.ui.comments .comment .actions a:last-child { - margin-right: 0; -} - -.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 0 2em 2.25em; - box-shadow: -1px 0 0 rgba(34, 36, 38, 0.15); -} - -/*-------------------- - Minimal - ---------------------*/ - -.ui.minimal.comments .comment .actions { - opacity: 0; - position: absolute; - top: 0; - right: 0; - left: auto; - transition: opacity 0.2s ease; - transition-delay: 0.1s; -} - -.ui.minimal.comments .comment > .content:hover > .actions { - opacity: 1; -} - -/*------------------- - Sizes ---------------------*/ - -.ui.comments { - font-size: 1rem; -} - -.ui.mini.comments { - font-size: 0.78571429rem; -} - -.ui.tiny.comments { - font-size: 0.85714286rem; -} - -.ui.small.comments { - font-size: 0.92857143rem; -} - -.ui.large.comments { - font-size: 1.14285714rem; -} - -.ui.big.comments { - font-size: 1.28571429rem; -} - -.ui.huge.comments { - font-size: 1.42857143rem; -} - -.ui.massive.comments { - font-size: 1.71428571rem; -} - -/*------------------- - Inverted - --------------------*/ - -.ui.inverted.comments .comment { - background-color: #1B1C1D; -} - -.ui.inverted.comments .comment .author, -.ui.inverted.comments .comment .text { - color: rgba(255, 255, 255, 0.9); -} - -.ui.inverted.comments .comment .metadata, -.ui.inverted.comments .comment .actions a { - color: rgba(255, 255, 255, 0.7); -} - -.ui.inverted.comments .comment a.author:hover, -.ui.inverted.comments .comment .actions a.active, -.ui.inverted.comments .comment .actions a:hover { - color: #ffffff; -} - -.ui.inverted.threaded.comments .comment > .comments { - box-shadow: -1px 0 0 #555555; -} - -/******************************* - Theme Overrides -*******************************/ - -/******************************* - User Variable Overrides -*******************************/ -/*! * # Fomantic-UI - Container * http://github.com/fomantic/Fomantic-UI/ * diff --git a/web_src/fomantic/semantic.json b/web_src/fomantic/semantic.json index 4a516b2c3a..a2f8e38727 100644 --- a/web_src/fomantic/semantic.json +++ b/web_src/fomantic/semantic.json @@ -24,7 +24,6 @@ "api", "button", "checkbox", - "comment", "container", "dimmer", "divider", |