Update assets/css/custom_style.css
Browse files- assets/css/custom_style.css +28 -28
assets/css/custom_style.css
CHANGED
@@ -14,53 +14,53 @@ header h2 { margin-top: .83em; }
|
|
14 |
|
15 |
#refusal-loss-formula .formula-list a { display: inline-block; width: 150px; margin: 0 20px; padding: 8px 10px; text-align: center; background: #DDD; cursor: pointer; text-decoration: none; color: #333; border-radius: 10px; user-select: none; transition-duration: 0.3s; }
|
16 |
|
17 |
-
#
|
18 |
|
19 |
input[type='radio'] { visibility: hidden; display: none; }
|
20 |
|
21 |
-
#
|
22 |
|
23 |
-
#
|
24 |
|
25 |
-
#refusal-loss-formula .formula-list a:hover, #
|
26 |
|
27 |
-
#
|
28 |
|
29 |
-
#
|
30 |
|
31 |
-
#
|
32 |
|
33 |
-
#
|
34 |
-
#
|
35 |
-
#
|
36 |
-
#
|
37 |
-
#
|
38 |
-
#
|
39 |
-
#
|
40 |
-
#
|
41 |
-
#
|
42 |
|
43 |
-
#
|
44 |
|
45 |
-
#
|
46 |
|
47 |
-
#
|
48 |
|
49 |
-
#
|
50 |
|
51 |
-
#
|
52 |
|
53 |
-
#
|
54 |
|
55 |
-
#
|
56 |
|
57 |
-
#
|
58 |
|
59 |
-
#
|
60 |
|
61 |
-
#
|
62 |
-
#
|
63 |
-
#
|
64 |
|
65 |
.warning-quote { padding: 15px; font-size: 0.8em; background-color: #f43636ba; color: white; margin-bottom: 15px; border-left: 5px solid #ff3030; transition-duration: 0.3s; }
|
66 |
|
|
|
14 |
|
15 |
#refusal-loss-formula .formula-list a { display: inline-block; width: 150px; margin: 0 20px; padding: 8px 10px; text-align: center; background: #DDD; cursor: pointer; text-decoration: none; color: #333; border-radius: 10px; user-select: none; transition-duration: 0.3s; }
|
16 |
|
17 |
+
#jailbreak-demo .radio-group { margin-right: 5px; }
|
18 |
|
19 |
input[type='radio'] { visibility: hidden; display: none; }
|
20 |
|
21 |
+
#jailbreak-demo .radio-group .option-label { font-size: 1em; cursor: pointer; position: relative; padding: 0.1em 0.6em; border: 1px solid #999; background: #FFF; border-radius: 0.2em; transition: 0.2s; }
|
22 |
|
23 |
+
#jailbreak-demo .radio-group .options:checked ~ .option-label { color: #FFF; background: #777; }
|
24 |
|
25 |
+
#refusal-loss-formula .formula-list a:hover, #jailbreak-demo #toolbox .calibrate-tool:hover { background: #555; color: #FFF; }
|
26 |
|
27 |
+
#jailbreak-demo #toolbox .options:checked ~ .calibrate-tool { color: #FFF; background: #555; }
|
28 |
|
29 |
+
#jailbreak-demo #toolbox .calibrate-tool { display: inline-block; width: 60%; margin: 2% auto 8%; padding: 8px 10px; text-align: center; background: #DDD; cursor: pointer; text-decoration: none; color: #333; border-radius: 10px; user-select: none; transition-duration: 0.3s; }
|
30 |
|
31 |
+
#jailbreak-demo .legend { text-align: center; width: 70%; margin: 0 auto; }
|
32 |
|
33 |
+
#jailbreak-demo .figure-option { text-align: center; width: 70%; margin: 4% auto 0; /* Customize the label (the container) */ /* Hide the browser's default checkbox */ /* Create a custom checkbox */ /* On mouse-over, add a grey background color */ /* When the checkbox is checked, add a blue background */ /* Create the checkmark/indicator (hidden when not checked) */ /* Show the checkmark when checked */ /* Style the checkmark/indicator */ }
|
34 |
+
#jailbreak-demo .figure-option .container { display: block; position: relative; padding-left: 35px; margin-bottom: 12px; cursor: pointer; font-size: 22px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
|
35 |
+
#jailbreak-demo .figure-option .container input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
|
36 |
+
#jailbreak-demo .figure-option .checkmark { position: absolute; top: 4px; left: 8px; height: 25px; width: 25px; background-color: #eee; }
|
37 |
+
#jailbreak-demo .figure-option .container:hover input ~ .checkmark { background-color: #ccc; }
|
38 |
+
#jailbreak-demo .figure-option .container input:checked ~ .checkmark { background-color: #9b9bff; }
|
39 |
+
#jailbreak-demo .figure-option .checkmark:after { content: ""; position: absolute; display: none; }
|
40 |
+
#jailbreak-demo .figure-option .container input:checked ~ .checkmark:after { display: block; }
|
41 |
+
#jailbreak-demo .figure-option .container .checkmark:after { left: 9px; top: 5px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
|
42 |
|
43 |
+
#jailbreak-demo .figure { margin: 0 auto; display: block; }
|
44 |
|
45 |
+
#jailbreak-demo .figure #original { display: none; }
|
46 |
|
47 |
+
#jailbreak-demo .figure img { user-drag: none; -webkit-user-drag: none; user-select: none; -khtml-user-drag: none; -moz-user-drag: none; -o-user-drag: none; pointer-events: none; position: relative; left: 35px; }
|
48 |
|
49 |
+
#jailbreak-demo .figure-caption { width: 240px; text-align: center; display: block; margin: 0 auto; padding: 10px 0 0; font-size: .8em; }
|
50 |
|
51 |
+
#jailbreak-demo .figure-caption ul { padding-left: 0; }
|
52 |
|
53 |
+
#jailbreak-demo .figure-caption ul li { list-style: none; }
|
54 |
|
55 |
+
#jailbreak-demo .figure-caption .model-prediction { font-weight: bold; }
|
56 |
|
57 |
+
#jailbreak-demo .figure-caption .correct { color: #009926; }
|
58 |
|
59 |
+
#jailbreak-demo .figure-caption .wrong { color: #e31327; }
|
60 |
|
61 |
+
#jailbreak-demo .calibration-error { display: inline-block; width: 60%; margin: 2% auto 8%; padding: 8px 10px; text-align: center; text-decoration: none; background: #DDD; color: #333; border-radius: 10px; user-select: none; }
|
62 |
+
#jailbreak-demo .calibration-error .calibration-metric { font-size: 0.75em; display: block; }
|
63 |
+
#jailbreak-demo .calibration-error .calibration-error-value { font-size: 1.5em; font-family: "sans-serif"; color: #820000; }
|
64 |
|
65 |
.warning-quote { padding: 15px; font-size: 0.8em; background-color: #f43636ba; color: white; margin-bottom: 15px; border-left: 5px solid #ff3030; transition-duration: 0.3s; }
|
66 |
|