stacker.news/styles/globals.scss

247 lines
5.0 KiB
SCSS
Raw Normal View History

2021-04-14 00:57:32 +00:00
$theme-colors: (
"primary" : #FADA5E,
"secondary" : #F6911D,
"danger" : #c03221,
"info" : #007cbe,
2021-04-24 21:05:07 +00:00
"success" : #5c8001,
"twitter" : #1da1f2,
"boost" : #7A0CE9,
2021-04-14 00:57:32 +00:00
);
2021-04-28 16:30:02 +00:00
$body-bg: #f5f5f5;
2021-04-14 00:57:32 +00:00
$border-radius: .4rem;
$enable-transitions: false;
$enable-gradients: false;
$enable-shadows: false;
$btn-transition: none;
2021-05-21 22:32:21 +00:00
$form-feedback-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='12' height='12'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M2 9h3v12H2a1 1 0 0 1-1-1V10a1 1 0 0 1 1-1zm5.293-1.293l6.4-6.4a.5.5 0 0 1 .654-.047l.853.64a1.5 1.5 0 0 1 .553 1.57L14.6 8H21a2 2 0 0 1 2 2v2.104a2 2 0 0 1-.15.762l-3.095 7.515a1 1 0 0 1-.925.619H8a1 1 0 0 1-1-1V8.414a1 1 0 0 1 .293-.707z' fill='rgba(92, 128, 1, 1)'/%3E%3C/svg%3E");
2021-04-14 00:57:32 +00:00
$form-feedback-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='12' height='12'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M22 15h-3V3h3a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1zm-5.293 1.293l-6.4 6.4a.5.5 0 0 1-.654.047L8.8 22.1a1.5 1.5 0 0 1-.553-1.57L9.4 16H3a2 2 0 0 1-2-2v-2.104a2 2 0 0 1 .15-.762L4.246 3.62A1 1 0 0 1 5.17 3H16a1 1 0 0 1 1 1v11.586a1 1 0 0 1-.293.707z' fill='rgba(192,50,33,1)'/%3E%3C/svg%3E");
$line-height-base: 1.75;
$input-btn-padding-y: .42rem;
$input-btn-padding-x: .84rem;
2021-04-22 22:14:32 +00:00
$btn-padding-y: .42rem;
2021-04-14 00:57:32 +00:00
$btn-padding-x: 1.1rem;
$btn-font-weight: bold;
$btn-focus-width: 0;
$btn-border-width: 0;
$btn-focus-box-shadow: none;
$alert-border-width: 0;
$close-text-shadow: none;
$close-color: inherit;
$alert-border-radius: #{33% 2%} / #{11% 74%};
$link-color: #007cbe;
$font-size-base: .9rem;
$enable-responsive-font-sizes: true;
$link-hover-decoration: none;
2021-04-28 21:30:32 +00:00
$dropdown-border-color: #ced4da;
$dropdown-link-active-color: inherit;
$dropdown-link-hover-bg: transparent;
$dropdown-link-active-bg: transparent;
$dropdown-link-color: rgba(0, 0, 0, 0.7);
$dropdown-link-hover-color: rgba(0, 0, 0, 0.9);
2021-04-14 00:57:32 +00:00
$container-max-widths: (
sm: 540px,
md: 720px,
lg: 900px,
) !default;
2021-07-01 23:51:58 +00:00
$nav-link-padding-y: .1rem;
$nav-tabs-link-active-bg: #fff;
$nav-tabs-link-hover-border-color: transparent;
$nav-tabs-link-active-border-color: #ced4da #ced4da $nav-tabs-link-active-bg;
2021-07-08 18:42:57 +00:00
$tooltip-bg: #5c8001;
2021-04-14 00:57:32 +00:00
@import "~bootstrap/scss/bootstrap";
@font-face {
font-family: lightning;
src: url(/Lightningvolt-xoqm.ttf);
}
2021-05-05 18:13:14 +00:00
body {
background-image: linear-gradient(180deg, #f5f5f5, #f5f5f5, white);
background-attachment:fixed;
min-height: 100vh;
height: 100%;
}
2021-06-02 23:15:28 +00:00
#__next {
display: flex;
flex-direction: column;
height: 100%;
min-height: 100vh;
}
footer {
margin-top: auto;
display: flex;
width: 100%;
align-items: center;
justify-content: center;
2021-06-30 23:01:28 +00:00
text-align: center;
}
.text-twitter svg {
fill: #1da1f2 !important;
}
.text-muted svg {
fill: #6c757d;
2021-06-02 23:15:28 +00:00
}
2021-05-06 22:01:48 +00:00
@media screen and (max-width: 767px) {
input, select, textarea, .form-control, .form-control:focus, .input-group-text {
font-size: 1rem !important;
}
}
2021-07-01 23:51:58 +00:00
.nav-tabs {
border-bottom: 0;
}
.nav-tabs .nav-link {
font-size: 80%;
color: #6c757d;
z-index: 100;
position: relative;
2021-07-02 00:05:35 +00:00
border-bottom: 0;
2021-07-01 23:51:58 +00:00
}
.nav-tabs .nav-link.active {
height: 100%;
}
2021-04-14 00:57:32 +00:00
.form-label {
font-size: 92%;
font-weight: bold;
}
.alert-dismissible .close {
font-weight: 300;
}
.nav-item {
font-weight: 500;
}
2021-04-28 21:30:32 +00:00
.dropdown-toggle::after {
display: none;
}
.dropdown-item {
font-weight: 500;
}
.dropdown-item.active {
text-shadow: 0 0 10px #FADA5E;
}
2021-04-14 00:57:32 +00:00
.form-control:focus {
border-color: #fada5e;
}
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:disabled {
color: #ffffff;
}
2021-04-24 21:05:07 +00:00
.btn-twitter svg {
fill: #ffffff;
}
.btn-dark svg {
fill: #ffffff;
}
2021-04-22 22:14:32 +00:00
.nav-link.active {
font-weight: bold;
2021-04-14 00:57:32 +00:00
}
2021-05-06 21:15:22 +00:00
.fill-grey {
fill: grey;
}
2021-05-11 15:52:50 +00:00
.fill-success {
fill: #5c8001;
}
.fill-danger {
fill: #c03221;
}
2021-04-14 00:57:32 +00:00
@keyframes flash {
2021-04-27 00:55:48 +00:00
from { filter: brightness(1);}
2021-04-22 22:14:32 +00:00
2% { filter: brightness(2.3); }
4% { filter: brightness(1.4); }
8% { filter: brightness(3); }
16% { filter: brightness(1); }
2021-04-27 00:55:48 +00:00
to { filter: brightness(1);}
2021-04-20 00:47:40 +00:00
}
2021-04-22 22:14:32 +00:00
.clouds {
background: url('/clouds.jpeg');
background-color: grey;
background-repeat: repeat;
background-origin: content-box;
background-size: cover;
background-attachment: fixed;
opacity: .2;
2021-05-06 21:15:22 +00:00
}
2021-06-24 23:56:01 +00:00
.flash-it {
2021-08-17 23:59:22 +00:00
animation: flash 2s linear 1;
2021-06-24 23:56:01 +00:00
}
2021-05-06 21:15:22 +00:00
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(359deg); }
}
.spin {
animation: spin 2s linear infinite;
}
.static {
background: url('/giphy.gif');
background-color: grey;
background-repeat: repeat;
background-origin: content-box;
background-size: cover;
background-attachment: fixed;
opacity: .1;
2021-05-11 15:52:50 +00:00
}
@keyframes flipX{
from {
transform: rotateX(180deg);
}
to {
transform: rotateX(-180deg);
}
}
.flipX {
animation: flipX 2s linear infinite;
}
@keyframes flipY{
from {
transform: rotateY(0deg);
}
to {
transform: rotateY(360deg);
}
}
.flipY {
animation: flipY 4s linear infinite;
}
@media (hover:none), (hover:on-demand) {
.tooltip {
visibility: hidden;
pointer-events: none;
}
2021-04-22 22:14:32 +00:00
}