<commit_before>@import "compass/css3"
// CUSTOM IMPORTS
@import "fonts"
@import "animations"
// BOILERPLATE IMPORTS
@import "helperclasses"
@import "print"


//////////////////////////////
// Variables
//////////////////////////////
// Main Color Palette

// Accent Colors
$white: #f1f1f1
$maintextcolor: #222
$linkColor: rgba(0,0,0,0.6)
$backgroundcolor: #181818


// Color transition variables
$max: 10
$speed: 3.0s

$fadeInDelay: 3s
$fadeInSpeed: 0.6s


//////////////////////////////
// Global Styles
//////////////////////////////
*,
*:after,
*:before
    +box-sizing(border-box)

html,
button,
input,
select,
textarea
    color: $maintextcolor

body    
    font-size: 13px
    font-style: normal
    line-height: 1.5
    background: $backgroundcolor
    text-rendering: optimizeLegibility
    -webkit-font-smoothing: antialiased
    -moz-osx-font-smoothing: grayscale
    +respond-to(tablet)
        font-size: 17px
    +respond-to(desktop)
        font-size: 19px

::-moz-selection
    background: transparent
    text-shadow: none

::selection 
    background: transparent
    text-shadow: none

hr 
    display: block
    height: 1px
    border: 0
    border-top: 1px solid #ccc
    margin: 1em 0
    padding: 0

img 
    vertical-align: middle
    max-width: 100%
    height: auto

ul
    list-style: none
    margin: 0
    padding: 0

a
    text-decoration: none

p
    color: $white

h1,
h2,
h3,
h4,
h5,
h6
    font-weight: normal
    font-size: 1em
    line-height: 1.2
    margin: 0

.inner
    margin: 0 auto
    width: 80%
    +respond-to(desktop)
        max-width: 600px
.table
    width: 100%
    height: 100%
    display: table
.vertical-align
    width: 100%
    height: 100%
    display: table-cell
    vertical-align: middle


$colorCount: $max
@while $colorCount >= 0
    $currentColor: hsl( ($colorCount * (350 / $max)), 60%, 75% )
    body.color#{$colorCount}
        #logo a:hover,
        .social a:hover,
        .profile h2
            color: $currentColor
        #work,
        .highlight
            background-color: $currentColor
    $colorCount: $colorCount - 1 !global
    // $colorCount: $colorCount - 1
      

//////////////////////////////
// Custom Styles
//////////////////////////////
html,
body,
.container,
.browserheight,
section
    height: 100%
    width: 100%
section
    background-color: $backgroundcolor
    position: relative

.browserheight
    pointer-events: none
    z-index: 0

#about
    position: fixed
    top: 0
    left: 0
    width: 100%
    height: 100%
    z-index: 0
    +transition(background-color $speed linear)

.profile
    h2
        color: transparent
        font-weight: 600
        min-height: 146px
        letter-spacing: -2px
        margin: 0 0 0.75em 0
        +transition(color $speed linear)
        .highlight
            color: transparent
            position: relative
            +transition(all $speed linear)
    .inner
        +transform(translateY(-30px))


.profile h2,
#work a
    font-family: "circular_stdregular"
    font-size: 2em
    line-height: 1.35
    +respond-to(desktop)
        font-size: 2.842em

#logo,
.tagline
    +transition($speed color linear)
    color: #c1272d
    a
        color: #c1272d
        position: relative
        +transition(color $speed linear)

#logo,
.social
    +opacity(0)


#logo,
.social,
#main-footer
    +animation-delay($fadeInDelay)
    +animation-duration($fadeInSpeed)
    +animation-timing-function(cubic-bezier(0.19, 1, 0.22, 1))
    +animation-fill-mode(both)
    // +backface-visibility(hidden)

#logo
    margin-bottom: 2.5em
    +animation-name(fadeBounceDown)
    a
        font-weight: 300
        +inline-block
        +transition(color 0.3s linear)

.social
    margin-right: 1em
    +animation-name(fadeBounceUp)
    li
        float: left
        margin-right: 1em
        &:last-child
            margin-right: 0
    a
        +inline-block
        color: rgba($white, 0.4)
        font-size: 0.75em
        letter-spacing: 2px
        text-transform: uppercase
        position: relative
        +transition(color 0.3s linear)

nav,
#logo,
.workheader
    font-family: "apercu_proregular"
    a
        color: $white

.workheader
    padding: 1em 0
    color: $white
    background-color: #1e1e1e
    display: block
    position: relative
    z-index: 2
    height: 45px
    +transition(0.3s ease background-color)
    &:hover
        background-color: lighten(#1e1e1e, 5%)
    +respond-to(tablet)
        height: 66px

#work 
    position: relative
    background-color: #1e1e1e
    +transition(background-color $speed linear)
    a
        display: block
        color: rgba($backgroundcolor, 0.6)
        letter-spacing: -2px
        padding: 0.25em 0
        height: 100%
        +transition(all 0.3s ease)
        position: relative
        &:hover
            color: rgba($backgroundcolor, 0.8)
            background-color: rgba($backgroundcolor, 0.1)

#main-footer
    position: relative
    +animation-name(navPeak1)
    +transition-property(all)
    +respond-to(tablet)
        +animation-name(navPeak2)
<commit_msg>Removed global in sass loop<commit_after>@import "compass/css3"
// CUSTOM IMPORTS
@import "fonts"
@import "animations"
// BOILERPLATE IMPORTS
@import "helperclasses"
@import "print"


//////////////////////////////
// Variables
//////////////////////////////
// Main Color Palette

// Accent Colors
$white: #f1f1f1
$maintextcolor: #222
$linkColor: rgba(0,0,0,0.6)
$backgroundcolor: #181818


// Color transition variables
$max: 10
$speed: 3.0s

$fadeInDelay: 3s
$fadeInSpeed: 0.6s


//////////////////////////////
// Global Styles
//////////////////////////////
*,
*:after,
*:before
    +box-sizing(border-box)

html,
button,
input,
select,
textarea
    color: $maintextcolor

body    
    font-size: 13px
    font-style: normal
    line-height: 1.5
    background: $backgroundcolor
    text-rendering: optimizeLegibility
    -webkit-font-smoothing: antialiased
    -moz-osx-font-smoothing: grayscale
    +respond-to(tablet)
        font-size: 17px
    +respond-to(desktop)
        font-size: 19px

::-moz-selection
    background: transparent
    text-shadow: none

::selection 
    background: transparent
    text-shadow: none

hr 
    display: block
    height: 1px
    border: 0
    border-top: 1px solid #ccc
    margin: 1em 0
    padding: 0

img 
    vertical-align: middle
    max-width: 100%
    height: auto

ul
    list-style: none
    margin: 0
    padding: 0

a
    text-decoration: none

p
    color: $white

h1,
h2,
h3,
h4,
h5,
h6
    font-weight: normal
    font-size: 1em
    line-height: 1.2
    margin: 0

.inner
    margin: 0 auto
    width: 80%
    +respond-to(desktop)
        max-width: 600px
.table
    width: 100%
    height: 100%
    display: table
.vertical-align
    width: 100%
    height: 100%
    display: table-cell
    vertical-align: middle


$colorCount: $max
@while $colorCount >= 0
    $currentColor: hsl( ($colorCount * (350 / $max)), 60%, 75% )
    body.color#{$colorCount}
        #logo a:hover,
        .social a:hover,
        .profile h2
            color: $currentColor
        #work,
        .highlight
            background-color: $currentColor
    // $colorCount: $colorCount - 1 !global
    $colorCount: $colorCount - 1
      

//////////////////////////////
// Custom Styles
//////////////////////////////
html,
body,
.container,
.browserheight,
section
    height: 100%
    width: 100%
section
    background-color: $backgroundcolor
    position: relative

.browserheight
    pointer-events: none
    z-index: 0

#about
    position: fixed
    top: 0
    left: 0
    width: 100%
    height: 100%
    z-index: 0
    +transition(background-color $speed linear)

.profile
    h2
        color: transparent
        font-weight: 600
        min-height: 146px
        letter-spacing: -2px
        margin: 0 0 0.75em 0
        +transition(color $speed linear)
        .highlight
            color: transparent
            position: relative
            +transition(all $speed linear)
    .inner
        +transform(translateY(-30px))


.profile h2,
#work a
    font-family: "circular_stdregular"
    font-size: 2em
    line-height: 1.35
    +respond-to(desktop)
        font-size: 2.842em

#logo,
.tagline
    +transition($speed color linear)
    color: #c1272d
    a
        color: #c1272d
        position: relative
        +transition(color $speed linear)

#logo,
.social
    +opacity(0)


#logo,
.social,
#main-footer
    +animation-delay($fadeInDelay)
    +animation-duration($fadeInSpeed)
    +animation-timing-function(cubic-bezier(0.19, 1, 0.22, 1))
    +animation-fill-mode(both)
    // +backface-visibility(hidden)

#logo
    margin-bottom: 2.5em
    +animation-name(fadeBounceDown)
    a
        font-weight: 300
        +inline-block
        +transition(color 0.3s linear)

.social
    margin-right: 1em
    +animation-name(fadeBounceUp)
    li
        float: left
        margin-right: 1em
        &:last-child
            margin-right: 0
    a
        +inline-block
        color: rgba($white, 0.4)
        font-size: 0.75em
        letter-spacing: 2px
        text-transform: uppercase
        position: relative
        +transition(color 0.3s linear)

nav,
#logo,
.workheader
    font-family: "apercu_proregular"
    a
        color: $white

.workheader
    padding: 1em 0
    color: $white
    background-color: #1e1e1e
    display: block
    position: relative
    z-index: 2
    height: 45px
    +transition(0.3s ease background-color)
    &:hover
        background-color: lighten(#1e1e1e, 5%)
    +respond-to(tablet)
        height: 66px

#work 
    position: relative
    background-color: #1e1e1e
    +transition(background-color $speed linear)
    a
        display: block
        color: rgba($backgroundcolor, 0.6)
        letter-spacing: -2px
        padding: 0.25em 0
        height: 100%
        +transition(all 0.3s ease)
        position: relative
        &:hover
            color: rgba($backgroundcolor, 0.8)
            background-color: rgba($backgroundcolor, 0.1)

#main-footer
    position: relative
    +animation-name(navPeak1)
    +transition-property(all)
    +respond-to(tablet)
        +animation-name(navPeak2)

{'fraction_non_alphanumeric': 0.14106090373280944, 'fraction_numerical': 0.03850687622789784, 'mean_word_length': 2.023760023760024, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1966713', 'n_tokens_mistral': 3681, 'n_tokens_neox': 3328, 'n_words': 822}