Webbserverprogrammering 1

Show sourcecode

The following files exists in this folder. Click to view.

webbsrvprg/

bilder/
comments.php
exercises/
exercises.php
gya/
img/
incl/
index-no-include.php
index.css
index.js
index.php
indexOld.php
ovningar/
source.php
style/
viewsource.php

index.css

137 lines ASCII Windows (CRLF)
html, body {
  min-height: 100%;
}

#cursorBlade, #cursorBlade * {
  cursor: url("bilder/blade.png") -30 0, auto;
}

#cursorKrokodil, #cursorKrokodil * {
  cursor: url("bilder/krokodilCursor.png") 0 10, auto;
}

#cursorHeterochromia, #cursorHeterochromia * {
  cursor: url("bilder/heterochromia.png") 47 64, auto;
}

body {
  background-color: #111;
  font-family: 'Courier New', Courier, monospace;
  margin: 0;
}

header {
  position: fixed;
  top: 0;
  width: 100vw;
  background-color: black;
  font-size: 1.8em;
}

#titleLink {
  color: red;
  text-decoration: none;
  font-weight: bold;
}

.webLink {
  color: red;
  text-decoration: none;
  padding: 0 1vw 0 1vw;
  float: right;
  text-align: center;
}

.webLink:hover {
  background-color: #101010;
}

main {
  position: relative;
  z-index: 10;
}

@keyframes loadFlex {
  0% {
    width: 0;
  }
  100% {
    width: 25vw; 
  }
}

@keyframes linkHover {
  0% {
    width: 25vw;
  }
  100% {
    width: 40vw; 
  }
}

#flex {
  margin-top: 10vh;
  flex-direction: column;
  display: flex;
  flex-wrap: wrap;
}

.flexLink {
  display: none;
  text-wrap: nowrap;
  animation: loadFlex 1s;
  margin: 1vh 0;
  padding: 0 1vw;
  width: 25vw;
  background-image: linear-gradient(to right, red, #111); 
  color: #111;
  text-decoration: none;
  line-height: 2.5em;
  font-size: 2em;
  transition: 0.2s;
}

.flexLink:hover {
  background-image: linear-gradient(to right, magenta, #111); 
  width: 40vw;
}

@keyframes startScreen {
  0% {
    top: 50vh;
    right: 30vw;
    width: 0;
    height: 0;
  }
  30% {
    top: 50vh;
    right: 5vw;
    width: 50vw;
    height: 0;
  }
  100% {
    top: 10vh;
    width: 50vw;
    height: 80vh;
  }
}

#slides {
  animation: startScreen 0.5s forwards;
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  right: 5vw;
  top: 10vh;
  width: 50vw;
  height: 80vh;
  border-radius: 20px;
  border: 5px solid #D11;
  background-image: radial-gradient(#616, #111);
}

.slide {
  display: none;
  position: relative;
}