現在評価モジュールには下記の問題点があります。
- 通常の評価モジュール: GoogleChromeで見るとモジュールと影の間に余白が現れる
- 殿堂入り評価モジュール: スマホで見ると殿堂入りマークが途中で折れ曲がる
これ等の問題は下記CSSを適用させる事で改修が可能です。
.page-rate-widget-box {
display: inline;
border-radius: 5px;
box-shadow: 1px 1px 3px rgba(0,0,0,.5);
margin-bottom: 10px;
margin:0;
padding:0;
}
.page-rate-widget-box .rate-points {
background-color: #633 !important;
border: solid 1px #633;
border-right: 0;
border-radius: 5px 0 0 5px;
}
.heritage-rating-module {
float:right;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-flex-direction: row-reverse;
flex-direction: row-reverse;
vertical-align: top;
background-color: #633;
padding: 2px 8px 2px 5px;
border: solid 1px #ccc066;
border-radius: 8px;
box-shadow: 0 1px 3px rgba(0,0,0,.25);
margin:0;
}
.heritage-rating-module .page-rate-widget-box{
box-shadow: none;
margin:0;
}
.rateBox{
display:inline-block;
}
.rateBox p{
display:inline;
margin:0;
padding:0;
}
デモページは下記に用意してあります。
RatemoduleFix
現在、SCP-JPのメインCSSは管理ページに直接貼りつけて管理している事もあり下記3点についてご意見をお伺いしたくよろしくお願いします。
- スタッフ全員へ: 評価モジュールCSSの改修への賛成/反対
- 主に技術スタッフの方へ: 現在提示中のCSSについての改善案(今回提示したスレッドがFixした場合でも継続的に意見を頂きたく思います)
- 管理者の方へ: 改修が賛成であった場合のCSS適用作業のお願い