77 lines
2.5 KiB
HTML
77 lines
2.5 KiB
HTML
<style>
|
|
div[m-id="{{d.mId}}"] {
|
|
position: relative;
|
|
}
|
|
|
|
div[m-id="{{d.mId}}"] > .setting {
|
|
position: absolute;
|
|
display: inline-flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
top: 5px;
|
|
right: 10px;
|
|
width: fit-content;
|
|
height: 23px;
|
|
z-index: 1;
|
|
border-radius: 2px;
|
|
padding: 0 1px;
|
|
}
|
|
|
|
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .setting {
|
|
background-color: #ffffff;
|
|
}
|
|
|
|
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .setting {
|
|
background-color: #1e1e1e;
|
|
}
|
|
|
|
div[m-id="{{d.mId}}"] > .setting label {
|
|
height: 18px;
|
|
font-size: 11px;
|
|
padding: 2px;
|
|
margin: 2px;
|
|
line-height: 15px;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .setting label {
|
|
border-color: #c9c9c9;
|
|
color: #000;
|
|
}
|
|
|
|
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .setting label {
|
|
border-color: rgba(128, 128, 128, 0.35);
|
|
color: #fff;
|
|
}
|
|
|
|
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .setting .m-btn:hover,
|
|
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .setting .btn-check:checked+.btn {
|
|
background-color: var(--app-light-color);
|
|
border-color: var(--app-light-color);
|
|
color: #fff;
|
|
}
|
|
|
|
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .setting .m-btn:hover,
|
|
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .setting .btn-check:checked+.btn {
|
|
background-color: var(--app-dark-color);
|
|
border-color: var(--app-dark-color);
|
|
}
|
|
|
|
div[m-id="{{d.mId}}"] > .body {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
</style>
|
|
<div m-id="{{d.mId}}" class="page-item">
|
|
<div class="setting">
|
|
<label class="empty m-btn btn btn-outline-primary">{{ d.empty }}</label><br>
|
|
<input type="checkbox" class="btn-check scroll" id="{{ d.mId }}-scroll" autocomplete="off">
|
|
<label class="btn btn-outline-primary" for="{{ d.mId }}-scroll">{{ d.scroll }}</label><br>
|
|
<input type="checkbox" class="btn-check timestamp" id="{{ d.mId }}-timestamp" autocomplete="off">
|
|
<label class="btn btn-outline-primary" for="{{ d.mId }}-timestamp">{{ d.timestamp }}</label><br>
|
|
<input type="checkbox" class="btn-check hex" id="{{ d.mId }}-hex" autocomplete="off">
|
|
<label class="btn btn-outline-primary" for="{{ d.mId }}-hex">HEX</label><br>
|
|
</div>
|
|
<div class="body"></div>
|
|
</div> |