Spaces:
Paused
Paused
| <head> | |
| <!-- <script src="jquery-3.3.1.min.js"></script> --> | |
| <script | |
| src="https://code.jquery.com/jquery-3.4.1.slim.min.js" | |
| integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" | |
| crossorigin="anonymous" | |
| ></script> | |
| <script | |
| src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" | |
| integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" | |
| crossorigin="anonymous" | |
| ></script> | |
| <script | |
| src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" | |
| integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" | |
| crossorigin="anonymous" | |
| ></script> | |
| <link | |
| rel="stylesheet" | |
| href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" | |
| integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" | |
| crossorigin="anonymous" | |
| /> | |
| <link rel="stylesheet" href="/static/styles/emphasis.css" /> | |
| <script | |
| src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" | |
| integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" | |
| crossorigin="anonymous" | |
| ></script> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <meta http-equiv="content-type" content="text/html;charset=UTF-8" /> | |
| <style> | |
| * { | |
| box-sizing: border-box; | |
| } | |
| .row { | |
| display: flex; | |
| flex-direction: column; | |
| } | |
| /* border:1px solid black; | |
| border-radius: 5px; */ | |
| /* Create two equal columns that sits next to each other */ | |
| .column { | |
| flex: 50%; | |
| padding: 15px; | |
| } | |
| .instance { | |
| border: 1px solid #070707; | |
| background-color: cccccc; | |
| border-radius: 5px; | |
| padding: 15px; | |
| display: block; | |
| justify-content: center; | |
| width: fit-content; | |
| max-width: 80%; | |
| text-align: left; | |
| margin: 0 auto; | |
| font-size: 15pt; | |
| } | |
| .instance p { | |
| font-weight: bold; | |
| display: block; | |
| } | |
| .annotation_schema { | |
| padding: 5px; | |
| display: flex; | |
| justify-content: center; | |
| width: 80%; | |
| text-align: left; | |
| margin: 0 auto; | |
| } | |
| fieldset { | |
| border: 1px solid #160085; | |
| background-color: cccccc; | |
| padding: 10px 15px 10px 15px; | |
| } | |
| legend { | |
| color: black; | |
| } | |
| input[type="text"] { | |
| -webkit-box-sizing: border-box; | |
| -moz-box-sizing: border-box; | |
| box-sizing: border-box; | |
| width: 100%; | |
| } | |
| input { | |
| margin: 5px; | |
| } | |
| .likert li { | |
| float: left; | |
| list-style-type: none; | |
| } | |
| /* The sidepanel menu */ | |
| .sidepanel { | |
| min-height: 250px; /* Specify a height */ | |
| width: 0; /* 0 width - change this with JavaScript */ | |
| position: fixed; /* Stay in place */ | |
| z-index: 1; /* Stay on top */ | |
| top: 95px; | |
| left: 1px; | |
| background-color: #111; /* Black*/ | |
| overflow-x: hidden; /* Disable horizontal scroll */ | |
| padding-top: 10px; /* Place content 60px from the top */ | |
| padding-bottom: 20px; | |
| transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */ | |
| } | |
| /* The sidepanel links */ | |
| .sidepanel a { | |
| padding: 8px 8px 8px 32px; | |
| text-decoration: none; | |
| font-size: 55px; | |
| color: #ffffff; /* #818181; */ | |
| display: block; | |
| transition: 0.3s; | |
| } | |
| /* When you mouse over the navigation links, change their color */ | |
| .sidepanel a:hover { | |
| color: #f1f1f1; | |
| } | |
| /* When you mouse over the navigation links, change their color */ | |
| .sidepanel table { | |
| color: #ffffff; | |
| font-size: 20px; | |
| /*padding: 8px 8px 18px 62px;*/ | |
| margin-left: 20px; | |
| margin-top: 10px; | |
| border-spacing: 10px; | |
| } | |
| .sidepanel td, | |
| th { | |
| color: #ffffff; | |
| padding: 5px; | |
| } | |
| .sidepanel tr:nth-child(even) { | |
| background-color: #333333; | |
| } | |
| /* Position and style the close button (top right corner) */ | |
| .sidepanel .closebtn { | |
| position: absolute; | |
| top: 0; | |
| right: 25px; | |
| font-size: 36px; | |
| margin-left: 50px; | |
| } | |
| /* Style the button that is used to open the sidepanel */ | |
| .openbtn { | |
| cursor: pointer; | |
| /* | |
| font-size: 20px; | |
| background-color: #111; | |
| color: white; | |
| padding: 10px 15px; | |
| border: none;*/ | |
| } | |
| .openbtn:hover { | |
| background-color: #444; | |
| } | |
| /* The instructions */ | |
| .instructions { | |
| /* width: 0; */ /* 0 width - change this with JavaScript */ | |
| transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */ | |
| overflow-y: hidden; /* Disable horizontal scroll */ | |
| border: 1px solid #070707; | |
| background-color: cccccc; | |
| border-radius: 5px; | |
| padding: 15px; | |
| display: block; | |
| justify-content: center; | |
| width: fit-content; | |
| max-width: 80%; | |
| text-align: left; | |
| margin: 0 auto; | |
| font-size: 14pt; | |
| } | |
| /* Position and style the close button (top right corner) */ | |
| .instructions .closebtn { | |
| position: absolute; | |
| top: 0; | |
| right: 25px; | |
| font-size: 36px; | |
| margin-left: 50px; | |
| } | |
| /* Style the button that is used to open the sidepanel */ | |
| .instructions .openbtn { | |
| cursor: pointer; | |
| /* | |
| font-size: 20px; | |
| background-color: #111; | |
| color: white; | |
| padding: 10px 15px; | |
| border: none;*/ | |
| } | |
| .span_container { | |
| border-width: 3px; | |
| border-style: solid; | |
| border: 2px solid black; | |
| position: relative; | |
| border-radius: 5px; | |
| padding: 2px 5px; | |
| background-color: pink; | |
| } | |
| .span_label { | |
| position: absolute; | |
| top: -12px; | |
| left: 5px; | |
| font-size: 7px; | |
| padding: 1px 1px; | |
| border-radius: 3px; | |
| background-color: pink; | |
| border: 2px solid red; | |
| text-align: center; | |
| } | |
| .span_close { | |
| position: absolute; | |
| top: -7px; | |
| right: -7px; | |
| width: 14px; | |
| height: 14px; | |
| font-size: 7px; | |
| padding: 2px 2px; | |
| border-radius: 50%; | |
| background-color: gray; | |
| border: 2px solid black; | |
| text-align: center; | |
| font: 7pt Arial, sans-serif; | |
| } | |
| </style> | |
| </head> | |