BetterDiscordApp-v1/css/main.css

209 lines
3.2 KiB
CSS
Raw Normal View History

2015-08-26 10:36:40 +02:00
#twitchcord-button-container {
position:absolute;
width:50px;
height:45px;
right:0;
top:0;
display:block;
}
#twitchcord-button {
position:absolute;
width:50px;
height:100%;
background-image:url(https://static-cdn.jtvnw.net/emoticons/v1/5/1.0);
background-repeat:no-repeat;
background-size:36px;
background-position:7px;
}
.twitchcord-button-open {
background-image:url(https://static-cdn.jtvnw.net/emoticons/v1/3/1.0) !important; }
#emote-menu {
background:#2E3136;
height:0;
width:300px;
position:absolute;
bottom:45px;
right:0;
border:1px solid #000;
border-radius: 5px 5px 0 0;
overflow:auto;
visibility:hidden;
transition: all 1s;
-webkit-transition: all 1s;
}
.emotemenu-open {
height:450px !important;
visibility:visible !important;
}
#emote-menu-header {
width:100%;
height:36px;
background:#36393E;
border-bottom:1px solid #000;
}
#emote-menu-header span {
width:100%;
text-align:center;
display:block;
line-height:36px;
font-weight:bold;
color:#ADADAD;
}
#emote-container {
padding:10px;
}
.emote-container {
display:inline-block;
padding:2px;
border-radius:5px;
width:30px;
height:30px;
position:relative;
}
.emote-container img {
max-width:100%;
max-height:100%;
position:absolute;
margin:auto;
top:0;
right:0;
bottom:0;
left:0;
cursor:pointer;
}
.emote-container:hover {
background: rgba(123, 123, 123, 0.37);
}
#tc-settings-panel {
position:fixed;
width:50%;
height:75%;
background:rgb(46,49,54);
display:block;
z-index:9001;
margin-left:25%;
margin-top:5%;
border:1px solid #000;
box-shadow:0 0 20px 0 #000;
max-height:800px;
}
#tc-settings-panel-header {
background:rgb(54,57,62);
height:60px;
border-bottom:1px solid #000;
box-shadow:0 1px 0 0 rgb(78,78,78);
}
#tc-settings-panel-header h2 {
margin:0;
line-height:60px;
margin-left:10px;
color:#ADADAD;
display:inline-block;
float:left;
}
#tc-settings-panel-header span {
float:right;
display:inline;
line-height:50px;
margin-right:15px;
font-size:29px;
font-weight:bold;
color:#ADADAD;
}
#tc-settings-panel-body {
overflow:auto;
}
#tc-settings-panel-body ul {
overflow: auto;
position:absolute;
padding:0;
margin-top:0;
border-bottom:1px solid #000;
left:0;
right:0;
bottom:0;
top:61px;
}
#tc-settings-panel-body ul li {
padding:15px;
color:#ADADAD;
background:#2E3136;
border-bottom:1px solid #000;
box-shadow:0 1px 0 #404040 inset;
}
#tc-settings-panel-body ul li:nth-child(odd) {
background:#33363B;
}
#tc-settings-panel-body ul li h2 {
display:inline;
}
#tc-links a {
color:#FFF;
}
#tc-settings-panel-footer {
background: rgb(54,57,62);
height:40px;
position:absolute;
bottom:0;
right:0;
left:0;
border-top:1px solid #000;
box-shadow:0 1px 0 #505050 inset;
line-height:40px;
padding-left:10px;
color:#ADADAD !important;
}
#tc-links {
float:right;
margin-right:10px;
}
.tc-switch {
background: rgb(46, 49, 54);
width: 100px;
height: 24px;
display: inline-block;
float: right;
margin: -7px;
border: 1px solid #000;
outline: 1px solid #404040;
cursor:pointer;
}
.tc-switch span {
line-height:24px;
display:inline-block;
width:50px;
text-align:center;
height:24px;
}
.tc-switch-on.active {
background:green;
}
.tc-switch-off.active {
background:#860606;
}