lyraddigital
This file contains 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
| main { | |
| width: 100%; | |
| min-width: 540px; | |
| max-width: 540px; | |
| } | |
| header { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; |
lyraddigital
/ App.css
Last active
February 9, 2022 08:48
Gist that contains all the material needed to start working on the React JS version of my Tic Tac Toe game
This file contains 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
| #game { | |
| background: var(--content-background-color); | |
| border-radius: var(--default-border-radius); | |
| padding: 3vmin; | |
| box-shadow: var(--box-shadow); | |
| } | |
| h1 { | |
| color: var(--primary-color); | |
| text-align: center; |
lyraddigital
/ starting-css.css
Last active
August 26, 2020 07:25
Tic Tac Toe YouTube video snippets
This file contains 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
| :root { | |
| --background-light-color: #57ebd7; | |
| --background-dark-color: #24a88b; | |
| --content-background-color: #fff6be; | |
| --primary-color: #007340; | |
| --primary-brighter: #00a057; | |
| --primary-saturated: #05a058; | |
| --primary-saturated-brighter: #07cf72; | |
| --accent-color: #FD0; | |
| --accent-darker: #a79000; |
This file contains 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
| @media (min-width: 910px) { | |
| #profile-tile { | |
| display: block; | |
| } | |
| #trending-tile { | |
| display: block; | |
| } | |
| #notice-tile { |
lyraddigital
/ twitter.css
Created
August 20, 2019 02:49
Adding grid code to make the main element a grid container that has one column that is centered and is 75vw wide
This file contains 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
| display: grid; | |
| grid-template-columns: 85vw; | |
| justify-content: center; |
This file contains 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
| display: grid; | |
| place-items: center center; |
This file contains 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
| <p> | |
| Interdum, ridiculus rutrum vitae urna rhoncus. Est at mattis congue | |
| donec cum neque torquent. Ac ipsum metus pellentesque habitasse | |
| venenatis magnis sagittis condimentum condimentum. Nostra senectus urna | |
| tristique urna vel montes. Magna cubilia in nulla. Adipiscing | |
| elementum proin ac habitant nisi congue rutrum aliquam duis himenaeos. | |
| Conubia potenti sapien proin adipiscing potenti netus. Iaculis erat dolor | |
| montes lobortis rutrum mauris. Natoque justo praesent diam auctor. Etiam | |
| taciti curae; rutrum eros gravida eu arcu amet eget interdum. | |
| Blandit etiam senectus molestie posuere primis sed. |
lyraddigital
/ twitter.css
Created
August 13, 2019 08:00
Hiding tiles for the mobile view of Twitter.
This file contains 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
| #profile-tile { | |
| display: none; | |
| } | |
| #trending-tile { | |
| display: none; | |
| } | |
| #notice-tile { | |
| display: none; |
This file contains 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
| * { | |
| margin: 0; | |
| padding: 0; | |
| box-sizing: border-box; | |
| } | |
| html, body { | |
| height: 100%; | |
| } |
This file contains 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
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <title>Twitter Layout</title> | |
| <link rel="stylesheet" type="text/css" media="screen" href="twitter.css" /> | |
| </head> | |
| <body> | |
| <header> |
NewerOlder