TheDesk Mio (15.8.0)
This commit is contained in:
cutls
@@ -1,5 +1,5 @@
|
||||
/*共通CSS*/
|
||||
html,body{overflow:hidden; user-select: none; cursor:default; font-size:13px;height: 100vh;}
|
||||
html,body{overflow:hidden; user-select: none; cursor:default; font-size:13px;height: 100vh; background-color: var(--bg); color: var(--color);}
|
||||
.btn {
|
||||
margin: 5px;
|
||||
text-transform: none;
|
||||
@@ -33,12 +33,12 @@ option {
|
||||
max-width: 100vw;
|
||||
max-height: 100vh;
|
||||
top:0;
|
||||
background-color: white;
|
||||
background-color: var(--modal);
|
||||
position: fixed;
|
||||
z-index: 9;
|
||||
}
|
||||
#imagemodal, #videomodal, #tootmodal {
|
||||
background-color: white;
|
||||
background-color: var(--modal);
|
||||
}
|
||||
#imagemodal .modal-content {
|
||||
overflow: hidden;
|
||||
@@ -128,7 +128,8 @@ blockquote:before, .quote:before {
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
background-color: var(--bg);
|
||||
color: var(--color);
|
||||
z-index: 99999;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@@ -142,7 +143,7 @@ blockquote:before, .quote:before {
|
||||
#pip{
|
||||
z-index:504;
|
||||
width:418px;
|
||||
background-color: white;
|
||||
background-color: var(--subcolor);
|
||||
position:absolute;
|
||||
}
|
||||
.pip-bottom{
|
||||
@@ -163,6 +164,9 @@ blockquote:before, .quote:before {
|
||||
.big-text{
|
||||
font-size:1.2rem;
|
||||
}
|
||||
#releasenote {
|
||||
background-color: var(--modal);
|
||||
}
|
||||
#releasenote li{
|
||||
list-style-type: disc
|
||||
}
|
||||
@@ -186,70 +190,13 @@ blockquote:before, .quote:before {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
.collapsible-header,.tabs{
|
||||
background-color: var(--subcolor);
|
||||
}
|
||||
.modal-footer{
|
||||
background-color: var(--modalfooter) !important;
|
||||
}
|
||||
|
||||
/*black theme*/
|
||||
.blacktheme body {
|
||||
color: white;
|
||||
background-color: #212121;
|
||||
}
|
||||
.blacktheme #drag {
|
||||
color: white;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 99999;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.blacktheme #imagemodal,.blacktheme #videomodal,.blacktheme #tootmodal,.blacktheme #releasenote {
|
||||
background-color: black;
|
||||
}
|
||||
.blacktheme .collapsible-header,.blacktheme .tabs,.blacktheme #pip {
|
||||
background-color: #212121;
|
||||
}
|
||||
/*indigo theme*/
|
||||
.indigotheme body {
|
||||
color: white;
|
||||
background-color: #031833;
|
||||
}
|
||||
.indigotheme #drag {
|
||||
color: white;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 99999;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.indigotheme #imagemodal,.indigotheme #videomodal,.indigotheme #tootmodal,.indigotheme #releasenote {
|
||||
background-color: #0d1351;
|
||||
}
|
||||
.indigotheme .collapsible-header,.indigotheme .tabs,.indigotheme #pip {
|
||||
background-color: #0d1351;
|
||||
}
|
||||
/*brown theme*/
|
||||
.browntheme body {
|
||||
color: white;
|
||||
background-color: #261411;
|
||||
}
|
||||
.browntheme #drag {
|
||||
color: white;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 99999;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.browntheme #imagemodal,.browntheme #videomodal,.browntheme #tootmodal,.browntheme #releasenote {
|
||||
background-color: #261411;
|
||||
}
|
||||
.browntheme .collapsible-header,.browntheme .tabs,.browntheme #pip {
|
||||
background-color: #4e342e;
|
||||
}
|
||||
|
||||
/*スクロールバー*/
|
||||
::-webkit-scrollbar {
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
position: fixed;
|
||||
right: 78px;
|
||||
bottom: 3px;
|
||||
background-color: white;
|
||||
background-color: var(--postbox);
|
||||
border: thin solid gray;
|
||||
z-index: 500;
|
||||
width: 300px;
|
||||
@@ -25,8 +25,6 @@
|
||||
#drag {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
background-color: #e0e0e0;
|
||||
color: black;
|
||||
}
|
||||
#post-btn {
|
||||
display: none;
|
||||
@@ -70,27 +68,6 @@
|
||||
}
|
||||
|
||||
|
||||
/*black theme*/
|
||||
.blacktheme #post-box {
|
||||
background-color: #424242;
|
||||
}
|
||||
/*indigo theme*/
|
||||
.indigotheme #post-box {
|
||||
background-color: #1a237e ;
|
||||
}
|
||||
/*brown theme*/
|
||||
.browntheme #post-box {
|
||||
background-color: #4e342e;
|
||||
}
|
||||
/*
|
||||
.blacktheme #drag {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
background-color: #004d40;
|
||||
color: white;
|
||||
padding: 3px;
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
/*mini*/
|
||||
|
||||
80
app/css/themes.css
Normal file
80
app/css/themes.css
Normal file
@@ -0,0 +1,80 @@
|
||||
:root{
|
||||
--bg:white;
|
||||
--drag:rgba(255, 255, 255, 0.8);
|
||||
--color:black;
|
||||
--modal:white;
|
||||
--subcolor:#e0e0e0;
|
||||
--box:white;
|
||||
--sidebar:#e0e0e0;
|
||||
--shared:#cfd8dc;
|
||||
--notfbox:white;
|
||||
--emphasized:#81c784;
|
||||
--his-data:rgba(255, 255, 255, 0.9);
|
||||
--active:#e6ee9c;
|
||||
--postbox:white;
|
||||
--modalfooter:#fafafa;
|
||||
}
|
||||
.blacktheme {
|
||||
--bg:#212121;
|
||||
--drag:rgba(0, 0, 0, 0.8);
|
||||
--color:white;
|
||||
--modal:black;
|
||||
--subcolor:#212121;
|
||||
--box:#424242;
|
||||
--sidebar:#424242;
|
||||
--shared:#004d40;
|
||||
--notfbox:#333333;
|
||||
--emphasized:#4e342e;
|
||||
--his-data:rgba(0, 0, 0, 0.8);
|
||||
--active:#757575;
|
||||
--postbox:#424242;
|
||||
--modalfooter:#212121;
|
||||
}
|
||||
.indigotheme {
|
||||
--bg:#031833;
|
||||
--drag:rgba(0, 0, 0, 0.8);
|
||||
--color:white;
|
||||
--modal:#0d1351;
|
||||
--subcolor:#0d1351;
|
||||
--shared:#004d40;
|
||||
--box:#0d1351;
|
||||
--sidebar:#0d1351;
|
||||
--notfbox:#0d47a1;
|
||||
--emphasized:#4e342e;
|
||||
--his-data:rgba(13, 19, 81,0.8);
|
||||
--active:#757575;
|
||||
--post-box:#1a237e;
|
||||
--modalfooter:#031833;
|
||||
}
|
||||
.browntheme {
|
||||
--bg:#261411;
|
||||
--drag:rgba(0, 0, 0, 0.8);
|
||||
--color:white;
|
||||
--modal:#261411;
|
||||
--subcolor:#4e342e;
|
||||
--shared:#004d40;
|
||||
--box:#4e342e;
|
||||
--sidebar:#4e342e;
|
||||
--notfbox:#4e342e;
|
||||
--emphasized:#0d47a1;
|
||||
--his-data:rgba(62, 39, 35,0.8);
|
||||
--active:#757575;
|
||||
--postbox:#4e342e;
|
||||
--modalfooter:#261411;
|
||||
}
|
||||
.greentheme{
|
||||
--bg:#c8e6c9;
|
||||
--drag:rgba(255, 255, 255, 0.8);
|
||||
--color:black;
|
||||
--modal:#81c784;
|
||||
--subcolor:#a5d6a7;
|
||||
--box:#81c784;
|
||||
--sidebar:#81c784;
|
||||
--shared:#ffcc80;
|
||||
--notfbox:#a5d6a7;
|
||||
--emphasized:#9e9d24;
|
||||
--his-data:rgba(255, 255, 255, 0.9);
|
||||
--active:#e6ee9c;
|
||||
--postbox:#a5d6a7;
|
||||
--modalfooter:#81c784;
|
||||
}
|
||||
@@ -14,7 +14,7 @@
|
||||
width:75px;
|
||||
min-width:75px;
|
||||
height:100vh;
|
||||
background-color:#e0e0e0;
|
||||
background-color:var(--sidebar);
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
}
|
||||
@@ -37,7 +37,7 @@
|
||||
vertical-align:text-bottom;
|
||||
}
|
||||
#sidebar a{
|
||||
color:black;
|
||||
color:var(--color);
|
||||
}
|
||||
#sidebar .big-menu{
|
||||
text-align:center;
|
||||
@@ -218,7 +218,7 @@ font-size:1rem;
|
||||
height:calc(0.8em + 8px);
|
||||
}
|
||||
.cbadge-hover {
|
||||
color: #000;
|
||||
color: var(--color);
|
||||
background-color: transparent;
|
||||
}
|
||||
.cbadge-hover:hover {
|
||||
@@ -233,17 +233,17 @@ p:not(:last-child){
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.shared {
|
||||
background-color: #cfd8dc;
|
||||
background-color: var(--shared);
|
||||
}
|
||||
.emphasized {
|
||||
background-color: #81c784;
|
||||
background-color: var(--emphasized);
|
||||
}
|
||||
.udg {
|
||||
cursor: pointer;
|
||||
}
|
||||
.notice-box {
|
||||
top: 0;
|
||||
background-color:white;
|
||||
background-color:var(--notfbox);
|
||||
position: relative;
|
||||
margin-right: 10px;
|
||||
width:100%;
|
||||
@@ -306,7 +306,7 @@ p:not(:last-child){
|
||||
.notf-box {
|
||||
position: fixed;
|
||||
right: 70px;
|
||||
background-color: white;
|
||||
background-color: var(--box);
|
||||
border: thin solid gray;
|
||||
z-index: 501;
|
||||
width: 400px;
|
||||
@@ -329,59 +329,15 @@ p:not(:last-child){
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.u-url {
|
||||
color: black;
|
||||
color: var(--color);
|
||||
cursor: text;
|
||||
}
|
||||
.type-b{
|
||||
display:none;
|
||||
}
|
||||
|
||||
/*black theme*/
|
||||
.blacktheme .cbadge-hover,.browntheme .cbadge-hover,.indigotheme .cbadge-hover { color: #fff;}
|
||||
.blacktheme .notf-box,.blacktheme .modal-footer,.blacktheme #sidebar {
|
||||
background-color: #424242;
|
||||
.modal-footer{
|
||||
background-color:var(--box);
|
||||
}
|
||||
.blacktheme .btn-flat,.blacktheme .u-url ,.blacktheme #sidebar a {
|
||||
color: white
|
||||
}
|
||||
.blacktheme .shared {
|
||||
background-color: #004d40;
|
||||
}
|
||||
.blacktheme .notice-box {
|
||||
background-color: #333333;
|
||||
}
|
||||
.blacktheme .emphasized {
|
||||
background-color: #4e342e;
|
||||
}
|
||||
/*indigo theme*/
|
||||
.indigotheme .notf-box,.indigotheme .modal-footer,.indigotheme #sidebar {
|
||||
background-color: #0d1351;
|
||||
}
|
||||
.indigotheme .btn-flat,.indigotheme .u-url ,.indigotheme #sidebar a {
|
||||
color: white
|
||||
}
|
||||
.indigotheme .shared {
|
||||
background-color: #004d40;
|
||||
}
|
||||
.indigotheme .notice-box {
|
||||
background-color: #0d47a1;
|
||||
}
|
||||
.indigotheme .emphasized {
|
||||
background-color: #4e342e;
|
||||
}
|
||||
/*brown theme*/
|
||||
.browntheme .notf-box,.browntheme .modal-footer,.browntheme #sidebar {
|
||||
background-color: #4e342e;
|
||||
}
|
||||
.browntheme .btn-flat,.browntheme .u-url ,.browntheme #sidebar a {
|
||||
color: white
|
||||
}
|
||||
.browntheme .shared {
|
||||
background-color: #004d40;
|
||||
}
|
||||
.browntheme .notice-box {
|
||||
background-color: #4e342e;
|
||||
}
|
||||
.browntheme .emphasized {
|
||||
background-color: #0d47a1;
|
||||
.btn-flat{
|
||||
color:var(--color);
|
||||
}
|
||||
@@ -17,7 +17,7 @@
|
||||
}
|
||||
#his-data-show {
|
||||
margin: 50px;
|
||||
background-color:rgba(255, 255, 255, 0.9);
|
||||
background-color:var(--his-data);
|
||||
width: calc(100% - 50px);
|
||||
height: calc(100% - 50px);
|
||||
margin-bottom: 0;
|
||||
@@ -31,31 +31,8 @@
|
||||
width: 10%;
|
||||
}
|
||||
.active-back{
|
||||
background-color: #e6ee9c;
|
||||
background-color: var(--active);
|
||||
}
|
||||
#his-name .emojione,#his-name .emoji-img{
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
|
||||
/*black theme*/
|
||||
.blacktheme #his-data-show {
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
.blacktheme .active-back{
|
||||
background-color:#757575;
|
||||
}
|
||||
/*indigo theme*/
|
||||
.indigotheme #his-data-show {
|
||||
background-color: rgba(13, 19, 81,0.8);
|
||||
}
|
||||
.indigotheme .active-back{
|
||||
background-color:#757575;
|
||||
}
|
||||
/*brown theme*/
|
||||
.browntheme #his-data-show {
|
||||
background-color: rgba(62, 39, 35,0.8);
|
||||
}
|
||||
.browntheme .active-back{
|
||||
background-color:#757575;
|
||||
}
|
||||
Reference in New Issue
Block a user