diff --git a/README.md b/README.md index 679bef0..08857c0 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,8 @@ +``` +I completed the challenge: 2 +I feel good about my code: 2 +I was only able to get the initial set up but will work on JS over the next couple of days +``` # 🎰 #100Devs Project: Slot Machine ### Goal: Build a Simple Slot Machine diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..95af6d0 --- /dev/null +++ b/css/style.css @@ -0,0 +1,89 @@ +/****************************************** +/* CSS +/*******************************************/ + +/* Box Model Hack */ +*{ + box-sizing: border-box; + } + + /****************************************** + /* LAYOUT + /*******************************************/ + body { + margin-top: 60px; +} + +.slotwrapper { + overflow: hidden; + display: inline-block; + border: 1px solid #000; + height: 200px; +} +.slotwrapper ul { + padding: 0; + margin: 0; + list-style: none; + position: relative; + float: left; +} +.slotwrapper ul { + width: 200px; + height:200px; + font-size: 200px; + line-height: 200px; + text-align: center; +} +.slotwrapper ul li img { + vertical-align: top; +} +@media screen and (max-width: 1200px) { + .slotwrapper { + width: 100%; + } + .slotwrapper ul { + width: 33%; + } +} +@media screen and (max-width: 768px) { + .slotwrapper { + height: 100px; + } + .slotwrapper ul { + height:100px; + font-size: 100px; + line-height: 100px; + } +} + +/* Example 10 override slotwrapper */ +#example10 { + height: 150px; +} +#example10 ul { + width: 150px; + height:150px; + font-size: 150px; + line-height: 150px; +} +@media screen and (max-width: 1200px) { + #example10 ul { + width: 18%; + } +} +@media screen and (max-width: 768px) { + #example10 { + height: 100px; + } + #example10 ul { + height:100px; + font-size: 100px; + line-height: 100px; + } +} + + + /****************************************** + /* ADDITIONAL STYLES + /*******************************************/ + \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..35e201e --- /dev/null +++ b/index.html @@ -0,0 +1,64 @@ + + + + + + + + API | Slot Machine + + + + + + +

Slot Machine

+ +
+
+
+
    +
  • 1
    • +
  • 2
    • +
  • 3
    • +
  • 4
    • +
  • 5
    • +
  • 6
    • +
  • 7
    • +
+
    +
  • 1
    • +
  • 2
    • +
  • 3
    • +
  • 4
    • +
  • 5
    • +
  • 6
    • +
  • 7
    • +
+
    +
  • 1
    • +
  • 2
    • +
  • 3
    • +
  • 4
    • +
  • 5
    • +
  • 6
    • +
  • 7
    • +
+
+
+ + +
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..e69de29