Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
titaniumnetwork-dev
GitHub Repository: titaniumnetwork-dev/Ludicrous
 Path: blob/main/styles/Global.module.css
1223 views
1
.game-div {

2
  position: absolute;

3
  z-index: 999999999999;

4
  top: 0;

5
  left: 0;

6
  width: 100vw;

7
  display: none;

8
  height: 100vh;

9
}

10


11
#game-header {

12
  width: calc(100vw - 60px);

13
  padding: 30px;

14
  border-bottom: 2px solid var(--text-color);

15
  background: var(--main-bg);

16
}

17


18
#game-frame {

19
  width: 100vw;

20
  height: calc(100vh - 81px);

21
  border: none;

22
  background: white;

23
  user-select: none;

24
  -webkit-user-select: none;

25
  -moz-user-select: none;

26
}

27


28
#frame-title {

29
  color: var(--text-color);

30
  font-size: 17px;

31
  width: 300px;

32
  overflow: hidden;

33
  white-space: nowrap;

34
}

35


36
#frame-title {

37
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 24px), transparent);

38
  mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 24px), transparent);

39
  display: inline-block;

40
  vertical-align: middle;

41
}

42


43
#frame-icon {

44
  background: url(/icon/globe.svg);

45
  display: inline-block;

46
  width: 24px;

47
  margin-right: 10px;

48
  height: 24px;

49
  filter: brightness(5000);

50
  vertical-align: middle;

51
}

52


53
#frame-reload {

54
  display: inline-flex;

55
  color: var(--text-color);

56
  align-items: center;

57
  padding: 5px;

58
  justify-content: center;

59
  width: 25px;

60
  height: 25px;

61
  float: right;

62
  transform: translateY(-10px);

63
  font-size: 23px;

64
  border: 2px solid var(--text-color);

65
  border-radius: 5px;

66
  background: rgb(255, 255, 255, 0.05);

67
  cursor: pointer;

68
  transition: 0.15s ease;

69
}

70


71
#frame-close {

72
  display: inline-flex;

73
  color: var(--text-color);

74
  align-items: center;

75
  padding: 5px;

76
  justify-content: center;

77
  width: 25px;

78
  height: 25px;

79
  float: right;

80
  transform: translateY(-10px);

81
  font-size: 20px;

82
  border: 2px solid var(--text-color);

83
  border-radius: 5px;

84
  background: rgb(255, 255, 255, 0.05);

85
  margin-left: 10px;

86
  cursor: pointer;

87
  transition: 0.15s ease;

88
}

89


90
#frame-full {

91
  display: inline-flex;

92
  color: var(--text-color);

93
  align-items: center;

94
  padding: 5px;

95
  justify-content: center;

96
  width: 25px;

97
  height: 25px;

98
  float: right;

99
  transform: translateY(-10px);

100
  font-size: 20px;

101
  border: 2px solid var(--text-color);

102
  border-radius: 5px;

103
  background: rgb(255, 255, 255, 0.05);

104
  margin-right: 10px;

105
  cursor: pointer;

106
  transition: 0.15s ease;

107
}

108


109
#frame-open {

110
  display: inline-flex;

111
  color: var(--text-color);

112
  align-items: center;

113
  padding: 5px;

114
  justify-content: center;

115
  width: 25px;

116
  height: 25px;

117
  float: right;

118
  transform: translateY(-10px);

119
  font-size: 20px;

120
  border: 2px solid var(--text-color);

121
  border-radius: 5px;

122
  background: rgb(255, 255, 255, 0.05);

123
  margin-right: 10px;

124
  cursor: pointer;

125
  transition: 0.15s ease;

126
}

127


128
#frame-close svg, #frame-reload svg, #frame-full svg, #frame-forward svg, #frame-back svg, #frame-open svg {

129
  transition: 0.3s ease;

130
}

131


132
#frame-close:hover svg, #frame-reload:hover svg, #frame-full:hover svg, #frame-forward:hover svg, #frame-back:hover svg, #frame-open:hover svg {

133
  transform: rotate(15deg);

134
}

135


136
#frame-close:hover, #frame-reload:hover, #frame-full:hover, #frame-forward:hover, #frame-back:hover, #frame-open:hover {

137
  background: rgb(255, 255, 255, 0.1);

138
}

139


140
#frame-forward, #frame-back {

141
  display: inline-flex;

142
  color: var(--text-color);

143
  align-items: center;

144
  padding: 5px;

145
  justify-content: center;

146
  width: 25px;

147
  height: 25px;

148
  float: right;

149
  transform: translateY(-10px);

150
  font-size: 20px;

151
  border: 2px solid var(--text-color);

152
  border-radius: 5px;

153
  background: rgb(255, 255, 255, 0.05);

154
  margin-right: 10px;

155
  cursor: pointer;

156
  transition: 0.15s ease;

157
}

158


159


160
#frame-forward {

161
  margin-right: 50px;

162
}

163