294 lines
7.2 KiB
Sass
294 lines
7.2 KiB
Sass
%icon
|
|
display: inline-block
|
|
vertical-align: middle
|
|
background:
|
|
size: 100%
|
|
repeat: no-repeat
|
|
|
|
.icon
|
|
width: 15px
|
|
height: 15px
|
|
@extend %icon
|
|
|
|
%icon-download-log
|
|
background-image: inline-image('stroke-icons/icon-downloadlogs.svg')
|
|
.icon-download-log
|
|
@extend .icon
|
|
@extend %icon-download-log
|
|
background-position: 0 -1px
|
|
%icon-remove-log
|
|
background-image: inline-image('stroke-icons/icon-deletelogs.svg')
|
|
.icon-remove-log
|
|
@extend .icon
|
|
@extend %icon-remove-log
|
|
background-position: 0 -1px
|
|
|
|
%icon-arrow-down
|
|
background-image: inline-image('stroke-icons/icon-arrowdown.svg')
|
|
|
|
.icon--search
|
|
background-image: inline-image('stroke-icons/icon-search.svg')
|
|
|
|
.icon--dismiss-yellow
|
|
background-image: inline-image('ui/icon-warning-dismiss.svg')
|
|
.icon--dismiss-green
|
|
background-image: inline-image('ui/icon-success-dismiss.svg')
|
|
.icon--dismiss-red
|
|
background-image: inline-image('ui/icon-error-dismiss.svg')
|
|
|
|
.icon--dismiss-grey
|
|
background-image: inline-image('ui/dismiss.svg')
|
|
|
|
%icon-line-trashcan
|
|
background-image: inline-image('stroke-icons/icon-trash.svg')
|
|
%icon-line-trashcan-red
|
|
background-image: inline-image('stroke-icons/icon-trash-red.svg')
|
|
%icon-line-trashcan-disabled
|
|
background-image: inline-image('stroke-icons/icon-trash-disabled.svg')
|
|
|
|
.icon-delete
|
|
@extend .icon
|
|
@extend %icon-line-trashcan
|
|
.icon-delete-hover
|
|
@extend %icon-line-trashcan-red
|
|
.icon-delete-disabled
|
|
@extend %icon-line-trashcan-disabled
|
|
|
|
%icon-line-arrowtabs
|
|
background-image: inline-image('stroke-icons/icon-arrowtabs.svg')
|
|
%icon-line-arrowtabs-teal
|
|
background-image: inline-image('stroke-icons/icon-arrowtabs-teal.svg')
|
|
|
|
%icon-line-key
|
|
background-image: inline-image('stroke-icons/icon-key.svg')
|
|
.icon-key
|
|
@extend .icon
|
|
@extend %icon-line-key
|
|
margin-right: .3rem
|
|
|
|
%icon-line-fingerprint
|
|
background-image: inline-image('stroke-icons/icon-fingerprint.svg')
|
|
.icon-fingerprint
|
|
@extend .icon
|
|
@extend %icon-line-fingerprint
|
|
margin-right: .3rem
|
|
|
|
%icon-line-calendar
|
|
background-image: inline-image('stroke-icons/icon-calendar.svg')
|
|
.icon-line-calendar,
|
|
.icon-cal,
|
|
.icon-calendar
|
|
@extend .icon
|
|
@extend %icon-line-calendar
|
|
margin-right: .3rem
|
|
|
|
%icon-line-clock
|
|
background-image: inline-image('stroke-icons/icon-clock.svg')
|
|
.icon-clock
|
|
@extend .icon
|
|
@extend %icon-line-clock
|
|
margin-right: .2rem
|
|
|
|
%icon-line-stopwatch
|
|
background-image: inline-image('stroke-icons/icon-stopwatch.svg')
|
|
.icon-stopwatch
|
|
@extend %icon
|
|
@extend %icon-line-stopwatch
|
|
width: 17px
|
|
height: 19px
|
|
margin-right: .2rem
|
|
|
|
.icon-line-build
|
|
@extend %icon
|
|
background-image: inline-image('stroke-icons/icon-builds.svg')
|
|
|
|
%icon-line-commit,
|
|
%icon-github
|
|
background-image: inline-image('stroke-icons/icon-github.svg')
|
|
.icon-line-commit
|
|
@extend %icon
|
|
@extend %icon-line-commit
|
|
|
|
%icon-line-eye
|
|
background-image:inline-image('stroke-icons/icon-seemore.svg')
|
|
%icon-line-eye-white
|
|
background-image:inline-image('stroke-icons/icon-seemore-white.svg')
|
|
|
|
%icon-line-question
|
|
background-image: inline-image('stroke-icons/icon-help.svg')
|
|
%icon-line-question-teal
|
|
background-image: inline-image('stroke-icons/icon-help-teal.svg')
|
|
|
|
.icon-question
|
|
width: 18px
|
|
height: 18px
|
|
background:
|
|
repeat: no-repeat
|
|
position: 3px 3px
|
|
size: auto 10px
|
|
display: inline-block
|
|
border: solid 1px #E4E6E6
|
|
border-radius: 50%
|
|
@extend %icon-line-question
|
|
&:hover
|
|
border-color: $oxide-blue
|
|
@extend %icon-line-question-teal
|
|
|
|
%icon-line-hash
|
|
background-image: inline-image('stroke-icons/icon-hash.svg')
|
|
.icon-hash
|
|
@extend .icon
|
|
@extend %icon-line-hash
|
|
|
|
%icon-line-linux
|
|
background-image: inline-image('stroke-icons/icon-linux.svg')
|
|
%icon-line-mac
|
|
background-image: inline-image('stroke-icons/icon-mac.svg')
|
|
%icon-line-language
|
|
background-image: inline-image('stroke-icons/icon-language.svg')
|
|
%icon-line-environment
|
|
background-image: inline-image('stroke-icons/icon-environment.svg')
|
|
|
|
%icon-line-cog
|
|
background-image: inline-image('stroke-icons/icon-settings.svg')
|
|
%icon-line-cog-teal
|
|
background-image: inline-image('stroke-icons/icon-settings-teal.svg')
|
|
%icon-line-cog-white
|
|
background-image: inline-image('stroke-icons/icon-settings-white.svg')
|
|
|
|
%icon-line-tofu
|
|
background-image: inline-image('stroke-icons/icon-tofuburger.svg')
|
|
%icon-line-tofu-teal
|
|
background-image: inline-image('stroke-icons/icon-tofuburger-teal.svg')
|
|
|
|
.icon-settings
|
|
@extend %icon-line-cog
|
|
@extend .icon
|
|
&:hover
|
|
@extend %icon-line-cog-teal
|
|
|
|
%icon-line-dropdown
|
|
background-image: inline-image('stroke-icons/icon-arrow-dropdown.svg')
|
|
%icon-line-dropdown-teal
|
|
background-image: inline-image('stroke-icons/icon-arrow-dropdown-teal.svg')
|
|
|
|
%icon-line-cross
|
|
background-image: inline-image('stroke-icons/icon-failed.svg')
|
|
%icon-line-cross-white
|
|
background-image: inline-image('stroke-icons/icon-failed-white.svg')
|
|
%icon-line-cross-teal
|
|
background-image: inline-image('stroke-icons/icon-failed-teal.svg')
|
|
|
|
.icon-deactivate
|
|
@extend .icon
|
|
@extend %icon-line-cross
|
|
border: 1px solid $cement-grey
|
|
border-radius: 50%
|
|
&:hover,
|
|
&:active
|
|
@extend %icon-line-cross-white
|
|
border-color: white
|
|
|
|
%icon-line-trigger
|
|
background-image: inline-image('stroke-icons/icon-restart.svg')
|
|
%icon-line-trigger-white
|
|
background-image: inline-image('stroke-icons/icon-restart-white.svg')
|
|
%icon-line-trigger-teal
|
|
background-image: inline-image('stroke-icons/icon-restart-teal.svg')
|
|
|
|
.icon-trigger
|
|
@extend .icon
|
|
@extend %icon-line-trigger
|
|
&:hover,
|
|
&:active
|
|
@extend %icon-line-trigger-white
|
|
|
|
%icon-line-lock
|
|
background-image: inline-image('stroke-icons/icon-private.svg')
|
|
.icon-lock
|
|
@extend %icon
|
|
@extend %icon-line-lock
|
|
width: 18px
|
|
height: 18px
|
|
margin-top: 1em
|
|
white-space: nowrap
|
|
text-indent: 999px
|
|
overflow: hidden
|
|
|
|
.icon-star
|
|
@extend %icon
|
|
width: 18px
|
|
height: 18px
|
|
|
|
%icon-line-passed
|
|
background-image: inline-image('stroke-icons/icon-passed.svg')
|
|
|
|
.icon-github
|
|
margin-right: 0.3em
|
|
vertical-align: middle
|
|
@extend .icon
|
|
@extend %icon-github
|
|
|
|
%icon-github-circle
|
|
background-image: inline-image('stroke-icons/icon-repooctocat.svg')
|
|
.icon-github-circle
|
|
display: inline-block
|
|
width: 1.2em
|
|
height: 1.2em
|
|
margin-right: 0.3em
|
|
vertical-align: middle
|
|
background-repeat: no-repeat
|
|
@extend %icon-github-circle
|
|
|
|
%icon-line-flag-teal
|
|
background-image: inline-image('stroke-icons/icon-flag.svg')
|
|
%icon-line-flag-yellow
|
|
background-image: inline-image('stroke-icons/icon-flag-yellow.svg')
|
|
|
|
%icon-line-scale
|
|
background-image: inline-image('stroke-icons/icon-scales.svg')
|
|
|
|
.icon-scale
|
|
@extend .icon
|
|
@extend %icon-line-scale
|
|
margin-right: .3rem
|
|
|
|
.icon--plus
|
|
width: 1.1rem
|
|
height: 1.4rem
|
|
&:after
|
|
content: "+"
|
|
font-size: 16px
|
|
color: $asphalt-grey
|
|
|
|
.icon-receiving
|
|
margin: 0.3rem 0.5rem;
|
|
display: inline-block;
|
|
i
|
|
width: 4px
|
|
height: 4px
|
|
border-radius: 50%
|
|
display: inline-block
|
|
background-color: $canary-yellow
|
|
transform-origin: center center
|
|
animation: bubbleScale 1.2s infinite linear
|
|
i:nth-of-type(2)
|
|
animation-delay: 0.35s
|
|
i:nth-of-type(3)
|
|
animation-delay: 0.7s
|
|
|
|
.icon-owner-receiving
|
|
@extend .icon-receiving
|
|
margin-right: 0.5em !important
|
|
i
|
|
width: 5px
|
|
height: 5px
|
|
background-color: #ECCE4B
|
|
|
|
@keyframes bubbleScale
|
|
0%, 80%, 100%
|
|
transform: scale(0)
|
|
|
|
40%
|
|
transform: scale(1.0)
|