454 lines
8.9 KiB
SCSS
454 lines
8.9 KiB
SCSS
@import "inc/bootstrap";
|
|
|
|
/*
|
|
* This program is free software; you can redistribute it and/or
|
|
* modify it under the terms of the GNU General Public License
|
|
* as published by the Free Software Foundation; under version 2
|
|
* of the License (non-upgradable).
|
|
*
|
|
* 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 GNU General Public License
|
|
* along with this program; if not, write to the Free Software
|
|
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
|
*
|
|
* Copyright (c) 2008-2010 (original work) Deutsche Institut für Internationale Pädagogische Forschung (under the project TAO-TRANSFER);
|
|
* 2009-2012 (update and modification) Public Research Centre Henri Tudor (under the project TAO-SUSTAIN & TAO-DEV);
|
|
*
|
|
*/
|
|
|
|
//@TODO in the long run all icons need to be changed to vectors!
|
|
|
|
.no-js {
|
|
.content-wrap, footer {
|
|
display:none;
|
|
}
|
|
}
|
|
|
|
html, body, .content-wrap, #footer {
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding : 0;
|
|
}
|
|
|
|
html {
|
|
height: 100%;
|
|
}
|
|
|
|
html body {
|
|
height: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
|
|
/* Main containers */
|
|
.container-title {
|
|
padding: 4px;
|
|
font-size: 1em;
|
|
}
|
|
|
|
.container-content {
|
|
font-size: 1em;
|
|
overflow-y: auto;
|
|
min-height: 200px;
|
|
max-height: 400px;
|
|
|
|
.elt-info {
|
|
display: block;
|
|
padding: 0 5px
|
|
}
|
|
}
|
|
|
|
#authoring-container {
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 600px;
|
|
}
|
|
|
|
.ext-home-container {
|
|
padding: 1%;
|
|
font-size: 1.1em;
|
|
}
|
|
|
|
.form-help {
|
|
display: block;
|
|
font-size: 10px;
|
|
margin: 5px 0 5px 30%;
|
|
font-style: italic;
|
|
}
|
|
|
|
|
|
|
|
/* Metadata */
|
|
#section-meta {
|
|
position: absolute;
|
|
bottom: 0%;
|
|
right: 0.25%;
|
|
width: 33%;
|
|
}
|
|
|
|
#meta-title {
|
|
padding: 3px;
|
|
}
|
|
|
|
#meta-content table {
|
|
border-collapse: collapse;
|
|
|
|
th, td {
|
|
border: solid 1px #ccc;
|
|
font-size: 0.9em;
|
|
color: #444;
|
|
padding: 3px;
|
|
margin: 0;
|
|
width: 20%;
|
|
}
|
|
|
|
td {
|
|
font-weight: normal;
|
|
}
|
|
|
|
.first {
|
|
width: 30%;
|
|
}
|
|
|
|
.last {
|
|
width: 50%;
|
|
}
|
|
}
|
|
|
|
/* Results Manual Scoring Conciliation */
|
|
#coding_scoreconcil {
|
|
#selectors {
|
|
width: 19.5%;
|
|
float: left;
|
|
}
|
|
|
|
#evalitems {
|
|
width: 80%;
|
|
float: right;
|
|
}
|
|
|
|
#navigation {
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
.containerDisplay {
|
|
border: 1px solid #999;
|
|
-webkit-border-radius: 4px;
|
|
-moz-border-radius: 4px;
|
|
border-radius: 4px;
|
|
margin-bottom: 10px;
|
|
position: relative;
|
|
|
|
& > .title {
|
|
border-bottom: 1px solid #999;
|
|
padding: 5px 7px;
|
|
font-weight: bold;
|
|
background-color: #ccc;
|
|
display: block;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.title a {
|
|
font-size: 10px;
|
|
}
|
|
}
|
|
|
|
ul.group-list, ul.group-list ul {
|
|
padding: 0;
|
|
margin: 0;
|
|
border: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
ul.group-list {
|
|
.group-title {
|
|
padding-left: 7px;
|
|
font-weight: bold;
|
|
|
|
&:hover {
|
|
background-color: #ddd;
|
|
}
|
|
}
|
|
|
|
li span.label, .group-title .title {
|
|
padding: 5px 0;
|
|
display: inline-block;
|
|
}
|
|
|
|
li span.selector, .group-title .selector {
|
|
width: 10%;
|
|
height: 26px;
|
|
vertical-align: top;
|
|
display: inline-block;
|
|
position: absolute;
|
|
right: 0;
|
|
}
|
|
|
|
li {
|
|
padding-left: 7px;
|
|
position: relative;
|
|
|
|
& > .checkable, .group-title > .checkable {
|
|
background-image: url(../img/checkbox.png);
|
|
}
|
|
|
|
span.has-inherited {
|
|
background-image: url(../img/checkbox_locked.png);
|
|
}
|
|
|
|
&.group, &.selectable {
|
|
list-style: none;
|
|
border-bottom: 1px solid #999;
|
|
}
|
|
|
|
ul.actions {
|
|
list-style: none;
|
|
display: inline-block;
|
|
min-width: 8px;
|
|
padding-right: 5px;
|
|
width: auto;
|
|
vertical-align: top;
|
|
|
|
li {
|
|
display: inline-block;
|
|
margin: 5px 0;
|
|
padding: 0;
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
}
|
|
|
|
&:last-child {
|
|
border-bottom: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
&:hover:not(.group) {
|
|
background-color: #ccc
|
|
}
|
|
|
|
&.selected {
|
|
background-color: #9f9;
|
|
|
|
&:hover {
|
|
background-color: #9c9;
|
|
}
|
|
}
|
|
|
|
.group-title {
|
|
background-color: rgb(240, 240, 240);
|
|
cursor: pointer;
|
|
}
|
|
|
|
span.title {
|
|
background-color: inherit;
|
|
}
|
|
|
|
&.expendable.closed {
|
|
margin-bottom: 1px;
|
|
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
ul {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
&.group {
|
|
padding: 0;
|
|
}
|
|
|
|
&.selectable {
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
.selector {
|
|
background-color: transparent;
|
|
background-repeat: no-repeat;
|
|
background-position: center center;
|
|
}
|
|
|
|
.has-access {
|
|
& > .selector, .group-title > .selector, &:hover > .selector, &:hover .group-title > .selector {
|
|
background-image: url(../img/checkbox_partial.png);
|
|
}
|
|
}
|
|
|
|
.has-allaccess {
|
|
& > .selector, .group-title > .selector, &:hover > .selector, &:hover .group-title > .selector {
|
|
background-image: url(../img/checkbox_checked.png);
|
|
}
|
|
}
|
|
|
|
.autoadd {
|
|
& > .selector, .group-title > .selector, &:hover > .selector, &:hover .group-title > .selector {
|
|
background-image: url(../img/autoadd.png);
|
|
}
|
|
|
|
&.checked {
|
|
& > .selector, .group-title > .selector, &:hover > .selector, &:hover .group-title > .selector {
|
|
background-image: url(../img/autoadd_checked.png);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.selector.checkable {
|
|
cursor: pointer
|
|
}
|
|
|
|
.group-title {
|
|
span.ui-icon {
|
|
display: inline-block;
|
|
position: relative;
|
|
top: 3px;
|
|
left: -2px;
|
|
}
|
|
|
|
&.open {
|
|
border-bottom: 1px solid #999;
|
|
}
|
|
|
|
.label {
|
|
font-size: 11px;
|
|
}
|
|
}
|
|
|
|
|
|
.tileBox {
|
|
margin-top: 20px;
|
|
margin-left: 20px;
|
|
float: left;
|
|
padding: 5px;
|
|
background-color: #efefef;
|
|
-moz-border-radius: 4px;
|
|
-webkit-border-radius: 4px;
|
|
border-radius: 4px;
|
|
width: 60%;
|
|
|
|
.boxHeader {
|
|
font-weight: bold;
|
|
margin: 10px;
|
|
}
|
|
|
|
.boxLogo {
|
|
float: left;
|
|
width: 30%;
|
|
height: 100%;
|
|
}
|
|
|
|
.boxContent {
|
|
float: left;
|
|
width: 70%;
|
|
height: 100%;
|
|
}
|
|
|
|
.button {
|
|
float: right;
|
|
margin-right: 5px;
|
|
margin-bottom: 5px;
|
|
padding: 5px;
|
|
cursor: pointer;
|
|
background-color: #aaa;
|
|
color: #fff;
|
|
border-width: 1px;
|
|
border-collapse: collapse;
|
|
-moz-border-radius: 3px;
|
|
-webkit-border-radius: 3px;
|
|
}
|
|
}
|
|
|
|
// TODO: move to tao-core-ui-fe
|
|
.secondary-props-list {
|
|
position: relative;
|
|
padding-left: 30px;
|
|
|
|
> li {
|
|
position: relative;
|
|
list-style-type: none;
|
|
margin-top: 10px;
|
|
|
|
&:first-child {
|
|
&::after {
|
|
top: -10px;
|
|
}
|
|
}
|
|
|
|
&:last-child {
|
|
&::after {
|
|
bottom: 50%;
|
|
}
|
|
}
|
|
|
|
&::marker {
|
|
color: #8C8C8C;
|
|
}
|
|
|
|
&::before {
|
|
content: '';
|
|
position: absolute;
|
|
border-top: 1px solid #8C8C8C;
|
|
top: 50%;
|
|
left: -26px;
|
|
width: 10px;
|
|
margin-top: -1px;
|
|
}
|
|
|
|
&::after {
|
|
content: '';
|
|
position: absolute;
|
|
border-left: 1px solid #8C8C8C;
|
|
bottom: -5px;
|
|
top: -5px;
|
|
left: -26px;
|
|
}
|
|
|
|
> div {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
flex-wrap: wrap;
|
|
|
|
&.disabled {
|
|
background: transparent!important;
|
|
}
|
|
|
|
&::before {
|
|
content: '';
|
|
width: 6px;
|
|
height: 6px;
|
|
border-radius: 50%;
|
|
border: 1px solid #8C8C8C;
|
|
position: absolute;
|
|
left: -16px;
|
|
}
|
|
|
|
label {
|
|
margin: 0;
|
|
}
|
|
|
|
select, .form_radlst {
|
|
width: calc(65% + 20px);
|
|
}
|
|
|
|
.form_desc {
|
|
width: calc(35% - 20px);
|
|
}
|
|
|
|
.form-error {
|
|
width: 100%;
|
|
}
|
|
}
|
|
}
|
|
}
|