settings
This is setting page for css mainly.
table view
code:style.css
th, tr, td{
border: 5px solid #ccc;
}
table{
max-width: 1000px;
background: #fff;
}
.scroll-container{
border-radius: 0;
background: transparent;
overflow-x: hidden;
max-width: 1000px;
margin: 0 auto;
box-shadow: none;
}
/* 3個目以上の列を非表示にする */
td:nth-child(n+5), th:nth-child(n+5) {
display: none;
}
youtube
code:style.css
.iframe-video-player iframe {
margin: 0 !important;
padding: 0 !important;
width: 100% !important;
aspect-ratio: 16 / 9;
}
body
code:style.css
body{
background: #ccc;
font-feature-settings: "palt" 1;
font-kerning: normal;
--telomere-border: transparent;
}
.line {
font-size:16px;
line-height: 200%;
}
/*--telomere-border*/
.kamon-caret-down {
display: none !important;
}
.kamon-caret-up {
display: none !important;
}
.btn-search{
display: none !important;
}
code:style.css
/* 検索ボックスを右寄せにする仕掛け */
.navbar .row .col-menu { width: unset }
.navbar .row:has(.col-search) {
grid-template-columns: 3.5fr 1fr 50px;
}
.icon{
}
.search-form{
/*display: none;*/
opacity: 0.3;
}
.quick-launch{
margin-bottom: 35px;
}
brand icon
code:style.css
.brand-icon{
}
.new-button{
/*display: none;*/
opacity: 0.3;
}
.kamon{
}
横幅
code:style.css
.page-column {
display: block !important;
}
.container {
width: 100%;
margin: auto !important;
padding: 0;
margin-top: 50px !important;
margin-bottom: 250px !important;
max-width: 1400px;/*calc(100% - 200px);*/
}
/* スマホ用のスタイル */
@media screen and (max-width: 1000px) {
.container {
max-width: none;
padding: 5px;
}
}
.col-page {
width: 100%;
max-width: 100%;
margin: auto !important;
padding: 0 !important;
}
/* 画面の横幅が640ピクセル未満の場合に適用されるスタイル */
@media (max-width: 770px) {
.container {
width: 100%;
margin: 0 !important;
padding: 0 !important;
}
.col-page {
width: 100%;
max-width: 100%;
margin: 0 !important;
padding: 0 !important;
}
}
font
code:style.css
html,body,code,kbd,pre,samp,.tooltip,.editor,.grid li,.list li.page-list-item,.popup-menu,.stream {
font-family: Helvetica;
}
pin & page-list-item
code:style.css
/*size*/
:is(.page-list, .related-page-list) ul.grid {
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 50px;
}
/* スマホ用のスタイル */
@media screen and (max-width: 1000px) {
:is(.page-list, .related-page-list) ul.grid {
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 5px;
}
}
/* pinnedのグループを独立させる */
.page-list-item.pin + .page-list-item:not(.pin) {
grid-column-start: 1;
}
/* それ以外 */
.page-list-item {
box-shadow: 250px -500px 50px #0003;
}
.page-list-item:hover {
box-shadow: 0px 0px 50px #0003;
}
/* pinの高さ */
.page-list .grid li.page-list-item.pin {
width: 100%;
height: 70px;
}
/**リストアイテムのタイトル**/
.grid li.page-list-item a .header .title{
height: 80px;
font-style: normal;
font-size: 16px;
line-height: 150%;
margin: 0;
padding-top: 2px;
padding-left: 10px;
}
.grid li.page-list-item a .description .line {
font-size: 14px;
line-height: 200%;
}
.grid li.page-list-item a .description{
padding: 20px;
color: #ccc;
background: #333;
text-overflow: ellipsis; /* 溢れたテキストに省略記号を表示 */
overflow: hidden; /* 溢れた部分を非表示 */
}
.grid li.page-list-item a .icon img {
object-fit: cover;
width: 100%;
height: 100%;
}
.grid li.page-list-item a .content{
height: 100% !important;/*変なスペースを消す*/
}
.grid li.page-list-item a .icon{
margin: 0px;
}
/** リストアイテム上部の線を削除 **/
.grid li.page-list-item a .header {
border-top: 0px !important;
padding: 10px;
margin: 0;
padding-bottom: 0px;
}
/* box shadow */
.grid li.page-list-item a {
box-shadow: none !important;
}
.grid li.page-list-itemdata-page-links~="'draft'" {
background: #fff5 !important;
display: none;
}
page
code:style.css
.page{
margin-top: 0px;
box-shadow: none !important;
box-sizing: content-box;
}
pagemenu
code:style.css
.page-menu{
}
img
code:style.css
.strong-image{
width: 100% !important;
max-width: 100% !important;
}
ヘッダー
code:style.css
.navbar{
opacity: 100%;
backdrop-filter: none;
background: #fff0;
box-shadow: none;
margin-left: 0px;
border: 0;
}
.toolbar{
display: none !important;
}
.related-page-list{
margin-top: 100px;
}
右上
code: style.css
.page-filter-menu .tool-btn{
/*padding: 0px !important;*/
}
右下
code:style.css
.page-list-status{
margin: 0px !important;
padding: 0px !important;
margin-right: 0px !important;
pointer-events: none;
background: transparent !important;
color: #000 !important;
letter-spacing: 0px;
font-size: 14px !important;
text-align: left;
position: relative;
right: 20px;
bottom: 10px;
}
.status-bar {
}
.status-bar>div{
border: 0 !important;
}
.footer{
padding: 10px;
}
左上タイトル
code:style.css
/*project title*/
.project-home{
font-weight: normal;
background: #0000;
border-radius: 0 0 5px 5px;
}
.page-list{
margin-top: 0px;
}
記事title/h2/h3
abc
code: style.css
strong {
background: #ff0;
}
strong.level-1{
background: #ff0;
}
strong.level-2, strong.level-3{
display: inline-block !important;
text-decoration: none !important;
text-align: left !important;
width: 100% !important;
/*border-bottom: 1px dotted #333 !important;*/
border-right: 25px dotted #888 !important;
background: transparent;
padding: 0px;
margin: 0;
margin-top: 90px;
margin-bottom: 30px;
font-size: 32px !important;
font-weight: normal !important;
/*background: #f0f0f0;*/
}
strong.level-1:before, strong.level-2:before, strong.level-3:before{
content: "";
}
.line-title{
text-align: center !important;
border-bottom: 1px dashed #000 !important;
padding-bottom: 10px;
margin-bottom: 50px;
margin-top: 0px;
padding-top: 0px;
font-size: 32px !important;
}
.line.line-title .text{
text-align: center;
}
.section-title{
text-align: center !important;
}
setting 非表示
code: style.css
.page-list-itemdata-page-title*="settings" {
opacity: 0.3;
}
related page
code:style.css
.related-page-list{
/*display: none;*/
}
a
code:style.css
.link{
text-underline-offset: 4px;
text-decoration: underline dotted;
}
hover
code:style.css
div.hover{
border: 2px solid #00f !important;
}