WheelOfPorn

The Wheel of Porn from Family Guy (Season 13 Episode 9) programmed in react.
git clone git://git.oshgnacknak.de/WheelOfPorn.git
Log | Files | Refs | README

index.css (1565B)

      1 body {
      2   margin: 0;
      3   padding: 0;
      4   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
      5     'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
      6     sans-serif;
      7   -webkit-font-smoothing: antialiased;
      8   -moz-osx-font-smoothing: grayscale;
      9     background: black;
     10     color: white;
     11     overflow-x: hidden;
     12     text-align: center;
     13 }
     14 
     15 code {
     16   font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
     17     monospace;
     18 }
     19 
     20 .app {
     21     width: 100%;
     22     height: 100%;
     23 }
     24 
     25 .arrow {
     26     width:0px;
     27     height:0px;
     28 
     29     position: absolute;
     30     transform: translate(-50%);
     31     top: 0;
     32     left: 50%;
     33 
     34     border-right:15px solid transparent;
     35     border-top:60px solid gray;
     36     border-left:15px solid transparent;
     37 }
     38 
     39 .spinner {
     40     width: 60vmin;
     41     height: 60vmin;
     42 
     43     position: absolute;
     44     top: 40px;
     45     left: 50%;
     46 
     47     transform-origin: 50% 50%;
     48     background: darkgray;
     49     padding: 5px;
     50     border-radius: 50%;
     51 }
     52 
     53 .spinner-container {
     54     height: 67vmin;
     55     min-height: 500px;
     56 }
     57 
     58 img.wop {
     59     width: auto;
     60     height: 30vh;
     61     margin: 0 auto;
     62     display: block;
     63 }
     64 
     65 .winner ul {
     66     padding: 0;
     67     list-style: none;
     68     display: flex;
     69     flex-direction: row;
     70     flex-wrap: wrap;
     71     align-items: center;
     72     justify-content: center;
     73 }
     74 
     75 .winner li a {
     76     font-size: 32px;
     77     margin: 20px;
     78     border: 15px solid darkgrey;
     79     display: inline-block;
     80     background: darkgrey;
     81     border-radius: 15px;
     82 }
     83 
     84 .winner li a img {
     85     position: relative;
     86     margin-right: 30px;
     87     width: 32px;
     88     height: 32px; 
     89 }