app/assets/stylesheets/answers.css.scss
// 画像ビューア
.viewer {
// サムネイル
.thumbs {
max-height: 1000px;
overflow: auto;
background-color: #fafafa;
padding: 15px 10px;
// 一覧
ol {
text-align: center;
counter-reset: number;
list-style: none;
margin: 0;
padding: 0;
li {
position: relative;
margin-bottom: 15px;
padding-top: 1.5em;
}
li:before { // 番号
counter-increment: number;
content: counter(number);
position: absolute;
top: 0;
left: 0.5em;
}
}
img {
width: 100%;
max-width: 150px;
box-shadow: 2px 2px 1px rgba(0,0,0,0.4);
}
}
// プレビュー部分
.preview {
max-height: 1000px;
overflow: auto;
background-color: #fafafa;
text-align: center;
padding: 10px 10px;
img {
width: 100%;
max-width: 800px;
margin-bottom: 20px;
box-shadow: 5px 5px 3px rgba(0,0,0,0.4);
}
}
}