http/client/main.css

/*
 This file is part of Deliantra clientV.

 Copyright (©) 2017 Marek Olszewski <m.olszewski@wit.edu.pl>

 Deliantra clientV is free software: you can redistribute it and/or
 modify it under the terms of the Affero GNU General Public License as
 published by the Free Software Foundation, either version 3 of the
 License, or (at your option) any later version.

 This program is distributed in the hope that it will be useful,
 but WITHOUT ANY WARRANTY; without even the implied warranty of
 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 GNU General Public License for more details.

 You should have received a copy of the Affero GNU General Public Licens
 and the GNU General Public License along with this program. If not, see
 <http://www.gnu.org/licenses/>.

 The authors can be reached via e-mail to <support@deliantra.net>
*/
body, html {
    background-image: url(img/background.png);
}
body, html {
    margin: 0;
    padding: 0;
    background-color: black;
    color: white;    
    height: 100%;
    overflow: hidden;
}

body, html, * {
    margin: 0;
    padding: 0;
    background-color: black;
    color: white;        
}


div.windowContainer {
    position: absolute;
    border: 14px groove white;
    cursor: pointer;
    
}

div.windowContainer div.titlebar {
    width: 100%;
    color: gold;    
    font: 17px monospace;
    text-align: center;
    border-bottom: 7px solid white;
    background-color: grey;
    text-align: center;
}

div.windowContainer div:first-child {
    
}

div.windowContainer div.dragHandle {
    color: gold;
    font: 17px monospace;
    width: 20px;
    heigth: 20px;
    border: 7px solid black;
    background-color: black;
    float: right;
}


div#channels {
    overflow: hidden;
}

div#channels div:last-child {
    overflow: auto;
    height: 150px;
    width: 99%;
}

div#hidden {
    position:absolute;
    left: -10000px;
    top: -10000px;
}

div#channels table {
    border: 0;
    width: 100%;
    color: white;
    font: 14px monospace;
    font-weight: bold;
}
.inputbox, div#channels input [type='text'] {
    margin-top: 5px;
    background: solid red;
    background-color: white;
    color: black;
    border: 1px solid red;
    width: 90%;
}

div#channels div input  {
    margin: 5px;
    display: inline block;
}

div#channels table.chat td:nth-child(1) {
    font-size: small;
    width: 80px;
    color: red;
    vertical-align: top;
}

table.login {
    width: 100%;
}

div#loginContainer table {
    margin-bottom: 20px;
}

div#loginContainer table tr:last td {
    width:100%;
    text-align: center;
}

div#loginContainer input {
    border: 1px solid gold;
    background-color: grey;
    width: 150px;
}
div#loginContainer {
    text-align: center;
}

div#loginContainer h3, div#loginContainer h1 {
    width: 100%;
    text-align: center;
    color: gold;
}

/* look and feel of bars */


.hpBar {
    left: 70px;
    top: 300px;
    background-color: orange;
    color: red;
    width: 250px;
    height: 20px;
}

.manaBar {
    left: 110px;
    top: 300px;
    background-color: lightblue;
    color: blueviolet;
    width: 250px;
    height: 20px;
}

.foodBar {
    left: 150px;
    top: 300px;
    background-color: lightgreen;
    color: greenyellow;
    width: 250px;
    height: 20px;
}
/* windows */


.mapWindow {
    left: 0px;
    top: 40px;
    width: 800px;
    height: 800px;
}

.barsWindow {
    left: 745px;
    top: 402px;
    width: 240px;
    height: 340px;
}

.messagesWindow {
    left: 745px;
    top: 40px;
    width: 510px;
    height: 246px;
}

.floorWindow {
    left: 1035px;
    top: 401px;
    width: 0;
    height: 0;
}

.containerWindow {  
    left: 750px;
    top: 402px;
    width: 0;
    height: 0;
}

.skillsWindow {
    left: 754px;
    top: 40px;
    width:0;
    height:0;
}

/* fancy bubble */

div.bubble {
    border-radius: 25px;
    height: 30px;
    width: auto;
    position: absolute;
    border: 4px solid blue;
    background: solid;
    background-color: white;
    color: black;
    font-size: small;
    padding: 5px;
    padding-top: 19px;
}

div.bubble strong {
    font-size: large;
    padding: 5px;
    background-color: blue;
    border-radius: 15px;
}

/* CONTEXT MENU */

div.contextMenuItem {
    height: 20px;
    width: 100%;
    padding-top: 3px;
    padding-bottom: 3px;
    font: small;
    background-color: grey;
    color: black;
    text-align: center;
}

div.contextMenuItem:hover {
    background-color: gold;
    color: red;
    text-decoration: underline;
}
Revision:	1.17
Committed:	Thu Jan 12 23:38:56 2017 UTC (9 years, 9 months ago) by sf-demisephi
Content type:	text/css
Branch:	MAIN
Changes since 1.16:	+30 -1 lines
Log Message:	context menu on floorbox and inventory item on double mouse click
#	User	Rev	Content
1	root	1.1	/*
2			This file is part of Deliantra clientV.
3
4			Copyright (©) 2017 Marek Olszewski <m.olszewski@wit.edu.pl>
5
6			Deliantra clientV is free software: you can redistribute it and/or
7			modify it under the terms of the Affero GNU General Public License as
8			published by the Free Software Foundation, either version 3 of the
9			License, or (at your option) any later version.
10
11			This program is distributed in the hope that it will be useful,
12			but WITHOUT ANY WARRANTY; without even the implied warranty of
13			MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
14			GNU General Public License for more details.
15
16			You should have received a copy of the Affero GNU General Public Licens
17			and the GNU General Public License along with this program. If not, see
18			<http://www.gnu.org/licenses/>.
19
20			The authors can be reached via e-mail to <support@deliantra.net>
21			*/
22	root	1.6	body, html {
23	root	1.10	background-image: url(img/background.png);
24	root	1.1	}
25	sf-demisephi	1.17	body, html {
26	root	1.6	margin: 0;
27			padding: 0;
28			background-color: black;
29	sf-demisephi	1.11	color: white;
30	sf-demisephi	1.17	height: 100%;
31			overflow: hidden;
32	root	1.1	}
33
34	sf-demisephi	1.17	body, html, * {
35			margin: 0;
36			padding: 0;
37			background-color: black;
38			color: white;
39			}
40
41
42	sf-demisephi	1.12	div.windowContainer {
43	root	1.6	position: absolute;
44	sf-demisephi	1.7	border: 14px groove white;
45	sf-demisephi	1.11	cursor: pointer;
46	sf-demisephi	1.12
47	root	1.1	}
48
49	sf-demisephi	1.12	div.windowContainer div.titlebar {
50	sf-demisephi	1.11	width: 100%;
51			color: gold;
52			font: 17px monospace;
53	sf-demisephi	1.12	text-align: center;
54	sf-demisephi	1.11	border-bottom: 7px solid white;
55			background-color: grey;
56			text-align: center;
57			}
58
59	sf-demisephi	1.12	div.windowContainer div:first-child {
60
61			}
62
63			div.windowContainer div.dragHandle {
64			color: gold;
65			font: 17px monospace;
66			width: 20px;
67			heigth: 20px;
68			border: 7px solid black;
69			background-color: black;
70			float: right;
71	root	1.1	}
72
73	sf-demisephi	1.12
74	root	1.6	div#channels {
75			overflow: hidden;
76	root	1.1	}
77
78	sf-demisephi	1.11	div#channels div:last-child {
79	sf-demisephi	1.8	overflow: auto;
80			height: 150px;
81	sf-demisephi	1.9	width: 99%;
82	sf-demisephi	1.8	}
83
84			div#hidden {
85			position:absolute;
86			left: -10000px;
87			top: -10000px;
88			}
89
90	root	1.1	div#channels table {
91			border: 0;
92	sf-demisephi	1.9	width: 100%;
93	root	1.1	color: white;
94			font: 14px monospace;
95			font-weight: bold;
96			}
97	sf-demisephi	1.15	.inputbox, div#channels input [type='text'] {
98	sf-demisephi	1.13	margin-top: 5px;
99	root	1.1	background: solid red;
100			background-color: white;
101			color: black;
102			border: 1px solid red;
103			width: 90%;
104			}
105
106	sf-demisephi	1.15	div#channels div input {
107	sf-demisephi	1.13	margin: 5px;
108			display: inline block;
109			}
110
111	root	1.1	div#channels table.chat td:nth-child(1) {
112			font-size: small;
113			width: 80px;
114			color: red;
115			vertical-align: top;
116			}
117
118	root	1.6	table.login {
119			width: 100%;
120	root	1.1	}
121
122			div#loginContainer table {
123			margin-bottom: 20px;
124			}
125
126			div#loginContainer table tr:last td {
127			width:100%;
128			text-align: center;
129			}
130
131			div#loginContainer input {
132			border: 1px solid gold;
133			background-color: grey;
134			width: 150px;
135			}
136			div#loginContainer {
137			text-align: center;
138			}
139
140	root	1.6	div#loginContainer h3, div#loginContainer h1 {
141	root	1.1	width: 100%;
142			text-align: center;
143			color: gold;
144	root	1.2	}
145	root	1.6
146	sf-demisephi	1.15	/* look and feel of bars */
147
148
149	sf-demisephi	1.14	.hpBar {
150			left: 70px;
151			top: 300px;
152			background-color: orange;
153			color: red;
154			width: 250px;
155			height: 20px;
156			}
157
158			.manaBar {
159			left: 110px;
160			top: 300px;
161			background-color: lightblue;
162			color: blueviolet;
163			width: 250px;
164			height: 20px;
165			}
166
167			.foodBar {
168			left: 150px;
169			top: 300px;
170			background-color: lightgreen;
171			color: greenyellow;
172			width: 250px;
173			height: 20px;
174			}
175	sf-demisephi	1.15	/* windows */
176
177	sf-demisephi	1.14
178			.mapWindow {
179			left: 0px;
180			top: 40px;
181			width: 800px;
182			height: 800px;
183			}
184
185			.barsWindow {
186			left: 745px;
187			top: 402px;
188			width: 240px;
189			height: 340px;
190			}
191
192			.messagesWindow {
193			left: 745px;
194			top: 40px;
195			width: 510px;
196			height: 246px;
197			}
198
199			.floorWindow {
200			left: 1035px;
201			top: 401px;
202			width: 0;
203			height: 0;
204			}
205
206			.containerWindow {
207			left: 750px;
208			top: 402px;
209			width: 0;
210			height: 0;
211			}
212
213			.skillsWindow {
214			left: 754px;
215			top: 40px;
216			width:0;
217			height:0;
218	sf-demisephi	1.15	}
219
220			/* fancy bubble */
221
222			div.bubble {
223			border-radius: 25px;
224			height: 30px;
225			width: auto;
226			position: absolute;
227			border: 4px solid blue;
228			background: solid;
229			background-color: white;
230			color: black;
231			font-size: small;
232			padding: 5px;
233	sf-demisephi	1.16	padding-top: 19px;
234			}
235
236			div.bubble strong {
237			font-size: large;
238			padding: 5px;
239			background-color: blue;
240			border-radius: 15px;
241	sf-demisephi	1.17	}
242
243			/* CONTEXT MENU */
244
245			div.contextMenuItem {
246			height: 20px;
247			width: 100%;
248			padding-top: 3px;
249			padding-bottom: 3px;
250			font: small;
251			background-color: grey;
252			color: black;
253			text-align: center;
254			}
255
256			div.contextMenuItem:hover {
257			background-color: gold;
258			color: red;
259			text-decoration: underline;
260	sf-demisephi	1.14	}