Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
patorjk
GitHub Repository: patorjk/JavaScript-Snake
 Path: blob/main/src/css/light-snake.css
163 views
1
/*

2
JavaScript Snake

3
By Patrick Gillespie

4
http://patorjk.com/games/snake

5
*/

6


7
body {

8
  margin: 0px;

9
  padding: 0px;

10
  background-color: #f73378;

11
}

12
#game-area {

13
  margin: 10px;

14
  padding: 0px;

15
}

16


17
#mode-wrapper {

18
  color: #ffffff;

19
  font-family: Verdana, arial, helvetica, sans-serif;

20
  font-size: 14px;

21
}

22
#game-area:focus {

23
  outline: none;

24
}

25
a.snake-link,

26
a.snake-link:link,

27
a.snake-link:visited {

28
  color: #fcfc54;

29
}

30
a.snake-link:hover {

31
  color: #ffff54;

32
}

33
.snake-pause-screen {

34
  font-family: Verdana, arial, helvetica, sans-serif;

35
  font-size: 14px;

36
  position: absolute;

37
  width: 300px;

38
  height: 80px;

39
  text-align: center;

40
  top: 50%;

41
  left: 50%;

42
  margin-top: -40px;

43
  margin-left: -150px;

44
  display: none;

45
  background-color: black;

46
  color: white;

47
}

48
.snake-panel-component {

49
  position: absolute;

50
  font-family: Verdana, arial, helvetica, sans-serif;

51
  font-size: 14px;

52
  color: #ffffff;

53
  text-align: center;

54
  padding: 8px;

55
  margin: 0px;

56
}

57
.snake-snakebody-block {

58
  margin: 0px;

59
  padding: 0px;

60
  background-color: #ff0000;

61
  position: absolute;

62
  border: 0px solid #000080;

63
  background-repeat: no-repeat;

64
}

65
.snake-snakebody-alive {

66
  background-image: url("src/css/images/snakeblock.png");

67
}

68
.snake-snakebody-dead {

69
  background-image: url("src/css/images/deadblock.png");

70
}

71
.snake-food-block {

72
  margin: 0px;

73
  padding: 0px;

74
  background-color: #6cfd6a;

75
  border: 0px solid #000080;

76
  position: absolute;

77
}

78
.snake-playing-field {

79
  margin: 0px;

80
  padding: 0px;

81
  position: absolute;

82
  background-color: #ab003c;

83
  border: 0px solid #ab003c;

84
}

85
.snake-game-container {

86
  margin: 0px;

87
  padding: 0px;

88
  border-width: 0px;

89
  border-style: none;

90
  zoom: 1;

91
  position: relative;

92
}

93
.snake-welcome-dialog {

94
  padding: 8px;

95
  margin: 0px;

96
  background-color: #000000;

97
  color: #ffffff;

98
  font-family: Verdana, arial, helvetica, sans-serif;

99
  font-size: 14px;

100
  position: absolute;

101
  top: 50%;

102
  left: 50%;

103
  width: 300px;

104
  /*height: 150px;*/

105
  margin-top: -100px;

106
  margin-left: -158px;

107
  text-align: center;

108
  display: block;

109
}

110
.snake-try-again-dialog,

111
.snake-win-dialog {

112
  padding: 8px;

113
  margin: 0px;

114
  background-color: #000000;

115
  color: #ffffff;

116
  font-family: Verdana, arial, helvetica, sans-serif;

117
  font-size: 14px;

118
  position: absolute;

119
  top: 50%;

120
  left: 50%;

121
  width: 300px;

122
  height: 100px;

123
  margin-top: -75px;

124
  margin-left: -158px;

125
  text-align: center;

126
  display: none;

127
}

128


129