ortal1602 commited on
Commit
b591737
·
verified ·
1 Parent(s): b134646

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +70 -17
index.html CHANGED
@@ -5,27 +5,80 @@
5
  <title>AR vs FM Experiment Page</title>
6
  <link rel="stylesheet" href="style/bootstrap.min.css">
7
  <style>
8
- body {
9
- margin: 30px 80px;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
10
  }
11
- td, th {
12
- text-align: center;
13
- padding: 8px;
14
- border-bottom: 0.1px solid #aaa;
15
  }
16
- audio {
17
- width: 20vw;
18
- min-width: 100px;
19
- max-width: 250px;
20
  }
21
- .container {
22
- background: white;
23
- border-radius: 16px;
24
- padding: 30px;
25
- box-shadow: 0 4px 20px rgba(0,0,0,0.05);
26
- margin-bottom: 50px;
27
  }
28
- </style>
 
 
 
 
 
 
 
 
 
 
 
 
29
  </head>
30
  <body>
31
 
 
5
  <title>AR vs FM Experiment Page</title>
6
  <link rel="stylesheet" href="style/bootstrap.min.css">
7
  <style>
8
+ body {
9
+ margin: 0;
10
+ padding: 0;
11
+ font-family: system-ui, sans-serif;
12
+ background: #fafafa;
13
+ }
14
+
15
+ .container {
16
+ width: 100%;
17
+ max-width: 1200px;
18
+ margin: 30px auto;
19
+ padding: 30px;
20
+ background: white;
21
+ border-radius: 16px;
22
+ box-shadow: 0 4px 20px rgba(0,0,0,0.05);
23
+ overflow-x: auto;
24
+ }
25
+
26
+ table {
27
+ width: 100%;
28
+ border-collapse: separate;
29
+ border-spacing: 0 10px;
30
+ table-layout: fixed;
31
+ word-wrap: break-word;
32
+ }
33
+
34
+ th, td {
35
+ text-align: left;
36
+ padding: 10px;
37
+ border-bottom: 1px solid #ddd;
38
+ vertical-align: top;
39
+ word-break: break-word;
40
+ }
41
+
42
+ audio {
43
+ width: 100%;
44
+ max-width: 300px;
45
+ height: 32px;
46
+ }
47
+
48
+ @media (max-width: 768px) {
49
+ .container {
50
+ padding: 20px;
51
+ }
52
+
53
+ table, thead, tbody, th, td, tr {
54
+ display: block;
55
  }
56
+
57
+ thead {
58
+ display: none;
 
59
  }
60
+
61
+ tr {
62
+ margin-bottom: 20px;
63
+ border-bottom: 1px solid #eee;
64
  }
65
+
66
+ td {
67
+ padding-left: 0;
 
 
 
68
  }
69
+
70
+ td::before {
71
+ content: attr(data-label);
72
+ font-weight: bold;
73
+ display: block;
74
+ margin-bottom: 5px;
75
+ }
76
+
77
+ audio {
78
+ width: 100%;
79
+ }
80
+ }
81
+ </style>
82
  </head>
83
  <body>
84