@chengkang/wildfire/src/assets/style.css

A drop-in replacement for other comment systems.

.wf { font-family: 'Helvetica Neue', arial, sans-serif; font-size: 15px; width: 100%; margin: 0 auto; }
.wf img.anonymous { opacity: .9; -webkit-filter: grayscale(70%); filter: grayscale(70%); }
.wf path { transition: fill .2s ease; }
.wf span { transition: color .2s ease; }
.wf textarea { transition: border .2s ease !important; background-color: transparent; }
.wf .float-right { float: right; }
.wf .wf-header .ivu-menu-submenu-title i { margin-right: unset; }
.wf textarea.ivu-input { background-color: rgba(255, 255, 255, 0.8); }
.wf .wf-comment-content pre { padding: 8px 12px; background-color: rgba(255, 255, 255, 0.8); font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace; font-size: 12px; border: 1px solid #ddd; border-radius: 3px; }
.wf .wf-comment-content pre code { display: inline-block; overflow: auto; width: 100%; max-height: 300px; line-height: 20px; vertical-align: middle; }
.wf .wf-comment-content img { max-width: 100% !important; }
.wf .code-overflow-hidden pre code { overflow: hidden !important; }
.wf .thumbnail { line-height: 150px; display: inline-block; overflow: hidden; width: 150px; height: 150px; cursor: pointer; border: 1px solid #fff; border-radius: 4px; background: 0 0; background-repeat: no-repeat; background-position: 50%; background-size: 100%; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); }
.wf .top-reply-area { display: flex; flex-direction: row; margin-left: 60px; justify-content: space-between; }
.wf .top-reply-area div { font-size: 10px; display: flex; }
.wf .top-reply-area .tool-bar { margin-right: 10px; flex: 1; }
.wf .ivu-spin-text div { display: inline-block; }
.wf .ivu-switch-checked .ivu-switch-inner { font-size: 8px; left: 4px; }
.wf .ivu-switch-inner { font-size: 8px; left: 12.5px; }
.wf .ivu-modal-confirm-body { overflow: hidden; max-height: 400px; min-height: 45px; }
.wf .ivu-spin { position: unset; background-color: unset; }
.wf .wf-form .ivu-form-label-top .ivu-form-item-label { float: left; padding: 0 0 8px 0; }
.wf .spin-icon { animation: ani-demo-spin 1s linear infinite; }
@keyframes ani-demo-spin {
  from { transform: rotate(0); }
  50% { transform: rotate(180deg); }
  to { transform: rotate(360deg); }
}

/* If smaller than or equal to iPhone 6 size */
@media only screen 
and (max-device-width:375px) 
and (-webkit-min-device-pixel-ratio:2) {

  /* display buttons vertically */
  .wf-personal-center .buttons, .wf-report-management .buttons { display: flex; flex-direction: column; }
}