From 50d477eb88ac3ddc6a1b2f2860fe9ace289f9205 Mon Sep 17 00:00:00 2001 From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> Date: Thu, 30 Nov 2023 16:59:05 +0300 Subject: [PATCH] Fix Desktop Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com> --- .../css/dist/pages/single-sfwd-courses.css | 165 +++-- .../dist/pages/single-sfwd-courses.css.map | 2 +- .../css/src/pages/single-sfwd-courses.scss | 564 +++++++++++------- .../academyAfrica/single-sfwd-courses.php | 164 ++--- 4 files changed, 540 insertions(+), 355 deletions(-) diff --git a/wp-content/themes/academyAfrica/assets/css/dist/pages/single-sfwd-courses.css b/wp-content/themes/academyAfrica/assets/css/dist/pages/single-sfwd-courses.css index afcc759c..05eb8c41 100644 --- a/wp-content/themes/academyAfrica/assets/css/dist/pages/single-sfwd-courses.css +++ b/wp-content/themes/academyAfrica/assets/css/dist/pages/single-sfwd-courses.css @@ -118,17 +118,22 @@ table { cursor: not-allowed; } -.single-courses { +.single-courses .wrapper { padding: 60px 30px; display: flex; flex-direction: column; gap: 50px; } -.single-courses .title-section .title { +.single-courses .wrapper .title-section { + display: flex; + justify-content: space-between; + align-items: center; +} +.single-courses .wrapper .title-section .title { display: flex; justify-content: start; } -.single-courses .title-section .title .cfa-title { +.single-courses .wrapper .title-section .title .cfa-title { text-align: left; font-family: Open Sans; font-size: 20px; @@ -136,11 +141,19 @@ table { font-weight: 700; line-height: 24px; } -.single-courses .title-section .title .cfa-title::after { +.single-courses .wrapper .title-section .title .cfa-title::after { left: unset; transform: unset; } -.single-courses .description { +.single-courses .wrapper .title-section .avatar { + display: none; +} +.single-courses .wrapper .title-section .avatar img { + width: 80px; + height: 80px; + object-fit: cover; +} +.single-courses .wrapper .description { color: #000000; font-size: 14px; font-style: normal; @@ -148,7 +161,7 @@ table { line-height: 18px; font-family: Open Sans; } -.single-courses .price .cfa-price { +.single-courses .wrapper .price .cfa-price { color: #0C1A81; font-size: 33px; font-style: normal; @@ -156,31 +169,31 @@ table { line-height: 40px; letter-spacing: -0.66px; } -.single-courses .certificate-text { +.single-courses .wrapper .certificate-text { color: #000000; font-size: 14px; font-style: normal; font-weight: 400; line-height: 18px; } -.single-courses .share .social-icons { +.single-courses .wrapper .share .social-icons { display: flex; gap: 16px; } -.single-courses .share .social-icons .icon-image { +.single-courses .wrapper .share .social-icons .icon-image { width: 24px; height: 24px; } -.single-courses .enroll .enroll-button { +.single-courses .wrapper .enroll .enroll-button { background: #ED1C24; } -.single-courses .divider { +.single-courses .wrapper .divider { width: 100%; border: none; height: 1px; background: #A9A9A9; } -.single-courses .inroduction .cfa-introduction-title { +.single-courses .wrapper .inroduction .cfa-introduction-title { color: #0C1A81; font-size: 18px; font-style: normal; @@ -188,21 +201,21 @@ table { line-height: 24px; margin-bottom: 20px; } -.single-courses .inroduction .cfa-introduction { +.single-courses .wrapper .inroduction .cfa-introduction { color: #000000; font-size: 18px; font-style: normal; font-weight: 400; line-height: 28px; } -.single-courses .inroduction .cfa-introduction a { +.single-courses .wrapper .inroduction .cfa-introduction a { color: #0C1A81; font-size: 18px; font-style: normal; font-weight: 400; line-height: 28px; } -.single-courses .carriculum { +.single-courses .wrapper .carriculum { color: #000000; font-size: 18px; font-weight: 400; @@ -211,7 +224,7 @@ table { flex-direction: column; gap: 30px; } -.single-courses .carriculum .title .cfa-introduction-title { +.single-courses .wrapper .carriculum .title .cfa-introduction-title { color: #0C1A81; font-size: 18px; font-style: normal; @@ -219,57 +232,64 @@ table { line-height: 24px; margin-bottom: 20px; } -.single-courses .carriculum .ld-item-list { +.single-courses .wrapper .carriculum .ld-item-list { margin: 0; padding: 0; } -.single-courses .carriculum .ld-item-list .ld-section-heading { +.single-courses .wrapper .carriculum .ld-item-list .ld-section-heading { display: none; } -.single-courses .carriculum .ld-item-list .ld-item-list-items { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items { display: flex; flex-direction: column; gap: 10px; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item { border: 1px solid #CCCFDA; border-radius: 0; margin: 0; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview { display: flex; flex-direction: row; align-items: center; justify-content: space-between; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-name .ld-status-icon { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-name .ld-status-icon { display: none; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-name .ld-item-title { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-name .ld-item-title { color: #000000; font-size: 18px; font-style: normal; font-weight: 600; line-height: 24px; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-name .ld-item-title .ld-item-components { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-name .ld-item-title .ld-item-components { display: none; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-details .ld-expand-button .ld-icon { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-details .ld-expand-button .ld-icon { color: #000000; background: #FFFFFF; border: none; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-details .ld-expand-button .ld-text { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-preview .ld-item-details .ld-expand-button .ld-text { display: none; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded { background: #F7F9FD; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-header { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-header { display: none; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-items .ld-table-list-item .ld-table-list-item-preview .ld-topic-title { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-items { + padding: 0; +} +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-items .ld-table-list-item { + margin: 0; + padding: 0 20px; +} +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-items .ld-table-list-item .ld-table-list-item-preview .ld-topic-title { color: #000000; font-size: 18px; font-style: normal; @@ -277,10 +297,10 @@ table { line-height: 28px; font-family: Open Sans; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-items .ld-table-list-item .ld-table-list-item-preview .ld-status-icon { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-items .ld-table-list-item .ld-table-list-item-preview .ld-status-icon { display: none; } -.single-courses .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-items .ld-table-list-item .ld-table-list-item-preview .ld-item-title { +.single-courses .wrapper .carriculum .ld-item-list .ld-item-list-items .ld-item-list-item .ld-item-list-item-expanded .ld-table-list-items .ld-table-list-item .ld-table-list-item-preview .ld-item-title { color: #000000; font-size: 18px; font-style: normal; @@ -288,19 +308,19 @@ table { line-height: 28px; font-family: Open Sans; } -.single-courses .instructor { +.single-courses .wrapper .instructor { display: flex; flex-direction: column; gap: 20px; } -.single-courses .instructor .title .cfa-introduction-title { +.single-courses .wrapper .instructor .title .cfa-introduction-title { color: #0C1A81; font-size: 18px; font-style: normal; font-weight: 700; line-height: 24px; } -.single-courses .instructor .name { +.single-courses .wrapper .instructor .name { color: #000000; font-size: 18px; font-style: normal; @@ -309,19 +329,19 @@ table { letter-spacing: -0.36px; text-transform: capitalize; } -.single-courses .instructor .avatar img { +.single-courses .wrapper .instructor .avatar img { width: 50px; height: 50px; border-radius: 50%; } -.single-courses .instructor .description { +.single-courses .wrapper .instructor .description { color: #000000; font-size: 18px; font-style: normal; font-weight: 400; line-height: 28px; } -.single-courses .organization .title .cfa-introduction-title { +.single-courses .wrapper .organization .title .cfa-introduction-title { color: #0C1A81; font-size: 18px; font-style: normal; @@ -329,11 +349,11 @@ table { line-height: 24px; margin-bottom: 20px; } -.single-courses .organization .list { +.single-courses .wrapper .organization .list { display: flex; flex-direction: column; } -.single-courses .organization .list .item .name { +.single-courses .wrapper .organization .list .item .name { color: #000000; font-size: 18px; font-style: normal; @@ -343,30 +363,85 @@ table { margin-bottom: 20px; text-transform: capitalize; } -.single-courses .organization .list .item .avatar { +.single-courses .wrapper .organization .list .item .avatar { margin-bottom: 20px; } -.single-courses .organization .list .item .avatar img { +.single-courses .wrapper .organization .list .item .avatar img { width: 225pxpx; height: 100px; } -.single-courses .organization .list .item .description { +.single-courses .wrapper .organization .list .item .description { color: #000000; font-size: 18px; font-style: normal; font-weight: 400; line-height: 28px; } -.single-courses .enroll { +.single-courses .wrapper .enroll { text-align: center; } -.single-courses .enroll.left { +.single-courses .wrapper .enroll.left { text-align: left; } @media (min-width: 768px) { - .single-courses .enroll { + .single-courses .wrapper .enroll { text-align: left; } } +@media (min-width: 1152px) { + .single-courses { + display: flex; + justify-content: center; + } + .single-courses .wrapper { + padding: 80px 0; + max-width: 1120px; + gap: 40px; + width: 960px; + } + .single-courses .wrapper .title-section .title { + display: flex; + justify-content: start; + } + .single-courses .wrapper .title-section .title .cfa-title { + font-size: 48px; + line-height: 60px; + } + .single-courses .wrapper .title-section .title .cfa-title::after { + left: unset; + transform: unset; + } + .single-courses .wrapper .title-section .avatar { + display: block; + } + .single-courses .wrapper .description { + font-size: 18px; + line-height: 28px; + } + .single-courses .wrapper .certificate-text { + font-size: 18px; + line-height: 28px; + } + .single-courses .wrapper .inroduction .cfa-introduction-title { + font-size: 33px; + line-height: 40px; + letter-spacing: -0.66px; + } + .single-courses .wrapper .carriculum .title .cfa-introduction-title { + font-size: 33px; + line-height: 40px; + letter-spacing: -0.66px; + } + .single-courses .wrapper .instructor .title .cfa-introduction-title { + font-size: 33px; + line-height: 40px; + letter-spacing: -0.66px; + } + .single-courses .wrapper .organization .title .cfa-introduction-title { + font-size: 33px; + line-height: 40px; + letter-spacing: -0.66px; + } +} /*# sourceMappingURL=single-sfwd-courses.css.map */ diff --git a/wp-content/themes/academyAfrica/assets/css/dist/pages/single-sfwd-courses.css.map b/wp-content/themes/academyAfrica/assets/css/dist/pages/single-sfwd-courses.css.map index 868c9269..88de5d77 100644 --- a/wp-content/themes/academyAfrica/assets/css/dist/pages/single-sfwd-courses.css.map +++ b/wp-content/themes/academyAfrica/assets/css/dist/pages/single-sfwd-courses.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../../src/abstracts/_reset.scss","../../src/abstracts/_buttons.scss","../../src/abstracts/_colors.scss","../../src/pages/single-sfwd-courses.scss","../../src/abstracts/_mixins.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAaC;EACA;EACA;EACA;EACA;EACA;;;AAED;AACA;AAAA;EAEC;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;;;AAED;AAAA;EAEC;EACA;;;AAED;EACC;EACA;;;AC5CD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OC0CmB;EDzCnB;EACA;EACA;;AAEA;EACE;EACA,OCmCiB;;ADhCnB;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE,YCbkB;EDclB;;AACA;EACE,YCrBe;EDsBf,OCjBgB;;ADqBpB;EACE,YCxCgB;EDyChB;;AACA;EACE,YClDa;EDmDb,OC5Cc;;ADgDlB;EACE,YCpCiB;EDqCjB;;AACA;EACE,YClCgB;EDmChB,OCVe;EDWf;;AAIJ;EACE,YCtDgB;EDuDhB,OClDgB;EDmDhB;EACA;;;AEtEJ;EACI;EACA;EACA;EACA;;AAKI;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAMhB;EACI,ODsBa;ECrBb;EACA;EACA;EACA;EAEA;;AAKA;EACI,ODlCQ;ECmCR;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAIA;EACI;EACA;;AAEA;EACI;EACA;;AAQR;EACI,YDjDU;;ACsDlB;EACI;EACA;EACA;EACA;;AAMA;EACI,ODnFQ;ECoFR;EACA;EACA;EACA;EACA;;AAGJ;EACI,ODhDS;ECiDT;EACA;EACA;EACA;;AAEA;EACI,ODnGI;ECoGJ;EACA;EACA;EACA;;AAMZ;EACI,ODlEa;ECmEb;EACA;EACA;EACA;EACA;EACA;;AAGI;EACI,ODxHI;ECyHJ;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGI;EACI;;AAGJ;EACI,ODnHX;ECoHW;EACA;EACA;EACA;;AAEA;EACI;;AAOJ;EACI,ODlIf;ECmIe,YDpIf;ECqIe;;AAGJ;EACI;;AAOhB;EACI,YDzLL;;AC2LK;EACI;;AAMQ;EACI,OD1JnB;EC2JmB;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI,ODvKnB;ECwKmB;EACA;EACA;EACA;EACA;;AAWpC;EACI;EACA;EACA;;AAGI;EACI,OD1OI;EC2OJ;EACA;EACA;EACA;;AAIR;EACI,ODvMS;ECwMT;EACA;EACA;EACA;EACA;EACA;;AAIA;EACI;EACA;EACA;;AAIR;EACI,ODzNS;EC0NT;EACA;EACA;EACA;;AAMA;EACI,ODhRI;ECiRJ;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;;AAGI;EACI,ODnPC;ECoPD;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAIR;EACI,ODvQC;ECwQD;EACA;EACA;EACA;;AAMhB;EACI;;AAEA;EACI;;ACpUJ;EDyUA;IACI","file":"single-sfwd-courses.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../../src/abstracts/_reset.scss","../../src/abstracts/_buttons.scss","../../src/abstracts/_colors.scss","../../src/pages/single-sfwd-courses.scss","../../src/abstracts/_mixins.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAaC;EACA;EACA;EACA;EACA;EACA;;;AAED;AACA;AAAA;EAEC;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;;;AAED;AAAA;EAEC;EACA;;;AAED;EACC;EACA;;;AC5CD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OC0CmB;EDzCnB;EACA;EACA;;AAEA;EACE;EACA,OCmCiB;;ADhCnB;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE,YCbkB;EDclB;;AACA;EACE,YCrBe;EDsBf,OCjBgB;;ADqBpB;EACE,YCxCgB;EDyChB;;AACA;EACE,YClDa;EDmDb,OC5Cc;;ADgDlB;EACE,YCpCiB;EDqCjB;;AACA;EACE,YClCgB;EDmChB,OCVe;EDWf;;AAIJ;EACE,YCtDgB;EDuDhB,OClDgB;EDmDhB;EACA;;;AEnEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAKZ;EACI;;AAEA;EACI;EACA;EACA;;AAKZ;EACI,ODOS;ECNT;EACA;EACA;EACA;EAEA;;AAKA;EACI,ODjDI;ECkDJ;EACA;EACA;EACA;EACA;;AAIR;EACI,ODfS;ECgBT;EACA;EACA;EACA;;AAIA;EACI;EACA;;AAEA;EACI;EACA;;AAQR;EACI,YDhEM;;ACqEd;EACI;EACA;EACA;EACA;;AAMA;EACI,ODlGI;ECmGJ;EACA;EACA;EACA;EACA;;AAGJ;EACI,OD/DK;ECgEL;EACA;EACA;EACA;;AAEA;EACI,ODlHA;ECmHA;EACA;EACA;EACA;;AAMZ;EACI,ODjFS;ECkFT;EACA;EACA;EACA;EACA;EACA;;AAGI;EACI,ODvIA;ECwIA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGI;EACI;;AAGJ;EACI,ODlIf;ECmIe;EACA;EACA;EACA;;AAEA;EACI;;AAOJ;EACI,ODjJnB;ECkJmB,YDnJnB;ECoJmB;;AAGJ;EACI;;AAOhB;EACI,YDxMT;;AC0MS;EACI;;AAGJ;EACI;;AACA;EACI;EACA;;AAEI;EACI,OD5KvB;EC6KuB;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI,ODzLvB;EC0LuB;EACA;EACA;EACA;EACA;;AAWpC;EACI;EACA;EACA;;AAGI;EACI,OD5PA;EC6PA;EACA;EACA;EACA;;AAIR;EACI,ODzNK;EC0NL;EACA;EACA;EACA;EACA;EACA;;AAIA;EACI;EACA;EACA;;AAIR;EACI,OD3OK;EC4OL;EACA;EACA;EACA;;AAMA;EACI,ODlSA;ECmSA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;;AAGI;EACI,ODrQH;ECsQG;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAIR;EACI,ODzRH;EC0RG;EACA;EACA;EACA;;AAMhB;EACI;;AAEA;EACI;;ACtVR;ED6VI;IACI;;;AC1VR;EDTR;IA0WQ;IACA;;EACA;IACI;IACA;IACA;IACA;;EAGI;IACI;IACA;;EAEA;IACI;IACA;;EAEA;IACI;IACA;;EAKZ;IACI;;EAIR;IACI;IACA;;EAGJ;IACI;IACA;;EAIA;IACI;IACA;IACA;;EAMA;IACI;IACA;IACA;;EAOJ;IACI;IACA;IACA;;EAOJ;IACI;IACA;IACA","file":"single-sfwd-courses.css"} \ No newline at end of file diff --git a/wp-content/themes/academyAfrica/assets/css/src/pages/single-sfwd-courses.scss b/wp-content/themes/academyAfrica/assets/css/src/pages/single-sfwd-courses.scss index 7f2ee1f0..80b83f04 100644 --- a/wp-content/themes/academyAfrica/assets/css/src/pages/single-sfwd-courses.scss +++ b/wp-content/themes/academyAfrica/assets/css/src/pages/single-sfwd-courses.scss @@ -2,132 +2,110 @@ .single-courses { - padding: 60px 30px; - display: flex; - flex-direction: column; - gap: 50px; - .title-section { + .wrapper { + padding: 60px 30px; + display: flex; + flex-direction: column; + gap: 50px; - .title { + .title-section { display: flex; - justify-content: start; + justify-content: space-between; + align-items: center; - .cfa-title { - text-align: left; - font-family: Open Sans; - font-size: 20px; - font-style: normal; - font-weight: 700; - line-height: 24px; + .title { + display: flex; + justify-content: start; - &::after { - left: unset; - transform: unset; + .cfa-title { + text-align: left; + font-family: Open Sans; + font-size: 20px; + font-style: normal; + font-weight: 700; + line-height: 24px; + + &::after { + left: unset; + transform: unset; + } } } - } - } - .description { - color: $color-shades-black; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 18px; - - font-family: Open Sans; - } + .avatar { + display: none; + img { + width: 80px; + height: 80px; + object-fit: cover; + } + } + } - .price { - .cfa-price { - color: $color-primary-700; - font-size: 33px; + .description { + color: $color-shades-black; + font-size: 14px; font-style: normal; - font-weight: 600; - line-height: 40px; - letter-spacing: -0.66px; + font-weight: 400; + line-height: 18px; + + font-family: Open Sans; } - } - .certificate-text { - color: $color-shades-black; - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 18px; - } - .share { - .social-icons { - display: flex; - gap: 16px; - - .icon-image { - width: 24px; - height: 24px; + .price { + .cfa-price { + color: $color-primary-700; + font-size: 33px; + font-style: normal; + font-weight: 600; + line-height: 40px; + letter-spacing: -0.66px; } } - } - - .enroll { + .certificate-text { + color: $color-shades-black; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 18px; + } - .enroll-button { - background: $color-secondary-500; + .share { + .social-icons { + display: flex; + gap: 16px; + .icon-image { + width: 24px; + height: 24px; + } + } } - } - .divider { - width: 100%; - border: none; - height: 1px; - background: #A9A9A9; - } + .enroll { - .inroduction { + .enroll-button { + background: $color-secondary-500; - .cfa-introduction-title { - color: $color-primary-700; - font-size: 18px; - font-style: normal; - font-weight: 700; - line-height: 24px; - margin-bottom: 20px; + } } - .cfa-introduction { - color: $color-shades-black; - font-size: 18px; - font-style: normal; - font-weight: 400; - line-height: 28px; - - a { - color: $color-primary-700; - font-size: 18px; - font-style: normal; - font-weight: 400; - line-height: 28px; - } + .divider { + width: 100%; + border: none; + height: 1px; + background: #A9A9A9; } - } + .inroduction { - .carriculum { - color: $color-shades-black; - font-size: 18px; - font-weight: 400; - line-height: 28px; - display: flex; - flex-direction: column; - gap: 30px; - .title { .cfa-introduction-title { color: $color-primary-700; font-size: 18px; @@ -136,96 +114,137 @@ line-height: 24px; margin-bottom: 20px; } + + .cfa-introduction { + color: $color-shades-black; + font-size: 18px; + font-style: normal; + font-weight: 400; + line-height: 28px; + + a { + color: $color-primary-700; + font-size: 18px; + font-style: normal; + font-weight: 400; + line-height: 28px; + } + } } - .ld-item-list { - margin: 0; - padding: 0; - .ld-section-heading { - display: none; + .carriculum { + color: $color-shades-black; + font-size: 18px; + font-weight: 400; + line-height: 28px; + display: flex; + flex-direction: column; + gap: 30px; + + .title { + .cfa-introduction-title { + color: $color-primary-700; + font-size: 18px; + font-style: normal; + font-weight: 700; + line-height: 24px; + margin-bottom: 20px; + } } - .ld-item-list-items { - display: flex; - flex-direction: column; - gap: 10px; + .ld-item-list { + margin: 0; + padding: 0; - .ld-item-list-item { - border: 1px solid $color-neutral-200; - border-radius: 0; - margin: 0; + .ld-section-heading { + display: none; + } - .ld-item-list-item-preview { - display: flex; - flex-direction: row; - align-items: center; - justify-content: space-between; + .ld-item-list-items { + display: flex; + flex-direction: column; + gap: 10px; - .ld-item-name { - .ld-status-icon { - display: none; - } + .ld-item-list-item { + border: 1px solid $color-neutral-200; + border-radius: 0; + margin: 0; - .ld-item-title { - color: $color-shades-black; - font-size: 18px; - font-style: normal; - font-weight: 600; - line-height: 24px; + .ld-item-list-item-preview { + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; - .ld-item-components { + .ld-item-name { + .ld-status-icon { display: none; } - } - } - .ld-item-details { - .ld-expand-button { - .ld-icon { + .ld-item-title { color: $color-shades-black; - background: $color-shades-white; - border: none; - } + font-size: 18px; + font-style: normal; + font-weight: 600; + line-height: 24px; - .ld-text { - display: none; + .ld-item-components { + display: none; + } } } - } - } - - .ld-item-list-item-expanded { - background: $color-neutral-50; - - .ld-table-list-header { - display: none; - } - - .ld-table-list-items { - .ld-table-list-item { - .ld-table-list-item-preview { - .ld-topic-title { + .ld-item-details { + .ld-expand-button { + .ld-icon { color: $color-shades-black; - font-size: 18px; - font-style: normal; - font-weight: 400; - line-height: 28px; - font-family: Open Sans; + background: $color-shades-white; + border: none; } - .ld-status-icon { + .ld-text { display: none; } + } + } - .ld-item-title { - color: $color-shades-black; - font-size: 18px; - font-style: normal; - font-weight: 400; - line-height: 28px; - font-family: Open Sans; + } + + .ld-item-list-item-expanded { + background: $color-neutral-50; + + .ld-table-list-header { + display: none; + } + + .ld-table-list-items { + padding: 0; + .ld-table-list-item { + margin: 0; + padding: 0 20px; + .ld-table-list-item-preview { + .ld-topic-title { + color: $color-shades-black; + font-size: 18px; + font-style: normal; + font-weight: 400; + line-height: 28px; + font-family: Open Sans; + } + + .ld-status-icon { + display: none; + } + + .ld-item-title { + color: $color-shades-black; + font-size: 18px; + font-style: normal; + font-weight: 400; + line-height: 28px; + font-family: Open Sans; + } } } } @@ -234,109 +253,192 @@ } } } - } - .instructor { - display: flex; - flex-direction: column; - gap: 20px; + .instructor { + display: flex; + flex-direction: column; + gap: 20px; - .title { - .cfa-introduction-title { - color: $color-primary-700; + .title { + .cfa-introduction-title { + color: $color-primary-700; + font-size: 18px; + font-style: normal; + font-weight: 700; + line-height: 24px; + } + } + + .name { + color: $color-shades-black; font-size: 18px; font-style: normal; font-weight: 700; line-height: 24px; + letter-spacing: -0.36px; + text-transform: capitalize; } - } - - .name { - color: $color-shades-black; - font-size: 18px; - font-style: normal; - font-weight: 700; - line-height: 24px; - letter-spacing: -0.36px; - text-transform: capitalize; - } - .avatar { - img { - width: 50px; - height: 50px; - border-radius: 50%; + .avatar { + img { + width: 50px; + height: 50px; + border-radius: 50%; + } } - } - .description { - color: $color-shades-black; - font-size: 18px; - font-style: normal; - font-weight: 400; - line-height: 28px; - } - } - - .organization { - .title { - .cfa-introduction-title { - color: $color-primary-700; + .description { + color: $color-shades-black; font-size: 18px; font-style: normal; - font-weight: 700; - line-height: 24px; - margin-bottom: 20px; + font-weight: 400; + line-height: 28px; } } - .list { - display: flex; - flex-direction: column; - - .item { - .name { - color: $color-shades-black; + .organization { + .title { + .cfa-introduction-title { + color: $color-primary-700; font-size: 18px; font-style: normal; font-weight: 700; line-height: 24px; - letter-spacing: -0.36px; margin-bottom: 20px; - text-transform: capitalize; } + } - .avatar { - margin-bottom: 20px; + .list { + display: flex; + flex-direction: column; - img { - width: 225pxpx; - height: 100px; + .item { + .name { + color: $color-shades-black; + font-size: 18px; + font-style: normal; + font-weight: 700; + line-height: 24px; + letter-spacing: -0.36px; + margin-bottom: 20px; + text-transform: capitalize; } - } - .description { - color: $color-shades-black; - font-size: 18px; - font-style: normal; - font-weight: 400; - line-height: 28px; + .avatar { + margin-bottom: 20px; + + img { + width: 225pxpx; + height: 100px; + } + } + + .description { + color: $color-shades-black; + font-size: 18px; + font-style: normal; + font-weight: 400; + line-height: 28px; + } } } } - } - .enroll { - text-align: center; + .enroll { + text-align: center; + + &.left { + text-align: left; + } + } + } - &.left { - text-align: left; + @include media-breakpoint-up(tablet) { + .wrapper { + .enroll { + text-align: left; + } } + } - @include media-breakpoint-up(tablet){ - .enroll { - text-align: left; + @include media-breakpoint-up(desktop) { + display: flex; + justify-content: center; + .wrapper { + padding: 80px 0; + max-width: 1120px; + gap: 40px; + width: 960px; + + .title-section { + .title { + display: flex; + justify-content: start; + + .cfa-title { + font-size: 48px; + line-height: 60px; + + &::after { + left: unset; + transform: unset; + } + } + } + + .avatar { + display: block; + } + } + + .description { + font-size: 18px; + line-height: 28px; + } + + .certificate-text { + font-size: 18px; + line-height: 28px; + } + + .inroduction { + .cfa-introduction-title { + font-size: 33px; + line-height: 40px; + letter-spacing: -0.66px; + } + } + + .carriculum { + .title { + .cfa-introduction-title { + font-size: 33px; + line-height: 40px; + letter-spacing: -0.66px; + } + } + } + + .instructor { + .title { + .cfa-introduction-title { + font-size: 33px; + line-height: 40px; + letter-spacing: -0.66px; + } + } + } + + .organization { + .title { + .cfa-introduction-title { + font-size: 33px; + line-height: 40px; + letter-spacing: -0.66px; + } + } + } } } diff --git a/wp-content/themes/academyAfrica/single-sfwd-courses.php b/wp-content/themes/academyAfrica/single-sfwd-courses.php index a43b107d..3fa5a839 100644 --- a/wp-content/themes/academyAfrica/single-sfwd-courses.php +++ b/wp-content/themes/academyAfrica/single-sfwd-courses.php @@ -58,88 +58,95 @@ get_header(); ?>
-
-
-

- +

+
+
+

+ +

+
+
+ '; + ?> +
+
+
+ +
+
+

+

-
-
- -
-
-

- -

-
-
-

The certificate for this course can be downloaded for a small fee when the course is completed

-
-