Index: lams_central/web/css/defaultMainHTML_rtl.css =================================================================== diff -u --- lams_central/web/css/defaultMainHTML_rtl.css (revision 0) +++ lams_central/web/css/defaultMainHTML_rtl.css (revision 47be8dfe4cf5a275b62258d8775c579bb109f1db) @@ -0,0 +1,1053 @@ +/* +************************************************* +LAMS 2.0 +CVS ID $id$ + +************************************************* +General page styles +********************************************** */ + +* { + margin: 0px; + padding: 0px; +} + +body { + background-color:#fff; + line-height:16px; + font-size: 11px; + font-family: verdana, arial, helvetica, sans-serif; +} + +a { + color: #47bc23; + text-decoration: none; + border-bottom: 1px dotted #47bc23; + text-decoration: none; +} + +a:hover { + color: #47bc23; + text-decoration: none; + border-bottom: 1px solid #47bc23; + text-decoration: none; +} + +body.stripes { + background: url('../images/css/diagonal_bg.gif'); +} + +.row { + voice-family: "\"}\""; /* hide the following rules from IE5 */ + voice-family: inherit; + overflow: hidden; /* CSS 'clearing hack' - works on all except for IE5, that's why the IE5 box model hack above */ +} + +* html .row { + height: 1%; +} /* part of the CSS 'clearing hack' */ + + +h1 { + color:#0087e5; + font-size:15px; + margin-bottom:0px; + margin-right:10px; + padding-top:5px; } + + +/*when there are no tabs at the top of the page */ +h1.no-tabs-below { + color:#0087e5; + font-size:16px; + margin-bottom:0px; + margin-right:10px; + padding-top:25px; } + +h2 {color:#47bc23; + font-size:12px; + margin-right:10px; + margin-bottom:10px; + margin-top:10px; } + +h2.no-space-left { + margin-right:0px; +} + +h2.spacer-left{ + margin-right:25px; +} + +span.h2font {color:#47bc23; + font-size:12px; } + + +h3 {color:#47bc23; + font-size:12px; + margin-right:10px; + margin-bottom:10px; + margin-top:10px; } + + + +h4 {color:#47bc23; font-size:11px;} + +/*defines when instructions are given and places a blue arrow before the text */ +p.instructions { + color: #0087e5; + margin-bottom: 0px; + margin-top: 0px;; + margin-right: 30px; + font-weight: bold; + background: url('../images/css/blue_arrow_left.gif') no-repeat top right; + padding-right: 30px; + padding-bottom: 10px; + font-size: 12px +} + +p { + margin-right: 25px; + margin-left: 30px; + margin-bottom: 18px; +} + +ul { + margin-right: 25px; + margin-left: 30px; +} + +ul li { list-style-type:circle;} + +ol { + margin-right: 25px; + margin-left: 30px; +} + +li.no-list-type { + list-style-type: none; +} +#page { /*whole layout of page*/ + margin: 25px auto; + width: 100%; + background: url('../images/css/lams_logo.gif') no-repeat -10px 10px; +} + +#header { /*layout of the header */ + width: 90%; + min-width:707px; + margin-left:auto; + margin-right:auto; + margin-bottom:5px; + +} + +#header-no-tabs { /*layout of the header when no-tabs are required. Big enough to line up with LAMS icon - don't use for learner (see header-no-tabs-learner) */ + width:90%; + margin-left:auto; + margin-right:auto; + min-width:707px; + height:40px; + background:url('../images/css/top_bg.jpg') no-repeat bottom; +} + + + + + +/* +************************************************* + +Layout of tab navigation section + +********************************************** */ +#nav { /* layout of box that contains the main navigation */ + margin-top: 15px; + width: auto; + height: 24px; + margin-right: -1px; +} + +#nav a { + color: #0087e5; + text-decoration: none; + font-size: 12px; + font-weight: bold; + border:0; +} + +#nav a:hover { + color: #006bb6; + text-decoration: none; + border:0; +} + +#nav a.selected { + color: #333; + border:0; +} + + + + +/* +************************************************* + +Tab navigation styles + +********************************************** */ +.nav-box { /* layout of containers that surround the tab navigation */ + height: 31px; + width: auto; + margin-left: 2px; + + float: right; + text-align: center; +} + +.tab-left-selected { /* defines left side of selected tab */ + height: 31px; + width: 8px; + background: url('../images/css/selected_left.jpg') no-repeat top left; + float: left +} + +.tab-middle-selected { /* defines middle of selected tab */ + height: 31px; + width: 90px; + background: url('../images/css/selected_bg.jpg') repeat-x; + float: left; + padding:8px 5px 0px 5px; +} + +#nav .tab-middle-link-selected { + color: #333333 +} + +.tab-right-selected { /* defines right side of selected tab */ + height: 31px; + width: 8px; + background: url('../images/css/selected_right.jpg') no-repeat top right; + float: left +} + +.tab-left { /* defines left side of selected tab */ + height: 31px; + width: 8px; + background: url('../images/css/button_left.jpg') no-repeat top left; + float: left +} + +.tab-middle { /* defines middle of selected tab */ + height: 31px; + width: 90px; + background: url('../images/css/button_bg.jpg') repeat-x; + float: left; + padding:8px 5px 0px 5px; +} + +#nav .tab-middle-link { + color: #0087e5 +} + +.tab-right { /* defines right side of selected tab */ + height: 31px; + width: 8px; + background: url('../images/css/button_right.jpg') no-repeat top right; + float: left +} + + .tab-left-highlight { /* defines left side of selected tab */ + height: 31px; + width: 8px; + background: url('../images/css/button_highlight_left.jpg') no-repeat top left; + float: left + } + + .tab-middle-highlight { /* defines middle of selected tab */ + height: 31px; + width: 90px; + background: url('../images/css/button_highlight_bg.jpg') repeat-x; + float: left; + + padding:8px 5px 0px 5px; + } + + #nav .tab-middle-highlight-link { + color: #FFFFFF + } + + .tab-right-highlight { /* defines right side of selected tab */ + height: 31px; + width: 8px; + background: url('../images/css/button_highlight_right.jpg') no-repeat top right; + float: left + } + +/* +************************************************* + +Layout of main content section + +********************************************** */ +#content { /*box around the main content area */ + background-color:#fff; + font-size: 11px; + border:1px solid #d4d8da; + margin-top: 0px; + margin-left:auto; + margin-right:auto; + margin-bottom:-5px; + width:90%; + height:100%; + padding-bottom:-5px; + min-width:707px; +} + +/*layout of Links within the content area */ +#content a { + color: #47bc23; + text-decoration: none; + border-bottom: 1px dotted #47bc23; +} + +#content a:hover { + color: #47bc23; + text-decoration: none; + border-bottom: 1px solid #47bc23; +} + +/*layout of a general button*/ +#content a.button { + background: url('../images/css/btn_off.gif') repeat-x 0px 0px; + color: #333; + border: 0px none; + padding:5px 20px 6px 20px; + text-decoration: none; + font-size:11px; +} + +/* style to disbable input buttons */ +#content a.button .disabled { + color: #999; + background: url('../images/css/btn_off.gif') repeat-x 0px 0px; + border: 0px none; + padding:5px 20px 6px 20px; + } + +#content a:hover.button { + background: url('../images/css/btn_over.gif') repeat-x 0px 0px; + color: #349018; + border: 0px none; + padding:5px 20px 6px 20px; + text-decoration: none; +} + +/*layout of a general button*/ +a.button { + background: url('../images/css/btn_off.gif') repeat-x 0px 0px; + color: #333; + border: 0px none; + padding:3px 15px 5px 15px; + font-size:11px; + display: table-cell; + +} + +a:hover.button { + background: url('../images/css/btn_over.gif') repeat-x 0px 0px; + color: #349018; + border: 0px none; + padding:3px 15px 5px 15px; + font-size:11px; + display: table-cell; +} + + +/* Hovering submit button */ +input.button { + background: url('../images/css/btn_off.gif') repeat-x 0px 0px; + color: #333; + border: 0px none; + padding:5px 20px 6px 20px; + text-decoration: none; + font-size: 11px; + font-family: verdana, arial, helvetica, sans-serif; +} + +input:hover.button { + background: url('../images/css/btn_over.gif') repeat-x 0px 0px; + color: #349018; + border: 0px none; + padding:5px 20px 6px 20px; + text-decoration: none; + font-size: 11px; + font-family: verdana, arial, helvetica, sans-serif; +} + +input.disabled { + color: #999; + background: url('../images/css/btn_off.gif') repeat-x 0px 0px; + border: 0px none; + padding:5px 20px 6px 20px; + font-size:11px; + } + +.box { + display: none; + min-height: 100px; + margin-right:5%; + margin-left:5%; +} + +#footer { /*layout of the footer - the bottom of the box */ + width: 100%; + height: 14px; +} + +#footer a{ /*layout of the footer - the bottom of the box */ + color:#85aacd; + border-bottom:1px solid #85aacd; + } + +/*layout of the table with the alternate color for the table heading cell */ +table.alternative-color { + width:91%; + margin-right:17px; + padding-top:0px; + margin-bottom:15px; + text-align:right; +} + +table.alternative-color th { + background: url('../images/css/green_bg.jpg') repeat-x; + height: 30px; + color: #47bc23; + padding-right: 15px; + border-right: 1px solid #cacdd1; + border-left: 1px solid #fff; + font-size: 12px; +} + +table.alternative-color td { + padding-right: 20px; + font-size: 11px; + border-bottom: 1px solid #efefef; + vertical-align: top; + background:url('../images/css/greyfade_bg.jpg') repeat-x 3px 0px +} + +table.alternative-color td.first, table.alternative-color th.first { + border-right: none; + padding-right: 20px; +} + + +/* Used for chosen grouping */ +table.chosengrouping { + width:98%; + margin-left:0px; + text-align:center; + } + +table.chosengrouping tr { + vertical-align:top +} + +table.chosengrouping th { + padding:0px; + font-size:11px; + text-align:center; +} + +table.chosengrouping td { + padding:0px; + font-size:11px; + text-align:center; +} + +table.chosengrouping td p{ + padding:0px; + font-size:11px; + line-height:11px; +} + +table.chosengrouping td select { + font-size:11px; +} +/*layout of the table with form elements */ + +table { + width:100%; + margin-left:auto; + margin-right:auto; + text-align:right; +} + +td { + padding:10px; + font-size:12px; + margin-right:auto; + margin-left:auto; + align:center; +} + +td p{ + padding:10px; + font-size:12px; + line-height:18px; +} + +/*layout of button in table +td .button{ + margin:0px; + padding:10px 10px 10px 0px; + font-size:11px; + font-family: verdana, arial, helvetica, sans-serif; +} +*/ + + +/* */ /*layout of form styles */ +.field-name{ + color: #0087e5; + font-weight: bold; + text-align: right; + padding-bottom:10px; +} + +.field-name-alternative-color { + color: #47bc23; + font-weight: bold; + padding-bottom:10px; + text-align: right; +} + +input { + border: 1px solid #c1c1c1; + padding: 2px; +} + +textarea { + border: 1px solid #c1c1c1; + padding: 2px; +} + +.noBorder { + border: none; +} + +/*misc styles*/ +.space-right { + margin-right: 10px; +} + +.space-left { + margin-left: 10px; +} + +.space-bottom { + margin-bottom: 40px; +} + +.space-bottom-top { + padding-bottom: 20px; + padding-top: 20px; + padding-right:20px; /* Testing spacing IE */ +} + +.small-space-bottom { + margin-bottom: 20px; +} + +.small-space-top {padding-top:6px;} + +.space-top {padding-top:20px;} + +.title-space-top {margin-top:12px;} + +hr {border:0px; + border-top:1px solid #ccc; + width: 630px; + height: 1px; + + } + +/* Warning message style */ +.warning { + color: #cc0000; + padding:8px 40px 10px 5px; + margin-top: 25px; + margin-left: auto; + margin-right: auto; + text-align: right; + font-weight: normal; + background: url('../images/css/warning.gif') no-repeat #ffeae0 right 10px; + width: 70%; + border: 1px solid #E82A28; +} + +.warning-login { + color: #cc0000; + padding:5px 5px; + padding-right: 35px; + padding-bottom: -10px; + margin-top: -5px; + margin-bottom: -10px; + margin-right: 15px; + text-align: right; + font-weight: normal; + background: url('../images/css/warning.gif') no-repeat #ffeae0 right 10px; + width: 70%; + border: 1px solid #E82A28; +} + +b.error {color:#cc0000;} + + +/* +************************************************* + +Floating button containers + +********************************************** */ + +.left-buttons {float:right; padding-right:20px;} + +.right-buttons {float:left; padding-left:20px; padding-top:5px;} + + + +/* +************************************************* + +My Courses Pages +********************************************** */ + +/* welcome user box */ + + +.welcome {margin-bottom:35px; margin-top:0px; background-color:#33FFFF; margin-right:20px;margin-left:10px;} + +.float-left {float:right;} + +.float-right {float:left;} + + + +/* layout for my-courses pages */ + +.my-courses { + background: url('../images/css/diagonal_bg.gif') repeat; +} + + +#page-mycourses { /*whole layout of page*/ + margin: 25px auto; + width: 100%; + background: url('../images/css/lams_logo.gif') no-repeat 95% -7px; + +} + +#page-mycourses #footer { /*layout of the footer - the bottom of the box */ + width: 90%; + min-width:707px; + margin-left:auto; + margin-right:auto; +} + +#page-mycourses #footer p{ + padding:20px 0px 0px 10px; + text-align:center; + font-family: verdana, arial, helvetica, sans-serif; + font-size:.9em; + color:#999; +} + + +#header-my-courses { /*layout of the header */ + width:90%; + min-width:707px; + margin-left:auto; + margin-right:auto; + margin-bottom:5px; +} + +/* my courses nav */ + +.nav-box-right { + height: 31px; + width: auto; + margin-left: -1px; + margin-top: 16px; + float: left; + text-align: center; + margin-right: 3px; +} + +#nav-right { /* layout of box that contains the main navigation */ + margin-top:30px; + width: 100%; + height: 40px; +} + +#nav-right a { + color: #0087e5; + text-decoration: none; + font-size: 12px; + font-weight: bold; +} + +#nav-right a:hover { + color: #006bb6; + text-decoration: none; +} + +#nav-right a.selected { + color: #333; +} + + +/* my courses grey buttons in the green bar */ + +.mycourses-left-buttons { + float:right; padding-left:10px; +} + +.mycourses-right-buttons { + float:left; padding-left:15px; margin-top:6px; height:24px; font-size:11px; +} + +#content a.sorting { border-bottom: none; cursor: pointer; } + +#content a.add-lesson-button { + background: url('../images/css/add_lesson.rtl.jpg') no-repeat top right; + color: #666; + padding: 5px 30px 3px 12px; + text-decoration: none; + border-left:1px solid #d2d2d2; + border-bottom: 0px; + display:block; +} + + +#content a:hover.add-lesson-button { + background: url('../images/css/add_lesson.rtl.jpg') no-repeat top right; + color: #47bc23; + padding: 5px 30px 3px 12px; + text-decoration: none; + border-left:1px solid #d2d2d2; + border-bottom: 0px; + display:block; +} + + +#content a.manage-group-button { + background: url('../images/css/manage_groups.rtl.jpg') no-repeat top right; + color: #666; + padding: 5px 30px 3px 12px; + text-decoration: none; + border-left:1px solid #d2d2d2; + border-bottom: 0px; + display:block; +} + + +#content a:hover.manage-group-button { + background: url('../images/css/manage_groups.rtl.jpg') no-repeat top right; + color: #47bc23; + padding: 5px 30px 3px 12px; + text-decoration: none; + border-left:1px solid #d2d2d2; + border-bottom: 0px; + display:block; +} + +#content a.show-all-groups-button { + background: url('../images/css/show_all_groups.jpg') no-repeat 0px 0px; + color: #666; + padding: 5px 16px 6px 12px; + text-decoration: none; + border-right:1px solid #d2d2d2; + border-bottom: 0px; +} + +#content a:hover.show-all-groups-button { + background: url('../images/css/show_all_groups.jpg') no-repeat 0px 0px; + color: #47bc23; + padding: 5px 16px 6px 12px; + text-decoration: none; + text-align:left; + border-right:1px solid #d2d2d2; + border-bottom: 0px; +} + + +/* my courses individual course boxes */ + +.course-bg { /*---- box around the green tabbed items -- */ + margin-top:15px; + margin-bottom:20px; + width:100%; + background:#fff url('../images/css/mycourses_greentab-minimal.jpg') repeat-x top; + margin-right:0px; + +} + +.course-bg h2 { + font-size:13px; + color:#47bc23; + padding-right:0px; + margin-top:12px; + margin-right:0px; +} + +.course-bg h4 { + font-size:12px; + color:#47bc23; + padding-right:0px +} + +.course-buttons { + margin-right:0px; +} + +/************ The sequence name box **********/ +.sequence-name { + margin-top:5px; + margin-right:30px; + +} + +.sequence-name p{ + margin:0px; + +} + + +#content a.sequence-name-link { + color:#0087E5; + text-decoration: none; + border-bottom: 1px dotted #0087E5; + } + + +#content a:hover.sequence-name-link { + color:#0087E5; + text-decoration: none; + border-bottom: 1px solid #0087E5; + +} + +#content a.sequence-action-link { + color:#47bc23; + text-decoration: none; + border:0px; + font-variant:small-caps; + margin-right:20px; +} + +#content a:hover.sequence-action-link { + color:#47bc23; + text-decoration: none; + border-bottom:0px; + font-variant:small-caps; + margin-right:20px; + } + +.sequence-description-tooltip { + border: 1px solid #d2d2d2; + background-color: #ffffff; + padding: 4px; + color: #000000; + font-family: Arial, Helvetica, sans-serif; + font-size: 12px; + width: 250px; +} +.sequence-description-tooltip #tooltipURL { + display: none; +} + +/************ The group name box **********/ + +.group-name { +margin-top:5px; +margin-right:60px; +} + +.group-name p { +padding-top:0px; +margin-bottom:0px; +padding-right:0px; +margin-right:0px; +} + +.group-name strong { +color: #666; +} + +/*aligns the image in the middle of the line - gives padding */ +.align-middle{ +vertical-align:middle; +padding-right:0px; +border:0px; +} + +.help {text-align:left; margin-left:35px; cursor: pointer;} + +.help-no-tabs {float:left; cursor:pointer;} + +/************ My Profile custom **********/ +.align-right{ +text-align:left; +} +.align-left{ +text-align:right; +} + + +.shading-bg { + padding: 5px; + padding-right: 10px; + padding-top: 10px; + margin-top: 10px; + margin-bottom: 10px; + width: 98%; + border-top: 1px solid #ccc; + background: url('../images/css/greyfade_bg.jpg') repeat-x 3px -1px +} + +.img-border { + padding: 2px; + border: 1px solid #dcdcdc; +} + +.userpage-td {border-right:1px solid #ccc;} + +/*IE style workarounds */ + +* html #header { /*layout of the header */ + width: 90%; + min-width:707px; + margin-left:auto; + margin-right:auto; + margin-bottom:5px; +} + +* html #header-my-courses { /*layout of the header */ + width:90%; + min-width:707px; + margin-left:auto; + margin-right:auto; + margin-bottom:5px; +} + +* html .nav-box-right { + height: 31px; + width: auto; + margin-left: -1px; + margin-top: 16px; + float: left; + text-align: center; + margin-right: 3px; +} + +* html #nav-right { /* layout of box that contains the main navigation */ + margin-top:30px; + width: 100%; + height: 40px; +} + +* html .mycourses-right-buttons { + float:left; padding-left:15px; margin-top:6px; height:24px; font-size:11px; +} + +* html #content { + background-color:#fff; + font-size: 11px; + border:1px solid #d4d8da; + margin-top: -15px; + margin-left:auto; + margin-right:auto; + margin-bottom:-5px; + width:90%; + height:100%; + padding-bottom:-5px; + min-width:707px; + position:relative; + z-index:1; +} + +* html .right-buttons {float:left; padding-left:20px; padding-top:5px;} + +* html .space-bottom { + margin-bottom: 40px; + +} + +* html #nav-right { /* layout of box that contains the main navigation */ + margin-top:30px; + width: 100%; + height: 40px; + position:relative; + z-index:2; + margin-left:-1px; +} + +* html #page-mycourses { /*whole layout of page*/ + margin: 25px auto; + width: 100%; + background: url('../images/css/lams_logo.gif') no-repeat 95% 25px; +} + +/*IE 7 workarounds */ + +*:first-child+html #page-mycourses { /*whole layout of page*/ + margin: 25px auto; + width: 100%; + background: url('../images/css/lams_logo.gif') no-repeat 95% -5px; +} + +*:first-child+html .nav-box-right { + height: 31px; + width: auto; + margin-left: -1px; + margin-top: -18px; + float: left; + text-align: center; + margin-right: 3px; +} + +*:first-child+html .mycourses-right-buttons { + float:left; padding-left:15px; margin-top:6px; height:24px; font-size:11px; +} + +*:first-child+html #header { /*layout of the header */ + width: 90%; + min-width:707px; + margin-left:auto; + margin-right:auto; + margin-bottom:5px; +} + +*:first-child+html #header-my-courses { /*layout of the header */ + width:90%; + min-width:707px; + margin-left:auto; + margin-right:auto; + margin-bottom:-25px; +} + +*:first-child+html #nav-right { /* layout of box that contains the main navigation */ + margin-top:30px; + width: 100%; + height: 40px; + position:relative; + z-index:2; +} + + + + + + +