Anastasia Stasy4168
Stasy4168
/ dabblet.css
Created
May 5, 2017 11:54
— forked from csssecrets/dabblet.css
Elastic color
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Elastic color | |
| */ | |
| html { | |
| background: rgb(100%, 0%, 40%); | |
| transition: 1s cubic-bezier(.25,.1,.2,3); | |
| } |
Stasy4168
/ dabblet.css
Created
May 5, 2017 11:54
— forked from csssecrets/dabblet.css
Elastic color
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Elastic color | |
| */ | |
| html { | |
| background: rgb(100%, 0%, 40%); | |
| transition: 1s cubic-bezier(.25,.1,.2,3); | |
| } |
Stasy4168
/ dabblet.css
Created
May 5, 2017 11:27
— forked from csssecrets/dabblet.css
Bouncing animation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Bouncing animation | |
| */ | |
| @keyframes bounce { | |
| 60%, 80%, to { | |
| transform: translateY(400px); | |
| animation-timing-function: ease; | |
| } | |
| 70% { transform: translateY(300px); } |
Stasy4168
/ dabblet.css
Created
May 4, 2017 12:13
— forked from csssecrets/dabblet.css
De-emphasizing by blurring (AND dimming)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * De-emphasizing by blurring (AND dimming) | |
| */ | |
| main { | |
| transition: .6s; | |
| background: white; | |
| } | |
| main.de-emphasized { |
Stasy4168
/ dabblet.css
Created
May 4, 2017 12:13
— forked from csssecrets/dabblet.css
De-emphasizing by blurring (AND dimming)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * De-emphasizing by blurring (AND dimming) | |
| */ | |
| main { | |
| transition: .6s; | |
| background: white; | |
| } | |
| main.de-emphasized { |
Stasy4168
/ dabblet.css
Created
May 4, 2017 12:04
— forked from csssecrets/dabblet.css
Rudimetary overlay with box-shadow
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Rudimetary overlay with box-shadow | |
| */ | |
| .lightbox { | |
| position: fixed; | |
| top: 50%; left: 50%; | |
| margin: -200px; | |
| box-shadow: 0 0 0 50vmax rgba(0,0,0,.8); | |
| } |
Stasy4168
/ dabblet.css
Created
May 4, 2017 12:04
— forked from csssecrets/dabblet.css
Rudimetary overlay with box-shadow
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Rudimetary overlay with box-shadow | |
| */ | |
| .lightbox { | |
| position: fixed; | |
| top: 50%; left: 50%; | |
| margin: -200px; | |
| box-shadow: 0 0 0 50vmax rgba(0,0,0,.8); | |
| } |
Stasy4168
/ dabblet.css
Created
May 4, 2017 10:20
— forked from csssecrets/dabblet.css
Text on a circle
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Text on a circle | |
| */ | |
| body { | |
| font: bold 120% Helvetica, sans-serif; | |
| } | |
| .circular { | |
| width: 30em; |
Stasy4168
/ dabblet.css
Created
May 4, 2017 10:20
— forked from csssecrets/dabblet.css
Text on a circle
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Text on a circle | |
| */ | |
| body { | |
| font: bold 120% Helvetica, sans-serif; | |
| } | |
| .circular { | |
| width: 30em; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Ligatures | |
| */ | |
| body { | |
| font: 200%/1.6 "Adobe Caslon Pro", Baskerville, serif; | |
| font-variant-ligatures: common-ligatures discretionary-ligatures historical-ligatures; | |
| } |
NewerOlder