github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/semantic/dist/components/comment.css (about)

     1  /*!
     2   * # Semantic UI x.x - Comment
     3   * http://github.com/semantic-org/semantic-ui/
     4   *
     5   *
     6   * Copyright 2014 Contributorss
     7   * Released under the MIT license
     8   * http://opensource.org/licenses/MIT
     9   *
    10   */
    11  
    12  
    13  /*******************************
    14              Standard
    15  *******************************/
    16  
    17  
    18  /*--------------
    19      Comments
    20  ---------------*/
    21  
    22  .ui.comments {
    23    margin: 1.5em 0em;
    24    max-width: 650px;
    25  }
    26  .ui.comments:first-child {
    27    margin-top: 0em;
    28  }
    29  .ui.comments:last-child {
    30    margin-bottom: 0em;
    31  }
    32  
    33  /*--------------
    34       Comment
    35  ---------------*/
    36  
    37  .ui.comments .comment {
    38    position: relative;
    39    background: none;
    40    margin: 0.5em 0em 0em;
    41    padding: 0.5em 0em 0em;
    42    border: none;
    43    border-top: none;
    44    line-height: 1.2;
    45  }
    46  .ui.comments .comment:first-child {
    47    margin-top: 0em;
    48    padding-top: 0em;
    49  }
    50  
    51  /*--------------------
    52      Nested Comments
    53  ---------------------*/
    54  
    55  .ui.comments .comment .comments {
    56    margin: 0em 0em 0.5em 0.5em;
    57    padding: 1em 0em 1em 1em;
    58  }
    59  .ui.comments .comment .comments:before {
    60    position: absolute;
    61    top: 0px;
    62    left: 0px;
    63  }
    64  .ui.comments .comment .comments .comment {
    65    border: none;
    66    border-top: none;
    67    background: none;
    68  }
    69  
    70  /*--------------
    71       Avatar
    72  ---------------*/
    73  
    74  .ui.comments .comment .avatar {
    75    display: block;
    76    width: 2.5em;
    77    height: auto;
    78    float: left;
    79    margin: 0.2em 0em 0em;
    80  }
    81  .ui.comments .comment img.avatar,
    82  .ui.comments .comment .avatar img {
    83    display: block;
    84    margin: 0em auto;
    85    width: 100%;
    86    height: 100%;
    87    border-radius: 0.25rem;
    88  }
    89  
    90  /*--------------
    91       Content
    92  ---------------*/
    93  
    94  .ui.comments .comment > .content {
    95    display: block;
    96  }
    97  
    98  /* If there is an avatar move content over */
    99  .ui.comments .comment > .avatar ~ .content {
   100    margin-left: 3.5em;
   101  }
   102  
   103  /*--------------
   104       Author
   105  ---------------*/
   106  
   107  .ui.comments .comment .author {
   108    font-size: 1em;
   109    color: rgba(0, 0, 0, 0.8);
   110    font-weight: bold;
   111  }
   112  .ui.comments .comment a.author {
   113    cursor: pointer;
   114  }
   115  .ui.comments .comment a.author:hover {
   116    color: #00b2f3;
   117  }
   118  
   119  /*--------------
   120       Metadata
   121  ---------------*/
   122  
   123  .ui.comments .comment .metadata {
   124    display: inline-block;
   125    margin-left: 0.5em;
   126    color: rgba(0, 0, 0, 0.4);
   127    font-size: 0.875em;
   128  }
   129  .ui.comments .comment .metadata > * {
   130    display: inline-block;
   131    margin: 0em 0.5em 0em 0em;
   132  }
   133  .ui.comments .comment .metadata > :last-child {
   134    margin-right: 0em;
   135  }
   136  
   137  /*--------------------
   138       Comment Text
   139  ---------------------*/
   140  
   141  .ui.comments .comment .text {
   142    margin: 0.25em 0em 0.5em;
   143    font-size: 1em;
   144    word-wrap: break-word;
   145    color: rgba(0, 0, 0, 0.8);
   146    line-height: 1.3;
   147  }
   148  
   149  /*--------------------
   150       User Actions
   151  ---------------------*/
   152  
   153  .ui.comments .comment .actions {
   154    font-size: 0.875em;
   155  }
   156  .ui.comments .comment .actions a {
   157    cursor: pointer;
   158    display: inline-block;
   159    margin: 0em 0.75em 0em 0em;
   160    color: rgba(0, 0, 0, 0.4);
   161  }
   162  .ui.comments .comment .actions a:last-child {
   163    margin-right: 0em;
   164  }
   165  .ui.comments .comment .actions a.active,
   166  .ui.comments .comment .actions a:hover {
   167    color: rgba(0, 0, 0, 0.8);
   168  }
   169  
   170  /*--------------------
   171        Reply Form
   172  ---------------------*/
   173  
   174  .ui.comments > .reply.form {
   175    margin-top: 1em;
   176  }
   177  .ui.comments .comment .reply.form {
   178    width: 100%;
   179    margin-top: 1em;
   180  }
   181  .ui.comments .reply.form textarea {
   182    font-size: 1em;
   183    height: 12em;
   184  }
   185  
   186  
   187  /*******************************
   188              State
   189  *******************************/
   190  
   191  .ui.collapsed.comments,
   192  .ui.comments .collapsed.comments,
   193  .ui.comments .collapsed.comment {
   194    display: none;
   195  }
   196  
   197  
   198  /*******************************
   199             Variations
   200  *******************************/
   201  
   202  
   203  /*--------------------
   204          Threaded
   205  ---------------------*/
   206  
   207  .ui.threaded.comments .comment .comments {
   208    margin: -1.5em 0 -1em 1.25em;
   209    padding: 3em 0em 2em 2.25em;
   210    box-shadow: -1px 0px 0px rgba(39, 41, 43, 0.15);
   211  }
   212  
   213  /*--------------------
   214          Minimal
   215  ---------------------*/
   216  
   217  .ui.minimal.comments .comment .actions {
   218    opacity: 0;
   219    position: absolute;
   220    top: 0px;
   221    right: 0px;
   222    left: auto;
   223    -webkit-transition: opacity 0.2s ease;
   224            transition: opacity 0.2s ease;
   225    -webkit-transition-delay: 0.1s;
   226            transition-delay: 0.1s;
   227  }
   228  .ui.minimal.comments .comment > .content:hover > .actions {
   229    opacity: 1;
   230  }
   231  
   232  /*--------------------
   233         Sizes
   234  ---------------------*/
   235  
   236  .ui.small.comments {
   237    font-size: 0.9em;
   238  }
   239  .ui.comments {
   240    font-size: 1em;
   241  }
   242  .ui.large.comments {
   243    font-size: 1.1em;
   244  }
   245  .ui.huge.comments {
   246    font-size: 1.2em;
   247  }
   248  
   249  
   250  /*******************************
   251           Theme Overrides
   252  *******************************/
   253  
   254  
   255  
   256  /*******************************
   257      User Variable Overrides
   258  *******************************/
   259