Settings
code:style.css
.line i {
font-style: normal;
}
.quote {
font-style: normal;
}
.level-1 img { width: 16.7%; max-height: none; }
.level-2 img { width: 33.3%; max-height: none; }
.level-3 img { width: 50%; max-height: none; }
.level-4 img { width: 66.7%; max-height: none; }
.level-5 img { width: 83.3%; max-height: none; }
.level-6 img { width: 100%; max-height: none; }
code:style.css
/*=============================================================*/
/* 全体のデザイン */
body {
}
.app {
width: 100vw;
margin: 50px auto;
max-width: 960px;
}
.container {
width: 100%;
padding: 0;
max-width: none;
}
.page-column {
grid-template-columns: initial;
}
.row-flex {
background-color: white;
padding-top: 20px;
}
.col-page {
width: auto;
background-color: white;
}
.col-page-side {
background-color: white;
}
.col-page .page {
width: 90vw;
max-width: 720px;
background: none;
box-shadow: none;
padding: 10px;
}
/* ナビゲートバー調整 */
.navbar {
position: relative;
}
.navbar.navbar-default {
background: none;
}
.navbar .brand-icon path {
}
.navbar .navbar-brand {
}
.navbar .row .project-home {
font-size: 25px;
}
.navbar .row .project-home::before {
content: "AI時代の教育学会 デジタル教科書専門研究グループ";
}
.navbar .row .project-home .title {
display: none;
}
.navbar .row:has(.col-search) {
grid-template-columns: 3fr 1fr minmax(0, 1fr);
}
.navbar .row {
margin-left: 10px;
margin-right: 20px;
}
@media (min-width: 768px) and (max-width: 991px) {
.navbar .row:has(.col-search):has(.user-name) {
grid-template-columns: 3fr 1fr minmax(0, 1fr);
}
.navbar .row {
margin-left: 10px;
margin-right: 20px;
}
.navbar .search-form {
display: none
}
}
@media (max-width: 767px) {
.navbar .row:has(.col-search):has(.user-name) {
display: grid;
grid-template-columns: 3fr min-content minmax(0, 1fr);
}
.navbar .row {
margin-left: 10px;
margin-right: 20px;
}
.navbar .search-form {
display: none
}
.navbar .col-menu {
display: none
}
}
/* 追加ボタン */
.new-button {
position: absolute;
right: 0px;
bottom: 0;
}
/*************** コンテナ部 ***************/
.container .quick-launch .flex-box .tool-btn {
color: white;
}
/* 背景 */
.container .quick-launch {
height: 25vw;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
margin: 30;
}
/* 一覧 */
.container .page-list ul.grid {
grid-template-columns: repeat(auto-fill, minmax(200px, 200px));
}
/* pinついていない要素は非表示 */
.page-list .page-list-item.grid-style-item:not(.pin) {
display: none;
}
/* pinマークを非表示 */
.page-list div.pin {
display: none;
}
.page-list .grid .page-list-item a {
/* width: 100%; */
/* height: 100px; */
margin: 10px 0;
background: none;
box-shadow: none;
transition: background-color 300ms ease;
border-top: solid 1px #DDD; border-left: solid 1px #DDD; border-right: solid 1px #DDD; border-bottom: solid 1px #DDD; }
.container .page-list .grid .page-list-item a:hover {
box-shadow: none;
}
.container .page-list .grid .lpage-list-item a.header {
border: none;
}
.container .page-list .grid .page-list-item a.description {
max-height: 120px;
}
/* 関連一覧 */
.container .related-page-list {
margin: 20px;
}
.container .related-page-list .grid {
grid-template-columns: repeat(auto-fill, minmax(150px, 150px));
}
.container .related-page-list .grid .page-list-item a {
/* width: 100%; */
/* height: 100px; */
background: none;
box-shadow: none;
transition: background-color 300ms ease;
border-top: solid 1px #DDD; border-left: solid 1px #DDD; border-right: solid 1px #DDD; border-bottom: solid 1px #DDD; }
.container .related-page-list .grid .page-list-item a:hover {
box-shadow: none;
}
.container .related-page-list .grid .page-list-item a.header {
border: none;
}
.container .related-page-list .grid .page-list-item a.description {
max-height: 120px;
}