1
1

images.scss 983 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. #mainPage.mobile .contentImage {
  2. height: 10ex; // It's a good idea to make these smaller on mobile.
  3. }
  4. .contentImage {
  5. background-size: contain;
  6. background-repeat: no-repeat;
  7. background-position: center center;
  8. height: 25ex; // size in ex guarantees the image will look about the same size on every screen
  9. &:hover {
  10. cursor: pointer;
  11. &:active {
  12. opacity: 0.7;
  13. }
  14. }
  15. }
  16. #imageViewer {
  17. display: none;
  18. background-size: contain;
  19. background-repeat: no-repeat;
  20. background-position: center center;
  21. height: 100%;
  22. width: 100%;
  23. position: fixed;
  24. z-index: 1000000;
  25. top: 0px;
  26. left: 0px;
  27. margin: 0px;
  28. background-color: rgba(0,0,0,.8);
  29. &:hover {
  30. cursor: pointer;
  31. }
  32. }
  33. .image001 {
  34. &.contentImage {
  35. // define height for content image
  36. height: 3em;
  37. }
  38. //background-image: inline-image("001.png");
  39. background-image: url("https://i.imgur.com/EvUe1bv.png");
  40. }
  41. .introLogo {
  42. background-image: inline-image("IntroLogo.svg");
  43. }