123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543 |
- <?php
- /**
- * Template Name: Course Plan
- *
- * @package UIU_DEPARTMENTAL
- */
- get_header();
- ?>
- <?php while (have_posts()) : the_post(); ?>
- <main id="primary" class="site-main">
- <section id="archive-hero">
- <div class="container">
- <!-- breadcrumb -->
- <nav aria-label="breadcrumb">
- <ul>
- <li><a href="#">Home</a></li>
- <li><a href="#">UG Program</a></li>
- <li>Course Plan</li>
- </ul>
- </nav>
- <div class="content">
- <!-- left content -->
- <div class="left-content">
- <div class="main-title">Course Plan</div>
- <div class="short-details">
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Quibusdam quis eos temporibus vel!.
- </div>
- <div class="links">
- <!-- message -->
- <a href="#">
- <img src="<?php echo (get_template_directory_uri()) ?>/img/envelope-solid.svg" alt="">
- </a>
- <!-- printer -->
- <a href="#">
- <img src="<?php echo (get_template_directory_uri()) ?>/img/print-solid.svg" alt="">
- </a>
- <!-- facebook -->
- <a href="#">
- <img src="<?php echo (get_template_directory_uri()) ?>/img/facebook-f.svg" alt="">
- </a>
- <!-- twitter -->
- <a href="#">
- <img src="<?php echo (get_template_directory_uri()) ?>/img/twitter.svg" alt="">
- </a>
- <!-- linkedin -->
- <a href="#">
- <img src="<?php echo (get_template_directory_uri()) ?>/img/linkedin-in.svg" alt="">
- </a>
- </div>
- </div>
- <!-- right content -->
- <div class="right-content">
- <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_07.jpg" alt="">
- </div>
- </div>
- </div>
- </section>
- <section class="container">
- <section id="course-plan-container">
- <!-- side component -->
- <div class="side-comp">
- <!-- link -->
- <div class="item">
- <!-- title -->
- <div class="item-title">
- UNDERGRADE PROGRAM
- </div>
- <!-- item container -->
- <div class="link-container">
- <ul>
- <li>
- <a href="#">Course Plan</a>
- </li>
- <li>
- <a href="#">Course Description</a>
- </li>
- <li>
- <a href="#">Course Plan (Old)</a>
- </li>
- <li>
- <a href="#">Course Description (New)</a>
- </li>
- <li>
- <a href="#">Mentor List</a>
- </li>
- </ul>
- </div>
- </div>
- <!-- notice -->
- <div class="item">
- <!-- title -->
- <div class="item-title">
- NOTICES
- </div>
- <!-- item container -->
- <div class="item-container">
- <a class="single-item" href="#">
- <div class="date">
- January 28, 2024
- </div>
- <div class="details">
- Orientation Program for the Newly Admitted Students of Summer 2023 Trimester
- </div>
- </a>
- <a class="single-item" href="#">
- <div class="date">
- January 28, 2024
- </div>
- <div class="details">
- Orientation Program for the Newly Admitted Students of Summer 2023 Trimester
- </div>
- </a>
- <a class="single-item" href="#">
- <div class="date">
- January 28, 2024
- </div>
- <div class="details">
- Orientation Program for the Newly Admitted Students of Summer 2023 Trimester
- </div>
- </a>
- <a class="single-item" href="#">
- <div class="date">
- January 28, 2024
- </div>
- <div class="details">
- Orientation Program for the Newly Admitted Students of Summer 2023 Trimester
- </div>
- </a>
- <a class="single-item" href="#">
- <div class="date">
- January 28, 2024
- </div>
- <div class="details">
- Orientation Program for the Newly Admitted Students of Summer 2023 Trimester
- </div>
- </a>
- </div>
- <!-- view more button -->
- <a class="view-more" href="#">
- <div class="icon">
- <img src="./img/square-plus-solid.svg" alt="">
- </div>
- <span>
- View more
- </span>
- </a>
- </div>
- </div>
- <!-- main component -->
- <div class="main-comp">
- <article>
- <?php the_content();
- ?>
- </article>
- </div>
- </section>
- </main><!-- #main -->
- <?php endwhile; // end of the loop.
- ?>
- <style>
- #course-plan-container table {
- width: 100%;
- background-color: #fff;
- }
- #course-plan-container th,
- #course-plan-container td {
- font-size: 0.75rem;
- padding: 0.5rem;
- border: 1px solid #000;
- }
- #course-plan-container th {
- font-weight: 700;
- }
- #course-plan-container td {
- font-weight: 500;
- }
- .text-center {
- text-align: center;
- }
- #archive-hero {
- padding: 2rem 0;
- background: #f3f0ec;
- }
- #archive-hero .content {
- display: flex;
- align-items: start;
- }
- #archive-hero .content .left-content {
- padding: 1rem;
- padding-left: 0 !important;
- flex: 1;
- }
- #archive-hero .content .left-content .main-title {
- font-size: 2.2rem;
- font-weight: 500;
- color: #000000;
- }
- #archive-hero .content .left-content .short-details {
- margin-top: 1.5rem;
- font-size: 1.1rem;
- font-weight: 400;
- }
- #archive-hero .content .left-content .links {
- margin-top: 2rem;
- display: flex;
- gap: 1.8rem;
- }
- #archive-hero .content .left-content .links a {
- height: 1.3rem;
- }
- #archive-hero .content .left-content .links a:hover {
- transform: scale(1.1);
- opacity: 1 !important;
- }
- #archive-hero .content .left-content .links a img {
- height: 100%;
- }
- #archive-hero .content .right-content {
- padding: 0 0 1rem 2rem !important;
- flex: 1;
- align-self: end;
- }
- #archive-hero .content .right-content img {
- width: 100%;
- }
- a {
- transition: all 0.25s ease-in-out;
- }
- a:hover {
- opacity: 0.65;
- text-decoration: none;
- }
- #course-plan-container {
- margin-top: 3rem;
- display: flex;
- gap: 0.5rem;
- }
- @media (max-width: 1000px) {
- #course-plan-container {
- flex-direction: column;
- }
- #course-plan-container .main-comp {
- order: 0;
- }
- #course-plan-container .side-comp {
- order: 1;
- }
- #course-plan-container .main-comp,
- #course-plan-container .side-comp {
- width: 100% !important;
- }
- }
- #course-plan-container .main-comp {
- padding: 0 0.75rem 1rem 0;
- width: calc(100% - (0.5rem + 240px));
- }
- #course-plan-container .main-comp article {
- margin-top: 0;
- width: 100%;
- padding: 2rem;
- }
- #course-plan-container .main-comp article h2 {
- font-weight: 500;
- text-align: start;
- color: #000;
- margin-bottom: 1rem;
- }
- #course-plan-container .main-comp .table-holder {
- width: 100%;
- overflow-x: auto;
- }
- #course-plan-container .main-comp .table-holder .td-title {
- border-right: none;
- border-left: none;
- padding-top: 20px;
- }
- #course-plan-container .main-comp .table-holder p {
- margin-bottom: unset;
- }
- #course-plan-container .side-comp {
- width: 240px;
- padding: 0 0.25rem 1rem 0 !important;
- }
- #course-plan-container .side-comp .item {
- margin-bottom: 2rem;
- padding: 1rem;
- background-color: blanchedalmond;
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.15), 0 3px 3px rgba(0, 0, 0, 0.15);
- }
- #course-plan-container .side-comp .item .item-title {
- padding: 0.25rem 1rem 0.75rem;
- text-align: center;
- border-bottom: 3px solid #F68B1F;
- color: #000;
- font-weight: 700;
- font-size: 0.7rem;
- }
- #course-plan-container .side-comp .item .item-container {
- padding: 0.5rem;
- }
- #course-plan-container .side-comp .item .item-container .single-item {
- display: block;
- margin-bottom: 0.75rem;
- padding-bottom: 2rem;
- border-bottom: 1px solid #2c5d73;
- transition: all 0.25s ease-in-out;
- }
- #course-plan-container .side-comp .item .item-container .single-item:last-child {
- border-bottom: none;
- margin-bottom: 0rem;
- padding-bottom: 0.25rem;
- }
- #course-plan-container .side-comp .item .item-container .single-item .date {
- font-size: 0.8rem;
- font-weight: 500;
- color: #c66f17;
- }
- #course-plan-container .side-comp .item .item-container .single-item .single-item-title {
- font-size: 0.8rem;
- font-weight: 700;
- color: #2c5d73;
- }
- #course-plan-container .side-comp .item .item-container .single-item .date-container {
- display: flex;
- align-items: center;
- gap: 0.7rem;
- }
- #course-plan-container .side-comp .item .item-container .single-item .date-container .date {
- font-size: 0.75rem;
- }
- #course-plan-container .side-comp .item .item-container .single-item .date-container .icon {
- width: 0.75rem;
- color: #ffffff;
- }
- #course-plan-container .side-comp .item .item-container .single-item .date-container .icon img {
- width: 100%;
- }
- #course-plan-container .side-comp .item .item-container .single-item .details {
- font-size: 0.7rem;
- margin-top: 0.3rem;
- color: #232323;
- }
- #course-plan-container .side-comp .item .link-container {
- padding-top: 0.25rem;
- }
- #course-plan-container .side-comp .item .link-container ul {
- margin-bottom: unset;
- }
- #course-plan-container .side-comp .item .link-container ul li {
- list-style: none;
- }
- #course-plan-container .side-comp .item .link-container a {
- display: block;
- color: #333;
- font-size: 0.8rem;
- font-weight: 500;
- padding: 0.5rem 0;
- border-bottom: 1px solid #c5c5c5;
- }
- #course-plan-container .side-comp .item .link-container a:hover {
- opacity: 1 !important;
- color: #ff860d;
- }
- #course-plan-container .side-comp .item .news {
- font-size: 0.7rem !important;
- padding-bottom: 2rem !important;
- }
- #course-plan-container .side-comp .item .view-more {
- display: flex;
- align-items: center;
- padding: 0 0.5rem 0.5rem;
- gap: 0.5rem;
- }
- #course-plan-container .side-comp .item .view-more .icon {
- width: 1rem;
- }
- #course-plan-container .side-comp .item .view-more .icon img {
- width: 100%;
- }
- #course-plan-container .side-comp .item .view-more span {
- font-size: 0.85rem;
- color: #2F4858;
- font-weight: bolder !important;
- transition: all 0.35s ease-in-out;
- }
- #course-plan-container .side-comp .item .view-more:hover {
- opacity: 1;
- }
- #course-plan-container .side-comp .item .view-more:hover span {
- color: #E55807;
- }
- @media print {
- head,
- header,
- footer {
- display: none;
- }
- main {
- padding-top: 0 !important;
- margin-top: 0 !important;
- }
- #archive-hero {
- margin: 0;
- }
- #course-plan-container {
- display: flex;
- flex-direction: column;
- }
- #course-plan-container .main-comp {
- order: 0;
- }
- #course-plan-container .side-comp {
- display: none;
- }
- #course-plan-container .main-comp,
- #course-plan-container .side-comp {
- width: 100% !important;
- }
- }
- /*# sourceMappingURL=course-plan.css.map */
- </style>
- <?php
- get_footer();
|