mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
08ef4df2c0
* Add Bulma v9 * Add vendor dependencies * Fix native * Fix sponsors * Add style attribute
246 lines
4.9 KiB
SCSS
246 lines
4.9 KiB
SCSS
@charset "utf-8";
|
|
|
|
$bootstrap: #6f5499;
|
|
$github: #333333;
|
|
$twitter: #55acee;
|
|
$patreon: #f96854;
|
|
$patreon-blue: #052d49;
|
|
$fortyfour: #5f45bb;
|
|
$amazon: #ffd863;
|
|
$bleeding-green: #abf47c;
|
|
$bleeding-red: #ca1f26;
|
|
$rss: #f26522;
|
|
$algolia: #3c4fe0;
|
|
|
|
$star: #ffd257;
|
|
$purple: #b86bff;
|
|
|
|
$mauve: #8a4d76;
|
|
$pink: #fa7c91;
|
|
$rose: #ea4aaa;
|
|
$brown: #757763;
|
|
$beige-light: #d0d1cd;
|
|
$beige-lighter: #eff0eb;
|
|
$sass: #bf4080;
|
|
|
|
$carbon-width: 300px;
|
|
$carbon-height: 100px;
|
|
$carbon-line-height: 20px;
|
|
$carbon-min-lines: 6;
|
|
$carbon-poweredby-height: 20px;
|
|
$carbon-min-height: ($carbon-line-height * $carbon-min-lines) +
|
|
$carbon-poweredby-height;
|
|
|
|
$main-spacing: 3rem;
|
|
$intro-width: 1080px;
|
|
$sidebar-width: 10.5rem;
|
|
|
|
$radius: 0.375em;
|
|
|
|
$bd-edge-width: 11.25rem;
|
|
$bd-edge-offset: 2rem;
|
|
|
|
@import '../sass/utilities/initial-variables';
|
|
@import '../sass/utilities/functions';
|
|
|
|
$custom-colors: (
|
|
'expo': (
|
|
$star,
|
|
$white,
|
|
findLightColor($star),
|
|
findDarkColor($star),
|
|
),
|
|
'love': (
|
|
$red,
|
|
$white,
|
|
findLightColor($red),
|
|
findDarkColor($red),
|
|
),
|
|
'patreon': (
|
|
$patreon,
|
|
$white,
|
|
findLightColor($patreon),
|
|
findDarkColor($patreon),
|
|
),
|
|
'rss': (
|
|
$rss,
|
|
$white,
|
|
findLightColor($rss),
|
|
findDarkColor($rss),
|
|
),
|
|
'bleeding': (
|
|
$bleeding-green,
|
|
findColorInvert($bleeding-green),
|
|
findLightColor($bleeding-green),
|
|
findDarkColor($bleeding-green),
|
|
),
|
|
'sass': (
|
|
$sass,
|
|
$white,
|
|
findLightColor($sass),
|
|
findDarkColor($sass),
|
|
),
|
|
'amazon': (
|
|
$amazon,
|
|
findColorInvert($amazon),
|
|
findLightColor($amazon),
|
|
findDarkColor($amazon),
|
|
),
|
|
'sponsor': (
|
|
$rose,
|
|
$white,
|
|
findLightColor($rose),
|
|
findDarkColor($rose),
|
|
),
|
|
'twitter': (
|
|
$twitter,
|
|
$white,
|
|
findLightColor($twitter),
|
|
findDarkColor($twitter),
|
|
),
|
|
'videos': (
|
|
$green,
|
|
$white,
|
|
findLightColor($green),
|
|
findDarkColor($green),
|
|
),
|
|
'extensions': (
|
|
$cyan,
|
|
$white,
|
|
findLightColor($cyan),
|
|
findDarkColor($cyan),
|
|
),
|
|
'bootstrap': (
|
|
$bootstrap,
|
|
$white,
|
|
findLightColor($bootstrap),
|
|
findDarkColor($bootstrap),
|
|
),
|
|
);
|
|
|
|
@import '../sass/utilities/derived-variables';
|
|
|
|
$navbar-breakpoint: $tablet;
|
|
|
|
@import '../bulma';
|
|
|
|
%center {
|
|
align-items: center;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
@mixin selection($current-selector: false) {
|
|
@if $current-selector {
|
|
&::-moz-selection {
|
|
@content;
|
|
}
|
|
&::selection {
|
|
@content;
|
|
}
|
|
} @else {
|
|
::-moz-selection {
|
|
@content;
|
|
}
|
|
::selection {
|
|
@content;
|
|
}
|
|
}
|
|
}
|
|
|
|
%reset {
|
|
-moz-appearance: none;
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
background: none;
|
|
border: none;
|
|
color: currentColor;
|
|
font-family: inherit;
|
|
font-size: 1em;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
%bd-box {
|
|
background-color: $white;
|
|
border-radius: $radius-large;
|
|
box-shadow: 0 1.5rem 1.5rem -1.25rem rgba($black, 0.05);
|
|
display: block;
|
|
}
|
|
|
|
%link-before-background {
|
|
position: relative;
|
|
|
|
&::before {
|
|
@include overlay;
|
|
background-color: $scheme-main-bis;
|
|
border-radius: $radius-large;
|
|
content: '';
|
|
display: block;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
transform: scale(1.1);
|
|
transform-origin: center;
|
|
transition-duration: $speed * 2;
|
|
transition-property: opacity, transform;
|
|
}
|
|
|
|
&:hover {
|
|
&::before {
|
|
opacity: 1;
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
}
|
|
|
|
@import './_sass/base/css-vars';
|
|
@import './_sass/base/custom';
|
|
@import './_sass/base/helpers';
|
|
|
|
@import './_sass/components/anchors';
|
|
@import './_sass/components/options';
|
|
@import './_sass/components/banner';
|
|
@import './_sass/components/call';
|
|
@import './_sass/components/carbon';
|
|
@import './_sass/components/categories';
|
|
@import './_sass/components/code';
|
|
@import './_sass/components/content';
|
|
@import './_sass/components/hero';
|
|
@import './_sass/components/highlight';
|
|
@import './_sass/components/klmn';
|
|
@import './_sass/components/navbar';
|
|
@import './_sass/components/notification';
|
|
@import './_sass/components/pagination';
|
|
@import './_sass/components/features';
|
|
@import './_sass/components/links';
|
|
@import './_sass/components/screenshots';
|
|
@import './_sass/components/drawing';
|
|
@import './_sass/components/variables';
|
|
@import './_sass/components/book';
|
|
@import './_sass/components/native';
|
|
|
|
@import './_sass/pages/index';
|
|
@import './_sass/pages/docs';
|
|
@import './_sass/pages/videos';
|
|
@import './_sass/pages/love';
|
|
@import './_sass/pages/expo';
|
|
@import './_sass/pages/backers';
|
|
@import './_sass/pages/blog';
|
|
@import './_sass/pages/single';
|
|
@import './_sass/pages/extensions';
|
|
@import './_sass/pages/made-with-bulma';
|
|
@import './_sass/pages/bootstrap';
|
|
|
|
@import './_sass/index/hello';
|
|
@import './_sass/index/focus';
|
|
@import './_sass/index/focus-animations';
|
|
@import './_sass/index/best';
|
|
@import './_sass/index/sponsors';
|
|
@import './_sass/index/heading';
|
|
@import './_sass/index/columns';
|
|
@import './_sass/index/custom';
|
|
|
|
@import './_sass/global/support';
|
|
@import './_sass/global/newsletter';
|
|
@import './_sass/global/cc';
|