251 行
6.2 KiB
SCSS
251 行
6.2 KiB
SCSS
|
|
// Fonts
|
|
@import url("https://fonts.googleapis.com/css?family=Raleway:300,400,600");
|
|
|
|
// Variables
|
|
@import "variables";
|
|
|
|
// Bootstrap
|
|
@import '~bootstrap/scss/bootstrap';
|
|
|
|
html {
|
|
// cursor: text;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Avenir', Helvetica, Arial, sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
text-align: center;
|
|
color: #fcfcfc;
|
|
background-color: #232629;
|
|
}
|
|
a {
|
|
color: #1d99f3;
|
|
}
|
|
.bg-dark {
|
|
background: radial-gradient(farthest-corner at 50% 85%,
|
|
#3498db 0%, #232629 100%);
|
|
border-bottom: 2px solid #3daee9;
|
|
box-shadow: 0 0 7px 3px #1d99f3;
|
|
}
|
|
.navbar-nav .dropdown-menu {
|
|
background-color: #31363b;
|
|
color: #fcfcfc;
|
|
border: 2px solid #3daee9;
|
|
box-shadow: 0 0 7px 3px #1d99f3;
|
|
}
|
|
.dropdown-item {
|
|
color: #fcfcfc;
|
|
}
|
|
.dropdown-item.active, .dropdown-item:active, .dropdown-item:hover, .dropdown-item:focus {
|
|
color: #fcfcfc;
|
|
background-color: #3daee9;
|
|
}
|
|
.navbar-brand {
|
|
padding: 5px;
|
|
}
|
|
.navbar-brand, .nav-item {
|
|
transition: background 0.3s, color 0.3s;
|
|
border-radius: 2px;
|
|
cursor: pointer;
|
|
}
|
|
.navbar-brand:hover, .nav-item:hover {
|
|
background-color: #2980b9;
|
|
}
|
|
.badge-light {
|
|
color: #232629;
|
|
background-color: #eff0f1;
|
|
}
|
|
.badge {
|
|
font-size: 100%;
|
|
}
|
|
.within {
|
|
margin: 30px auto;
|
|
border: 2px solid #3daee9;
|
|
box-shadow: 0px 0px 7px 3px #1d99f3;
|
|
}
|
|
.bar {
|
|
background: linear-gradient(
|
|
to bottom,
|
|
#22699c 0%,
|
|
#436a86 34%,
|
|
#1a3746 100%
|
|
);
|
|
padding: 5px;
|
|
font-size: 200%;
|
|
border-bottom: solid 2px #3daee9;
|
|
cursor: pointer;
|
|
transition: background 0.3s, color 0.3s;
|
|
}
|
|
.bar > a {
|
|
color: #fcfcfc;
|
|
}
|
|
.bar > a:hover {
|
|
text-decoration: none;
|
|
}
|
|
.bar:hover {
|
|
background: linear-gradient(
|
|
to bottom,
|
|
#2980b9 0%,
|
|
#6e93ad 34%,
|
|
#2b6b8b 100%
|
|
);
|
|
// background-color: #2980b9;
|
|
}
|
|
.meta {
|
|
padding: 5px;
|
|
text-align: left;
|
|
background-color: #2c3e50;
|
|
border-bottom: solid 2px #3daee9;
|
|
}
|
|
.comment {
|
|
border-top: solid 2px #3daee9;
|
|
}
|
|
.back, .comment {
|
|
padding: 10px;
|
|
background-color: #31363b;
|
|
text-align: left;
|
|
}
|
|
.modal-header, .modal-body, .modal-footer {
|
|
color: #fcfcfc;
|
|
}
|
|
.modal-header {
|
|
background: linear-gradient(
|
|
to bottom,
|
|
#1d99f3 0%,
|
|
#6ec0fb 34%,
|
|
#3daee9 100%
|
|
);
|
|
}
|
|
.modal-body {
|
|
background-color: #4d4d4d;
|
|
}
|
|
.modal-footer {
|
|
background-color: #31363b;
|
|
}
|
|
.form-control, .form-control:focus {
|
|
background-color: #31363b;
|
|
color: #fcfcfc;
|
|
}
|
|
.form-control {
|
|
border: 1px solid #34495e;
|
|
}
|
|
.form-control:focus {
|
|
border: 1px solid #3daee9;
|
|
}
|
|
.form-control:disabled, .form-control[readonly] {
|
|
background-color: #232629;
|
|
}
|
|
.custom-control-input:checked ~ .custom-control-label::before,
|
|
.custom-radio .custom-control-input:checked ~ .custom-control-label::before,
|
|
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before
|
|
{
|
|
color: #fcfcfc;
|
|
background-color: #3daee9;
|
|
border-color: #1d99f3;
|
|
}
|
|
.btn, btn:hover {
|
|
margin: 0 2px;
|
|
border: 2px solid;
|
|
}
|
|
.btn {
|
|
border-left-color: #fcfcfc;
|
|
border-top-color: #fcfcfc;
|
|
}
|
|
.btn:hover {
|
|
border-left-color: #7f8c8d;
|
|
border-top-color: #7f8c8d;
|
|
}
|
|
.btn-forum, .btn-forum.disabled, .btn-forum:disabled {
|
|
color: #fcfcfc;
|
|
background-color: #9b59b6;
|
|
border-color: transparent;
|
|
border-bottom-color: #cb81ea;
|
|
border-right-color: #cb81ea;
|
|
}
|
|
.btn-forum:hover {
|
|
color: #fcfcfc;
|
|
background-color: #61237c;
|
|
border-bottom-color: #9b59b6;
|
|
border-right-color: #9b59b6;
|
|
}
|
|
.btn-cwgames, .btn-cwgames.disabled, .btn-cwgames:disabled {
|
|
background: radial-gradient(ellipse at top, #4d4d4d, transparent),
|
|
radial-gradient(ellipse at bottom, #232629, transparent);
|
|
color: #fcfcfc;
|
|
border-bottom-color: #bdc3c7;
|
|
border-right-color: #bdc3c7;
|
|
}
|
|
.btn-cwgames:hover {
|
|
color: #fcfcfc;
|
|
background-color: #727272;
|
|
border-color: transparent;
|
|
border-bottom-color: #31363b;
|
|
border-right-color: #31363b;
|
|
}
|
|
.btn-primary, .btn-primary.disabled, .btn-primary:disabled {
|
|
background: radial-gradient(ellipse at top, #3daee9, transparent),
|
|
radial-gradient(ellipse at bottom, #232629, transparent);
|
|
color: #fcfcfc;
|
|
border-bottom-color: #9ed6ff;
|
|
border-right-color: #9ed6ff;
|
|
}
|
|
.btn-primary:hover {
|
|
color: #fcfcfc;
|
|
background-color: #205e7d;
|
|
border-color: transparent;
|
|
border-bottom-color: #1d99f3;
|
|
border-right-color: #1d99f3;
|
|
}
|
|
.btn-secondary, .btn-secondary.disabled, .btn-secondary:disabled {
|
|
color: #fcfcfc;
|
|
background-color: #7f8c8d;
|
|
border-color: transparent;
|
|
border-bottom-color: #d6dfe4;
|
|
border-right-color: #d6dfe4;
|
|
}
|
|
.btn-secondary:hover {
|
|
color: #fcfcfc;
|
|
background-color: #495051;
|
|
border-color: transparent;
|
|
border-bottom-color: #bdc3c7;
|
|
border-right-color: #bdc3c7;
|
|
}
|
|
.btn-success, .btn-success.disabled, .btn-success:disabled {
|
|
color: #fcfcfc;
|
|
background-color: #2ecc71;
|
|
border-color: transparent;
|
|
border-bottom-color: #20ec77;
|
|
border-right-color: #20ec77;
|
|
}
|
|
.btn-success:hover {
|
|
color: #fcfcfc;
|
|
background-color: #145d33;
|
|
border-bottom-color: #27ae60;
|
|
border-right-color: #27ae60;
|
|
}
|
|
.btn-danger, .btn-danger.disabled, .btn-danger:disabled {
|
|
color: #fcfcfc;
|
|
background-color: #da4453;
|
|
border-color: transparent;
|
|
border-bottom-color: #f58276;
|
|
border-right-color: #f58276;
|
|
}
|
|
.btn-danger:hover {
|
|
color: #fcfcfc;
|
|
background-color: #611e24;
|
|
border-bottom-color: #e74c3c;
|
|
border-right-color: #e74c3c;
|
|
}
|
|
|
|
.within { margin: 0 auto; }
|
|
.wny { border: solid 2px #ed1515; box-shadow: 0px 0px 20px 10px rgba(237,21,21,1); }
|
|
.bny, .cny { background-color: #da4453; border-bottom: solid 2px #ed1515; }
|
|
.mny { background-color: #c0392b; border-bottom: solid 2px #ed1515; }
|
|
.new { background-color: #2c3e50; margin: 10px auto; padding: 0; }
|
|
.head > div { margin: 5px 0; }
|
|
.new-head, .new-body { padding: 10px; }
|
|
.new-head { border: 2px solid #3daee9; background-color: #34495e; }
|
|
.new-body { border-bottom: 2px solid #3daee9; border-left: 2px solid #3daee9; border-right: 2px solid #3daee9; }
|