Skip to content
Snippets Groups Projects
Select Git revision
  • 7a8461a8fd31abe930f961c1ac56f6930a5da9f6
  • master default protected
  • v0.11
  • v0.10
  • v0.9
  • v0.8
  • v0.7
7 results

README.md

Blame
    • Code owners
    Assign users and groups as approvers for specific file changes. Learn more.
    index.php 7.42 KiB 
    <!DOCTYPE HTML>
<html lang="de">
<head>
  <meta charset="UTF-8">

  <title>Matchconceptions Memory Game</title>

  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <section class="memory-game">
    <div class="memory-card" data-framework="A">
      <?php $text = 'A'; $style = 'background-color: #FFCCCB; text-align: center;'; $width = 640 * 0.25 - 10; $height = 640 * 0.33333 - 10; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='$width' height='$height'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/aurelia.svg" alt="Aurelia" style="background-color: #FFCCCB"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>
    <div class="memory-card" data-framework="A">
    <?php $text = 'A'; $style = 'background-color: #90EE90; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='50%' height='10%'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/aurelia.svg" alt="Aurelia" style="background-color: #90EE90"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>

    <div class="memory-card" data-framework="B">
      <?php $text = 'B'; $style = 'background-color: #FFCCCB; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/vue.svg" alt="Vue" style="background-color: #FFCCCB"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>
    <div class="memory-card" data-framework="B">
      <?php $text = 'B'; $style = 'background-color: #90EE90; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/vue.svg" alt="Vue" style="background-color: #90EE90"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>

    <div class="memory-card" data-framework="C">
      <?php $text = 'C'; $style = 'background-color: #FFCCCB; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/angular.svg" alt="Angular" style="background-color: #FFCCCB"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>
    <div class="memory-card" data-framework="C">
      <?php $text = 'C'; $style = 'background-color: #90EE90; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/angular.svg" alt="Angular" style="background-color: #90EE90"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>

    <div class="memory-card" data-framework="D">
      <?php $text = 'D'; $style = 'background-color: #FFCCCB; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/ember.svg" alt="Ember" style="background-color: #FFCCCB"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>
    <div class="memory-card" data-framework="D">
      <?php $text = 'D'; $style = 'background-color: #90EE90; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/ember.svg" alt="Ember" style="background-color: #90EE90"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>

    <div class="memory-card" data-framework="E">
      <?php $text = 'E'; $style = 'background-color: #FFCCCB; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/backbone.svg" alt="Backbone" style="background-color: #FFCCCB"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>
    <div class="memory-card" data-framework="E">
      <?php $text = 'E'; $style = 'background-color: #90EE90; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/backbone.svg" alt="Backbone" style="background-color: #90EE90"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>

    <div class="memory-card" data-framework="F">
      <?php $text = 'F'; $style = 'background-color: #FFCCCB; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/react.svg" alt="React" style="background-color: #FFCCCB"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
        </div>
    <div class="memory-card" data-framework="F">
      <?php $text = 'F'; $style = 'background-color: #90EE90; text-align: center;'; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='100' height='50'><text x='10' y='30'>$text</text></svg>"; $svgData = base64_encode($svg); $src = "data:image/svg+xml;base64,$svgData"; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?>
      <!-- <img class="front-face" src="img/react.svg" alt="React" style="background-color: #90EE90"/> -->
      <img class="back-face" src="img/js-badge.svg" alt="" />
    </div>
  </section>

  <script src="scripts.js"></script>

  <!--- From https://marina-ferreira.github.io/tutorials/js/memory-game/ --->
</body>
</html>