Skip to content

Instantly share code, notes, and snippets.

View Wakkos's full-sized avatar
🏠
Working from home

Daniel Martínez Wakkos

🏠
Working from home
View GitHub Profile
@Wakkos
Wakkos / input.scss
Created February 12, 2024 18:41
Generated by SassMeister.com.
$unit: 6;
$directionsmap: (
top: top,
right: right,
bottom: bottom,
left: left
);
@each $key, $value in $directionsmap {
@Wakkos
Wakkos / input.scss
Created May 16, 2023 18:42
Generated by SassMeister.com.
@each $header, $margin-bot, $font-size,
$line-height
in (h1, 0.5rem, 3, 1.1)
(h2, 0.5rem, 2, 1.5)
(h3, 1.5em, 1.4, 1.5)
(h4, 1.5em, 1.3, 1.5)
(h5, 0.5rem, 1.2, 1.5)
(h6, 0.5rem, 0.9, 1.3)
{
#{$header},
@Wakkos
Wakkos / input.scss
Created May 10, 2023 16:54
Generated by SassMeister.com.
@each $header, $margin-bot, $font-size,
$line-height
in (h1, 0.5rem, 3, 1.1)
(h2, 0.5rem, 2, 1.5)
(h3, 1.5em, 1.4, 1.5)
(h4, 1.5em, 1.3, 1.5)
(h5, 0.5rem, 1.2, 1.5)
(h6, 0.5rem, 0.9, 1.3)
{
#{$header},
@Wakkos
Wakkos / input.scss
Created May 10, 2023 16:40
Generated by SassMeister.com.
$size-vars: (
"xx-small" : .50,
"x-small" : .70, // 11px
"small" : .75, // 12px
"medium" : .875, // 14px
"normal" : 1, // 16px
"x-normal" : 1.12, // 18px
"big" : 1.3, // 21px
"x-big" : 1.8, // 29px
"xx-big" : 2.5, // 32px
@Wakkos
Wakkos / input.scss
Created May 10, 2023 16:40
Generated by SassMeister.com.
$size-vars: (
"xx-small" : .50,
"x-small" : .70, // 11px
"small" : .75, // 12px
"medium" : .875, // 14px
"normal" : 1, // 16px
"x-normal" : 1.12, // 18px
"big" : 1.3, // 21px
"x-big" : 1.8, // 29px
"xx-big" : 2.5, // 32px
@Wakkos
Wakkos / input.scss
Created February 15, 2023 18:27
Generated by SassMeister.com.
$bp-small: 600px;
$bp-medium: 720px;
$bp-large: 1440px;
@mixin mq($bp: $bp-medium, $bp-direction: min-width) {
@media all and ($bp-direction: $bp) {
@content;
}
}
@Wakkos
Wakkos / input.scss
Created March 9, 2022 19:53
Generated by SassMeister.com.
$breakpoints: (
'small' : 48em,
'medium' : 56.25em,
'large' : 1600px,
'qweqwe' : 1em,
);
@mixin respond-to($width) {
@if map-has-key($breakpoints, $width) {
@media (min-width: map-get($breakpoints, $width)) {
@Wakkos
Wakkos / input.scss
Created December 15, 2021 19:52
Generated by SassMeister.com.
$small : 48em;
$medium : 56.25em;
$large : 1600px;
@mixin respond-to($breakpoint: $medium) {
@media (min-width: $breakpoint) {
@content;
}
@Wakkos
Wakkos / input.scss
Created December 15, 2021 17:31
Generated by SassMeister.com.
/**
* Brand color
*/
$color-brand : #8bc84c; // CC Brand Color
$color-brand-dark : darken($color-brand, 15); // Dark green
$brand-colors: (
'brand': $color-brand,
@Wakkos
Wakkos / input.scss
Created October 4, 2021 13:34
Generated by SassMeister.com.
.break-after--always {
page-break-after: always;
}
.break-inside--avoid {
page-break-inside: avoid;
}
.print-title-section {