diff --git a/css/swad18.80.css b/css/swad18.80.css new file mode 100644 index 000000000..9803e505d --- /dev/null +++ b/css/swad18.80.css @@ -0,0 +1,3585 @@ +/* swad_desktop.css:style-sheet for desktop layout of SWAD */ + +/* + SWAD (Shared Workspace At a Distance), + is a web platform developed at the University of Granada (Spain), + and used to support university teaching. + + This file is part of SWAD core. + Copyright (C) 1999-2019 Antonio Caņas Vargas + + This program is free software: you can redistribute it and/or modify + it under the terms of the GNU Affero General 3 License as + published by the Free Software Foundation,either version 3 of the + License,or (at your option) any later version. + + 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 Affero General Public License for more details. + + You should have received a copy of the GNU Affero General Public License + along with this program. If not,see . +*/ +/********************************* Body **************************************/ +body + { + margin:0; + background-color:white; + font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; + font-size:1em; + overflow-y:scroll; /* force vertical scrollbar */ + } +input + { + font-size:12pt; + } +select + { + font-size:12pt; + } +textarea + { + font-size:13pt; + font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; + } +table + { + box-sizing:border-box; + border-width:0; + border-style:none; + border-spacing:0; + } +table th + { + box-sizing:border-box; + padding:0; + color:#4D88A1; + font-weight:bold; + } +table td + { + box-sizing:border-box; + padding:0; + } +img + { + border-width:0; + border-style:none; + } +form + { + display:inline; + margin:0; + } +address + { + font-style: normal; + } + +/*********************** Text decoration of links ****************************/ +a + { + color:#4D88A1; + } +a:link, a:visited, a:active + { + text-decoration:none; + } +a:hover /* Default ==> underlined */ + { + text-decoration:underline; + } +.TAB_OFF a, .TAB_ON a, .MENU_LIST_ITEM a /* Tabs and menus are the exceptions */ + { + text-decoration:none; + } + +/****************** Layout (the whole page with a background) ****************/ +#whole_page + { + display:table; + box-sizing:border-box; + width:100%; + /* + background-color:black; + background-image:url('/swad/background.jpg'); + background-repeat:no-repeat; + background-size:100%; + */ + } + +/************************* Layout (first heading row) ************************/ +#head_row_1 + { + display:table; + box-sizing:border-box; + width:100%; + height:40px; + } +.HEAD_ROW_1_WHITE + { + background-color:black; + } +.HEAD_ROW_1_GREY + { + background-image:-webkit-linear-gradient(#383838 0,#404040 100%); /* Safari */ + background-image:linear-gradient(#383838 0,#404040 100%); + background-repeat:no-repeat; + } +.HEAD_ROW_1_PURPLE + { + background-image:-webkit-linear-gradient(#812b5a 0,#874c80 100%); /* Safari */ + background-image:linear-gradient(#812b5a, #874c80 100%); + background-repeat:no-repeat; + } +.HEAD_ROW_1_BLUE + { + background-color:#3781c1; + } +.HEAD_ROW_1_YELLOW + { + background-image:-webkit-linear-gradient(#292229 0,#302830 100%); /* Safari */ + background-image:linear-gradient(#292229 0,#302830 100%); + background-repeat:no-repeat; + } +.HEAD_ROW_1_PINK + { + background-image:-webkit-linear-gradient(#bf667f 0,#c86b85 100%); /* Safari */ + background-image:linear-gradient(#bf667f 0,#c86b85 100%); + background-repeat:no-repeat; + } +.HEAD_ROW_1_PINK + { + background-image:-webkit-linear-gradient(#8e5e8f 0,#ab5c84 100%); /* Safari */ + background-image:linear-gradient(#8e5e8f 0,#ab5c84 100%); + background-repeat:no-repeat; + } + +#head_row_1_left + { + display:table-cell; + text-align:left; + vertical-align:middle; + } +@media only screen and (max-width: 1024px) + { /* For mobile-phones */ + #head_row_1_logo_small + { + display:inline-block; + } + #head_row_1_logo_big + { + display:none; + } + #head_row_1_tagline + { + display:none; + } + } +@media only screen and (min-width: 1024px) + { /* For tablets and desktop */ + #head_row_1_logo_small + { + display:none; + } + #head_row_1_logo_big + { + display:inline-block; + } + #head_row_1_tagline + { + display:inline-block; + box-sizing:border-box; + padding:0 4px; + font-size:11pt; + font-weight:bold; + line-height:110%; + white-space:nowrap; + text-align:left; + vertical-align:middle; + } + } +.TAGLINE_WHITE {color:#b0b0b0;} +.TAGLINE_GREY {color:#e0e0e0;} +.TAGLINE_PURPLE {color:#e0e0e0;} +.TAGLINE_BLUE {color:#bad2da;} +.TAGLINE_YELLOW {color:#b3b0b3;} +.TAGLINE_PINK {color:#e8e8e8;} + +#head_row_1_search + { + display:inline-block; + padding:0 10px; + } +@media only screen and (max-width: 1280px) + { /* For mobile phones and tablets */ + #head_search_text + { + display:none; + } + } + +@media only screen and (max-width: 480px) + { /* For mobile phones */ + .SEL_ROLE {width:55px;} + .HEAD_USR + { + display:inline-block; + box-sizing:border-box; + max-width:200px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + } +@media only screen and (min-width: 480px) + { /* For mobile phones */ + .SEL_ROLE {width:130px;} + .HEAD_USR + { + display:inline-block; + box-sizing:border-box; + max-width:320px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + } +.USR_WHITE {color:#b0b0b0; font-size:15pt; font-weight:bold; white-space:nowrap;} +.USR_GREY {color:#e0e0e0; font-size:15pt; font-weight:bold; white-space:nowrap;} +.USR_PURPLE {color:#e0e0e0; font-size:15pt; font-weight:bold; white-space:nowrap;} +.USR_BLUE {color:white; font-size:15pt; font-weight:bold; white-space:nowrap;} +.USR_YELLOW {color:#b3b0b3; font-size:15pt; font-weight:bold; white-space:nowrap;} +.USR_PINK {color:white; font-size:15pt; font-weight:bold; white-space:nowrap;} + +#head_row_1_right + { + display:table-cell; + text-align:right; + vertical-align:middle; + } +#login_box + { + display:inline; + padding:0 10px; + } + +/************************ Layout (second heading row) ************************/ +#head_row_2 + { + display:table; + box-sizing:border-box; + width:100%; + vertical-align:top; + } +.HEAD_ROW_2_WHITE + { + background-image:-webkit-linear-gradient(#cfcfce 0,white 40px,white 100%); /* Safari */ + background-image:linear-gradient(#cfcfce 0,white 40px,white 100%); + } +.HEAD_ROW_2_GREY + { + background-color:#404040; + } +.HEAD_ROW_2_PURPLE + { + background-image:-webkit-linear-gradient(#874c80 0,#a070a1 100%); /* Safari */ + background-image:linear-gradient(#874c80 0,#a070a1 100%); + background-repeat:no-repeat; + } +.HEAD_ROW_2_BLUE + { + background-image:-webkit-linear-gradient(#3781c1 0,#4f90c8 100%); /* Safari */ + background-image:linear-gradient(#3781c1 0,#4f90c8 100%); + background-repeat:no-repeat; + } +.HEAD_ROW_2_YELLOW + { + background-color:#302830; + } +.HEAD_ROW_2_PINK + { + background-image:-webkit-linear-gradient(#ab5c84 0,#c86b85 100%); /* Safari */ + background-image:linear-gradient(#ab5c84 0,#c86b85 100%); + background-repeat:no-repeat; + } + +/******************************* Current time ********************************/ +#head_row_2_time + { + display:table-cell; + box-sizing:border-box; + width:160px; + text-align:center; + vertical-align:middle; + } +#current_date + { + box-sizing:border-box; + background-color:rgba(255, 255, 255, 0.8); + width:80px; + margin-left:6px; + border-radius:4px; + box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 2px 1px -2px rgba(0,0,0,0.2), 0 1px 5px 0 rgba(0,0,0,0.12); + } +#current_month + { + border-radius:4px 4px 0 0; + background-color:rgba(222, 33, 33, 0.8); + color:white; + font-size:10pt; + font-weight:bold; + white-space:nowrap; + overflow:hidden; + } +.CURRENT_MONTH + { + color:white; + } +#current_day + { + color:#606060; + margin:2px 0 -2px 0; + font-size:20pt; + font-weight:bold; + line-height:100%; + } +.CURRENT_DAY + { + color:#606060; + } +#current_time + { + border-radius:0 0 4px 4px; + color:#606060; + font-size:12pt; + font-weight:bold; + } + +@media only screen and (max-width: 1024px) + { /* For mobile phones */ + #head_row_2_time + { + display:none; + } + } + +/****** Breadcrumb (platform/country/institution/centre/degree/course) *******/ +#head_row_2_hierarchy + { + display:table-cell; + text-align:center; + vertical-align:middle; + } +.TOP_LOGO /* Institution / Centre / Degree logo in top title */ + { + height:40px; + margin-right:10px; + text-align:left; + vertical-align:top !important; + } +@media only screen and (max-width: 480px) + { /* For mobile-phones */ + #breadcrumb + { + display:table; + margin:0 auto; + font-size:6pt; + font-weight:bold; + white-space:nowrap; + } + .BC + { + display:table-cell; + max-width:28px; + overflow:hidden; + } + } +@media only screen and (min-width: 480px) and (max-width: 800px) + { /* For mobile-phones */ + #breadcrumb + { + display:table; + margin:0 auto; + font-size:8pt; + font-weight:bold; + white-space:nowrap; + } + .BC + { + display:table-cell; + max-width:60px; + overflow:hidden; + } + } +@media only screen and (min-width: 800px) and (max-width: 1024px) + { /* For tablets */ + #breadcrumb + { + display:table; + margin:0 auto; + font-size:10pt; + font-weight:bold; + white-space:nowrap; + } + .BC + { + display:table-cell; + max-width:100px; + overflow:hidden; + } + } +@media only screen and (min-width: 1024px) + { /* For desktop */ + #breadcrumb + { + display:table; + margin:0 auto; + font-size:12pt; + font-weight:bold; + white-space:nowrap; + } + .BC + { + display:table-cell; + max-width:150px; + overflow:hidden; + } + } + +.BC_SEMIOFF {opacity:0.7;} +.BC_OFF {opacity:0.3;} + +.BC_WHITE {color:#707070;} +.BC_GREY {color:#ffb42e;} +.BC_PURPLE {color:#ffc040;} +.BC_BLUE {color:#ffc040;} +.BC_YELLOW {color:#ffb42e;} +.BC_PINK {color:#ffc040;} + +.BC_ICON + { + display:inline-block; + width:20px; + height:20px; + vertical-align:middle; + margin:-1px 0 1px 0; + } + +/******** Big name of country, institution, centre, degree or course *********/ +#main_title + { + margin:0; + padding:0; + font-size:24pt; + font-weight:normal; + line-height:100%; + white-space:nowrap; + } +#big_name_container + { + display:inline-block; + } +@media only screen and (max-width: 1024px) + { /* For mobile-phones */ + #big_short_name + { + display:table-cell; + max-width:560px; + height:40px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + margin:0 auto; + vertical-align:middle; + } + #big_full_name + { + display:none; + } + } +@media only screen and (min-width: 1024px) + { /* For tablets and desktop */ + #big_short_name + { + display:none; + } + #big_full_name + { + display:table-cell; + max-width:899px; + height:40px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + margin:0 auto; + vertical-align:middle; + } + } +.MAIN_TITLE_WHITE {color:#4d88a1;} +.MAIN_TITLE_GREY {color:#f7f6f5;} +.MAIN_TITLE_PURPLE {color:white;} +.MAIN_TITLE_BLUE {color:white;} +.MAIN_TITLE_YELLOW {color:white;} +.MAIN_TITLE_PINK {color:white;} +#my_courses + { + width:130px; + margin:1px; + } + +/***************************** Notifications *********************************/ +#msg /* Notifications, used for AJAX based refresh */ + { + display:table-cell; + box-sizing:border-box; + width:160px; + text-align:center; + vertical-align:top; + padding-top:10px; + } +@media only screen and (max-width: 1024px) + { /* For mobile phones */ + #msg + { + display:none; + } + } +@media only screen and (min-width: 1024px) and (max-width: 1280px) + { /* For tablets */ + #notif_all + { + display:none; + } + } +.NOTIF_WHITE {color:#707070; font-size:12pt; white-space:nowrap;} +.NOTIF_GREY {color:#e0e0e0; font-size:12pt; white-space:nowrap;} +.NOTIF_PURPLE {color:#e0e0e0; font-size:12pt; white-space:nowrap;} +.NOTIF_BLUE {color:white; font-size:12pt; white-space:nowrap;} +.NOTIF_YELLOW {color:#b3b0b3; font-size:12pt; white-space:nowrap;} +.NOTIF_PINK {color:white; font-size:12pt; white-space:nowrap;} + +/******************* Layout (third heading row with tabs) ********************/ +.HEAD_ROW_3_WHITE + { + background-color:white; + } +.HEAD_ROW_3_GREY + { + background-image:-webkit-linear-gradient(#404040 0,#404040 54px,white 54px,white 100%); /* Safari */ + background-image:linear-gradient(#404040 0,#404040 54px,white 54px,white 100%); + } +.HEAD_ROW_3_PURPLE + { + background-image:-webkit-linear-gradient(#a070a1 0,#a070a1 54px,white 54px,white 100%); /* Safari */ + background-image:linear-gradient(#a070a1 0,#a070a1 54px,white 54px,white 100%); + } +.HEAD_ROW_3_BLUE + { + background-image:-webkit-linear-gradient(#4f90c8 0,#4f90c8 54px,white 54px,white 100%); /* Safari */ + background-image:linear-gradient(#4f90c8 0,#4f90c8 54px,white 54px,white 100%); + } +.HEAD_ROW_3_YELLOW + { + background-image:-webkit-linear-gradient(#302830 0,#302830 54px,white 54px,white 100%); /* Safari */ + background-image:linear-gradient(#302830 0,#302830 54px,white 54px,white 100%); + } +.HEAD_ROW_3_PINK + { + background-image:-webkit-linear-gradient(#c86b85 0,#c86b85 54px,white 54px,white 100%); /* Safari */ + background-image:linear-gradient(#c86b85 0,#c86b85 54px,white 54px,white 100%); + } +@media only screen and (max-width: 480px) + { /* For mobile-phones */ + #tabs + { + display:table; + box-sizing:border-box; + margin:0 auto; + border-spacing:1px 0; + } + .TAB_OFF + { + display:table-cell; + box-sizing:border-box; + width:38px; + height:60px; + margin:0; + padding:0; + border-radius:4px 4px 0 0; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + vertical-align:top; + overflow:hidden; + } + .TAB_ON + { + display:table-cell; + box-sizing:border-box; + width:38px; + height:60px; + margin:0; + padding:0; + border-radius:4px 4px 0 0; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + vertical-align:top; + overflow:hidden; + } + .TAB_TXT + { + font-size:9pt; + font-weight:bold; + line-height:100%; + max-width:30px; + white-space:nowrap; + overflow:hidden; + margin:0 auto; + text-transform:uppercase; + } + } +@media only screen and (min-width: 480px) and (max-width: 800px) + { /* For mobile-phones */ + #tabs + { + display:table; + box-sizing:border-box; + margin:0 auto; + border-spacing:1px 0; + } + .TAB_OFF + { + display:table-cell; + box-sizing:border-box; + width:58px; + height:60px; + margin:0; + padding:0; + border-radius:4px 4px 0 0; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + vertical-align:top; + overflow:hidden; + } + .TAB_ON + { + display:table-cell; + box-sizing:border-box; + width:58px; + height:60px; + margin:0; + padding:0; + border-radius:4px 4px 0 0; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + vertical-align:top; + overflow:hidden; + } + .TAB_TXT + { + font-size:9pt; + font-weight:bold; + line-height:100%; + max-width:50px; + white-space:nowrap; + overflow:hidden; + margin:0 auto; + text-transform:uppercase; + } + } +@media only screen and (min-width: 800px) + { /* For tablets and desktop */ + #tabs + { + display:table; + box-sizing:border-box; + margin:0 auto; + border-spacing:1px 0; + } + .TAB_OFF + { + display:table-cell; + box-sizing:border-box; + width:98px; + height:60px; + margin:0; + padding:0; + border-radius:4px 4px 0 0; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + vertical-align:top; + overflow:hidden; + } + .TAB_ON + { + display:table-cell; + box-sizing:border-box; + width:98px; + height:60px; + margin:0; + padding:0; + border-radius:4px 4px 0 0; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + vertical-align:top; + overflow:hidden; + } + .TAB_TXT + { + font-size:9pt; + font-weight:bold; + line-height:100%; + max-width:90px; + white-space:nowrap; + overflow:hidden; + margin:0 auto; + text-transform:uppercase; + } + } + +.TAB_ON_WHITE {background-color:#f7f6f5;} +.TAB_ON_GREY {background-color:#f7f6f5;} +.TAB_ON_PURPLE {background-color:#fdf3f3;} +.TAB_ON_BLUE {background-color:#e8f3f6;} +.TAB_ON_YELLOW {background-color:#faf0da;} +.TAB_ON_PINK {background-color:#faf0e8;} + +.TAB_OFF_WHITE {background-color:#d4d4d4;} +.TAB_OFF_GREY {background-color:#aea79f;} +.TAB_OFF_PURPLE {background-color:#f2dada;} +.TAB_OFF_BLUE {background-color:#cae1e8;} +.TAB_OFF_YELLOW {background-color:#f4dfb2;} +.TAB_OFF_PINK {background-color:#f3dcca;} + +.TAB_OFF_TXT_WHITE {color:#707070;} +.TAB_OFF_TXT_GREY {color:#505050;} +.TAB_OFF_TXT_PURPLE {color:#505050;} +.TAB_OFF_TXT_BLUE {color:#365e6e;} +.TAB_OFF_TXT_YELLOW {color:#4a2e19;} +.TAB_OFF_TXT_PINK {color:#505050;} + +.TAB_ON_TXT_WHITE {color:#4d88A1;} +.TAB_ON_TXT_GREY {color:#606060;} +.TAB_ON_TXT_PURPLE {color:#573c4d;} +.TAB_ON_TXT_BLUE {color:#4d88A1;} +.TAB_ON_TXT_YELLOW {color:#7c4d2a;} +.TAB_ON_TXT_PINK {color:#63474e;} + +.TAB_ICO + { + height:32px; + vertical-align:middle; + margin-top:2px; + padding:2px 0; + } + +/*********************** Layout (fourth row, main zone) **********************/ +#main_zone + { + display:table; + box-sizing:border-box; + width:100%; + } +.LEFT_RIGHT_CELL + { + padding:0 6px 6px 6px; + text-align:center; + vertical-align:top; + } + +@media only screen and (max-width: 1280px) + { /* For mobile phones and tablets */ + #main_zone_central_none, #main_zone_central_left, #main_zone_central_right, #main_zone_central_both + { + display:table-cell; + text-align:center; + vertical-align:top; + } + #left_col + { + display:none; + } + #right_col + { + display:none; + } + } +@media only screen and (min-width: 1280px) + { /* For desktop */ + #main_zone_central_none /* Hide left and right columns */ + { + display:table-cell; + text-align:center; + vertical-align:top; + } + #main_zone_central_left /* Show left column, hide right column */ + { + display:table-cell; + text-align:center; + vertical-align:top; + } + #main_zone_central_right /* Hide left column, show right column */ + { + display:table-cell; + text-align:center; + vertical-align:top; + padding-right:160px; + } + #main_zone_central_both /* Show both columns */ + { + display:table-cell; + text-align:center; + vertical-align:top; + padding-right:160px; + } + #left_col + { + display:table-cell; + box-sizing:border-box; + width:160px; + text-align:center; + vertical-align:top; + } + #right_col + { + display:table-cell; + box-sizing:border-box; + width:160px; + text-align:center; + vertical-align:top; + position:absolute; + right:0; + } + } + +@media only screen and (max-width: 800px) + { /* For mobile-phones */ + #main_zone_central_container + { + box-sizing:border-box; + margin:-6px 0 0 0; + padding:4px 0; + border-radius:4px; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + vertical-align:top; + position:relative; + } + } +@media only screen and (min-width: 800px) + { /* For tablets and desktop */ + #main_zone_central_container + { + box-sizing:border-box; + min-height:900px; + margin:-6px 0 0 0; + padding:4px 0; + border-radius:4px; + box-shadow:inset 0 -1px 1px 0 rgba(50,50,50,0.2); + text-align:center; + vertical-align:top; + position:relative; + } + } + +/************* Main central zone with horizontal menu and canvas *************/ +#main_horizontal + { + box-sizing:border-box; + width:100%; + } +#main_horizontal .MENU_LIST_CONTAINER + { + width:100%; + } +#main_horizontal .MENU_LIST + { + display:table; + box-sizing:border-box; + height:60px; + margin:0 auto; + padding:0 8px; + list-style-type:none; + } +#main_horizontal .MENU_LIST_ITEM + { + display:table-cell; + width:128px; + height:60px; + margin:0 auto; + text-align:center; + vertical-align:middle; + } +#main_horizontal .MENU_OPT_OFF + { + opacity:0.7; + } +#main_horizontal .MENU_OPT_OFF:hover, #main_horizontal .MENU_OPT_ON + { + opacity:1; + transform:scale(1.286,1.286); + } +/* +#main_horizontal .MENU_ICO + { + box-sizing:border-box; + padding:28px 0 0 0; + background-size:28px 28px; + background-repeat:no-repeat; + background-position:center top; + } +*/ +#main_horizontal .MENU_ICO + { + box-sizing:border-box; + padding:28px 0 0 0; + background-size:auto 28px; + background-repeat:no-repeat; + background-position:center top; + } +#main_horizontal .MAIN_ZONE_CANVAS /* Where content for each action is written */ + { + box-sizing:border-box; + width:100%; + padding:4px 8px; + margin:0 auto; + text-align:left; + vertical-align:top; + } + +/************** Main central zone with vertical menu and canvas **************/ +@media only screen and (max-width: 1024px) + { /* For mobile phones */ + /* Mobile phone will display menu always in horizontal + so the CSS must draw menu really in horizontal */ + #main_vertical + { + box-sizing:border-box; + width:100%; + } + #main_vertical .MENU_LIST_CONTAINER + { + width:100%; + } + #main_vertical .MENU_LIST + { + display:table; + box-sizing:border-box; + height:60px; + margin:0 auto; + padding:0 8px; + list-style-type:none; + } + #main_vertical .MENU_LIST_ITEM + { + display:table-cell; + width:128px; + height:60px; + margin:0 auto; + text-align:center; + vertical-align:middle; + } + #main_vertical .MENU_OPT_OFF + { + opacity:0.7; + } + #main_vertical .MENU_OPT_OFF:hover, #main_vertical .MENU_OPT_ON + { + opacity:1; + transform:scale(1.286,1.286); + } + /* + #main_vertical .MENU_ICO + { + box-sizing:border-box; + padding:28px 0 0 0; + background-size:28px 28px; + background-repeat:no-repeat; + background-position:center top; + } + */ + #main_vertical .MENU_ICO + { + box-sizing:border-box; + padding:28px 0 0 0; + background-size:auto 28px; + background-repeat:no-repeat; + background-position:center top; + } + #main_vertical .MAIN_ZONE_CANVAS /* Where content for each action is written */ + { + box-sizing:border-box; + width:100%; + padding:4px 8px; + margin:0 auto; + text-align:left; + vertical-align:top; + } + #action_title /* Do not display action title */ + { + display:none; + } + } + +@media only screen and (min-width: 1024px) + { /* For tablets and desktop */ + #main_vertical + { + display:table; + box-sizing:border-box; + width:100%; + } + #main_vertical .MENU_LIST_CONTAINER + { + display:table-cell; + box-sizing:border-box; + width:170px; + } + #main_vertical .MENU_LIST + { + display:table; + margin:0; + padding-left:8px; + list-style-type:none; + } + #main_vertical .MENU_LIST_ITEM + { + text-align:left; + } + #main_vertical .MENU_OPT_OFF + { + opacity:0.7; + } + #main_vertical .MENU_OPT_OFF:hover, #main_vertical .MENU_OPT_ON + { + opacity:1; + } + #main_vertical .MENU_ICO + { + display:table-cell; + box-sizing:border-box; + height:44px; + vertical-align:middle; + padding:2px 2px 2px 46px; + background-size:32px 32px; + background-repeat:no-repeat; + background-position:4px 6px; + } + #main_vertical .MAIN_ZONE_CANVAS /* Where content for each action is written */ + { + display:table-cell; + box-sizing:border-box; + padding:4px 8px; + margin:0 auto; + text-align:left; + vertical-align:top; + } + #action_title + { + box-sizing:border-box; + width:440px; + min-height:64px; + clear:both; + margin:0 auto; + text-align:left; + background-size:60px 60px; + background-position:0 0; + background-repeat:no-repeat; + padding:4px 0 8px 70px; + overflow:hidden; + } + } + +/********************************* Menu fonts ********************************/ +@media only screen and (max-width: 800px) + { /* For mobile-phones */ + .MENU_TEXT + { + font-size:12pt; + font-weight:bold; + line-height:110%; + white-space:nowrap; + overflow:hidden; + width:30px; + margin:0 auto; + } + } +@media only screen and (min-width: 800px) + { /* For tablets and desktop */ + .MENU_TEXT + { + font-size:12pt; + font-weight:bold; + line-height:110%; + margin:0 auto; + } + } + +.MENU_TXT_WHITE {color:#4D88a1;} +.MENU_TXT_GREY {color:#606060;} +.MENU_TXT_PURPLE {color:#573c4d;} +.MENU_TXT_BLUE {color:#4D88a1;} +.MENU_TXT_YELLOW {color:#7c4d2a;} +.MENU_TXT_PINK {color:#63474e;} + +/****************** Title of current action in main block ********************/ +.TITLE_ACTION_WHITE {color:#606060; font-size:20pt;} +.TITLE_ACTION_GREY {color:#606060; font-size:20pt;} +.TITLE_ACTION_PURPLE {color:#573c4d; font-size:20pt;} +.TITLE_ACTION_BLUE {color:#4D88A1; font-size:20pt;} +.TITLE_ACTION_YELLOW {color:#7c4d2a; font-size:20pt;} +.TITLE_ACTION_PINK {color:#63474e; font-size:20pt;} + +.SUBTITLE_ACTION_WHITE {color:#606060; font-size:12pt;} +.SUBTITLE_ACTION_GREY {color:#606060; font-size:12pt;} +.SUBTITLE_ACTION_PURPLE {color:#573c4d; font-size:12pt;} +.SUBTITLE_ACTION_BLUE {color:#4D88A1; font-size:12pt;} +.SUBTITLE_ACTION_YELLOW {color:#7c4d2a; font-size:12pt;} +.SUBTITLE_ACTION_PINK {color:#63474e; font-size:12pt;} + +/***************************** Users connected *******************************/ +.CONNECTED + { + box-sizing:border-box; + margin:0 auto; + background:white; + border-style:solid; + border-width:1px; + border-color:#80C040; + padding:5px; + border-radius:4px; + font-size:12pt; + color:#398000; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.CONNECTED_LIST + { + box-sizing:border-box; + width:100%; + margin-top:2px; + padding-top:2px; + border-style:solid; + border-width:1px 0 0 0; + border-color:#BFDF9F; + white-space:nowrap; + overflow:hidden; + } +.CONNECTED_TXT + { + color:#398000; + font-size:12pt; + } +.CON_USR_NARROW_TIT + { + max-width:136px; + text-align:center; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/* Connected to the current course? */ +.CON_NO_CRS {color:#B8D070; font-size:11pt; line-height:110%; white-space:nowrap;} +.CON_CRS {color:#398000; font-size:11pt; line-height:110%; white-space:nowrap;} + +/* 1st. column */ +.CON_PHOTO + { + width:22px; + text-align:left; + vertical-align:middle; + } + +/* 2nd. column */ +.CON_NAME_NARROW + { + width:66px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.CON_NAME_FOLLOW + { + width:90px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.CON_NAME_WIDE + { + width:360px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/* 3rd. column */ +.CON_SINCE + { + width:48px; + text-align:right; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + } +.CON_ICON_FOLLOW + { + width:24px; + vertical-align:middle; + } + +/*************************** Most frequent actions ***************************/ +#MFU_actions + { + box-sizing:border-box; + width:148px; + margin:0; + background:white; + border-style:solid; + border-width:1px; + border-color:#8CBCCE; + padding:5px; + border-radius:4px; + font-size:11pt; + color:#4D88A1; + } +#MFU_actions ul + { + box-sizing:border-box; + width:138px; + margin-top:2px; + padding-top:2px; + border-style:solid; + border-width:1px 0 0 0; + border-color:#DDECF1; + } +#MFU_actions li + { + width:138px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +#MFU_actions img + { + width:20px; + height:20px; + margin:1px; + vertical-align:middle; + } + +#MFU_actions_big + { + padding:5px; + } +#MFU_actions_big img + { + width:40px; + height:40px; + margin:1px 4px 1px 0; + vertical-align:middle; + } + +/*********************************** Month ***********************************/ +.MONTH_CONTAINER + { + box-sizing:border-box; + width:148px; + margin:0; + padding:5px; + background:white; + border-style:solid; + border-width:1px; + border-color:#8CBCCE; + border-radius:4px; + text-align:center; + overflow:hidden; + } +.MONTH_TABLE_DAYS + { + box-sizing:border-box; + width:138px; + margin-top:2px; + padding-top:2px; + border-style:solid; + border-width:1px 0 0 0; + border-color:#DDECF1; + } +.MONTH + { + color:#4D88A1; + font-size:9pt; + white-space:nowrap; + text-transform:uppercase; + } +.DAY_WRK_HEAD + { + color:#4D88A1; + font-size:9pt; + text-align:center; + } +.DAY_NO_WRK_HEAD + { + color:red; + font-size:9pt; + text-align:center; + } +.DAY_WRK + { + color:#202020; + font-size:9pt; + text-align:center; + } +.DAY_NO_WORK + { + color:#C04080; + font-size:9pt; + text-align:center; + } +.DAY_HLD + { + color:red; + font-size:9pt; + text-align:center; + } +.DAY_WRK_LIGHT + { + color:#E0E0E0; + font-size:9pt; + text-align:center; + } +.DAY_NO_WORK_LIGHT + { + color:#FFE0FF; + font-size:9pt; + text-align:center; + } +.DAY_HLD_LIGHT + { + color:#FFE0E0; + font-size:9pt; + text-align:center; + } +.DAY + { + border:solid 1px; + border-color:white; + text-align:center; + } +.TODAY + { + border:solid 1px; + border-color:#50B800; + text-align:center; + } +.DAY_EVENT + { + border:solid 1px; + border-color:white; + background-color:#FFF080; + text-align:center; + } +.TODAY_EVENT + { + border:solid 1px; + border-color:#50B800; + background-color:#FFF080; + text-align:center; + } + +/********************************* Buttons ***********************************/ +.BT_CREATE + { + background-color:#5BC33B; + border:1px solid #518741; + } +.BT_CONFIRM + { + background-color:#55ACEE; + border:1px solid #3B88C3; + } +.BT_REMOVE + { + background-color:#EF5555; + border:1px solid #C33B3B; + } +.BT_SUBMIT + { + margin:8px auto; + padding:10px 20px; + border-radius:4px; + box-shadow:0 1px 0 rgba(255,255,255,0.15) inset; + color:white; + font-size:20px; + font-weight:bold; + line-height:normal; + white-space:nowrap; + } +.BT_SUBMIT_INLINE + { + box-sizing:border-box; + min-width:170px; + margin:0 10px; + padding:2px 4px; + border-radius:4px; + box-shadow:0 1px 0 rgba(255,255,255,0.15) inset; + color:white; + font-size:15px; + font-weight:bold; + line-height:normal; + white-space:nowrap; + vertical-align:middle; + } +.BT_SUBMIT:hover + { + background-image:-webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2)); /* Safari */ + background-image:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2)); + } +.BT_SUBMIT_INLINE:hover + { + background-image:-webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2)); /* Safari */ + background-image:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.2)); + } + +/********************************** Notice ***********************************/ +.NOTICE_CONTAINER_ACTIVE + { + box-sizing:border-box; + margin:0 auto 10px auto; + padding:10px; + background-image:-webkit-linear-gradient(rgba(238,216,108,0.8) 0%,rgba(248,237,149,0.8) 15%,rgba(250,240,152,0.8) 100%); /* Safari */ + background-image:linear-gradient(rgba(238,216,108,0.8) 0%,rgba(248,237,149,0.8) 15%,rgba(250,240,152,0.8) 100%); + box-shadow:0 8px 10px -5px rgba(125,113,0,0.8); + text-align:left; + overflow:hidden; + } +.NOTICE_CONTAINER_OBSOLETE + { + box-sizing:border-box; + margin:0 auto 10px auto; + padding:10px; + background-image:-webkit-linear-gradient(rgba(238,216,108,0.4) 0%,rgba(248,237,149,0.4) 15%,rgba(250,240,152,0.4) 100%); /* Safari */ + background-image:linear-gradient(rgba(238,216,108,0.4) 0%,rgba(248,237,149,0.4) 15%,rgba(250,240,152,0.4) 100%); + box-shadow:0 8px 10px -5px rgba(125,113,0,0.4); + text-align:left; + overflow:hidden; + } +.NOTICE_DATE_ACTIVE + { + float:right; + font-size:12pt; + color:#202020; + text-align:right; + overflow:hidden; + } +.NOTICE_DATE_OBSOLETE + { + float:right; + font-size:12pt; + color:#808080; + text-align:right; + overflow:hidden; + } +.NOTICE_SUBJECT_ACTIVE + { + margin:12px auto; + font-size:15pt; + font-weight:bold; + color:#202020; + text-align:center; + overflow:hidden; + } +.NOTICE_SUBJECT_OBSOLETE + { + margin:12px auto; + font-size:15pt; + font-weight:bold; + color:#808080; + text-align:center; + overflow:hidden; + } +.NOTICE_TEXT_BRIEF + { + clear:both; + font-size:12pt; + color:#204080; + overflow:hidden; + } +.NOTICE_TEXT_ACTIVE + { + padding:10px 20px; + clear:both; + font-size:12pt; + color:#204080; + overflow:hidden; + } +.NOTICE_TEXT_OBSOLETE + { + padding:10px 20px; + clear:both; + font-size:12pt; + color:#4070A0; + overflow:hidden; + } +.NOTICE_AUTHOR + { + box-sizing:border-box; + float:right; + max-width:120px; + text-align:right; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + font-size:12pt; + } +.NOTICE_AUTHOR_ACTIVE + { + color:#202020; + } +.NOTICE_AUTHOR_OBSOLETE + { + color:#808080; + } + +/**************************** Institutional links ****************************/ +#institutional_links + { + box-sizing:border-box; + width:148px; + margin:0; + background:white; + border-style:solid; + border-width:1px; + border-color:#8CBCCE; + padding:5px; + border-radius:4px; + font-size:11pt; + color:#4D88A1; + } +#institutional_links ul + { + box-sizing:border-box; + width:138px; + margin-top:2px; + padding-top:2px; + border-style:solid; + border-width:1px 0 0 0; + border-color:#DDECF1; + } +#institutional_links li + { + width:138px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.INS_LNK + { + padding:1px; + font-size:11pt; + color:#4D88A1; + } + +/*********************************** Alerts **********************************/ +.ALERT + { + display:inline-block; + box-sizing:border-box; + margin:8px auto; + padding:12px; + /* background-color:#fff3d4; */ + background-color:#fff8e5; + border-radius:2px; + box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 2px 1px -2px rgba(0,0,0,0.2), 0 1px 5px 0 rgba(0,0,0,0.12); + } +.ALERT_CLOSE + { + float:right; + margin:-8px -8px 8px 8px; + opacity:0.3; + } +.ALERT_CLOSE:hover + { + opacity:1; + } +.ALERT_TXT + { + box-sizing:border-box; + padding:8px 0 8px 40px; + background-position:8px 8px; + background-size:20px 20px; + background-repeat:no-repeat; + font-size:12pt; + color:#632921; + text-align:left; + overflow:hidden; + } + +/*********************************** Icons ***********************************/ +.ICOx16 { height:16px; vertical-align:middle;} +.ICO16x16 {width:16px; height:16px; vertical-align:middle;} +.ICO20x20 {width:20px; height:20px; vertical-align:middle;} +.ICOx20 { height:20px; vertical-align:middle; margin:0 auto;} +.ICO25x25 {width:25px; height:25px; vertical-align:middle;} +.ICO40x40 {width:40px; height:40px; vertical-align:middle;} +.ICO64x64 {width:64px; height:64px; vertical-align:middle;} +.ICO160x160 {width:160px; height:160px; vertical-align:middle;} +.BANNER {width:150px; height:50px;} +.BANNER_SMALL {width:75px; height:25px;} + +/****** Contextual links with small icons and text to go to some action ******/ +.CONTEXT_MENU + { + margin:4px auto 6px auto; + text-align:center; + } +.CONTEXT_OPT + { + display:inline-block; + margin-left:2px; + margin-right:2px; + white-space:nowrap; + } +.CONTEXT_COL + { + width:32px; + text-align:center; + vertical-align:top; + } +.CONTEXT_ICO_16x16 + { + width:16px; + height:16px; + margin-top:-2px; + vertical-align:middle; + } +.CONTEXT_ICO_x16 + { + height:16px; + margin-top:-2px; + vertical-align:middle; + } + +/********************************** Frame ************************************/ +.FRAME_INLINE + { + display:inline-block; + margin:0 8px; + vertical-align:top; + } +.FRAME_CONTAINER + { + box-sizing:border-box; + width:100%; + text-align:center; + vertical-align:middle; + } +.FRAME + { + display:inline-block; + box-sizing:border-box; + margin:5px 0; + padding:8px 12px 20px 12px; + background-color:white; + border-radius:2px; + box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 2px 1px -2px rgba(0,0,0,0.2), 0 1px 5px 0 rgba(0,0,0,0.12); + text-align:center; + overflow:hidden; + } +.FRAME_SHADOW + { + display:inline-block; + box-sizing:border-box; + margin:5px 0 18px 0; + padding:12px; + background-color:rgba(255,255,255,0.95); + border-width:1px; + border-style:solid; + border-color:#C0C0C0; + border-radius:4px; + box-shadow:2px 5px 15px #888; + text-align:center; + overflow:hidden; + } +.FRAME_ICO + { + box-sizing:border-box; + height:20px; + text-align:left; + } +.FRAME_ICO_LEFT + { + display:inline-block; + } +.FRAME_ICO_RIGHT + { + float:right; + } +.FRAME_TBL_WIDE + { + box-sizing:border-box; + width:100%; + } +.FRAME_TBL_WIDE_MARGIN + { + box-sizing:border-box; + width:100%; + margin-bottom:20px; + } +.FRAME_TBL_CENTER + { + margin:0 auto; + } +.FRAME_TBL_CENTER_MARGIN + { + margin:0 auto; + margin-bottom:20px; + } +.FRAME_TITLE + { + display:table; + box-sizing:border-box; + width:100%; + margin:0 auto; + padding:0 12px 12px 12px; + } +.FRAME_TITLE_BIG + { + color:#606060; + font-size:22pt; + } +.FRAME_TITLE_SMALL + { + color:#808080; + font-size:18pt; + } + +/* Apply only to the first level of th and td */ +table.CELLS_PAD_1 > tbody > tr > th {padding: 1px;} +table.CELLS_PAD_1 > tbody > tr > td {padding: 1px;} +table.CELLS_PAD_2 > tbody > tr > th {padding: 2px;} +table.CELLS_PAD_2 > tbody > tr > td {padding: 2px;} +table.CELLS_PAD_5 > tbody > tr > th {padding: 5px;} +table.CELLS_PAD_5 > tbody > tr > td {padding: 5px;} +table.CELLS_PAD_10 > tbody > tr > th {padding:10px;} +table.CELLS_PAD_10 > tbody > tr > td {padding:10px;} + +/******************** Selector below the title of a frame ********************/ +.SEL_BELOW_TITLE + { + text-align:center; + vertical-align:middle; + margin-bottom:8px; + } +.SEL_BELOW_TITLE ul + { + display:inline-block; + list-style-type:none; + padding:0; + margin:0; + text-align:left; + vertical-align:middle; + } +.SEL_BELOW_TITLE li + { + display:inline; + text-align:left; + vertical-align:middle; + } +.SEL_BELOW_TITLE label + { + color:#202020; + font-size:13pt; + } + +/*********************************** Title ***********************************/ +.TIT + { + margin:13px auto 0 auto; + font-size:13pt; + font-weight:bold; + color:#94745C; + text-align:center; + } + +/********** Title of country, institution, centre, degree, course ************/ +.TITLE_LOCATION + { + color:#808080; + font-size:20pt; + font-weight:bold; + } + +/************************** Map and name of country **************************/ +.COUNTRY_SMALL + { + display:inline-block; + box-sizing:border-box; + max-width:300px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.COUNTRY_TINY + { + display:inline-block; + box-sizing:border-box; + max-width:120px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.COUNTRY_MAP_TITLE + { + box-sizing:border-box; + width:40px; + height:40px; + margin-right:10px; + vertical-align:top; + } +.COUNTRY_MAP_SMALL + { + box-sizing:border-box; + width:64px; + height:64px; + vertical-align:middle; + } +.COUNTRY_MAP_TINY + { + box-sizing:border-box; + width:20px; + height:20px; + vertical-align:middle; + } +.COUNTRY_MAP_SHOW + { + box-sizing:border-box; + width:320px; + height:320px; + margin:10px; + } +.COUNTRY_MAP_PRINT + { + box-sizing:border-box; + width:625px; + height:625px; + margin:12px; + } + +/********************* List of my courses ************************************/ +.MY_CRSS_LNK + { + box-sizing:border-box; + max-width:500px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/******************* Web of institution, centre, degree **********************/ +.EXTERNAL_WWW_SHORT + { + box-sizing:border-box; + max-width:100px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.EXTERNAL_WWW_LONG + { + box-sizing:border-box; + max-width:250px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/****************************** Photo of centre ******************************/ +.CENTRE_PHOTO_SHOW + { + box-sizing:border-box; + width:480px; + padding:6px; margin:9px; + border:solid 1px #EEE; + } +a:hover img.CENTRE_PHOTO_SHOW + { + border:solid 1px #CCC; + box-shadow:1px 1px 6px #999; + } +.CENTRE_PHOTO_PRINT + { + box-sizing:border-box; + width:600px; + padding:10px; margin:15px; + border:solid 1px #EEE; + box-shadow:1px 1px 6px #999; + } + +/**************** Attribution (author and license) of images *****************/ +#AttributionArea + { + box-sizing:border-box; + width:480px; + } +.ATTRIBUTION + { + box-sizing:border-box; + margin-bottom:15px; + color:#A0A0A0; + font-size:8pt; + text-align:center; + } + +/******************************* User's photo ********************************/ +.PHOTO12x16 {width: 12px; height: 16px; border-radius:1px; vertical-align:middle; margin-top:-2px;} +.PHOTO15x20 {width: 15px; height: 20px; border-radius:2px; vertical-align:middle;} +.PHOTO15x20B {width: 15px; height: 20px; border-radius:2px; display:block; margin:0 auto;} +.PHOTO18x24 {width: 18px; height: 24px; border-radius:2px; vertical-align:middle;} +.PHOTO21x28 {width: 21px; height: 28px; border-radius:2px; vertical-align:middle;} +.PHOTO30x40 {width: 30px; height: 40px; border-radius:2px; vertical-align:middle;} +.PHOTO42x56 {width: 42px; height: 56px; border-radius:3px; vertical-align:middle;} +.PHOTO45x60 {width: 45px; height: 60px; border-radius:3px; vertical-align:middle;} +.PHOTO60x80 {width: 60px; height: 80px; border-radius:3px; vertical-align:middle;} +.PHOTO186x248 {width:186px; height:248px; border-radius:8px; vertical-align:middle;} +.IMG_USR + { + box-sizing:border-box; + width:186px; + height:248px; + border-radius:4px; + } +.ZOOM + { + box-sizing:border-box; + position:absolute; + z-index:1000; + left:-300px; + top:-400px; + padding:6px; + background-color:rgba(255,255,255,0.95); + border-width:1px; + border-style:solid; + border-color:#C0C0C0; + border-radius:6px; + box-shadow:2px 5px 15px #888; + } +.ZOOM_TXT_LINE + { + box-sizing:border-box; + display:block; + width:186px; + margin:0 auto; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.ZOOM_DEG + { + display:inline-block; + margin:0 auto; + padding:0 0 0 20px; + background-size:16px 16px; + background-repeat:no-repeat; + background-position:left center; + } + +.NO_BR {white-space:nowrap;} + +/********************************* Messages **********************************/ +.MSG_RECIPIENTS, .MSG_SUBJECT, .MSG_CONTENT + { + box-sizing:border-box; + width:640px; + } +.BG_MSG_BLUE + { + background-image:-webkit-linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%); /* Safari */ + background-image:linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%); + background-repeat:no-repeat; + } +.BG_MSG_GREEN + { + background-image:-webkit-linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%); /* Safari */ + background-image:linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%); + background-repeat:no-repeat; + } + +/************************** Listing of users *********************************/ +.USR_LIST_NUM {color:#A0A0A0; font-size:15pt; font-weight:bold;} +.USR_LIST_NUM_N {color:#202020; font-size:15pt; font-weight:bold;} + +/*****************************************************************************/ +.TITLE_WHITE {color:#505050; font-size:18pt;} +.TITLE_GREY {color:#505050; font-size:18pt;} +.TITLE_PURPLE {color:#573c4d; font-size:18pt;} +.TITLE_BLUE {color:#4D88A1; font-size:18pt;} +.TITLE_YELLOW {color:#7c4d2a; font-size:18pt;} +.TITLE_PINK {color:#63474e; font-size:18pt;} + +/*********************** Icon and checkbox highlighting **********************/ +.ICO_HIDDEN + { + opacity:0.3; + } +.ICO_HIGHLIGHT, .CHECKBOX_UNCHECKED + { + opacity:0.7; + } +.ICO_HIGHLIGHT:hover, .CHECKBOX_UNCHECKED:hover, .CHECKBOX_CHECKED + { + opacity:1; + } + +.HLP_HIGHLIGHT + { + opacity:0.3; + } +.HLP_HIGHLIGHT:hover + { + opacity:1; + } + +/********************************* Form fonts ********************************/ +/* Inside white box */ +.FORM_IN_WHITE {color:#4d88a1; font-size:13pt;} +.FORM_IN_GREY {color:#4d88a1; font-size:13pt;} +.FORM_IN_PURPLE {color:#4d88a1; font-size:13pt;} +.FORM_IN_BLUE {color:#4d88a1; font-size:13pt;} +.FORM_IN_YELLOW {color:#7c4d2a; font-size:13pt;} +.FORM_IN_PINK {color:#4d88a1; font-size:13pt;} + +/* Outside white box */ +.FORM_OUT_WHITE {color:#4d88a1; font-size:13pt;} +.FORM_OUT_GREY {color:#4d88a1; font-size:13pt;} +.FORM_OUT_PURPLE {color:#573c4d; font-size:13pt;} +.FORM_OUT_BLUE {color:#4d88a1; font-size:13pt;} +.FORM_OUT_YELLOW {color:#7c4d2a; font-size:13pt;} +.FORM_OUT_PINK {color:#63474e; font-size:13pt;} + +.BOLD {font-weight:bold;} +.NOWRAP {white-space:nowrap;} + +/****************************** Placing of objects ***************************/ +.LEFT_TOP {text-align:left; vertical-align:top;} +.LEFT_MIDDLE {text-align:left; vertical-align:middle;} +.LEFT_BOTTOM {text-align:left; vertical-align:bottom;} +.CENTER_TOP {text-align:center; vertical-align:top;} +.CENTER_MIDDLE {text-align:center; vertical-align:middle;} +.CENTER_BOTTOM {text-align:center; vertical-align:bottom;} +.RIGHT_TOP {text-align:right; vertical-align:top;} +.RIGHT_MIDDLE {text-align:right; vertical-align:middle;} +.RIGHT_BOTTOM {text-align:right; vertical-align:bottom;} + +/***************** Colors used in headers,backgrounds,etc. *****************/ +.COLOR0 {background-color:#F4F2EA;} +.COLOR1 {background-color:#FBFAF7;} +.LIGHT_GREEN {background-color:#C0FF40;} +.LIGHT_BLUE {background-color:#DDECF1;} +.VERY_LIGHT_BLUE {background-color:#EAF3F6;} + +/********************************* Course info *******************************/ +#crs_info + { + margin:0; + padding:0 12px; + color:inherit; + } +#crs_info table + { + border:1px solid grey; + } +#crs_info th + { + border:1px solid grey; + background-color:#F0F0F0; + padding:6px; + } +#crs_info td + { + border:1px solid grey; + padding:6px; + } + +/************************ Help for the text editor ***************************/ +.HELP_EDIT + { + margin:10px; + text-align:center; + color:#808080; + font-size:8pt; + } + +/*********************************** Lists ***********************************/ +.LIST_LEFT + { + display:inline-block; + list-style-type:none; + padding:0; + margin:0; + text-align:left; + vertical-align:middle; + } + +/******************************* File browsers *******************************/ +.FILENAME + { + display:inline-block; + box-sizing:border-box; + width:260px; /* width of LST_EDIT + 10 */ + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.FILENAME_TXT + { + color:#202020; + font-size:18pt; + font-weight:bold; + } +.BROWSER_TITLE {color:#94745C; font-size:13pt; font-weight:bold;} +.BROWSER_TITLE_LIGHT {color:#D5C6BB; font-size:13pt; font-weight:bold;} +.BROWSER_SUBTITLE {color:#94745C; font-size:12pt;} +.BROWSER_TABLE + { + box-sizing:border-box; + width:100%; + } +.LST {color:#202020; font-size:11pt; white-space:nowrap;} +.LST_HID {color:#A0A0A0; font-size:11pt; white-space:nowrap;} +.LST_REC {color:#008000; font-size:11pt; white-space:nowrap;} +.LST_REC_HID {color:#89BE87; font-size:11pt; white-space:nowrap;} +.LST_EDIT {width:250px; color:#202020; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;} +.LST_EDIT_HID {width:250px; color:#A0A0A0; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;} +.LST_EDIT_REC {width:250px; color:#008000; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;} +.LST_EDIT_REC_HID {width:250px; color:#89BE87; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;} +.LST_EDIT_ROWS {width:30px; color:#202020; font-weight:bold; font-size:11pt; height:20px; padding:0; margin:-1px; border-width:1px; border-style:solid; border-color:#ECE9D8;} + +/************** Paragraph (margin on top and bottom of a div) ****************/ +.PAR + { + margin-top:1em; + margin-bottom:1em; + } + +/*****************************************************************************/ + +.T1 {color:#202020; font-size:15pt;} +.T2 {color:#202020; font-size:13pt;} +.T3 {color:#202020; font-size:12pt;} + +.DAT {color:#606060; font-size:13pt;} +.DAT_NOBR {color:#606060; font-size:13pt; white-space:nowrap;} +.DAT_BOLD {color:#606060; font-size:13pt; font-weight:bold;} +.DAT_GREEN {color:darkgreen; font-size:13pt;} +.DAT_RED {color:darkred; font-size:13pt;} +.DAT_LIGHT {color:#A0A0A0; font-size:13pt;} +.DAT_N {color:black; font-size:13pt;} +.DAT_NOBR_N {color:black; font-size:13pt; white-space:nowrap;} +.DAT_N_BOLD {color:black; font-size:13pt; font-weight:bold;} + +/*********************** Line in top part of a table row *********************/ +.DAT_N_LINE_TOP + { + color:black; + font-size:13pt; + border-style:solid none none none; + border-width:1px; + } + +.DAT_SMALL {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#606060; font-size:12pt;} +.DAT_SMALL_LIGHT {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#A0A0A0; font-size:12pt;} +.DAT_SMALL_NOBR {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#606060; font-size:12pt; white-space:nowrap;} +.DAT_SMALL_N {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:black; font-size:12pt;} +.DAT_SMALL_NOBR_N {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:black; font-size:12pt; white-space:nowrap;} + +.DAT_SMALL_GREY {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#707070; font-size:12pt;} +.DAT_SMALL_RED {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:red; font-size:12pt;} +.DAT_SMALL_PURPLE {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#707070; font-size:12pt;} +.DAT_SMALL_GREEN {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#008000; font-size:12pt;} +.DAT_SMALL_BLUE {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#0080FF; font-size:12pt;} +.DAT_SMALL_YELLOW {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#C0C000; font-size:12pt;} +.DAT_SMALL_PINK {font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; color:#707070; font-size:12pt;} + +/******************************** User's IDs *********************************/ +.USR_ID {font-size:18pt; font-weight:bold;} +.USR_ID_C {color:#408020} +.USR_ID_NC {color:#A02020} + +/******************************* Record card *********************************/ +.REC_USR + { + display:block; + margin:0 0 12px 0; + text-align:center; + } +.REC_LEFT, .REC_RIGHT + { + display:inline-block; + margin:0 6px; + vertical-align:top; + } + +.REC_C1_TOP + { + box-sizing:border-box; + width:68px; + padding-top:8px !important; + vertical-align:top; + } +.REC_C2_TOP + { + box-sizing:border-box; + width:278px; + height:68px; + padding-top:8px !important; + } +.REC_C3_TOP + { + box-sizing:border-box; + width:190px; + } + +.REC_C1_MID + { + box-sizing:border-box; + width:68px; + } +.REC_C2_MID + { + box-sizing:border-box; + width:278px; + } +.REC_C3_MID + { + box-sizing:border-box; + width:190px; + } + +.REC_C1_BOT + { + box-sizing:border-box; + width:170px; + } +.REC_C2_BOT + { + box-sizing:border-box; + width:362px; + } +.REC_C2_BOT_INPUT + { + box-sizing:border-box; + width:358px; + } + +.REC_HEAD {font-family:Georgia,"DejaVu LGC Serif","Bitstream Vera Serif",serif; color:#808080; font-size:12pt;} +.REC_NAME + { + box-sizing:border-box; + max-width:274px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + color:#808080; + font-size:20pt; + font-weight:bold; + } +.REC_NICK + { + color:#808080; + font-size:15pt; + font-weight:bold; + } +.REC_WEBS + { + width:180px; + margin:0 auto; + } +.REC_EMAIL + { + box-sizing:border-box; + max-width:358px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.REC_DAT + { + color:#808080; + font-size:13pt; + line-height:110%; + } +.REC_DAT_BOLD + { + color:black; + font-size:13pt; + line-height:110%; + } + +/******************************** Class photo ********************************/ +.CLASSPHOTO_TITLE + { + color:#606060; + font-family:Georgia,"DejaVu LGC Serif","Bitstream Vera Serif",serif; + font-size:13pt; + } +.CLASSPHOTO + { + color:#606060; + font-size:10pt; + line-height:110%; + white-space:nowrap; + } +.CLASSPHOTO_CAPTION + { + display:block; + box-sizing:border-box; + max-width:60px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + margin:0 auto; + } + +/*****************************************************************************/ +.MSJ_AVISO {color:#632921; font-size:12pt;} +.TIT_TBL {color:#4D88A1; font-size:12pt; font-weight:bold;} + +.GRP_TITLE {color:#4D88A1; font-size:15pt; font-weight:bold;} + +.ASG_TITLE {color:#4D88A1; font-size:15pt; font-weight:bold;} +.ASG_TITLE_LIGHT {color:#AFC4CC; font-size:15pt; font-weight:bold;} +.ASG_LABEL {color:#4D88A1; font-size:13pt;} +.ASG_LABEL_LIGHT {color:#AFC4CC; font-size:13pt;} +.ASG_GRP {color:#4D88A1; font-size:12pt;} +.ASG_GRP_LIGHT {color:#AFC4CC; font-size:12pt;} + +.DATE_RED {color:red; font-size:13pt;} +.DATE_RED_LIGHT {color:#F98A8A; font-size:13pt;} +.DATE_GREEN {color:#008000; font-size:13pt;} +.DATE_GREEN_LIGHT {color:#89BE87; font-size:13pt;} +.DATE_BLUE {color:#4D88A1; font-size:13pt;} +.DATE_BLUE_LIGHT {color:#AFC4CC; font-size:13pt;} + +.ASG_LST_DATE_GREEN {color:#008000; font-size:11pt; white-space:nowrap;} +.ASG_LST_DATE_RED {color:red; font-size:11pt; white-space:nowrap;} + +.STATUS_GREEN {color:#008000; font-size:12pt;} +.STATUS_GREEN_LIGHT {color:#89BE87; font-size:12pt;} +.STATUS_RED {color:red; font-size:12pt;} +.STATUS_RED_LIGHT {color:#F98A8A; font-size:12pt;} + +/********************** Number of question, project, etc. ********************/ +.BIG_INDEX {color:#808080; font-size:20pt; font-weight:bold;} + +/******************************** Projects ***********************************/ +.PRJ_LST_USR + { + margin:0; + padding-left:1em; + } +.PRJ_INPUT + { + max-width:500px; + } + +/********************************** Tests ************************************/ +.TAG_SEL {box-sizing:border-box; width:346px;} +.TAG_TXT {box-sizing:border-box; width:346px;} +.STEM + { + box-sizing:border-box; + margin:0 auto; + width:700px; + } +.STEM_TEXTAREA + { + width:696px; + } +.ANSWER + { + box-sizing:border-box; + margin:0 auto; + width:600px; + } +.ANSWER_TEXTAREA + { + width:596px; + } +.ANS_TXT {color:#202020; font-size:12pt;} +.ANS_0 {color:#202020; font-size:12pt; font-weight:bold;} +.ANS_OK {color:#008000; font-size:12pt; font-weight:bold;} +.ANS_BAD {color:red; font-size:12pt; font-weight:bold;} +.TEST_SUBTITLE + { + margin:10px; + color:#202020; + font-size:13pt; + text-align:center; + vertical-align:middle; + } +.TEST_EXA {color:#202020; font-size:12pt;} +.TEST_EXA_LIGHT {color:#a0a0a0; font-size:12pt;} +.TEST_EDI {color:#202020; font-size:12pt;} +.TEST_EDI_LIGHT {color:#a0a0a0; font-size:12pt;} + +.TEST_TAG_LIST + { + padding:0; + margin:0 0 0 1em; + } + +.TEST_IMG_SHOW_STEM_CONTAINER + { + box-sizing:border-box; + width:100%; + margin:10px 0; + } +.TEST_IMG_SHOW_STEM + { + box-sizing:border-box; + width:100%; + border-radius:4px; + } +.TEST_IMG_SHOW_ANS_CONTAINER + { + box-sizing:border-box; + width:100%; + margin:10px 0; + } +.TEST_IMG_SHOW_ANS + { + box-sizing:border-box; + width:100%; + border-radius:4px; + } +.TEST_IMG_EDIT_LIST_STEM_CONTAINER + { + box-sizing:border-box; + width:100%; + margin:5px 0; + } +.TEST_IMG_EDIT_LIST_STEM + { + box-sizing:border-box; + width:100%; + border-radius:2px; + } +.TEST_IMG_EDIT_LIST_ANS_CONTAINER + { + box-sizing:border-box; + width:100%; + margin:5px 0; + } +.TEST_IMG_EDIT_LIST_ANS + { + box-sizing:border-box; + width:100%; + border-radius:2px; + } + +.TEST_FORM_EDIT_MED + { + box-sizing:border-box; + margin:15px 0; + text-align:left; + vertical-align:top; + } + +.TEST_IMG_EDIT_ONE_STEM_CONTAINER + { + box-sizing:border-box; + width:100%; + } +.TEST_IMG_EDIT_ONE_STEM + { + box-sizing:border-box; + width:100%; + border-radius:4px; + } +.TEST_IMG_EDIT_ONE_ANS_CONTAINER + { + box-sizing:border-box; + width:100%; + } +.TEST_IMG_EDIT_ONE_ANS + { + box-sizing:border-box; + width:100%; + border-radius:4px; + } + +.TEST_EDI_ANS_LEFT_COL + { + box-sizing:border-box; + width:48px; + text-align:left; + vertical-align:top; + } +.TEST_EDI_ANS_CENTER_COL + { + box-sizing:border-box; + width:48px; + text-align:right; + vertical-align:top; + } +.TEST_EDI_ANS_RIGHT_COL + { + box-sizing:border-box; + width:600px; + text-align:left; + vertical-align:top; + } + +/********************************** Games ************************************/ +.GAM_PLAY_CONTAINER + { + box-sizing:border-box; + display:table; + margin:5%; + } +.GAM_PLAY_NUM_QST + { + width:10%; + float:left; + /* position:relative; */ + padding-bottom:24pt; + color:#808080; + font-size:48pt; + font-weight:bold; + } +.GAM_PLAY_QST_CONTAINER + { + width:80%; + float:left; + /* position:relative; */ + } +.GAM_PLAY_NXT_CONTAINER + { + width:10%; + float:left; + /* position:relative; */ + } +.GAM_PLAY_QST + { + color:#202020; + font-size:24pt; + } +.GAM_PLAY_CONTINUE_CONTAINER + { + clear:all; + text-align:center; + } +.GAM_PLAY_CONTINUE_CONTAINER a + { + text-decoration:none; + } +.GAM_PLAY_CONTINUE + { + font-size:16pt; + } + +/******************************* Time table **********************************/ +#timetable + { + width:100%; + margin:0 auto; + } +.TT_CELL + { + box-sizing:border-box; + max-width:80px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + margin:0 auto; + } +.TT_TXT + { + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + color:#345C6C; + font-size:10pt; + line-height:100%; + letter-spacing:0; + } +.TT_DAY + { + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + color:#202020; + font-size:10pt; + letter-spacing:0; + } +.TT_SUNDAY + { + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + color:red; + font-size:10pt; + letter-spacing:0; + } +.TT_HOUR_BIG + { + /* font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; */ + color:#808080; + font-size:10pt; + font-weight:bold; + line-height:100%; + letter-spacing:0; + } +.TT_HOUR_SMALL + { + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + color:#A0A0A0; + font-size:10pt; + line-height:100%; + letter-spacing:0; + } +.TT_HOURCOL {box-sizing:border-box; height:16px; width:7%;} +.TT_HOUR {box-sizing:border-box; height:32px; width:7%;} +.TT_MINICOL {box-sizing:border-box; height:16px; width:2%;} +.TT_ALIGN {box-sizing:border-box; height:16px; width:1%;} +.TT_FREE0 {box-sizing:border-box; height:16px; background-color:#F4F2EA; border:solid 1px; border-color:#F4F2EA #E0D9C2 #EEEADC #F4F2EA;} +.TT_FREE1 {box-sizing:border-box; height:16px; background-color:#F4F2EA; border:solid 1px; border-color:#F4F2EA #E0D9C2 #E0D9C2 #F4F2EA;} +.TT_FREE2 {box-sizing:border-box; height:16px; background-color:#FBFAF7; border:solid 1px; border-color:#FBFAF7 #E0D9C2 #F5F2E9 #FBFAF7;} +.TT_FREE3 {box-sizing:border-box; height:16px; background-color:#FBFAF7; border:solid 1px; border-color:#FBFAF7 #E0D9C2 #E0D9C2 #FBFAF7;} +.TT_LECT {box-sizing:border-box; height:16px; background-color:#C0DAE4; border:solid 2px; border-color:#D5F1FC #AAC1C9 #AAC1C9 #D5F1FC;} +.TT_PRAC {box-sizing:border-box; height:16px; background-color:#DBE5E9; border:solid 2px; border-color:#EDF8FC #C7D0D4 #C7D0D4 #EDF8FC;} +.TT_TUTO {box-sizing:border-box; height:16px; background-color:#D6E9C3; border:solid 2px; border-color:#E8FCD3 #C2D4B1 #C2D4B1 #E8FCD3;} + +/********************************* Preference ********************************/ + +.PREF_CONTAINERS + { + margin:0 auto; + } +.PREF_CONTAINER + { + display:inline-block; + margin:0 10px; + } +.PREF_OFF + { + display:table-cell; + box-sizing:border-box; + padding:6px; + text-align:center; + vertical-align:middle; + border:solid 1px; + border-color:transparent; + } +.PREF_ON + { + display:table-cell; + box-sizing:border-box; + padding:6px; + text-align:center; + vertical-align:middle; + border:solid 1px; + border-color:#C0DAE4; + background-color:#DDECF1; + } + +/************************************* Log ***********************************/ +.LOG + { + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + font-size:11pt; + color:#606060; + } +.LOG_R + { + font-family:"Arial Narrow","Nimbus Sans L","DejaVu LGC Sans Condensed",sans-serif; + font-size:11pt; + color:red; + } + +/***************************** Exam announcement *****************************/ +/* Bottom space is used for signatures */ +.EXA_ANN_VISIBLE + { + box-sizing:border-box; + width:100%; + padding:25px 25px 125px 25px; + } +.EXA_ANN_HIDDEN + { + box-sizing:border-box; + width:100%; + padding:25px 25px 125px 25px; + opacity:0.3; + } + +/*********************** Media (image/video) uploading ***********************/ +.MED_UPL_CON /* Upload container */ + { + text-align:center; + margin-bottom:6px; + } + +.MED_PLAY + { + position:relative; + } +/* The icon inside the overlay is positioned in the middle vertically and horizontally */ +.MED_PLAY_ICO + { + position:absolute; + left:50%; + top:50%; + transform:translate(-50%,-50%); + font-size:20pt; + font-weight:bold; + color:white; + text-shadow: 0 0 8px black; + } + +/* For YouTube embedded videos. See https://avexdesigns.com/responsive-youtube-embed/ */ +.MED_VIDEO_CONT /* Adjust container height to get a 16:9 aspect ratio */ + { + position:relative; + box-sizing:border-box; + margin:10px 0; + padding-bottom:56.25%; /* percentage relative to width */ + } +.MED_VIDEO_CONT iframe, +.MED_VIDEO_CONT object, +.MED_VIDEO_CONT embed + { + position:absolute; + top:0; + left:0; + width:100%; + height:100%; + } + +/********** Author of assignments, attendance, messages, surveys... **********/ +.AUTHOR_1_LINE + { + display:inline-block; + box-sizing:border-box; + max-width:100px; + height:20px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.AUTHOR_2_LINES + { + display:inline-block; + box-sizing:border-box; + max-width:60px; + height:40px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.AUTHOR_TXT {color:#4D88A1; font-size:11pt;} +.AUTHOR_TXT_LIGHT {color:#AFC4CC; font-size:11pt;} +.AUTHOR_TXT_NEW {color:#4D88A1; font-size:11pt; font-weight:bold;} + +/************************** Owner of assignments and works *******************/ +.OWNER_WORKS_PHOTO + { + box-sizing:border-box; + width:64px; + text-align:left; + vertical-align:top; + } +.OWNER_WORKS_DATA + { + display:inline-block; + box-sizing:border-box; + width:100px; + text-align:left; + vertical-align:top; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/***************************** Listing of users ******************************/ +.USR_DAT + { + box-sizing:border-box; + max-width:120px; + overflow:hidden; + text-overflow:ellipsis; + } + +/********************************* Attendance ********************************/ +.ATT_CHECK + { + display:inline-block; + font-size:13pt; + font-weight:bold; + color:darkgreen; + } +.ATT_CROSS + { + display:inline-block; + font-size:13pt; + font-weight:bold; + color:darkred; + opacity:0.1; + } + +/**************************** Enrolment requests *****************************/ +.REQUESTER_NAME + { + box-sizing:border-box; + max-width:100px; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/********************************* Timeline **********************************/ +#view_new_posts_container,#view_old_posts_container + { + display:table-cell; + height:50px; + text-align:center; + vertical-align:middle; + } +#just_now_timeline_list,#new_timeline_list,#old_timeline_list + { + display:none; + margin:0; + padding:0; + } +#old_timeline_list + { + margin:0; + padding:0; + } +.TL_LIST + { + list-style-type:none; + padding:0; + margin:0; + text-align:left; + vertical-align:middle; + } + +@media only screen and (max-width: 800px) + { /* For mobile-phones */ + .TL_WIDTH {width:316px;} /* 536-220 */ + .TL_RIGHT_WIDTH {width:260px;} /* 480-220 */ + .TL_RIGHT_AUTHOR_WIDTH {width:100px;} /* 320-220 */ + .TL_POST_MED_WIDTH {width:220px;} /* 440-220 */ + .TL_COMMENT_WIDTH {width:220px;} /* 440-220 */ + .TL_COMMENT_AUTHOR_WIDTH {width: 60px;} /* 280-220 */ + } +@media only screen and (min-width: 800px) + { /* For tablets and desktop */ + .TL_WIDTH {width:536px;} + .TL_RIGHT_WIDTH {width:480px;} + .TL_RIGHT_AUTHOR_WIDTH {width:320px;} + .TL_POST_MED_WIDTH {width:440px;} + .TL_COMMENT_WIDTH {width:440px;} + .TL_COMMENT_AUTHOR_WIDTH {width:280px;} + } + +.TL_NEW_PUB + { + background-color:#ddecf1; + animation: fadein 2s linear forwards; + } +@keyframes fadein + { + to {background-color:white;} + } +.TL_FORM_NEW_POST + { + padding:10px 0; + text-align:center; + } +.TL_SEP /* Separator (upper line between publications) */ + { + border-top:1px solid silver; + } +.TL_TOP_CONTAINER + { + box-sizing:border-box; + padding-top:10px; + text-align:left; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.TL_TOP_PUBLISHER + { + color:#808080; + font-size:13pt; + } +.TL_LEFT_PHOTO + { + display:inline-block; + box-sizing:border-box; + width:56px; + height:70px; + padding:10px 0; + text-align:left; + vertical-align:top; + } +.TL_RIGHT_CONTAINER + { + display:inline-block; + box-sizing:border-box; + padding-top:10px; + } +.TL_RIGHT_AUTHOR + { + display:inline-block; + box-sizing:border-box; + text-align:left; + vertical-align:top; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.TL_RIGHT_TIME + { + display:inline-block; + box-sizing:border-box; + width:160px; + text-align:right; + vertical-align:top; + } +.TL_POST_TEXTAREA + { + box-sizing:border-box; + margin:0; + resize:none; + } +.TL_POST_MED_INPUT + { + box-sizing:border-box; + margin:0 auto; + } +.TL_POST_MED_CONTAINER + { + box-sizing:border-box; + margin:10px 0; + } +.TL_POST_MED + { + box-sizing:border-box; + border-radius:8px; + } +.TL_COMMENT_CONTAINER + { + display:inline-block; + box-sizing:border-box; + padding:10px 0; + } +.TL_COMMENT_AUTHOR + { + display:inline-block; + box-sizing:border-box; + text-align:left; + vertical-align:top; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.TL_COMMENT_MED_CONTAINER + { + box-sizing:border-box; + margin:10px 0; + } +.TL_COMMENT_MED + { + box-sizing:border-box; + border-radius:8px; + } +.TL_FORM_NEW_COMMENT + { + display:inline-block; + margin-left:56px; + border-top:1px solid silver; + padding-bottom:10px; + text-align:center; + } +.TL_COMMENT_TEXTAREA + { + box-sizing:border-box; + margin:0; + resize:none; + } +.TL_COMMENT_IMG_TIT_URL + { + box-sizing:border-box; + } +.TL_BOTTOM_LEFT /* Container for button used to toggle new comment form */ + { + display:inline-block; + box-sizing:border-box; + width:56px; + vertical-align:bottom; + } +.TL_BOTTOM_RIGHT /* Container for fav, share, remove and comments */ + { + display:inline-block; + box-sizing:border-box; + vertical-align:top; + } +.TL_ICO_FAV_SHA_REM /* Container for fav, share and remove */ + { + padding-bottom:10px; + } +.TL_TXT + { + padding:5px 0; + color:#202020; + font-size:13pt; + line-height:1.4; + } +.TL_EXPAND_COMMENTS + { + text-align:center; + vertical-align:top; + padding-bottom:10px; + } +.TL_ICO_COMMENT + { + display:inline-block; + padding-bottom:10px; + } +.TL_ICO_COMMENT_DISABLED + { + display:inline-block; + padding-bottom:10px; + opacity:0.1; + } +.TL_ICO_FAV + { + display:inline-block; + vertical-align:bottom; + } +.TL_ICO_SHA + { + display:inline-block; + padding-left:20px; + vertical-align:bottom; + } +.TL_ICO_FAV_DISABLED + { + display:inline-block; + vertical-align:bottom; + opacity:0.1; + } +.TL_ICO_SHA_DISABLED + { + display:inline-block; + padding-left:20px; + vertical-align:bottom; + opacity:0.1; + } +.TL_ICO_REM + { + vertical-align:bottom; + float:right; + } +.TL_NUM_SHA_FAV + { + color:#A0A0A0; + font-size:12pt; + font-weight:bold; + } +.TL_SHARER + { + display:inline-block; + padding-left:4px; + vertical-align:bottom; + } +.TL_COMMENT + { + border-top:1px solid silver; + } +.TL_COMMENT_PHOTO + { + display:inline-block; + box-sizing:border-box; + width:40px; + height:54px; + padding:10px 0; + text-align:left; + vertical-align:top; + } + +/************************************ Forum **********************************/ +.FOR_IMG_CONTAINER + { + box-sizing:border-box; + width:100%; + margin:10px 0; + } +.FOR_IMG + { + box-sizing:border-box; + width:100%; + border-radius:4px; + } +.FOR_MED_INPUT + { + box-sizing:border-box; + margin:0 auto; + width:480px; + } + +/*********************************** Messages ********************************/ +.MSG_TO_ONE_RCP + { + display:inline-block; + padding-left:4px; + text-align:left; + vertical-align:middle; + } +.MSG_IMG_CONTAINER + { + box-sizing:border-box; + width:100%; + margin:10px 0; + } +.MSG_IMG + { + box-sizing:border-box; + width:100%; + border-radius:4px; + } +.MSG_MED_INPUT + { + box-sizing:border-box; + margin:0 auto; + width:480px; + } +.MSG_TXT + { + color:#202020; + font-size:13pt; + line-height:1.4; + } +.MSG_TIT {color:#4D88A1; font-size:13pt;} +.MSG_TIT_NEW {color:#4D88A1; font-size:13pt; font-weight:bold;} +.MSG_TIT_REM {color:#AFC4CC; font-size:13pt;} +.MSG_TIT_BG + { + background-image:-webkit-linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%); /* Safari */ + background-image:linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%); + background-repeat:no-repeat; + color:#4D88A1; + font-size:13pt; + } +.MSG_TIT_BG_NEW + { + background-image:-webkit-linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%); /* Safari */ + background-image:linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%); + background-repeat:no-repeat; + color:#4D88A1; + font-size:13pt; + font-weight:bold; + } +.MSG_TIT_BG_REM + { + background-image:-webkit-linear-gradient(#f3fcff 0,#f3fcff 80%,white 100%); /* Safari */ + background-image:linear-gradient(#f3fcff 0,#f3fcff 80%,white 100%); + background-repeat:no-repeat; + color:#AFC4CC; + font-size:13pt; + } +.MSG_AUT_BG + { + background-image:-webkit-linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%); /* Safari */ + background-image:linear-gradient(#eaf3f6 0,#eaf3f6 80%,white 100%); + background-repeat:no-repeat; + color:#4D88A1; + font-size:11pt; + } +.MSG_AUT_BG_NEW + { + background-image:-webkit-linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%); /* Safari */ + background-image:linear-gradient(#f5ffd7 0,#f5ffd7 80%,white 100%); + background-repeat:no-repeat; + color:#4D88A1; + font-size:11pt; + font-weight:bold; + } +.MSG_AUT_BG_REM + { + background-image:-webkit-linear-gradient(#f3fcff 0,#f3fcff 80%,white 100%); /* Safari */ + background-image:linear-gradient(#f3fcff 0,#f3fcff 80%,white 100%); + background-repeat:no-repeat; + color:#AFC4CC; + font-size:11pt; + } +.MSG_DATE {color:#4D88A1; font-size:11pt;} +.MSG_DATE_NEW {color:#4D88A1; font-size:11pt; font-weight:bold;} + +.BT {width:20px; text-align:center; vertical-align:top;} +.BT0 {width:20px; text-align:center; vertical-align:top; background-color:#F4F2EA;} +.BT1 {width:20px; text-align:center; vertical-align:top; background-color:#FBFAF7;} + +.BM {width:20px; text-align:center; vertical-align:middle;} +.BM_SEL {width:20px; text-align:center; vertical-align:middle; background-color:#C0FF40;} + +.BM0 {width:20px; text-align:center; vertical-align:middle; background-color:#F4F2EA;} +.BM1 {width:20px; text-align:center; vertical-align:middle; background-color:#FBFAF7;} + +/******************************** Pagination *********************************/ +.PAG + { + display:inline-block; + box-sizing:border-box; + margin:4px 2px; + padding:2px 8px; + border-style:solid; + border-width:1px; + border-radius:4px; + border-color:#C0DAE4; + } +a.PAG:hover, .PAG_CUR + { + display:inline-block; + box-sizing:border-box; + margin:4px 2px; + padding:2px 8px; + border-style:solid; + border-width:1px; + border-radius:4px; + border-color:#C0DAE4; + background-color:#DDECF1; + text-decoration:none; + } +.PAG_TXT + { + font-size:13pt; + font-weight:bold; + color:#4D88A1; + } + +/***************************** Calls for exams *******************************/ +.CONV_TIT + { + font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif; + color:#202020; + font-weight:bold; + font-size:18pt; + } +.CONV_TIT_IMPR + { + font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif; + color:#202020; + font-weight:bold; + font-size:18pt; + } +.CONV_NEG + { + font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif; + color:#202020; + font-weight:bold; + font-size:13pt; + white-space:nowrap; + } +.CONV_NEG_IMPR + { + font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif; + color:#202020; + font-weight:bold; + font-size:13pt; + white-space:nowrap; + text-align:right; + } +.CONV + { + font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif; + color:#202020; + font-size:13pt; + } +.CONV_IMPR + { + font-family:Garamond,"DejaVu LGC Serif","Bitstream Vera Serif",serif; + color:#202020; + font-size:13pt; + } + +/***************************** Public user's profile *************************/ +.PRF_FIG_LEFT_CONTAINER + { + display:inline-block; + box-sizing:border-box; + width:50%; + padding-right:10px; + text-align:right; + vertical-align:top; + } +.PRF_FIG_RIGHT_CONTAINER + { + display:inline-block; + box-sizing:border-box; + width:50%; + padding-left:10px; + text-align:left; + vertical-align:top; + } +.PRF_FIG_UL + { + display:inline-block; + list-style-type:none; + padding:0; + margin:0; + text-align:left; + vertical-align:middle; + } +.PRF_FIG_LI + { + padding:0 0 0 20px; + background-size:16px 16px; + background-repeat:no-repeat; + background-position:left center; + opacity:0.7; + } + +#following_side + { + display:inline-block; + box-sizing:border-box; + width:50%; + padding-right:10px; + } +#followers_side + { + display:inline-block; + box-sizing:border-box; + width:50%; + padding-left:10px; + } +.FOLLOW_SIDE + { + display:table; + box-sizing:border-box; + width:100%; + } +#follows_me + { + display:table-cell; + box-sizing:border-box; + padding-right:20px; + text-align:right; + vertical-align:middle; + } +#follow_usr + { + display:table-cell; + height:60px; + box-sizing:border-box; + padding-left:20px; + text-align:left; + vertical-align:middle; + } +.FOLLOW_BOX + { + display:table-cell; + width:140px; + text-align:center; + vertical-align:middle; + } +.FOLLOW_NUM + { + color:#202020; + font-size:30pt; + font-weight:bold; + opacity:0.5; + } +.FOLLOW_NUM_B + { + color:#202020; + font-size:30pt; + font-weight:bold; + } +.FOLLOW_PHOTO + { + box-sizing:border-box; + width:72px; + height:90px; + text-align:left; + vertical-align:bottom; + } +.FOLLOW_USR + { + box-sizing:border-box; + width:100px; + height:90px; + } +.FOLLOW_USR_NAME + { + box-sizing:border-box; + max-width:100px; + text-align:left; + vertical-align:bottom; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } +.FOLLOW_USR_ICO + { + text-align:left; + padding:4px; + } + +/****************************** Users ranking ********************************/ +.RANK_USR + { + box-sizing:border-box; + max-width:40px; + text-align:left; + vertical-align:middle; + white-space:nowrap; + overflow:hidden; + text-overflow:ellipsis; + } + +/************************* Indicators about courses **************************/ +.INDICATORS td,.INDICATORS th + { + border:1px solid silver; + border-collapse:collapse; + padding:1px; + } +.INDICATORS th + { + color:#4D88A1; + font-size:12pt; + font-weight:bold; + } +.INDICATORS_INPUT + { + max-width:500px; + } + +/************* Forms to edit institution, centre, degree, course *************/ +.CODE + { + min-width:60px; + text-align:right; + vertical-align:middle; + } +.INPUT_INS_CODE + { + width:90px; + } +.INPUT_SHORT_NAME + { + width:90px; + } +.INPUT_FULL_NAME + { + width:180px; + } +.INPUT_WWW + { + width:90px; + } + +.INPUT_STATUS + { + width:80px; + } +.INPUT_REQUESTER + { + width:90px; + } + +/********************************* Page foot *********************************/ +@media only screen and (max-width: 800px) + { /* For mobile-phones */ + #foot_zone, #about_zone + { + display:none; + } + } +@media only screen and (min-width: 800px) + { /* For tablets and desktop */ + #foot_zone + { + padding:20px; + } + #about_zone + { + padding:20px; + text-align:center; + } + } +.FOOT_LIST_CONTAINER + { + position:relative; + float:left; + text-align:left; + padding-bottom:20px; + background:white; + } +.FOOT_LIST_TITLE + { + color:#666; + font-size:14pt; + font-weight:bold; + white-space:nowrap; + } +.FOOT_LIST + { + box-sizing:border-box; + list-style-type:none; + margin:0; + padding:0; + border-width:0; + font-size:12pt; + white-space:nowrap; + line-height:140%; + } +.FOOT_LINK + { + color:#2C90C9; + } +.ABOUT + { + color:#A0A0A0; + font-size:12pt; + } + +/************** Something that does not take up space and is not shown *******/ +.NOT_SHOWN + { + display:none; + } + +/************ Something that takes up space but which is invisible ***********/ +.HIDDEN + { + visibility:hidden; + } diff --git a/js/swad18.80.js b/js/swad18.80.js new file mode 100644 index 000000000..2c5d008a4 --- /dev/null +++ b/js/swad18.80.js @@ -0,0 +1,1633 @@ +// swad.js: javascript functions + +/* + SWAD (Shared Workspace At a Distance), + is a web platform developed at the University of Granada (Spain), + and used to support university teaching. + Copyright (C) 1999-2019 Antonio Caņas-Vargas + University of Granada (SPAIN) (acanas@ugr.es) + + This program is free software: you can redistribute it and/or modify + it under the terms of the GNU Affero General Public License as + published by the Free Software Foundation, either version 3 of the + License, or (at your option) any later version. + + 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 Affero General Public License for more details. + + You should have received a copy of the GNU Affero General Public License + along with this program. If not, see . +*/ +"use strict"; + +// Global variable (string) used to write HTML +var Gbl_HTMLContent; + +// Global variable used to call SWAD via AJAX +var ActionAJAX; + +/*****************************************************************************/ +/*************** Write a date-time in client local time **********************/ +/*****************************************************************************/ +// id is the id of the HTML element in which date-time will be written +// TimeUTC is the date-time to write in UTC UNIX time format +// DateFormat: +// Dat_FORMAT_YYYY_MM_DD = 0 +// Dat_FORMAT_DD_MONTH_YYYY = 1 +// Dat_FORMAT_MONTH_DD_YYYY = 2 +// separator is HTML code to write between date and time +// StrToday is a string in current language ('today', 'hoy'...) +// WriteDateOnSameDay = false ==> don't write date if it's the same day than the last call +// WriteWeekDay = true ==> write day of the week ('monday', 'tuesday'...) +// WriteHMS = 3 least significant bits for hour, minute and second + +function writeLocalDateHMSFromUTC (id,TimeUTC,DateFormat,Separator,StrToday, + WriteDateOnSameDay,WriteWeekDay,WriteHMS) { + // HMS: Hour, Minutes, Seconds + var today = new Date(); + var todayYea = today.getFullYear(); + var todayMon = today.getMonth() + 1; + var todayDay = today.getDate(); + var d = new Date(); + var WriteDate; + var WriteTodayStr; + var Yea; + var Mon; + var Day; + var DayOfWeek; + var Hou; + var Min; + var Sec; + var StrDate; + var StrMon; + var StrDay; + var StrHou; + var StrMin; + var StrSec; + + d.setTime(TimeUTC * 1000); + Yea = d.getFullYear(); + Mon = d.getMonth() + 1; + Day = d.getDate(); + + if (WriteDateOnSameDay) + WriteDate = true; + // Check to see if the last date has been initialized + else if (typeof writeLocalDateHMSFromUTC.lastd == 'undefined') // Static variable to remember current date for the next call + // Not initialized + WriteDate = true; + else + WriteDate = (Yea != writeLocalDateHMSFromUTC.lastd.getFullYear() || + Mon != writeLocalDateHMSFromUTC.lastd.getMonth() + 1 || + Day != writeLocalDateHMSFromUTC.lastd.getDate()) + + writeLocalDateHMSFromUTC.lastd = d; // Update last date for the next call + + /* Set date */ + if (WriteDate) { + WriteTodayStr = false; + if (StrToday != null) + if (StrToday.length && + Yea == todayYea && + Mon == todayMon && + Day == todayDay) // Today + WriteTodayStr = true; + + if (WriteTodayStr) + StrDate = StrToday; + else + switch (DateFormat) { + case 0: // Dat_FORMAT_YYYY_MM_DD + StrMon = ((Mon < 10) ? '0' : '') + Mon; + StrDay = ((Day < 10) ? '0' : '') + Day; + StrDate = Yea.toString() + '-' + StrMon + '-' + StrDay; + break; + case 1: // Dat_FORMAT_DD_MONTH_YYYY + StrDate = Day.toString() + ' ' + MonthsShort[Mon - 1] + ' ' + Yea.toString(); + break; + case 2: // Dat_FORMAT_MONTH_DD_YYYY + StrDate = MonthsShort[Mon - 1] + ' ' + Day.toString() + ', ' + Yea.toString(); + break; + default: + StrDate = ''; + break; + } + + if (WriteWeekDay) { + DayOfWeek = d.getDay(); + DayOfWeek = (DayOfWeek == 0) ? 6 : DayOfWeek - 1; + StrDate = StrDate + Separator + DAYS[DayOfWeek]; + } + StrDate = StrDate + Separator; + } + else + StrDate = ''; + + /* Set HH:MM:SS */ + StrHou = ''; + StrMin = ''; + StrSec = ''; + if (WriteHMS & (1<<2)) { + // Bit 2 on => Write hour + Hou = d.getHours(); + StrHou = ((Hou < 10) ? '0' : '') + Hou; + if (WriteHMS & (1<<1)) { + // Bits 2,1 on => Write minutes + Min = d.getMinutes(); + StrMin = ((Min < 10) ? ':0' : ':') + Min; + if (WriteHMS & 1) { + // Bits 2,1,0 on => Write seconds + Sec = d.getSeconds(); + StrSec = ((Sec < 10) ? ':0' : ':') + Sec; + } + } + } + + /* Write date and time */ + document.getElementById(id).innerHTML = StrDate + StrHou + StrMin + StrSec; +} + +/*****************************************************************************/ +/************** Set local date-time form fields from UTC time ****************/ +/*****************************************************************************/ + +function setLocalDateTimeFormFromUTC (id,TimeUTC) { + var FormYea = document.getElementById(id+'Year' ); + var FormMon = document.getElementById(id+'Month' ); + var FormDay = document.getElementById(id+'Day' ); + var FormHou = document.getElementById(id+'Hour' ); + var FormMin = document.getElementById(id+'Minute'); + var FormSec = document.getElementById(id+'Second'); + var d; + var Year; + var YearIsValid = false; + var Hou; + var Min; + var Sec; + + if (TimeUTC) { + d = new Date(); + d.setTime(TimeUTC * 1000); + + Year = d.getFullYear(); + for (var i=0; i=0; i--) + if (FormMin.options[i].value <= Min) { + FormMin.options[i].selected = true; + break; + } + + if (FormSec) { + Sec = d.getSeconds(); + FormSec.options[d.getSeconds()].selected = true; + } + } + } + + if (!YearIsValid) { + FormYea.options[0].selected = true; + FormMon.options[0].selected = true; + FormDay.options[0].selected = true; + FormHou.options[0].selected = true; + FormMin.options[0].selected = true; + FormSec.options[0].selected = true; + } +} + +/*****************************************************************************/ +/************** Set UTC time from local date-time form fields ****************/ +/*****************************************************************************/ + +function setUTCFromLocalDateTimeForm (id) { + var Seconds = 0; + var idSecond = document.getElementById(id+'Second'); + if (idSecond) // id+'Second' present + Seconds = idSecond.value; + // Important: set date all at once to avoid problems with different length of months + var d = new Date(document.getElementById(id+'Year' ).value, + document.getElementById(id+'Month' ).value-1, + document.getElementById(id+'Day' ).value, + document.getElementById(id+'Hour' ).value, + document.getElementById(id+'Minute').value, + Seconds, + 0); + document.getElementById(id+'TimeUTC').value = d.getTime() / 1000; +} + +/*****************************************************************************/ +/******************* Set form params related to time zones *******************/ +/*****************************************************************************/ + +// Set form param with time difference between UTC time and client local time, in minutes +// For example, if your time zone is GMT+2, -120 will be returned +function setTZ (id) { + var FormTZ = document.getElementById(id); + var d = new Date(); + + FormTZ.value = d.getTimezoneOffset(); +} + +// Set form param with the name of the time zone +function setTZname (id) { + var FormTZname = document.getElementById(id); + var tz = jstz.determine(); // Determines the time zone of the browser client + FormTZname.value = tz.name(); // Returns the name of the time zone eg "Europe/Berlin" +} + +/*****************************************************************************/ +/********* Adjust a date form correcting selector days in the month **********/ +/*****************************************************************************/ + +// The selector of days can start by 1, 2, 3... or by -, 1, 2, 3... +function adjustDateForm (id) { + var FormYea = document.getElementById(id+'Year' ); + var FormMon = document.getElementById(id+'Month'); + var FormDay = document.getElementById(id+'Day' ); + var Yea = Number(FormYea.options[FormYea.selectedIndex].value); + var Mon = Number(FormMon.options[FormMon.selectedIndex].value); + + if (Yea != 0 && Mon != 0) { + var LastDayIndex = FormDay.options.length - 1; + var LastDayValue = Number(FormDay.options[LastDayIndex].value); + var SelectedDay = Number(FormDay.options[FormDay.selectedIndex].value); + var Days = daysInMonth (Mon,Yea); + + // If current selected day is out of range... + if (SelectedDay > Days) + // Select last day in month + for (var i=LastDayIndex; i>=0; i--) + if (FormDay.options[i].value == Days) { + FormDay.options[i].selected = true; + break; + } + + // Create new days at the end if necessary + for (var Day = Number(LastDayValue) + 1; Day <= Days; Day++) { + var opt = document.createElement('option'); + opt.value = opt.text = Day; + FormDay.add(opt); + } + + // Remove days from the end if necessary + for (var i=LastDayIndex; i>=0; i--) + if (FormDay.options[i].value > Days) + FormDay.options[i] = null; + else + break; + } +} + +/*****************************************************************************/ +/*********************** Get number of days in a month ***********************/ +/*****************************************************************************/ + +function daysInMonth (month, year) { // Month is 1 based + return new Date(year, month, 0).getDate(); // 0 is the last day of previous month +} + +/*****************************************************************************/ +/****************** Set a date range form to a specific day ******************/ +/*****************************************************************************/ + +// Set a date range form to yesterday +function setDateToYesterday (idStart,idEnd) { + var d = new Date(); + + d.setTime (d.getTime () - 24 * 60 * 60 * 1000); // Today - 1 day + setDateRange(idStart,idEnd,d); +} + +// Set a date range form to today +function setDateToToday (idStart,idEnd) { + var d = new Date(); + + setDateRange(idStart,idEnd,d); +} + +function setDateRange (idStart,idEnd,d) { + var FormYea; + var Yea = d.getFullYear(); + var Mon = d.getMonth() + 1; + var Day = d.getDate(); + + FormYea = document.getElementById(idStart+'Year'); + for (var i=0; i= 60) { + H = Math.floor(M / 60); + M %= 60; + } else + H = 0; + S = ListSeconds[i] % 60; + if (H != 0) { + StrM = ((M < 10) ? '0' : '') + M; + StrS = ((S < 10) ? '0' : '') + S; + PrintableClock = H + ':' + StrM + ''' + StrS + '"'; + } else if (M != 0) { + StrS = ((S < 10) ? '0' : '') + S; + PrintableClock = M + ''' + StrS + '"'; + } else + PrintableClock = S + '"'; + BoxClock.innerHTML = PrintableClock; + } + } + } + setTimeout('writeClockConnected()',1000); // refresh after 1 second +} + +/*****************************************************************************/ +/************* Automatic refresh of connected users using AJAX ***************/ +/*****************************************************************************/ + +// This function must be called from time to time +var objXMLHttpReqCon = false; +function refreshConnected () { + objXMLHttpReqCon = AJAXCreateObject(); + if (objXMLHttpReqCon) { + var RefreshParams = RefreshParamNxtActCon + '&' + + RefreshParamIdSes + '&' + + RefreshParamCrsCod; + + objXMLHttpReqCon.onreadystatechange = readConnUsrsData; // onreadystatechange must be lowercase + objXMLHttpReqCon.open('POST',ActionAJAX,true); + objXMLHttpReqCon.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); + objXMLHttpReqCon.send(RefreshParams); + } +} + +// Receive and show connected users data +function readConnUsrsData () { + if (objXMLHttpReqCon.readyState == 4) { // Check if data have been received + if (objXMLHttpReqCon.status == 200) { + var endOfDelay = objXMLHttpReqCon.responseText.indexOf('|',0); // Get separator position + var endOfNotif = objXMLHttpReqCon.responseText.indexOf('|',endOfDelay + 1); // Get separator position + var endOfGblCon = objXMLHttpReqCon.responseText.indexOf('|',endOfNotif + 1); // Get separator position + var endOfCrsCon = objXMLHttpReqCon.responseText.indexOf('|',endOfGblCon + 1); // Get separator position + var endOfNumUsrs = objXMLHttpReqCon.responseText.indexOf('|',endOfCrsCon + 1); // Get separator position + + var delay = parseInt(objXMLHttpReqCon.responseText.substring(0,endOfDelay)); // Get refresh delay + var htmlNotif = objXMLHttpReqCon.responseText.substring(endOfDelay + 1,endOfNotif); // Get HTML code for new notifications + var htmlGblCon = objXMLHttpReqCon.responseText.substring(endOfNotif + 1,endOfGblCon); // Get HTML code for connected + var htmlCrsCon = objXMLHttpReqCon.responseText.substring(endOfGblCon + 1,endOfCrsCon); // Get HTML code for course connected + var NumUsrsStr = objXMLHttpReqCon.responseText.substring(endOfCrsCon + 1,endOfNumUsrs); // Get number of users + var startOfUsr; + var endOfUsr; + + NumUsrsCon = (NumUsrsStr.length ? parseInt(NumUsrsStr) : 0); + + var divNewNotif = document.getElementById('msg'); // Access to new notifications DIV + if (divNewNotif) + divNewNotif.innerHTML = (htmlNotif.length) ? htmlNotif : ''; // Update new notifications DIV + + var divGblConnected = document.getElementById('globalconnected'); // Access to global connected DIV + if (divGblConnected) + divGblConnected.innerHTML = htmlGblCon; // Update global connected DIV + if (htmlCrsCon.length) { + var divCrsConnected = document.getElementById('courseconnected'); // Access to course connected DIV + if (divCrsConnected) { + divCrsConnected.innerHTML = htmlCrsCon; // Update course connected DIV + countClockConnected = 0; // Don't refresh again using writeClockConnected until past 10 seconds + startOfUsr = endOfNumUsrs + 1; + for (var NumUsr=0; NumUsr= 60000) // If refresh slower than 1 time each 60 seconds, do refresh; else abort + setTimeout('refreshConnected()',delay); + } + } +} + +/*****************************************************************************/ +/**************** Automatic refresh of last clicks using AJAX ****************/ +/*****************************************************************************/ + +// This function must be called from time to time +var objXMLHttpReqLog = false; +function refreshLastClicks () { + objXMLHttpReqLog = AJAXCreateObject(); + if (objXMLHttpReqLog) { + var RefreshParams = RefreshParamNxtActLog + '&' + + RefreshParamIdSes + '&' + + RefreshParamCrsCod; + + objXMLHttpReqLog.onreadystatechange = readLastClicksData; // onreadystatechange must be lowercase + objXMLHttpReqLog.open('POST',ActionAJAX,true); + objXMLHttpReqLog.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); + objXMLHttpReqLog.send(RefreshParams); + } +} + +function readLastClicksData () { + if (objXMLHttpReqLog.readyState == 4) { // Check if data have been received + if (objXMLHttpReqLog.status == 200) { + var endOfDelay = objXMLHttpReqLog.responseText.indexOf('|',0); // Get separator position + + var delay = parseInt(objXMLHttpReqLog.responseText.substring(0,endOfDelay)); // Get refresh delay + var htmlLastClicks = objXMLHttpReqLog.responseText.substring(endOfDelay + 1); // Get HTML code for last clicks + + var divLastClicks = document.getElementById('lastclicks'); // Access to last click DIV + if (divLastClicks) + divLastClicks.innerHTML = htmlLastClicks; // Update global connected DIV + if (delay > 200) // If refresh slower than 1 time each 0.2 seconds, do refresh; else abort + setTimeout('refreshLastClicks()',delay); + } + } +} + +/*****************************************************************************/ +/*** Automatically refresh new publications in social timeline using AJAX ****/ +/*****************************************************************************/ + +// This function must be called from time to time +var objXMLHttpReqNewTL = false; +function refreshNewTimeline () { + objXMLHttpReqNewTL = AJAXCreateObject(); + if (objXMLHttpReqNewTL) { + var RefreshParams = RefreshParamNxtActNewPub + '&' + + RefreshParamIdSes + '&' + + RefreshParamWhichUsrs; + + objXMLHttpReqNewTL.onreadystatechange = readNewTimelineData; // onreadystatechange must be lowercase + objXMLHttpReqNewTL.open('POST',ActionAJAX,true); + objXMLHttpReqNewTL.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); + objXMLHttpReqNewTL.send(RefreshParams); + } +} + +// Receive and show new social timeline data +function readNewTimelineData () { + if (objXMLHttpReqNewTL.readyState == 4) { // Check if data have been received + if (objXMLHttpReqNewTL.status == 200) { + + var justNowTimeline = document.getElementById('just_now_timeline_list');// Access to UL for the just received timeline + if (justNowTimeline) { + justNowTimeline.innerHTML = objXMLHttpReqNewTL.responseText; // Update list of publications in just now timeline + + var countJustNowTimeline = justNowTimeline.childNodes.length; + if (countJustNowTimeline) { // New pubs just retrieved + // Scripts in timeline got via AJAX are not executed ==> execute them + evalScriptsInElem (justNowTimeline); + + // Process mathematics; see http://docs.mathjax.org/en/latest/advanced/typeset.html + MathJax.Hub.Queue(["Typeset",MathJax.Hub,justNowTimeline]); + + // Move just received timeline to top of new timeline + var newTimeline = document.getElementById('new_timeline_list'); // Access to UL with the new timeline + + // Move all the LI elements in UL 'just_now_timeline_list' to the top of UL 'new_timeline_list' + for (var i=0; i