peliprint/blueprint/extensions/blueprint/assets/blueprint.style.css

151 lines
No EOL
3.5 KiB
CSS

@import url("/assets/extensions/blueprint/misc/cacheOverlay-1.css");
@keyframes notification {
0% { right:-300px; top:62px; opacity:0; background-color: #1f2933; }
10% { right:12px; top:62px; opacity:1; background-color: #1f2933; }
90% { right:12px; top:62px; opacity:1; background-color: #1f2933; }
100% { right:-300px; top:62px; opacity:0; background-color: #1f2933; }
}
.notification {
opacity:0;
position:fixed;
right:-300px;
top:62px;
height:auto;
width:300px;
z-index:99999;
background-color:#1f2933;
color:#cad1d8;
padding:10px;
border-radius:3px;
animation-name: notification;
animation-duration: 10s;
border-top: #3c8dbc 3px solid;
}
tag {
display:inline-block;
padding:3px;
background-color:#505050;
border-radius:5px;
font-size:12px;
color:white;
}
tag[mg-left] {margin-left:5px;}
tag[mg-right] {margin-right:5px;}
tag[red] {background-color:#ff4040;}
tag[green] {background-color:#27b949;}
tag[blue] {background-color:#288afb;}
[ext-title]{display:flex; flex-direction:row; align-items:center;}
.btn-gray {background-color:#33404d;color:#cad1d8 !important;border-color:#606d7b;}
.btn-gray:hover {background-color:#29343e;color:#cad1d8 !important;border-color:#606d7b;}
.btn-gray-alt {background-color:#4d5b69;color:#cad1d8 !important;border-color:#4d5b69;}
.btn-gray-alt:hover {background-color:#3f4d5a;color:#cad1d8 !important;border-color:#4d5b69;}
.btn {transition: background-color .3s;}
.img-btn {
width:25px;
height:25px;
border-radius:3px;
margin-right:2px;
}
.extension-btn-image {
width:auto;
height:100%;
aspect-ratio: 1/1;
border-top-left-radius:7px;
border-bottom-left-radius:7px;
float: left;
margin-right:10px;
}
.extension-btn-text {
font-size: 20px;
margin:0;
text-align:left;
position: relative;
left: -30px;
z-index: 2;
width: calc( 100% - 20px );
font-weight: 600;
margin-top: 11px;
overflow: clip;
text-overflow: ellipsis;
}
.extension-btn-version {
font-size: 11px;
text-align:left;
margin:0;
position: relative;
left: -30px;
z-index: 2;
width: calc( 100% - 20px );
overflow: clip;
text-overflow: ellipsis;
}
.extension-btn {
background-color:rgb(38, 50, 60);
color:#cad1d8;
border-color:#00000000;
height:calc(65px + 14px);
/*padding-top:7px;
padding-bottom:7px;*/
padding: 0px !important;
overflow:hidden;
vertical-align:center;
transition:background-color .2s;
border-radius:8px;
}
.extension-btn:hover,
.extension-btn:active,
.extension-btn:focus {
background-color:rgb(38, 50, 60);
color:#cad1d8 !important;
border-color:#00000000;
}
.extension-btn-overlay {
height: calc(100% - 19px);
width: auto;
position: absolute;
z-index: 2;
aspect-ratio: 1/1;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
background: linear-gradient(90deg, rgba(38, 50, 60, 0.35) 0%, rgb(38, 50, 60) 100%);
}
.byte-img {
width: 100px;
opacity: .3;
align-self: center;
}
.blueprint\:push-repo {
position: absolute;
top: 60px;
right: 55px;
background-color: #1f2933;
width: 270px;
z-index: 10;
border-radius: 7px;
padding: 10px;
border: #33404d 2px solid;
color: #83909e
}
.blueprint\:push-repo::after {
content: " ";
position: absolute;
bottom: 100%;
right: 12px;
margin-left: -7px;
border-width: 7px;
border-style: solid;
border-color: transparent transparent #1f2933 transparent;
}