+++ /dev/null
-@import "variables";
-
-// Use all Bootstrap modules that we want
-@import "../bootstrap/scss/functions";
-@import "../bootstrap/scss/variables";
-@import "../bootstrap/scss/mixins";
-@import "../bootstrap/scss/root";
-@import "../bootstrap/scss/reboot";
-@import "../bootstrap/scss/type";
-@import "../bootstrap/scss/images";
-@import "../bootstrap/scss/code";
-@import "../bootstrap/scss/grid";
-@import "../bootstrap/scss/tables";
-@import "../bootstrap/scss/forms";
-@import "../bootstrap/scss/buttons";
-@import "../bootstrap/scss/transitions";
-@import "../bootstrap/scss/dropdown";
-@import "../bootstrap/scss/button-group";
-@import "../bootstrap/scss/input-group";
-@import "../bootstrap/scss/nav";
-@import "../bootstrap/scss/navbar";
-@import "../bootstrap/scss/card";
-@import "../bootstrap/scss/pagination";
-@import "../bootstrap/scss/badge";
-@import "../bootstrap/scss/alert";
-@import "../bootstrap/scss/progress";
-@import "../bootstrap/scss/media";
-@import "../bootstrap/scss/list-group";
-@import "../bootstrap/scss/close";
-@import "../bootstrap/scss/modal";
-@import "../bootstrap/scss/utilities";
-@import "../bootstrap/scss/print";
-
-// Include fonts
-@import "fonts";
-
-// Custom stuff
-@import '_icons';
-
-body {
- // For scrollspy
- position: relative;
-
- padding-top: 6rem;
-}
-
-// Buttons
-.btn {
- text-transform: uppercase;
-}
-
-// Headings
-
-h1 {
- line-height: 4rem;
- font-weight: 300;
-}
-
-h2 {
- line-height: 3.5rem;
-}
-
-h3 {
- line-height: 3rem;
-}
-
-h4 {
- line-height: 2.75rem;
-}
-
-h5 {
- line-height: 2rem;
-}
-
-h6 {
- line-height: 1.75rem;
-}
-
-.card {
- color: $dark;
-}
-
-.nav {
- .nav-link {
- color: $white;
-
- &.active {
- color: $link-color;
- border-left: 2px solid $link-color;
- }
- }
-}
-
-.navbar {
- &.scrolled {
- background-color: white;
-
- transition: background-color 200ms linear;
- }
-
- .navbar-nav {
- .nav-link {
- color: $white;
-
- &.active {
- border-bottom: 2px solid $link-color;
- }
- }
- }
-}
-
-footer {
- .btn-toolbar .icon {
- height: 2.25rem;
- width: 2.25rem;
- fill: rgba($gray-400, .6);
- }
- .i_heart {
- vertical-align: top;
- transform: translateY(-.15rem);
- @include media-breakpoint-down(sm) {
- transform: translateY(-.75rem);
- }
- }
-}
-
-// Sections
-
-.main {
- section {
- padding: 3rem 0;
-
- @include media-breakpoint-up(sm) {
- padding: 72px 0;
- }
-
- h1 {
- margin-bottom: 64px;
- }
- }
-
- section.intro {
- // Make it cover the navbar, too
- margin-top: -6rem;
- padding-top: 6rem;
-
- min-height: 100vh;
- background-image: url('img/header-background.jpg');
- background-size: cover;
- background-attachment: fixed;
- background-position: center top;
- position: relative;
-
- .branding {
- margin-top: 7.5rem;
- margin-bottom: 4rem;
-
- @include media-breakpoint-down(xs) {
- margin-top: 2.5rem;
- }
-
- text-align: center;
-
- h1 {
- margin-bottom: 0;
-
- @include media-breakpoint-down(xs) {
- font-size: 72px;
- line-height: 88px;
- }
- }
-
- h1:before {
- content: "";
- height: 60px;
- width: 76px;
- background-image: url('img/ipfire-tux.png');
- background-repeat: no-repeat;
- background-position: center center;
- background-size: contain;
- display: inline-block;
- position: relative;
- top: 4px;
-
- @include media-breakpoint-up(sm) {
- height: 120px;
- width: 93px;
- margin-right: 32px;
- top: 8px;
- }
- }
-
- h5 {
- color: $white;
-
- @include media-breakpoint-down(xs) {
- font-size: 14px;
- line-height: 20px;
- }
- }
- }
- }
-
- section#news, section#support, footer {
- background-color: rgba($gray-800, .06);
- }
-
- section#news {
- color: rgba($gray-800, .6);
- }
-
- section#fireinfo {
- border-bottom: 1px solid rgba($gray-800, .2);
- }
-
- section#appliances {
- padding-bottom: 48px;
- }
-}
-
-.blog-post {
- .blog-header {
- h5 {
- a {
- color: $body-color;
- }
- }
- }
-
- .blog-content {
- h1, h2, h3, h4, h5, h6 {
- font-size: 20px;
- font-weight: $headings-font-weight;
-
- line-height: 28px;
-
- margin-bottom: 0.25rem;
- }
-
- img {
- @include img-fluid;
- }
- }
-
- &.lightning-wire-labs {
- .blog-header {
- h5 {
- a {
- color: $lwl;
- }
- }
-
- a {
- color: $lwl;
- }
- }
-
- .blog-content {
- a {
- color: $lwl;
- }
- }
- }
-}
-
-// Donations
-
-.faq {
- a {
- color: $body-color;
- }
-}
-
-.donation-explanation {
- margin-bottom: 2rem;
-
- p {
- color: $text-muted;
- }
-
- @include media-breakpoint-down(sm) {
- background-color: $dark;
- color: $white;
-
- padding: 1.5rem;
-
- h5, p {
- color: inherit;
- }
- }
-}
-
-// Sidebar navigation
-
-#sidebar .nav {
- position: fixed;
-}
-
-.page-scroll {
- display: block;
- visibility: visible;
- position: absolute;
- bottom: 48px;
- left: 50%;
- transform: translateX(-50%);
- .btn {
- width: 36px;
- height: 36px;
- fill: $red;
- @include media-breakpoint-up(sm) {
- width: 64px;
- height: 64px;
- }
- &:hover .i_arrow_down {
- fill: white;
- }
- }
-}
-
-.feature_icons {
- width: 40px;
- height: 100%;
- float: left;
- margin-right: .75rem;
-}
-
-.progress {
- background-color: rgba(255, 255, 255, .2);
-}
-
-.circle {
- position: relative;
- p.fireinfo_per {
- color: $gray-800;
- position: absolute;
- top: calc(50% - 18px);
- width: 100%;
- }
-}
-
-.fixed-top + .blog-content {
- padding-top: 88px;
- margin-bottom: 40px;
- @include media-breakpoint-up(lg) {
- padding-top: 161px;
- }
- .content {
- background: white;
- border-radius: 4px;
- padding: 40px 24px;
- position: relative;
- }
-}
-
-.blog-content {
- margin-bottom: 80px;
-}
-
-.divider {
- width: 128px;
- height: 4px;
- border-radius: 2px;
- background-image: linear-gradient(to right, $red, $gray-400);
- margin: 40px auto 24px auto;
- @include media-breakpoint-up(sm) {
- margin: 56px auto 40px auto;
- }
-}
-
-footer {
- padding: 3rem 0 0 0;
- @include media-breakpoint-down(md) {
- padding-top: 31px;
- }
- h4 {
- margin-bottom: 1.25rem;
- color: rgba($gray-400, .6);
- font-size: 20px;
- line-height: 28px;
- }
- ul {
- li {
- font-size: 14px;
- margin-bottom: .75rem;
- a {
- color: rgba($gray-400, .6);
- text-decoration: none;
- &:hover {
- color: $gray-400;
- text-decoration: underline;
- }
- }
- }
- }
- .btn-lg {
- margin-bottom: 2.75rem;
- }
-
- .copyright {
- background-color: rgba($gray-400, .06);
- padding: $spacer 0;
-
- font-size: $small-font-size;
-
- a {
- color: $text-muted;
- }
- }
-}
-
-// Animation
-@keyframes scroll {
- 0%, 100% { transform: translateY(30%); }
- 50% { transform: translateY(50%); }
-}
projects / ipfire.org.git / blobdiff