Spaces:
Running
Running
Update style/classical_style_template.css
Browse files
style/classical_style_template.css
CHANGED
@@ -102,20 +102,20 @@
|
|
102 |
/* Close button: far right */
|
103 |
.close-btn {
|
104 |
position: absolute;
|
105 |
-
top:
|
106 |
-
right:
|
107 |
}
|
108 |
/* Fullscreen button: immediately to the left */
|
109 |
.fullscreen-toggle {
|
110 |
position: absolute;
|
111 |
-
top:
|
112 |
-
right:
|
113 |
}
|
114 |
/* Reset camera button: immediately to the left of fullscreen */
|
115 |
.reset-camera-btn {
|
116 |
position: absolute;
|
117 |
-
top:
|
118 |
-
right:
|
119 |
}
|
120 |
|
121 |
/* Help button: positioned in the middle on the right side of the canvas */
|
@@ -123,23 +123,12 @@
|
|
123 |
position: absolute;
|
124 |
top: 50%;
|
125 |
right: 4px;
|
|
|
|
|
|
|
126 |
transform: translateY(-50%);
|
127 |
}
|
128 |
|
129 |
-
/* Button Icons via pseudo-elements; each icon appears only once */
|
130 |
-
.close-btn::before {
|
131 |
-
content: "✕";
|
132 |
-
}
|
133 |
-
.fullscreen-toggle::before {
|
134 |
-
content: "🗖";
|
135 |
-
}
|
136 |
-
.reset-camera-btn::before {
|
137 |
-
content: "⟲";
|
138 |
-
}
|
139 |
-
.help-toggle::before {
|
140 |
-
content: "?";
|
141 |
-
}
|
142 |
-
|
143 |
/* Hover effects */
|
144 |
.close-btn:hover {
|
145 |
background-color: #d32f2f;
|
|
|
102 |
/* Close button: far right */
|
103 |
.close-btn {
|
104 |
position: absolute;
|
105 |
+
top: 0px;
|
106 |
+
right: 0px;
|
107 |
}
|
108 |
/* Fullscreen button: immediately to the left */
|
109 |
.fullscreen-toggle {
|
110 |
position: absolute;
|
111 |
+
top: 0px;
|
112 |
+
right: 40px; /* 4px + 40px */
|
113 |
}
|
114 |
/* Reset camera button: immediately to the left of fullscreen */
|
115 |
.reset-camera-btn {
|
116 |
position: absolute;
|
117 |
+
top: 0px;
|
118 |
+
right: 80px; /* 4px + 40px + 40px */
|
119 |
}
|
120 |
|
121 |
/* Help button: positioned in the middle on the right side of the canvas */
|
|
|
123 |
position: absolute;
|
124 |
top: 50%;
|
125 |
right: 4px;
|
126 |
+
border-radius: 2;
|
127 |
+
width: 50px;
|
128 |
+
height: 40px;
|
129 |
transform: translateY(-50%);
|
130 |
}
|
131 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
132 |
/* Hover effects */
|
133 |
.close-btn:hover {
|
134 |
background-color: #d32f2f;
|