Skip to content

Instantly share code, notes, and snippets.

@motsu0
motsu0 / common.css
Last active February 23, 2023 14:03
demo-bg-color-checkered
.color-checkered{
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
width: 80%;
max-width: 400px;
height: 200px;
margin: 0 auto;
font-size: 40px;
.block{
margin-bottom: 40px;
}
.bt-common{
padding: 4px 8px;
cursor: pointer;
}
/* */
.area-table{
overflow-x: auto;
@motsu0
motsu0 / simple-dialog.css
Last active March 9, 2023 01:44
simple-dialog.js (JavaScript Library)
@charset "utf-8";
.simpleDialog_s-fix{
overflow: hidden;
}
.simpleDialog_bg{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
@motsu0
motsu0 / demo-simple-dialog1.html
Last active March 9, 2023 01:44
demo-simple-dialog
<button id="bt-demo1" class="bt-demo">デモボタン1</button>
<p>オプション指定無し。</p>
.area-file{
margin: 12px 0;
text-align: center;
}
#message{
margin: 12px 0;
text-align: center;
color: #e00000;
}
/* */
.block{
margin-bottom: 32px;
}
th{
font-weight: normal;
}
/* */
#bt-sample{
margin-right: 12px;
cursor: pointer;
.block{
margin: 8px 0 32px 0;
}
.bt-control{
display: block;
margin: 12px 0;
cursor: pointer;
}
.message{
margin: 12px 0;
<input type="file" id="input-file-01">
<div id="output-01" class="output"></div>
.block{
margin: 16px 0;
}
#input-url{
box-sizing: border-box;
width: 100%;
height: 40px;
padding: 0 8px;
}
#bt-submit{
.img-sample{
width: 100%;
}
/* */
.area-file{
margin: 16px 0;
text-align: center;
}
#input-file{
margin-top: 8px;