diff --git a/core/static/core/style.scss b/core/static/core/style.scss index 36d57876..de042bb9 100644 --- a/core/static/core/style.scss +++ b/core/static/core/style.scss @@ -1465,514 +1465,3 @@ a.ui-button:active, } } } - -/* --------------------------------------pedagogy-----------------------------------*/ - -$pedagogy-blue: #1bb9ea; -$pedagogy-orange: #ea7900; -$pedagogy-hover-blue: #0e97ce; -$pedagogy-light-blue: #caf0ff; -$pedagogy-white-text: #f0f0f0; - -.pedagogy { - #pagination { - text-align: center; - } - - &.star-not-checked { - color: #f7f7f7; - margin-bottom: 0; - margin-top: 0; - } - &.star-checked { - color: $pedagogy-orange; - margin-bottom: 0; - margin-top: 0; - } - - &.grade-without-star { - display: none; - } - - @media screen and (max-width: $large-devices) { - &.star-not-checked { - margin-left: 5px; - margin-right: 5px; - } - &.star-checked { - margin-left: 5px; - margin-right: 5px; - } - } - - @media screen and (max-width: $small-devices) { - &.grade-without-star { - display: block; - } - &.grade-with-star { - display: none; - } - } - - #dynamic_view { - font-size: 1.1em; - - overflow-wrap: break-word; - - td { - text-align: center; - border: none; - } - } - - #search_form { - .search-form-container { - display: grid; - grid-template-columns: auto auto; - grid-template-rows: auto auto auto; - grid-template-areas: - "action-bar action-bar" - "search-bar search-bar" - "radio-department radio-department" - "radio-credit-type radio-semester"; - } - - .action-bar { - grid-area: action-bar; - margin-bottom: 10px; - } - - .search-bar { - grid-area: search-bar; - display: grid; - grid-template-columns: auto 200px; - grid-template-rows: auto; - grid-template-areas: "search-bar-input search-bar-button"; - - @media screen and (max-width: $medium-devices) { - grid-template-columns: auto auto; - grid-template-rows: auto; - grid-template-areas: "search-bar-input search-bar-button"; - } - - @media screen and (max-width: $small-devices) { - grid-template-columns: auto; - grid-template-rows: auto; - grid-template-areas: "search-bar-input"; - - .search-bar-button { - display: none; - } - } - - .search-bar-input { - grid-area: search-bar-input; - background: $pedagogy-light-blue; - } - - .search-bar-button { - grid-area: search-bar-button; - background: $pedagogy-orange; - color: white; - font-weight: bold; - margin-left: 20px; - } - } - - .radio-department { - grid-area: radio-department; - } - - .radio-credit-type { - grid-area: radio-credit-type; - } - - .radio-semester { - grid-area: radio-semester; - } - - .radio-guide input[type="radio"], - input[type="checkbox"] { - display: none; - } - .radio-guide { - margin-top: 10px; - color: white; - } - .radio-guide label { - display: inline-block; - background-color: $pedagogy-blue; - padding: 10px 20px; - font-family: Arial, sans-serif; - font-size: 16px; - border-radius: 4px; - } - .radio-guide input[type="radio"]:checked + label { - background-color: $pedagogy-orange; - } - .radio-guide input[type="checkbox"]:checked + label { - background-color: $pedagogy-orange; - } - .radio-guide label:hover { - background-color: $pedagogy-hover-blue; - } - } - - #uv_detail { - color: #062f38; - - .uv-quick-info-container { - display: grid; - grid-template-columns: 20% 20% 20% 20% auto; - grid-template-rows: auto auto; - grid-template-areas: - "hours-cm hours-td hours-tp hours-te hours-the" - "department credit-type semester . ."; - } - - .department { - grid-area: department; - } - - .credit-type { - grid-area: credit-type; - } - - .semester { - grid-area: semester; - } - - .hours-cm { - grid-area: hours-cm; - } - - .hours-td { - grid-area: hours-td; - } - - .hours-tp { - grid-area: hours-tp; - } - - .hours-te { - grid-area: hours-te; - } - - .hours-the { - grid-area: hours-the; - } - - #leave_comment_not_allowed { - p { - text-align: center; - color: red; - } - } - - #leave_comment { - .leave-comment-grid-container { - display: grid; - grid-template-columns: 270px auto; - grid-template-rows: 100%; - grid-template-areas: "stars comment"; - - @media screen and (max-width: $large-devices) { - grid-template-columns: 100%; - grid-template-rows: auto auto; - grid-template-areas: - "stars" - "comment"; - } - } - - .ui-accordion-content { - background-color: $white-color; - border-color: $pedagogy-orange; - border-right: none; - } - - .form-stars { - grid-area: stars; - } - - .form-comment { - grid-area: comment; - } - - .ui-accordion-header { - background-color: $pedagogy-orange; - color: $pedagogy-white-text; - clip-path: polygon(0 0%, 0 100%, 30% 100%, 33% 0); - - @media screen and (max-width: $large-devices) { - clip-path: none; - } - } - - .ui-accordion-header-icon { - color: $pedagogy-white-text; - margin-right: 10px; - } - - .input-stars { - margin-top: 20px; - } - - input[type="submit"] { - float: right; - } - } - - .uv-details-container { - display: grid; - grid-template-columns: 150px 100px auto; - grid-template-rows: 156px 1fr; - grid-template-areas: - "grade grade-stars uv-infos" - ". . uv-infos"; - - @media screen and (max-width: $large-devices) { - grid-template-columns: 50% 50%; - grid-template-rows: auto auto; - grid-template-areas: - "grade grade-stars" - "uv-infos uv-infos"; - } - } - - .grade { - grid-area: grade; - color: $pedagogy-white-text; - background-color: $pedagogy-blue; - padding-right: 10px; - - > p { - text-align: right; - font-weight: bold; - } - } - - .grade-stars { - grid-area: grade-stars; - color: $pedagogy-white-text; - background-color: $pedagogy-blue; - font-weight: bold; - } - - .uv-infos { - grid-area: uv-infos; - padding-left: 10px; - } - - .comment-container { - display: grid; - grid-template-columns: 300px auto; - grid-template-rows: auto auto auto; - grid-template-areas: - "grade-block comment" - "grade-block info" - "comment-end-bar comment-end-bar"; - margin-bottom: 30px; - margin-top: 10px; - - @media screen and (max-width: $large-devices) { - grid-template-columns: auto; - grid-template-rows: auto auto auto auto; - grid-template-areas: - "grade-block" - "comment" - "info" - "comment-end-bar"; - } - - .grade-block { - grid-area: grade-block; - width: 300px; - - display: grid; - grid-template-columns: 150px 150px; - grid-template-rows: 156px auto; - grid-template-areas: - "grade-type grade-stars" - "grade-extension grade-extension"; - grid-gap: 15px; - - clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 30px, 270px 0); - align-items: start; - - background-color: $pedagogy-blue; - - @media screen and (max-width: $large-devices) { - grid-template-columns: 50% auto; - grid-template-rows: auto; - grid-template-areas: "grade-type grade-stars"; - width: auto; - clip-path: none; - align-content: space-evenly; - align-items: end; - } - - .grade-extension { - grid-area: grade-extension; - background-color: $pedagogy-blue; - } - - .grade-type { - grid-area: grade-type; - - > p { - color: $pedagogy-white-text; - font-weight: bold; - text-align: right; - } - } - - .grade-stars { - grid-area: grade-stars; - } - } - - .comment { - grid-area: comment; - - display: grid; - grid-template-columns: auto; - grid-template-rows: auto auto; - grid-template-areas: - "anchor" - "markdown"; - - @media screen and (max-width: $large-devices) { - border-left: solid; - border-right: solid; - border-color: $pedagogy-blue; - } - - .anchor { - grid-area: anchor; - text-align: right; - margin-right: 15px; - } - - .markdown { - grid-area: markdown; - - min-height: 139px; - margin-top: 0; - margin-right: 0; - padding: 10px; - text-align: justify; - overflow: auto; - } - } - - .info { - grid-area: info; - padding-bottom: 10px; - - @media screen and (max-width: $large-devices) { - border-left: solid; - border-right: solid; - border-color: $pedagogy-blue; - } - - .status-reported { - color: red; - float: left; - padding-left: 10px; - } - - .actions { - float: right; - } - } - - .comment-end-bar { - grid-area: comment-end-bar; - - display: grid; - grid-template-columns: 33% auto auto; - grid-template-rows: 2.5em; - grid-template-areas: "author date report"; - - background-color: $pedagogy-blue; - margin-top: -1px; - - @media screen and (max-width: $large-devices) { - grid-template-columns: auto; - grid-template-rows: auto auto auto; - grid-template-areas: - "report" - "date" - "author"; - margin-top: 0; - text-align: center; - } - - .author { - grid-area: author; - - padding-top: 6px; - padding-left: 20px; - - background-color: $pedagogy-orange; - clip-path: polygon(0 10px, 0 100%, 350px 200%, 300px 10px); - - @media screen and (max-width: $large-devices) { - clip-path: none; - padding: 0; - padding-bottom: 7px; - } - - a { - color: $pedagogy-white-text; - font-weight: bold; - } - - a:hover { - color: $pedagogy-hover-blue; - } - } - - .date { - grid-area: date; - color: $pedagogy-white-text; - - @media screen and (max-width: $large-devices) { - padding-bottom: 7px; - } - } - - .report { - grid-area: report; - justify-self: right; - padding-right: 30px; - padding-left: 30px; - - a { - color: $pedagogy-white-text; - } - - a:hover { - color: $pedagogy-hover-blue; - } - - @media screen and (max-width: $large-devices) { - text-align: center; - justify-self: inherit; - padding-bottom: 7px; - background-color: $white-color; - - border-left: solid; - border-right: solid; - border-color: $pedagogy-blue; - - a { - color: $black-color; - } - } - } - } - } - } -}