├── .gitignore ├── .npmignore ├── .nvmrc ├── .stylelintrc ├── .travis.yml ├── README.md ├── dist.js ├── examples ├── components │ ├── button.hbs │ ├── cb-navbar.hbs │ ├── certificate.hbs │ ├── doubts.hbs │ ├── footer.hbs │ ├── hb │ │ ├── breadcrumbs.hbs │ │ ├── college-contest-card.hbs │ │ ├── competition-banner.hbs │ │ ├── competition-carousel.hbs │ │ ├── compile-card.hbs │ │ ├── congo-card.hbs │ │ ├── daily-goal-card.hbs │ │ ├── dashboard-badge-card.hbs │ │ ├── dashboard-bookmark-card.hbs │ │ ├── dashboard-dcb-card.hbs │ │ ├── dashboard-interview-card.hbs │ │ ├── dashboard-leaderboard.hbs │ │ ├── dashboard-metrics-card.hbs │ │ ├── dashboard-practice-card.hbs │ │ ├── dashboard-reg-contests-card.hbs │ │ ├── dcb-card.hbs │ │ ├── faq-card.hbs │ │ ├── filter-card.hbs │ │ ├── nav-hb.hbs │ │ ├── practice-banner.hbs │ │ ├── practice-card.hbs │ │ ├── profile-badge-card.hbs │ │ ├── profile-bookmark-card.hbs │ │ ├── profile-dropdown.hbs │ │ ├── profile-leaderboard.hbs │ │ ├── profile-reg-contests-card.hbs │ │ ├── sidenav.hbs │ │ ├── test-cases-card.hbs │ │ └── up-competition-card.hbs │ ├── nav-bar.hbs │ ├── online-cb │ │ ├── certificate-locked.hbs │ │ ├── course-card-new.hbs │ │ ├── doubts-view.hbs │ │ ├── my-course-card.hbs │ │ ├── nagarro-banner.hbs │ │ └── online-card.hbs │ └── side-nav.hbs ├── public │ ├── JS │ │ ├── banner-carousel.js │ │ ├── bootstrap.js │ │ ├── bootstrap.min.js │ │ ├── carousel.js │ │ ├── code-editor.js │ │ ├── curtain.js │ │ ├── radial-progress.js │ │ ├── universe.js │ │ └── v2.js │ ├── fonts │ │ ├── BebasNeue-Bold.ttf │ │ ├── BebasNeue-Regular.ttf │ │ ├── Effra_Std_Rg.ttf │ │ ├── Gilroy.ttf │ │ ├── GreatVibes-Regular.ttf │ │ ├── Mulish-Italic-VariableFont_wght.ttf │ │ └── Mulish-VariableFont_wght.ttf │ └── images │ │ ├── 2.png │ │ ├── 3.png │ │ ├── 4-501.png │ │ ├── 404image.png │ │ ├── 5.png │ │ ├── 6.png │ │ ├── Group 1.svg │ │ ├── Group 13.svg │ │ ├── Group 17.svg │ │ ├── Group 24.svg │ │ ├── Group.svg │ │ ├── Group_2.svg │ │ ├── Layer 5 59.svg │ │ ├── Vector.svg │ │ ├── Vector_2.svg │ │ ├── admissioncontest_w.png │ │ ├── algo_badge.png │ │ ├── amazon-logo.svg │ │ ├── android-logo.svg │ │ ├── android.svg │ │ ├── announcement-white.png │ │ ├── announcement-white.svg │ │ ├── announcement.png │ │ ├── announcement.svg │ │ ├── arrowl_g.png │ │ ├── arrowr_g.png │ │ ├── badge.png │ │ ├── bannerimage.jpg │ │ ├── bannner.jpg │ │ ├── beginner.gif │ │ ├── beginnner.ai │ │ ├── best_talent.svg │ │ ├── bg_redpink.png │ │ ├── bookmark.svg │ │ ├── books-stack-of-three.png │ │ ├── bytesize-cart.png │ │ ├── c++ │ │ ├── cast-apat.svg │ │ ├── cblogo-black.png │ │ ├── cblogo.png │ │ ├── certificate.png │ │ ├── certificate.svg │ │ ├── certificate2.svg │ │ ├── certification-i.svg │ │ ├── code-green-dark.png │ │ ├── code-green-dark.svg │ │ ├── code-green.png │ │ ├── code-green.svg │ │ ├── code-red-dark.png │ │ ├── code-red-dark.svg │ │ ├── code-red.png │ │ ├── code-red.svg │ │ ├── college-graduation.png │ │ ├── collegecontest_w.png │ │ ├── comp5.gif │ │ ├── companies.png │ │ ├── competition.svg │ │ ├── competition_beg.svg │ │ ├── confetti.png │ │ ├── cong.png │ │ ├── contests.svg │ │ ├── coursecontest_w.png │ │ ├── cpp-white.png │ │ ├── dcb-beg.svg │ │ ├── dcb.svg │ │ ├── dcb2.svg │ │ ├── dcb_badge.png │ │ ├── docs-white.svg │ │ ├── docs.svg │ │ ├── doubt.png │ │ ├── download_o.png │ │ ├── ds_badge.png │ │ ├── error_o.png │ │ ├── feather-award.svg │ │ ├── file-green-dark.png │ │ ├── file-green-dark.svg │ │ ├── file-green.png │ │ ├── file-green.svg │ │ ├── file-red-dark.png │ │ ├── file-red-dark.svg │ │ ├── file-red.png │ │ ├── file-red.svg │ │ ├── fingerprint.png │ │ ├── fingerprint.svg │ │ ├── fire.png │ │ ├── footer.png │ │ ├── free.png │ │ ├── g-so-c-icon-192-copy.png │ │ ├── google-play.png │ │ ├── green.svg │ │ ├── group-2.png │ │ ├── group-3.png │ │ ├── group.png │ │ ├── hb_dg.png │ │ ├── hb_logo_monochrome_full_dg.png │ │ ├── hb_logo_monochrome_full_w.png │ │ ├── hb_o.png │ │ ├── hb_white.png │ │ ├── hexagon.jpg │ │ ├── hiringcontest_w.png │ │ ├── holi.webp │ │ ├── holihai.webp │ │ ├── home.png │ │ ├── home_bg.jpg │ │ ├── home_main.jpg │ │ ├── homeimage.svg │ │ ├── hpi1.png │ │ ├── hpi2.png │ │ ├── hpi3.png │ │ ├── hpi4.png │ │ ├── i1.png │ │ ├── i2.png │ │ ├── i3.png │ │ ├── i4.png │ │ ├── i5.png │ │ ├── icon1.png │ │ ├── icon2.png │ │ ├── icon3.png │ │ ├── icon4.png │ │ ├── interview-beg.svg │ │ ├── interview.png │ │ ├── interview.svg │ │ ├── iphone-nav.png │ │ ├── iphone-x-minimal-buttons.svg │ │ ├── iphone.svg │ │ ├── journey.png │ │ ├── learning.png │ │ ├── lines.svg │ │ ├── loginsvg.svg │ │ ├── logo-fb.png │ │ ├── logosheet.png │ │ ├── logostrip.png │ │ ├── love.svg │ │ ├── mail.svg │ │ ├── maingif.gif │ │ ├── mentorsupport.png │ │ ├── menu-icon.png │ │ ├── menu-white.svg │ │ ├── menu.svg │ │ ├── naggaro-logo.png │ │ ├── ng-icon-1.png │ │ ├── ng-icon-2.png │ │ ├── ng-icon-3.png │ │ ├── notif-icon.png │ │ ├── online-logo-text.png │ │ ├── online-logo.png │ │ ├── partners.svg │ │ ├── placeholder.gif │ │ ├── player-control.png │ │ ├── portfolio.png │ │ ├── profile.svg │ │ ├── radio-green.svg │ │ ├── radio-white.svg │ │ ├── revisit.png │ │ ├── right.png │ │ ├── right.svg │ │ ├── searchicon.png │ │ ├── stack │ │ ├── stamp.png │ │ ├── star_g.png │ │ ├── star_o.png │ │ ├── strategy.svg │ │ ├── support-white.svg │ │ ├── support.svg │ │ ├── tick-mark.svg │ │ ├── tick_dg.png │ │ ├── tick_g.png │ │ ├── tick_o.png │ │ ├── user.svg │ │ ├── vector-2.png │ │ ├── vector-3.png │ │ ├── vector-date.svg │ │ ├── vector-person.svg │ │ ├── vector-time.svg │ │ ├── vector.png │ │ ├── video-green-dark.png │ │ ├── video-green-dark.svg │ │ ├── video-green.png │ │ ├── video-green.svg │ │ ├── video-red-dark.png │ │ ├── video-red-dark.svg │ │ ├── video-red.png │ │ ├── video-red.svg │ │ ├── warning.svg │ │ ├── webinar.png │ │ ├── wildcraft.png │ │ ├── wildcraft1.png │ │ ├── wrong.png │ │ ├── wrong.svg │ │ ├── wrong_g.png │ │ └── wrong_r.png └── views │ ├── account │ ├── n-account-address.hbs │ ├── n-account-application.hbs │ ├── n-account-client.hbs │ ├── n-account-edit.hbs │ ├── n-account-login.hbs │ ├── n-account-organisation.hbs │ ├── n-account-signup.hbs │ ├── n-accounts-card.hbs │ ├── n-add-address.hbs │ ├── n-add-organisation.hbs │ ├── n-edit-profile.hbs │ └── n-profile-page.hbs │ ├── banner-carousel-js.hbs │ ├── banner-carousel-new.hbs │ ├── breadcrumbs.hbs │ ├── cast-window.hbs │ ├── cb-junior │ └── landing-page-junior.hbs │ ├── cb-navbar.hbs │ ├── cbhire.hbs │ ├── certificate-completion.hbs │ ├── certificate-excellence.hbs │ ├── certificate-lite.hbs │ ├── code-editor.hbs │ ├── code-window.hbs │ ├── coding-blocks │ ├── about-us-page.hbs │ ├── accelerate-course-page.hbs │ ├── accelerate-new.hbs │ ├── accelerate.hbs │ ├── buttons.hbs │ ├── cards.hbs │ ├── cast-apat.hbs │ ├── classroom-courses.hbs │ ├── classroom-page-old-website.hbs │ ├── courses-page.hbs │ ├── events-classes-landing.hbs │ ├── events-page.hbs │ ├── faq-section.hbs │ ├── individual-course-page.hbs │ ├── landing-page__deleted-sections.hbs │ ├── landing-page_events.hbs │ ├── landing-page_main.hbs │ ├── subnav-meganav.hbs │ ├── supernav.hbs │ ├── tabs.hbs │ ├── tracks-section.hbs │ └── universe.hbs │ ├── competition-card.hbs │ ├── competition.hbs │ ├── course-card-new.hbs │ ├── daily-goal-card-small.hbs │ ├── dcb-problem-card.hbs │ ├── divided-list-horizontal.hbs │ ├── dukaan │ ├── coupons-card.hbs │ ├── dukaan-allpayment.hbs │ ├── dukaan-complete-order.hbs │ ├── dukaan-fullpayment.hbs │ ├── dukaan-widget.hbs │ ├── items-card.hbs │ ├── my-order.hbs │ ├── new-checkout.hbs │ └── transaction-history.hbs │ ├── events-page.hbs │ ├── faq-section.hbs │ ├── floating-ad.hbs │ ├── form-input.hbs │ ├── hb-author-card.hbs │ ├── hb-rating-card.hbs │ ├── hb-tab-nav.hbs │ ├── hb │ ├── 404page.hbs │ ├── admission-contests.hbs │ ├── admission-home.hbs │ ├── admission-info.hbs │ ├── badges.hbs │ ├── competition-info.hbs │ ├── contest-page.hbs │ ├── contests-home.hbs │ ├── course-contests-home.hbs │ ├── dashboard.hbs │ ├── dcb-home.hbs │ ├── hamburger-nav.hbs │ ├── hb-leaderboard.hbs │ ├── hb-sidenav.hbs │ ├── landing-page.hbs │ ├── practice-ds.hbs │ ├── practice-home.hbs │ ├── previous-dcb.hbs │ ├── profile-page.hbs │ ├── submission-feedback.hbs │ ├── submission-msg-cards.hbs │ ├── submit-test.hbs │ └── webtest-window.hbs │ ├── hello-intern.hbs │ ├── hiringblocks │ ├── applicant-profile-editor.hbs │ └── applicant-profile.hbs │ ├── img-review-card.hbs │ ├── img-ring.hbs │ ├── index.hbs │ ├── junior-consumption.hbs │ ├── junior-course-card.hbs │ ├── junior-dashboard-main.hbs │ ├── junior-resource-components.hbs │ ├── junior-resources.hbs │ ├── junior-search-card.hbs │ ├── junior-upgrade-premium.hbs │ ├── layouts │ └── default.hbs │ ├── list.hbs │ ├── live-classes-course-page-new.hbs │ ├── live-classes-course-page.hbs │ ├── live-classes-original.hbs │ ├── live-classes.hbs │ ├── live-course-popup-card.hbs │ ├── loader.hbs │ ├── main-website-carousel.hbs │ ├── nagarro-landing.hbs │ ├── online-cb │ ├── certificate-modal.hbs │ ├── course-card-buycourse.hbs │ ├── course-card-mini.hbs │ ├── course-content-card.hbs │ ├── course-dashboard-progress-card.hbs │ ├── cricket-cup.hbs │ ├── dashboard-cards.hbs │ ├── dashboard-carousel-cards.hbs │ ├── dashboard-stats-card.hbs │ ├── eligibility-test-modals.hbs │ ├── goodies-card.hbs │ ├── hiring-index.hbs │ ├── home.hbs │ ├── ipl-leaderboard.hbs │ ├── ipl-modal.hbs │ ├── ipl.hbs │ ├── job-description.hbs │ ├── joblisting.hbs │ ├── jobs-page-new.hbs │ ├── know-your-mentor-banners.hbs │ ├── masonry-poc.hbs │ ├── mentor-card.hbs │ ├── my-courses-card.hbs │ ├── my-courses-page-new.hbs │ ├── new-course-card.hbs │ ├── new-dashboard-cards.hbs │ ├── new-layout-logged-in.hbs │ ├── new-layout-logged-out.hbs │ ├── new-video-timeline-trainer-tabnav.hbs │ ├── new-video-timeline-trainer.hbs │ ├── new-video-timeline.hbs │ ├── online-tiers-comparison.hbs │ ├── overview.hbs │ ├── product-tiers-card.hbs │ ├── projects-card.hbs │ ├── rating-card.hbs │ ├── review-rating-card.hbs │ ├── scholarship.hbs │ ├── skeleton-card.hbs │ ├── student-review-card.hbs │ ├── timeline-ad.hbs │ ├── track-list-card.hbs │ ├── tracks.hbs │ ├── trainer-login.hbs │ ├── trainer-pathway-card.hbs │ ├── upgrade-modal-large.hbs │ └── upgrade-modal-small.hbs │ ├── pills.hbs │ ├── practice-interview-card.hbs │ ├── radial-progress.hbs │ ├── timer-clock.hbs │ └── unordered-list.hbs ├── file-list-gen.js ├── gruntfile.js ├── live.sh ├── mkdirs ├── motley.config.json ├── package-lock.json ├── package.json ├── public └── index.html ├── sass └── styles │ ├── _animations.scss │ ├── _applications.scss │ ├── _components.scss │ ├── _elements.scss │ ├── _media-query.scss │ ├── _objects.scss │ ├── _resets.scss │ ├── _themes.scss │ ├── _tools.scss │ ├── _trumps.scss │ ├── _utilities.scss │ ├── animations │ ├── index.scss │ └── zoom.scss │ ├── app.css.map │ ├── app.scss │ ├── applications │ ├── account │ │ ├── _application.scss │ │ ├── _components.scss │ │ ├── app.scss │ │ ├── components │ │ │ └── options.scss │ │ ├── hamburger-nav.scss │ │ ├── img-ring.scss │ │ └── layout.scss │ ├── coding-blocks │ │ ├── _application.scss │ │ ├── _components.scss │ │ ├── _elements.scss │ │ ├── _settings.scss │ │ ├── app.scss │ │ ├── buttons.scss │ │ ├── cb-junior.scss │ │ ├── classroom-courses.scss │ │ ├── classroom-page-old.scss │ │ ├── color.scss │ │ ├── components │ │ │ ├── accordion-list.scss │ │ │ ├── cards.scss │ │ │ ├── faq-section.scss │ │ │ ├── option-div.scss │ │ │ └── universe.scss │ │ ├── elements │ │ │ └── a.scss │ │ ├── events-page-landing.scss │ │ ├── font.scss │ │ ├── hamburger-nav.scss │ │ ├── heading.scss │ │ ├── landing-page.scss │ │ ├── margin.scss │ │ ├── padding.scss │ │ ├── settings │ │ │ ├── colors.scss │ │ │ ├── directions.scss │ │ │ └── font.scss │ │ ├── super-navbar.scss │ │ ├── tabs.scss │ │ └── wakanda.scss │ ├── dukaan │ │ ├── _application.scss │ │ └── app.scss │ ├── hb │ │ ├── _application.scss │ │ ├── _components.scss │ │ ├── _settings.scss │ │ ├── app.scss │ │ ├── border-card.scss │ │ ├── buttons.scss │ │ ├── components │ │ │ ├── 404page.scss │ │ │ ├── admission.scss │ │ │ ├── badges.scss │ │ │ ├── code-editor.scss │ │ │ ├── code-window.scss │ │ │ ├── competition-card.scss │ │ │ ├── congo-card.scss │ │ │ ├── contest-card.scss │ │ │ ├── daily-goal-card.scss │ │ │ ├── dashboard.scss │ │ │ ├── dcb-card.scss │ │ │ ├── dcb-home.scss │ │ │ ├── faq-card.scss │ │ │ ├── previous-dcb.scss │ │ │ └── test-cases-card.scss │ │ ├── dropdown.scss │ │ ├── progress.scss │ │ ├── settings │ │ │ └── colors.scss │ │ ├── submissions-table.scss │ │ ├── tab-nav.scss │ │ └── textarea.scss │ ├── hiringblocks │ │ ├── _application.scss │ │ ├── _components.scss │ │ ├── _objects.scss │ │ ├── _settings.scss │ │ ├── app.scss │ │ ├── components │ │ │ ├── hiring-modal.scss │ │ │ ├── profile.scss │ │ │ └── topnav.scss │ │ ├── form-input.scss │ │ ├── hamburger-nav.scss │ │ ├── hiring-landing.scss │ │ ├── objects │ │ │ └── buttons.scss │ │ ├── settings │ │ │ └── colors.scss │ │ ├── tables.scss │ │ └── topnav.scss │ └── online-cb │ │ ├── _application.scss │ │ ├── _components.scss │ │ ├── _elements.scss │ │ ├── _objects.scss │ │ ├── _settings.scss │ │ ├── app.scss │ │ ├── card-mentor.scss │ │ ├── components │ │ ├── about-course │ │ │ ├── about-course.scss │ │ │ ├── accordion.scss │ │ │ ├── buy-right.scss │ │ │ └── buy-top.scss │ │ ├── carousel.scss │ │ ├── classroom-layout.scss │ │ ├── content │ │ │ ├── code-editor.scss │ │ │ ├── content.scss │ │ │ ├── document.scss │ │ │ ├── pb-leaderboard.scss │ │ │ ├── pb-statement.scss │ │ │ ├── pb-submissions.scss │ │ │ ├── problem.scss │ │ │ ├── timeline.scss │ │ │ └── video.scss │ │ ├── course-card-buy.scss │ │ ├── course-card.scss │ │ ├── course-logos.scss │ │ ├── cricket-cup.scss │ │ ├── csv │ │ │ ├── csv.scss │ │ │ └── submissions.scss │ │ ├── dashboard.scss │ │ ├── difficulty-dots.scss │ │ ├── doubts.scss │ │ ├── feedback-modal.scss │ │ ├── goodies-card.scss │ │ ├── hiring-banner.scss │ │ ├── homepage.scss │ │ ├── job-description.scss │ │ ├── my-course-card.scss │ │ ├── nagarro-banner.scss │ │ ├── nav-layout.scss │ │ ├── notification.scss │ │ ├── offerings.scss │ │ ├── online-card.scss │ │ ├── otp-enroll.scss │ │ ├── overview-course.scss │ │ ├── pathway-card.scss │ │ ├── player-modal.scss │ │ ├── qna.scss │ │ ├── rating-card.scss │ │ ├── rating-stats.scss │ │ ├── referral-code.scss │ │ ├── run-card.scss │ │ ├── sidebar.scss │ │ ├── sidenav.scss │ │ ├── testimonial.scss │ │ ├── topnav.scss │ │ ├── track-card.scss │ │ ├── tracks.scss │ │ └── upgrade-modal.scss │ │ ├── divided-list-horizontal.scss │ │ ├── elements │ │ ├── buttons.scss │ │ └── card-mentors.scss │ │ ├── form-input.scss │ │ ├── generics.scss │ │ ├── hamburger-nav.scss │ │ ├── horizontal-quiz-card.scss │ │ ├── img-card.scss │ │ ├── know-your-mentor.scss │ │ ├── objects │ │ ├── comparison-table.scss │ │ └── form-input.scss │ │ ├── progress.scss │ │ ├── settings │ │ └── colors.scss │ │ ├── tab-nav.scss │ │ └── timeline.scss │ ├── components │ ├── accordion-layout.scss │ ├── backdrop.scss │ ├── cb-navbar │ │ └── index.scss │ ├── events-page.scss │ ├── grid.scss │ ├── hamburger-nav.scss │ ├── hello-intern.scss │ ├── img-review-card.scss │ ├── indicator.scss │ ├── label-card.scss │ ├── landing-page.scss │ ├── live-classes.scss │ ├── modal.scss │ ├── problem-list.scss │ ├── review-pad.scss │ ├── searchbar.scss │ ├── side-nav.scss │ ├── sidenav.scss │ ├── topnav.scss │ └── tracks.scss │ ├── elements │ ├── button.scss │ ├── floating-ad.scss │ ├── heading.scss │ ├── input.scss │ ├── progress.scss │ ├── small-animations.scss │ ├── tag.scss │ └── ul-li.scss │ ├── generic │ ├── normalize.scss │ ├── print.scss │ └── reset.scss │ ├── media-query │ └── font.scss │ ├── objects │ ├── alert.scss │ ├── back-div.scss │ ├── banner-carousel.scss │ ├── border-card.scss │ ├── bottom-nav.scss │ ├── breadcrumbs.scss │ ├── buttons.scss │ ├── card.mentors.scss │ ├── card.scss │ ├── certificate.scss │ ├── copy-code.scss │ ├── curtain.scss │ ├── dialog.scss │ ├── divided-list-horizontal.scss │ ├── divider.scss │ ├── fade.scss │ ├── fader.scss │ ├── form-input.scss │ ├── home.search.scss │ ├── hoverable.scss │ ├── icon.scss │ ├── img-card.scss │ ├── img-desc.scss │ ├── img-ring.scss │ ├── info-popup.scss │ ├── list.scss │ ├── loader.scss │ ├── masonry.scss │ ├── modal.scss │ ├── navigation.scss │ ├── notification.scss │ ├── pill.scss │ ├── progress.scss │ ├── radial-progress.scss │ ├── round-image.scss │ ├── scrollables.scss │ ├── searchbox.scss │ ├── skeleton.scss │ ├── star.scss │ ├── status-circle.scss │ ├── tab-nav.scss │ ├── tables.scss │ ├── tags.scss │ ├── threads.scss │ ├── tick.scss │ ├── timeline.scss │ ├── timer.scss │ └── video-player.scss │ ├── settings │ ├── settings.color.scss │ ├── settings.font.scss │ ├── settings.global.scss │ └── settings.objects.scss │ ├── themes │ └── cricket-cup.scss │ ├── tools │ ├── list.scss │ ├── position.scss │ ├── tools.border-radius.scss │ ├── tools.border.scss │ ├── tools.dimensions.scss │ ├── tools.display.scss │ ├── tools.flexbox.scss │ ├── tools.float.scss │ ├── tools.fonts.scss │ ├── tools.margin.scss │ ├── tools.multiply-px.scss │ ├── tools.padding.scss │ ├── tools.textalign.scss │ └── tools.width.scss │ ├── trumps │ ├── home.scss │ ├── nagarro-landing.scss │ └── trump.scss │ └── utilities │ ├── aspect-ratio.scss │ ├── background.scss │ ├── border.scss │ ├── color.scss │ ├── display.scss │ ├── flexbox.scss │ ├── floating.scss │ ├── font.scss │ ├── grid │ ├── breakpoints │ │ └── mixins │ │ │ └── _breakpoints.scss │ ├── grid.scss │ ├── grid │ │ ├── _functions.scss │ │ ├── _grid.scss │ │ ├── _variables.scss │ │ ├── bootstrap-grid.scss │ │ ├── mixins │ │ │ ├── _breakpoints.scss │ │ │ ├── _grid-framework.scss │ │ │ └── _grid.scss │ │ └── utilities │ │ │ ├── _display.scss │ │ │ └── _flex.scss │ ├── layout │ │ ├── mixins │ │ │ └── _visibility.scss │ │ └── utilities │ │ │ ├── _display.scss │ │ │ ├── _spacing.scss │ │ │ └── _visibility.scss │ └── sizing │ │ └── utilities │ │ └── _sizing.scss │ ├── overflow.scss │ ├── position.scss │ ├── scrollbar.scss │ ├── selector.scss │ ├── text.scss │ ├── transition.scss │ ├── width-limiter.scss │ └── width-x-height.scss ├── yarn-error.log └── yarn.lock /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | dist/ 3 | npm-debug.log 4 | .idea/ 5 | .DS_Store 6 | examples/public/stylesheets/ 7 | sass/styles/app.css 8 | examples/html/ 9 | live/ 10 | examples/public/stylesheets/ 11 | *.swp 12 | *.swo 13 | dump.rdb 14 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | * 2 | !package.json 3 | !dist/* 4 | !dist 5 | !/dist 6 | !dist/ 7 | !dist/hb/* 8 | !dist/account/* 9 | !dist/dukaan/* 10 | !dist/online-cb/* 11 | !dist/hiringblocks/* 12 | !dist/coding-blocks/* 13 | !dist/font/* 14 | -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | 10 2 | -------------------------------------------------------------------------------- /.stylelintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "stylelint-config-standard", 3 | "ignoreFiles": [ 4 | "./sass/styles/generic/normalize.scss" 5 | ], 6 | "rules": { 7 | "at-rule-no-unknown": [true, { 8 | "ignoreAtRules": [ 9 | "at-root", 10 | "each", 11 | "else", 12 | "extend", 13 | "for", 14 | "function", 15 | "if", 16 | "include", 17 | "mixin", 18 | "return", 19 | "warn" 20 | ] 21 | }], 22 | "font-family-no-missing-generic-family-keyword": null, 23 | "no-descending-specificity": null, 24 | "no-empty-source": null 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - "10" 4 | 5 | before_script: npm run build 6 | script: sh live.sh 7 | deploy: 8 | local-dir: live 9 | provider: pages 10 | skip-cleanup: true 11 | github-token: $GITHUB_TOKEN 12 | keep-history: false 13 | on: 14 | branch: master 15 | -------------------------------------------------------------------------------- /dist.js: -------------------------------------------------------------------------------- 1 | const sass = require('node-sass'); 2 | const config = require('./motley.config.json'); 3 | const fs = require('fs') 4 | 5 | const writeToDisc = function (result, outFileCss){ 6 | fs.writeFileSync(outFileCss, result.css.toString(), {recursive: true}) 7 | } 8 | 9 | config.applications.map(app => { 10 | const file = `sass/styles/applications/${app}/app.scss` 11 | const outFileCss = `dist/${app}/app.css` 12 | const outFileScss = `dist/${app}/scss/app.scss` 13 | const outFileCssMin = `dist/${app}/app.min.css` 14 | 15 | fs.mkdirSync(`dist/${app}/scss`, { recursive: true }) 16 | 17 | writeToDisc(sass.renderSync({file}), outFileCss) 18 | writeToDisc(sass.renderSync({file, outputStyle: 'compressed'}), outFileCssMin) 19 | fs.writeFileSync(outFileScss, fs.readFileSync(file, 'utf-8')) 20 | }) 21 | 22 | writeToDisc(sass.renderSync({file: 'sass/styles/app.scss'}), 'dist/app.css') 23 | writeToDisc(sass.renderSync({file: 'sass/styles/app.scss', outputStyle:'compressed'}), 'dist/app.min.css') 24 | -------------------------------------------------------------------------------- /examples/components/button.hbs: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /examples/components/certificate.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 | 4 |
5 |
Generate Certificate
6 |
7 | 8 | Generate only when you are satisfied with your 9 | current score. You are not allowed to regenerate it. 10 |
11 |
12 |
13 | 14 |
15 |
Course Completion: 90%+
16 |
Mentor Approval
17 |
Any Extra Check
18 |
19 | 20 |
21 |
22 | 23 |
24 |
25 |
-------------------------------------------------------------------------------- /examples/components/hb/breadcrumbs.hbs: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /examples/components/hb/compile-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |

Compilation Error

3 |
Check the compiler output, fix the error and try again.
4 |
5 |
Compile Message
6 |
7 |
Solution.cpp: In function 'int countingValleys(int, std::__cxx11::string)': Solution.cpp:9:1: error: no return statement in function returning non-void [-Werror=return-type]}^cc1plus: some warnings being treated as errors
8 |
9 |
-------------------------------------------------------------------------------- /examples/components/hb/congo-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 | Confetti 4 | Congratulations 5 |
6 |

You have earned a new badge

7 |
8 |
9 | Badge 10 |
11 |
12 |

Mathematics

13 |

Level 2

14 |
15 |
16 |

Keep up the good work!

17 |
Solve 10 more problems to unlock Level 3
18 | 19 |
20 |
-------------------------------------------------------------------------------- /examples/components/hb/dashboard-interview-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |

Interview Preparation

5 |
6 | 7 |
8 |
9 |
10 | Current Level : 11 | Level 3 12 |
13 | Badge Logo 14 |

Interview Master

15 |
Complete 7 More Levels to earn this badge
16 | 17 |
3 of 10 Levels completed
18 | 19 |
-------------------------------------------------------------------------------- /examples/components/hb/dashboard-metrics-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |

All Time Best

6 |
#32
7 |
Achieved on 18 May 2018
8 |
9 |
10 |
11 |

Current Ranking

12 |
4300
13 |
20 Ranks from last month
14 |
15 |
16 |

Performance

17 |
34000 Points
18 |
200 Points from last month 19 |
20 |
21 |
22 |
-------------------------------------------------------------------------------- /examples/components/hb/practice-banner.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |
6 | 7 |
8 |
9 |

Unlock Badge

10 | Arrays | LinkedList | Stacks | Queues | Trees | Graphs 11 |
12 |
13 |
14 |
15 |
250+
16 |
PROBLEMS
17 |
18 |
19 |
-------------------------------------------------------------------------------- /examples/components/hb/profile-dropdown.hbs: -------------------------------------------------------------------------------- 1 |
2 | Profile 3 | Bookmarks 4 | Invite Friends 5 | Become HB Author 6 |
7 |
Logout
 8 |
-------------------------------------------------------------------------------- /examples/components/online-cb/certificate-locked.hbs: -------------------------------------------------------------------------------- 1 |
2 | 3 |
Unlock Certificate
4 |
Complete 90% of your course to unlock and 5 | generate the certificate
6 |
-------------------------------------------------------------------------------- /examples/components/online-cb/nagarro-banner.hbs: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/components/online-cb/nagarro-banner.hbs -------------------------------------------------------------------------------- /examples/components/side-nav.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | 5 |
6 | 7 |
8 |

Hi, Darsh

9 |
10 | 11 |
12 | 13 |
14 |
15 | MY PROFILE 16 |
17 |
18 | 19 |
20 | MY ADDRESSES 21 |
22 | 23 |
24 | 25 |
26 | MY APPS 27 |
28 | 29 |
30 |
31 | MY CLIENTS 32 |
33 |
34 |
35 | LOGOUT 36 |
37 |
38 |
-------------------------------------------------------------------------------- /examples/public/JS/carousel.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by aayusharora on 2/27/18. 3 | */ 4 | 5 | var initial_cards = document.getElementsByClassName('border-card o-layout-card'); 6 | // All cards in the cards array 7 | 8 | var cards = new InitializeCards(initial_cards); 9 | 10 | function InitializeCards(initial_cards) { 11 | this.card = Array.from(initial_cards); 12 | this.index = 0; 13 | this.card_removed = []; 14 | } 15 | 16 | InitializeCards.prototype.previous = function() { 17 | 18 | // reverse card 19 | this.reverse_card = this.card.reverse(); 20 | this.ele = this.reverse_card.pop(); 21 | // pop element from card 22 | // push element in card remove array 23 | if(this.ele) { 24 | this.card_removed.push(this.ele); 25 | } 26 | 27 | }; 28 | 29 | InitializeCards.prototype.next = function() { 30 | this.ele = this.card_removed.pop(); 31 | this.card.reverse(); 32 | this.card.push(this.ele); 33 | this.card.reverse(); 34 | }; 35 | 36 | function previous() { 37 | cards.previous(); 38 | } 39 | 40 | function next() { 41 | cards.next() 42 | 43 | } 44 | 45 | -------------------------------------------------------------------------------- /examples/public/JS/curtain.js: -------------------------------------------------------------------------------- 1 | 2 | $(".curtains").click((e) => { 3 | targetCurtain = e.target.attributes['data-target'].nodeValue; 4 | 5 | switch (targetCurtain) { 6 | case 'left': $(e.currentTarget.children[0]).toggleClass('collapse').siblings().addClass('collapse'); 7 | break; 8 | case 'right': $(e.currentTarget.children[2]).toggleClass('collapse').siblings().addClass('collapse'); 9 | break; 10 | } 11 | 12 | }) -------------------------------------------------------------------------------- /examples/public/JS/radial-progress.js: -------------------------------------------------------------------------------- 1 | var forEach = function (array, callback, scope) { 2 | for (var i = 0; i < array.length; i++) { 3 | callback.call(scope, i, array[i]); 4 | } 5 | }; 6 | 7 | // document.addEventListener("DOMContentLoaded", function (event) { 8 | // var max = -219.99078369140625; 9 | // forEach( 10 | // document.querySelectorAll(".radial-progress"), 11 | // function (index, value) { 12 | // percent = value.getAttribute("data-progress"); 13 | // value 14 | // .querySelector(".fill") 15 | // .setAttribute( 16 | // "style", 17 | // "stroke-dashoffset: " + ((100 - percent) / 100) * max 18 | // ); 19 | // } 20 | // ); 21 | // }); 22 | 23 | window.onload = function () { 24 | var max = -219.99078369140625; 25 | forEach( 26 | document.querySelectorAll(".radial-progress"), 27 | function (index, value) { 28 | percent = value.getAttribute("data-progress"); 29 | value 30 | .querySelector(".fill") 31 | .setAttribute( 32 | "style", 33 | "stroke-dashoffset: " + ((100 - percent) / 100) * max 34 | ); 35 | } 36 | ); 37 | }; 38 | -------------------------------------------------------------------------------- /examples/public/fonts/BebasNeue-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/fonts/BebasNeue-Bold.ttf -------------------------------------------------------------------------------- /examples/public/fonts/BebasNeue-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/fonts/BebasNeue-Regular.ttf -------------------------------------------------------------------------------- /examples/public/fonts/Effra_Std_Rg.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/fonts/Effra_Std_Rg.ttf -------------------------------------------------------------------------------- /examples/public/fonts/Gilroy.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/fonts/Gilroy.ttf -------------------------------------------------------------------------------- /examples/public/fonts/GreatVibes-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/fonts/GreatVibes-Regular.ttf -------------------------------------------------------------------------------- /examples/public/fonts/Mulish-Italic-VariableFont_wght.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/fonts/Mulish-Italic-VariableFont_wght.ttf -------------------------------------------------------------------------------- /examples/public/fonts/Mulish-VariableFont_wght.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/fonts/Mulish-VariableFont_wght.ttf -------------------------------------------------------------------------------- /examples/public/images/2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/2.png -------------------------------------------------------------------------------- /examples/public/images/3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/3.png -------------------------------------------------------------------------------- /examples/public/images/4-501.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/4-501.png -------------------------------------------------------------------------------- /examples/public/images/404image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/404image.png -------------------------------------------------------------------------------- /examples/public/images/5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/5.png -------------------------------------------------------------------------------- /examples/public/images/6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/6.png -------------------------------------------------------------------------------- /examples/public/images/Group 13.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /examples/public/images/Group.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /examples/public/images/Layer 5 59.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /examples/public/images/Vector.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /examples/public/images/Vector_2.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /examples/public/images/admissioncontest_w.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/admissioncontest_w.png -------------------------------------------------------------------------------- /examples/public/images/algo_badge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/algo_badge.png -------------------------------------------------------------------------------- /examples/public/images/announcement-white.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/announcement-white.png -------------------------------------------------------------------------------- /examples/public/images/announcement.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/announcement.png -------------------------------------------------------------------------------- /examples/public/images/arrowl_g.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/arrowl_g.png -------------------------------------------------------------------------------- /examples/public/images/arrowr_g.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/arrowr_g.png -------------------------------------------------------------------------------- /examples/public/images/badge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/badge.png -------------------------------------------------------------------------------- /examples/public/images/bannerimage.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/bannerimage.jpg -------------------------------------------------------------------------------- /examples/public/images/bannner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/bannner.jpg -------------------------------------------------------------------------------- /examples/public/images/beginner.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/beginner.gif -------------------------------------------------------------------------------- /examples/public/images/beginnner.ai: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/beginnner.ai -------------------------------------------------------------------------------- /examples/public/images/bg_redpink.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/bg_redpink.png -------------------------------------------------------------------------------- /examples/public/images/books-stack-of-three.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/books-stack-of-three.png -------------------------------------------------------------------------------- /examples/public/images/bytesize-cart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/bytesize-cart.png -------------------------------------------------------------------------------- /examples/public/images/c++: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/c++ -------------------------------------------------------------------------------- /examples/public/images/cblogo-black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/cblogo-black.png -------------------------------------------------------------------------------- /examples/public/images/cblogo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/cblogo.png -------------------------------------------------------------------------------- /examples/public/images/certificate.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/certificate.png -------------------------------------------------------------------------------- /examples/public/images/code-green-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/code-green-dark.png -------------------------------------------------------------------------------- /examples/public/images/code-green.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/code-green.png -------------------------------------------------------------------------------- /examples/public/images/code-red-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/code-red-dark.png -------------------------------------------------------------------------------- /examples/public/images/code-red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/code-red.png -------------------------------------------------------------------------------- /examples/public/images/college-graduation.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/college-graduation.png -------------------------------------------------------------------------------- /examples/public/images/collegecontest_w.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/collegecontest_w.png -------------------------------------------------------------------------------- /examples/public/images/comp5.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/comp5.gif -------------------------------------------------------------------------------- /examples/public/images/companies.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/companies.png -------------------------------------------------------------------------------- /examples/public/images/confetti.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/confetti.png -------------------------------------------------------------------------------- /examples/public/images/cong.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/cong.png -------------------------------------------------------------------------------- /examples/public/images/coursecontest_w.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/coursecontest_w.png -------------------------------------------------------------------------------- /examples/public/images/cpp-white.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/cpp-white.png -------------------------------------------------------------------------------- /examples/public/images/dcb_badge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/dcb_badge.png -------------------------------------------------------------------------------- /examples/public/images/doubt.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/doubt.png -------------------------------------------------------------------------------- /examples/public/images/download_o.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/download_o.png -------------------------------------------------------------------------------- /examples/public/images/ds_badge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/ds_badge.png -------------------------------------------------------------------------------- /examples/public/images/error_o.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/error_o.png -------------------------------------------------------------------------------- /examples/public/images/feather-award.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /examples/public/images/file-green-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/file-green-dark.png -------------------------------------------------------------------------------- /examples/public/images/file-green.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/file-green.png -------------------------------------------------------------------------------- /examples/public/images/file-red-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/file-red-dark.png -------------------------------------------------------------------------------- /examples/public/images/file-red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/file-red.png -------------------------------------------------------------------------------- /examples/public/images/fingerprint.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/fingerprint.png -------------------------------------------------------------------------------- /examples/public/images/fire.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/fire.png -------------------------------------------------------------------------------- /examples/public/images/footer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/footer.png -------------------------------------------------------------------------------- /examples/public/images/free.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/free.png -------------------------------------------------------------------------------- /examples/public/images/g-so-c-icon-192-copy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/g-so-c-icon-192-copy.png -------------------------------------------------------------------------------- /examples/public/images/google-play.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/google-play.png -------------------------------------------------------------------------------- /examples/public/images/green.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 10 | 11 | 12 | 13 | 14 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /examples/public/images/group-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/group-2.png -------------------------------------------------------------------------------- /examples/public/images/group-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/group-3.png -------------------------------------------------------------------------------- /examples/public/images/group.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/group.png -------------------------------------------------------------------------------- /examples/public/images/hb_dg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hb_dg.png -------------------------------------------------------------------------------- /examples/public/images/hb_logo_monochrome_full_dg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hb_logo_monochrome_full_dg.png -------------------------------------------------------------------------------- /examples/public/images/hb_logo_monochrome_full_w.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hb_logo_monochrome_full_w.png -------------------------------------------------------------------------------- /examples/public/images/hb_o.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hb_o.png -------------------------------------------------------------------------------- /examples/public/images/hb_white.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hb_white.png -------------------------------------------------------------------------------- /examples/public/images/hexagon.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hexagon.jpg -------------------------------------------------------------------------------- /examples/public/images/hiringcontest_w.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hiringcontest_w.png -------------------------------------------------------------------------------- /examples/public/images/holi.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/holi.webp -------------------------------------------------------------------------------- /examples/public/images/holihai.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/holihai.webp -------------------------------------------------------------------------------- /examples/public/images/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/home.png -------------------------------------------------------------------------------- /examples/public/images/home_bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/home_bg.jpg -------------------------------------------------------------------------------- /examples/public/images/home_main.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/home_main.jpg -------------------------------------------------------------------------------- /examples/public/images/hpi1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hpi1.png -------------------------------------------------------------------------------- /examples/public/images/hpi2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hpi2.png -------------------------------------------------------------------------------- /examples/public/images/hpi3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hpi3.png -------------------------------------------------------------------------------- /examples/public/images/hpi4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/hpi4.png -------------------------------------------------------------------------------- /examples/public/images/i1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/i1.png -------------------------------------------------------------------------------- /examples/public/images/i2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/i2.png -------------------------------------------------------------------------------- /examples/public/images/i3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/i3.png -------------------------------------------------------------------------------- /examples/public/images/i4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/i4.png -------------------------------------------------------------------------------- /examples/public/images/i5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/i5.png -------------------------------------------------------------------------------- /examples/public/images/icon1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/icon1.png -------------------------------------------------------------------------------- /examples/public/images/icon2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/icon2.png -------------------------------------------------------------------------------- /examples/public/images/icon3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/icon3.png -------------------------------------------------------------------------------- /examples/public/images/icon4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/icon4.png -------------------------------------------------------------------------------- /examples/public/images/interview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/interview.png -------------------------------------------------------------------------------- /examples/public/images/iphone-nav.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/iphone-nav.png -------------------------------------------------------------------------------- /examples/public/images/journey.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/journey.png -------------------------------------------------------------------------------- /examples/public/images/learning.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/learning.png -------------------------------------------------------------------------------- /examples/public/images/lines.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /examples/public/images/logo-fb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/logo-fb.png -------------------------------------------------------------------------------- /examples/public/images/logosheet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/logosheet.png -------------------------------------------------------------------------------- /examples/public/images/logostrip.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/logostrip.png -------------------------------------------------------------------------------- /examples/public/images/maingif.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/maingif.gif -------------------------------------------------------------------------------- /examples/public/images/mentorsupport.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/mentorsupport.png -------------------------------------------------------------------------------- /examples/public/images/menu-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/menu-icon.png -------------------------------------------------------------------------------- /examples/public/images/menu-white.svg: -------------------------------------------------------------------------------- 1 | 3 | Menu 4 | A line styled icon from Orion Icon Library. 5 | 8 | 10 | -------------------------------------------------------------------------------- /examples/public/images/menu.svg: -------------------------------------------------------------------------------- 1 | 3 | Menu 4 | A line styled icon from Orion Icon Library. 5 | 8 | 10 | -------------------------------------------------------------------------------- /examples/public/images/naggaro-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/naggaro-logo.png -------------------------------------------------------------------------------- /examples/public/images/ng-icon-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/ng-icon-1.png -------------------------------------------------------------------------------- /examples/public/images/ng-icon-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/ng-icon-2.png -------------------------------------------------------------------------------- /examples/public/images/ng-icon-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/ng-icon-3.png -------------------------------------------------------------------------------- /examples/public/images/notif-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/notif-icon.png -------------------------------------------------------------------------------- /examples/public/images/online-logo-text.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/online-logo-text.png -------------------------------------------------------------------------------- /examples/public/images/online-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/online-logo.png -------------------------------------------------------------------------------- /examples/public/images/placeholder.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/placeholder.gif -------------------------------------------------------------------------------- /examples/public/images/player-control.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/player-control.png -------------------------------------------------------------------------------- /examples/public/images/portfolio.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/portfolio.png -------------------------------------------------------------------------------- /examples/public/images/radio-green.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 10 | 11 | 12 | 13 | 14 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /examples/public/images/radio-white.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/public/images/revisit.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/revisit.png -------------------------------------------------------------------------------- /examples/public/images/right.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/right.png -------------------------------------------------------------------------------- /examples/public/images/right.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /examples/public/images/searchicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/searchicon.png -------------------------------------------------------------------------------- /examples/public/images/stack: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/stack -------------------------------------------------------------------------------- /examples/public/images/stamp.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/stamp.png -------------------------------------------------------------------------------- /examples/public/images/star_g.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/star_g.png -------------------------------------------------------------------------------- /examples/public/images/star_o.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/star_o.png -------------------------------------------------------------------------------- /examples/public/images/tick_dg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/tick_dg.png -------------------------------------------------------------------------------- /examples/public/images/tick_g.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/tick_g.png -------------------------------------------------------------------------------- /examples/public/images/tick_o.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/tick_o.png -------------------------------------------------------------------------------- /examples/public/images/vector-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/vector-2.png -------------------------------------------------------------------------------- /examples/public/images/vector-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/vector-3.png -------------------------------------------------------------------------------- /examples/public/images/vector-date.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /examples/public/images/vector-person.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /examples/public/images/vector-time.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /examples/public/images/vector.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/vector.png -------------------------------------------------------------------------------- /examples/public/images/video-green-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/video-green-dark.png -------------------------------------------------------------------------------- /examples/public/images/video-green.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/video-green.png -------------------------------------------------------------------------------- /examples/public/images/video-red-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/video-red-dark.png -------------------------------------------------------------------------------- /examples/public/images/video-red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/video-red.png -------------------------------------------------------------------------------- /examples/public/images/warning.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 9 | 10 | 11 | 13 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /examples/public/images/webinar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/webinar.png -------------------------------------------------------------------------------- /examples/public/images/wildcraft.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/wildcraft.png -------------------------------------------------------------------------------- /examples/public/images/wildcraft1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/wildcraft1.png -------------------------------------------------------------------------------- /examples/public/images/wrong.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/wrong.png -------------------------------------------------------------------------------- /examples/public/images/wrong.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 10 | 11 | -------------------------------------------------------------------------------- /examples/public/images/wrong_g.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/wrong_g.png -------------------------------------------------------------------------------- /examples/public/images/wrong_r.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/examples/public/images/wrong_r.png -------------------------------------------------------------------------------- /examples/views/account/n-accounts-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 | HOME 6 |
7 |
Siddharth Jain
8 |
9 | 10 | sidjain2091@gmail.com 11 |
12 |
13 | 14 | +91 9560839425 15 |
16 |
17 | L 1104, Pan Oasis, Sector 70, Noida Near Near Global International School, Noida - 201301 18 |
19 |
20 | Edit Address 21 |
22 |
23 |
24 |
-------------------------------------------------------------------------------- /examples/views/breadcrumbs.hbs: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /examples/views/certificate-completion.hbs: -------------------------------------------------------------------------------- 1 |
2 | 5 | 6 |
7 | CERTIFICATE OF COMPLETION 8 |
9 |
10 | This certificate is proudly presented to
11 | {{!-- name goes here --}} 12 |
13 |
14 |
15 | for successfully completing the
C++ Course for Beginners course. 16 |
17 |
18 |
19 |
20 |
Date
21 |
22 | 23 |
24 | 25 |
26 |
Manmohan Gupta (Founder, Coding Blocks)
27 |
28 |
29 |
-------------------------------------------------------------------------------- /examples/views/coding-blocks/buttons.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Primary Button States

4 | 5 | 6 | 7 |

Secondary Button States

8 | 9 | 10 | 11 |

Secondary Button States

12 | 13 | 14 |
15 | 16 |
17 | 18 |
1
19 |
2
20 | 21 |
22 |
-------------------------------------------------------------------------------- /examples/views/coding-blocks/faq-section.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |
6 |
7 |
This is a question
8 | 9 |
10 |
11 | Coding Blocks was founded in 2014 with a mission to create skilled software engineers for our country and the world. 12 | We aim to bridge the gap between the quality of skills demanded by industry and the quality of skills. Read more... 13 | Coding Blocks was founded in 2014 with a mission to create skilled software engineers for our country and the world. 14 | We aim to bridge the gap between the quality of skills demanded by industry and the quality of skills. Read more... 15 |
16 |
17 |
18 |
19 |
20 |
-------------------------------------------------------------------------------- /examples/views/coding-blocks/tabs.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Primary Tabs

4 |
5 |
Tab 1
6 |
Tab 2
7 |
Tab 3
8 |
Tab 4
9 |
10 | 11 |

Secondary Tabs

12 |
13 |
Tab 1
14 |
Tab 2
15 |
Tab 3
16 |
Tab 4
17 |
18 |
19 |
-------------------------------------------------------------------------------- /examples/views/daily-goal-card-small.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |

Daily Goal

5 |
Complete daily goal to count it as streak
6 | 7 |
20/100 Points Scored
8 |
9 |
10 |
-------------------------------------------------------------------------------- /examples/views/divided-list-horizontal.hbs: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /examples/views/faq-section.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | 5 | 8 |
9 | No, in case you don't join Nagarro, the fees won't be refunded. There won't be any bond upon joining this 10 | Bootcamp. 11 |
12 |
13 |
14 |
-------------------------------------------------------------------------------- /examples/views/floating-ad.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | 5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
Gaurav Bansal
13 |
Got placed in Amazon
14 |
Course - C++ Master Course
15 |
16 |
17 |
18 |
19 | 20 |
Watch his
success story
21 |
22 |
23 |
24 |
25 |
-------------------------------------------------------------------------------- /examples/views/hb-author-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |

About the Authors

5 |
6 | 7 |
8 |
Siddharth Jain
9 | View Profile 10 |
11 |
12 |
13 | 14 |
15 |
Siddharth Jain
16 | View Profile 17 |
18 |
19 |
20 |
21 |
-------------------------------------------------------------------------------- /examples/views/hb-rating-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |

Rate this problem?

5 |
6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 |
25 |
26 |
-------------------------------------------------------------------------------- /examples/views/hb/404page.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 | {{>nav-hb}} 4 |
5 | {{>sidenav}} 6 |
7 |
8 |
9 |
404
10 |
Sorry, Page not found
11 | 12 | 404 13 |
14 |
15 |
16 |
17 |
18 |
-------------------------------------------------------------------------------- /examples/views/hb/badges.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 | Badge 6 |
02
7 |
8 |
9 |
10 |
-------------------------------------------------------------------------------- /examples/views/hb/submit-test.hbs: -------------------------------------------------------------------------------- 1 | {{!-- Should take up 40% of the total width --}} 2 |
3 |
4 |
5 |
6 |
SUBMIT TEST
7 |
8 |
9 |
Once submitted, you can no longer view or modify this test. Are you sure you are done, and want to close 10 | the 11 | test?
12 |
13 | 18 | 22 |
23 |
24 |
25 |
26 |
-------------------------------------------------------------------------------- /examples/views/img-review-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |
6 | 8 |
9 |
10 |
11 | 12 |
13 | 14 |
Yashvardhan, Jss
15 |
16 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore 17 | magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan lacus vel 18 | facilisis. 19 |
20 |
21 |
22 |
-------------------------------------------------------------------------------- /examples/views/img-ring.hbs: -------------------------------------------------------------------------------- 1 |
2 | 3 |
-------------------------------------------------------------------------------- /examples/views/loader.hbs: -------------------------------------------------------------------------------- 1 | 2 | {{> nav-bar }} 3 | 4 |
5 |
6 |
7 |
8 |
9 |
10 | 11 | -------------------------------------------------------------------------------- /examples/views/online-cb/dashboard-cards.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 | 6 | Claim Goodies 7 |
8 |
9 | Complete 70% of your course 10 | to unlock and claim goodies 11 |
12 |
13 |
14 |
15 |
Threshold Completion: 70%+
16 |
17 | 21 |
22 |
23 | 24 |
25 | 26 |
27 |
-------------------------------------------------------------------------------- /examples/views/online-cb/goodies-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 | fire 6 |
7 | wildcraft 8 |
9 | Get a Wildcraft Backpack and lots of goodies with this course! 10 |
11 |
12 |
13 |
-------------------------------------------------------------------------------- /examples/views/online-cb/projects-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
Projects
3 |
4 | 5 |
Todo List App
6 |
7 | A task manager with features like 'mark as done', 'cear done tasks' and sorting tasks by their status. 8 |
9 |
10 |
Todo List App
11 |
12 | A task manager with features like 'mark as done', 'cear done tasks' and sorting tasks by their status. 13 |
14 |
15 |
Todo List App
16 |
17 | A task manager with features like 'mark as done', 'cear done tasks' and sorting tasks by their status. 18 |
19 |
-------------------------------------------------------------------------------- /examples/views/online-cb/student-review-card.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |
6 |
7 |
Shivam Agarwal
8 |
Android App Dev
9 |
10 |
11 |
12 | Coding Blocks helped in gaining enough experience to get internships at giants like Google and Rubrik. 13 |
14 |
15 |
Placed at Google
16 | feather 17 |
18 |
19 |
20 |
-------------------------------------------------------------------------------- /examples/views/pills.hbs: -------------------------------------------------------------------------------- 1 |
Small Pills
2 |
3 |
4 | Pill Default 5 |
6 | 7 |
8 | Pill Green 9 |
10 | 11 |
12 | Pill Red 13 |
14 |
15 | 16 | 17 |
Default Pills
18 |
19 |
20 | Pill Default 21 |
22 |
23 | Pill Green 24 |
25 | 26 | 27 |
28 | Pill Red 29 |
30 |
31 | 32 |
Large Pills
33 |
34 |
35 | Pill Default 36 |
37 | 38 |
39 | Pill Green 40 |
41 | 42 |
43 | Pill Red 44 |
45 |
46 | 47 | 48 | -------------------------------------------------------------------------------- /examples/views/radial-progress.hbs: -------------------------------------------------------------------------------- 1 |
2 |
3 | 4 | 5 | 6 | 7 |
8 |
-------------------------------------------------------------------------------- /examples/views/timer-clock.hbs: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /examples/views/unordered-list.hbs: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /file-list-gen.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const shell = require('shelljs') 3 | const config = require('./motley.config.json') 4 | 5 | const fileListViews = shell.find('examples/views') 6 | .filter((file) => file.match(/\.hbs$/)) 7 | .sort() 8 | .map(hbsFileName => { 9 | let fileName = hbsFileName.replace(".hbs", "") 10 | fileName = fileName.split("/").pop() 11 | return `
${fileName}
` 12 | }) 13 | .join('\n') 14 | 15 | 16 | 17 | html = ` 18 | {{> nav-bar }} 19 |
20 |
21 |
22 |

Views

23 | ${fileListViews} 24 |
25 |
26 |

Preview

27 |
28 | 29 |
30 |
31 |
32 |
` 33 | fs.writeFile(__dirname + '/examples/views/index.hbs', html, () => null) 34 | -------------------------------------------------------------------------------- /live.sh: -------------------------------------------------------------------------------- 1 | rm -rf live 2 | mkdir live 3 | cp -Rv examples/html/* live/ 4 | cp -Rv examples/public/* live/ 5 | -------------------------------------------------------------------------------- /mkdirs: -------------------------------------------------------------------------------- 1 | mkdir examples/views/online-cb 2 | mkdir examples/views/dukaan 3 | mkdir examples/views/hb 4 | mkdir examples/components/online-cb 5 | mkdir examples/components/dukaan 6 | mkdir examples/components/hb 7 | -------------------------------------------------------------------------------- /motley.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "applications": [ 3 | "hb", 4 | "online-cb", 5 | "dukaan", 6 | "account", 7 | "hiringblocks", 8 | "coding-blocks" 9 | ] 10 | } 11 | -------------------------------------------------------------------------------- /sass/styles/_animations.scss: -------------------------------------------------------------------------------- 1 | @import "animations/index"; 2 | @import "animations/zoom" 3 | -------------------------------------------------------------------------------- /sass/styles/_applications.scss: -------------------------------------------------------------------------------- 1 | @import "applications/hb/hb"; 2 | @import "applications/dukaan/dukaan"; 3 | @import "applications/online-cb/online-cb"; 4 | @import "applications/accounts/accounts"; 5 | @import "applications/hiringblocks/hiringblocks"; 6 | @import "applications/coding-blocks/coding-blocks"; 7 | -------------------------------------------------------------------------------- /sass/styles/_components.scss: -------------------------------------------------------------------------------- 1 | @import "components/grid"; 2 | @import "components/side-nav"; 3 | @import "components/modal"; 4 | @import "components/cb-navbar/index"; 5 | @import "components/review-pad"; 6 | @import "components/searchbar"; 7 | @import "components/hello-intern"; 8 | @import "components/landing-page"; 9 | @import "components/accordion-layout"; 10 | @import "components/sidenav.scss"; 11 | @import "components/hamburger-nav.scss"; 12 | @import "components/topnav.scss"; 13 | @import "components/live-classes.scss"; 14 | @import "components/img-review-card.scss"; 15 | @import "components/events-page.scss"; 16 | @import "components/label-card.scss"; 17 | @import "components/indicator.scss"; 18 | @import "components/backdrop.scss"; 19 | @import "components/tracks.scss"; 20 | -------------------------------------------------------------------------------- /sass/styles/_elements.scss: -------------------------------------------------------------------------------- 1 | @import "elements/heading"; 2 | @import "elements/progress"; 3 | @import "elements/button"; 4 | @import "elements/ul-li"; 5 | @import "elements/input"; 6 | @import "elements/tag.scss"; 7 | @import "elements/small-animations.scss"; 8 | @import "elements/floating-ad.scss"; 9 | -------------------------------------------------------------------------------- /sass/styles/_media-query.scss: -------------------------------------------------------------------------------- 1 | @import "media-query/font"; 2 | -------------------------------------------------------------------------------- /sass/styles/_resets.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/sass/styles/_resets.scss -------------------------------------------------------------------------------- /sass/styles/_themes.scss: -------------------------------------------------------------------------------- 1 | @import "themes/cricket-cup" 2 | -------------------------------------------------------------------------------- /sass/styles/_tools.scss: -------------------------------------------------------------------------------- 1 | @import "tools/tools.border-radius"; 2 | @import "tools/tools.dimensions"; 3 | @import "tools/tools.fonts"; 4 | @import "tools/tools.margin"; 5 | @import "tools/tools.padding"; 6 | @import "tools/tools.textalign"; 7 | @import "tools/tools.float"; 8 | @import "tools/tools.border"; 9 | @import "tools/tools.flexbox"; 10 | @import "tools/tools.display"; 11 | @import "tools/tools.width"; 12 | @import "tools/list"; 13 | @import "tools/tools.multiply-px.scss"; 14 | @import "tools/position.scss"; 15 | -------------------------------------------------------------------------------- /sass/styles/_trumps.scss: -------------------------------------------------------------------------------- 1 | @import "trumps/home"; 2 | @import "trumps/trump"; 3 | @import "trumps/nagarro-landing.scss"; -------------------------------------------------------------------------------- /sass/styles/_utilities.scss: -------------------------------------------------------------------------------- 1 | @import "utilities/grid/grid"; 2 | @import "utilities/background"; 3 | @import "utilities/border"; 4 | @import "utilities/color"; 5 | @import "utilities/display"; 6 | @import "utilities/flexbox"; 7 | @import "utilities/font"; 8 | @import "utilities/text"; 9 | @import "utilities/position"; 10 | @import "utilities/selector"; 11 | @import "utilities/width-x-height"; 12 | @import "utilities/floating.scss"; 13 | @import "utilities/overflow.scss"; 14 | @import "utilities/aspect-ratio.scss"; 15 | @import "utilities/transition.scss"; 16 | @import "utilities/scrollbar.scss"; 17 | @import "utilities/width-limiter.scss"; 18 | -------------------------------------------------------------------------------- /sass/styles/animations/index.scss: -------------------------------------------------------------------------------- 1 | .animated { 2 | -webkit-animation-duration: 0.5s; 3 | animation-duration: 0.5s; 4 | -webkit-animation-fill-mode: both; 5 | animation-fill-mode: both; 6 | } 7 | -------------------------------------------------------------------------------- /sass/styles/animations/zoom.scss: -------------------------------------------------------------------------------- 1 | @keyframes zoom-in { 2 | from { 3 | opacity: 0; 4 | transform: scale3d(0.3, 0.3, 0.3); 5 | } 6 | 7 | 50% { 8 | opacity: 1; 9 | } 10 | } 11 | 12 | .zoom-in { 13 | animation-name: zoom-in; 14 | } 15 | 16 | @keyframes zoom-out { 17 | from { 18 | opacity: 1; 19 | } 20 | 21 | 50% { 22 | opacity: 0; 23 | transform: scale3d(0.3, 0.3, 0.3); 24 | } 25 | 26 | to { 27 | opacity: 0; 28 | } 29 | } 30 | 31 | .zoom-out { 32 | animation-name: zoom-out; 33 | } 34 | -------------------------------------------------------------------------------- /sass/styles/app.scss: -------------------------------------------------------------------------------- 1 | @import "settings/settings.color"; 2 | @import "settings/settings.global"; 3 | @import "settings/settings.font"; 4 | @import "tools"; 5 | @import "generic/normalize"; 6 | @import "generic/reset"; 7 | @import "utilities"; 8 | @import "animations"; 9 | @import "elements"; 10 | @import "objects"; 11 | @import "components"; 12 | @import "media-query"; 13 | 14 | //TODO: OPTION TO SELECT THEME AND INSERT THAT THEME HERE 15 | @import "themes"; 16 | @import "trumps"; 17 | -------------------------------------------------------------------------------- /sass/styles/applications/account/_application.scss: -------------------------------------------------------------------------------- 1 | .a-ac { 2 | @import "img-ring.scss"; 3 | @import "layout.scss"; 4 | @import "hamburger-nav.scss"; 5 | } -------------------------------------------------------------------------------- /sass/styles/applications/account/_components.scss: -------------------------------------------------------------------------------- 1 | @import "./components/options"; 2 | -------------------------------------------------------------------------------- /sass/styles/applications/account/app.scss: -------------------------------------------------------------------------------- 1 | @import "../../settings/settings.color"; 2 | @import "../../settings/settings.global"; 3 | @import "../../settings/settings.font"; 4 | @import "../../tools"; 5 | @import "../../generic/normalize"; 6 | @import "../../generic/reset"; 7 | @import "../../utilities"; 8 | @import "../../animations"; 9 | @import "../../elements"; 10 | @import "../../objects"; 11 | @import "../../components"; 12 | @import "../../media-query"; 13 | 14 | //TODO: OPTION TO SELECT THEME AND INSERT THAT THEME HERE 15 | @import "../../themes"; 16 | @import "application"; 17 | @import "components"; 18 | @import "../../trumps"; 19 | -------------------------------------------------------------------------------- /sass/styles/applications/account/components/options.scss: -------------------------------------------------------------------------------- 1 | .hover-orange { 2 | &:hover { 3 | font-weight: $bold; 4 | } 5 | 6 | &.active { 7 | font-weight: $bold; 8 | color: $orange; 9 | } 10 | } 11 | 12 | input.underline-input { 13 | border-bottom: solid 1px $hover-grey !important; 14 | padding-bottom: 1.5rem; 15 | 16 | &:focus { 17 | border-bottom: solid 1px $black !important; 18 | } 19 | } -------------------------------------------------------------------------------- /sass/styles/applications/account/hamburger-nav.scss: -------------------------------------------------------------------------------- 1 | @media screen and (max-width: 767px) { 2 | .hamburger-nav { 3 | &__ham-logo { 4 | width: 45%; 5 | } 6 | } 7 | } -------------------------------------------------------------------------------- /sass/styles/applications/account/img-ring.scss: -------------------------------------------------------------------------------- 1 | .img-ring { 2 | border: solid 1px $orange; 3 | height: 10rem; 4 | width: 10rem; 5 | 6 | &--profile { 7 | height: 5.714rem; 8 | width: 5.714rem; 9 | } 10 | } -------------------------------------------------------------------------------- /sass/styles/applications/account/layout.scss: -------------------------------------------------------------------------------- 1 | .topbar { 2 | height: 80px; 3 | } 4 | 5 | .work-area { 6 | height: calc(100vh - 80px); 7 | 8 | &__side-menu { 9 | width: max-content; 10 | } 11 | 12 | &__main-area { 13 | padding-left: 5.5rem !important; 14 | padding-right: 5.5rem !important; 15 | 16 | @media screen and (max-width: 1199px) { 17 | padding-left: 4rem !important; 18 | padding-right: 4rem !important; 19 | } 20 | 21 | @media screen and (max-width: 991px) { 22 | padding-left: 2.5rem !important; 23 | padding-right: 2.5rem !important; 24 | } 25 | 26 | @media screen and (max-width: 555px) { 27 | padding-left: 1.5rem !important; 28 | padding-right: 1.5rem !important; 29 | } 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/_application.scss: -------------------------------------------------------------------------------- 1 | .a-cbm { 2 | @import "buttons.scss"; 3 | @import "heading.scss"; 4 | @import "font.scss"; 5 | @import "color.scss"; 6 | @import "landing-page.scss"; 7 | @import "events-page-landing.scss"; 8 | @import "padding.scss"; 9 | @import "margin.scss"; 10 | @import "tabs.scss"; 11 | @import "cb-junior.scss"; 12 | @import "classroom-courses.scss"; 13 | @import "super-navbar.scss"; 14 | @import "hamburger-nav.scss"; 15 | @import "wakanda.scss"; 16 | @import "classroom-page-old.scss"; 17 | } 18 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/_components.scss: -------------------------------------------------------------------------------- 1 | @import "components/option-div.scss"; 2 | @import "components/cards.scss"; 3 | @import "components/universe.scss"; 4 | @import "components/accordion-list.scss"; 5 | @import "components/faq-section.scss"; 6 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/_elements.scss: -------------------------------------------------------------------------------- 1 | @import "elements/a.scss"; -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/_settings.scss: -------------------------------------------------------------------------------- 1 | @import "settings/colors.scss"; 2 | @import "settings/font.scss"; 3 | @import "settings/directions.scss"; 4 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/app.scss: -------------------------------------------------------------------------------- 1 | @import "../../settings/settings.color"; 2 | @import "../../settings/settings.global"; 3 | @import "../../settings/settings.font"; 4 | @import "settings"; 5 | @import "../../tools"; 6 | @import "../../generic/normalize"; 7 | @import "../../generic/reset"; 8 | @import "../../utilities"; 9 | @import "../../animations"; 10 | @import "../../elements"; 11 | @import "elements"; 12 | @import "../../objects"; 13 | @import "../../components"; 14 | @import "../../media-query"; 15 | 16 | //TODO: OPTION TO SELECT THEME AND INSERT THAT THEME HERE 17 | @import "../../themes"; 18 | @import "application"; 19 | @import "components"; 20 | @import "../../trumps"; 21 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/classroom-page-old.scss: -------------------------------------------------------------------------------- 1 | // Delete this css file once V2 is launched 2 | 3 | .syllabus-grid-section { 4 | .syllabus-grid-card:nth-child(2n-1) { 5 | .card { 6 | background-color: $grey-light-3; 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/color.scss: -------------------------------------------------------------------------------- 1 | // TEXT SOLIDS 2 | 3 | @each $abbrev, $color in $solid-color-list { 4 | .text-#{$abbrev} { 5 | color: $color !important; 6 | } 7 | } 8 | 9 | // TEXT GRADIENTS 10 | 11 | @each $abbrev, $color in $gradient-color-list { 12 | .text-gradient-#{$abbrev} { 13 | -webkit-text-fill-color: transparent; 14 | -webkit-background-clip: text; 15 | background-clip: text; 16 | background-image: $color; 17 | } 18 | } 19 | 20 | // BACKGROUND SOLIDS 21 | 22 | @each $abbrev, $color in $solid-color-list { 23 | .bg-#{$abbrev} { 24 | background-color: $color !important; 25 | } 26 | } 27 | 28 | // BACKGROUND GRADIENTS 29 | 30 | @each $abbrev, $color in $gradient-color-list { 31 | .bg-gradient-#{$abbrev} { 32 | background: $color; 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/components/accordion-list.scss: -------------------------------------------------------------------------------- 1 | .accordion-container { 2 | &__accordion-head { 3 | position: relative; 4 | cursor: pointer; 5 | 6 | &::after { 7 | content: "\2022"; 8 | position: absolute; 9 | top: 50%; 10 | transform: translateY(-50%); 11 | left: -7px; 12 | font-size: 3rem; 13 | -webkit-text-fill-color: transparent; 14 | -webkit-background-clip: text; 15 | background-clip: text; 16 | background-image: $gradient-orange; 17 | } 18 | } 19 | 20 | &__accordion-body { 21 | &--hidden { 22 | display: none; 23 | } 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/components/faq-section.scss: -------------------------------------------------------------------------------- 1 | .faq-element-container { 2 | border-bottom: 1px solid #e9e9e9; 3 | } 4 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/components/option-div.scss: -------------------------------------------------------------------------------- 1 | .option-div { 2 | cursor: pointer; 3 | padding: 1.5rem; 4 | color: #959595; 5 | position: relative; 6 | border-radius: 5px; 7 | border: 1px solid $white; 8 | background: $white; 9 | 10 | &__icon { 11 | display: none; 12 | } 13 | 14 | &:hover { 15 | border: solid 1px $orange; 16 | color: $black; 17 | } 18 | 19 | &.selected { 20 | border: solid 1px $orange; 21 | color: $black; 22 | } 23 | 24 | &.selected > &__icon { 25 | display: inline-block; 26 | } 27 | 28 | &--rect { 29 | display: flex; 30 | justify-content: space-between; 31 | align-items: center; 32 | } 33 | 34 | &--square > &__icon { 35 | position: absolute; 36 | top: 1.5rem; 37 | right: 1.5rem; 38 | } 39 | 40 | &--square { 41 | display: flex; 42 | flex-direction: column; 43 | justify-content: space-between; 44 | align-items: center; 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/elements/a.scss: -------------------------------------------------------------------------------- 1 | a { 2 | color: $global-font-text-color; 3 | } -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/font.scss: -------------------------------------------------------------------------------- 1 | @each $type, $size in $text-size-list { 2 | .#{$type} { 3 | font-size: $size !important; 4 | } 5 | } 6 | 7 | .extra-bold { 8 | font-weight: 900 !important; 9 | } -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/heading.scss: -------------------------------------------------------------------------------- 1 | // @each $number in (1, 2, 3, 4, 5, 6) { 2 | // h#{$number} { 3 | // font-size: $heading-#{$number} !important; 4 | // } 5 | // } 6 | 7 | h1 { 8 | font-size: $heading-1; 9 | } 10 | 11 | h2 { 12 | font-size: $heading-2; 13 | } 14 | 15 | h3 { 16 | font-size: $heading-3; 17 | } 18 | 19 | h4 { 20 | font-size: $heading-4; 21 | } 22 | 23 | h5 { 24 | font-size: $heading-5; 25 | } 26 | 27 | h6 { 28 | font-size: $heading-6; 29 | } -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/settings/directions.scss: -------------------------------------------------------------------------------- 1 | $directions: ( 2 | "t": top, 3 | "b": bottom, 4 | "r": right, 5 | "l": left, 6 | ); 7 | -------------------------------------------------------------------------------- /sass/styles/applications/coding-blocks/settings/font.scss: -------------------------------------------------------------------------------- 1 | // Font Sizes 2 | 3 | $global-font-size: 12px; 4 | 5 | $font-1: 0.75rem; // 10px 6 | $font-2: 0.875rem; // 12px 7 | $font-3: 1rem; // Standard font size - 14px 8 | $font-4: 1.143rem; // 16px 9 | $font-5: 1.286rem; // 18px 10 | 11 | $heading-6: 1.428rem; // 20px 12 | $heading-5: 1.713rem; // 24px 13 | $heading-4: 2rem; // 28px 14 | $heading-3: 2.286rem; // 32px 15 | $heading-2: 2.571rem; // 36px 16 | $heading-1: 2.857rem; // 40px 17 | 18 | // Font Weights 19 | 20 | $extra-bold: 900; 21 | 22 | $text-size-list: ( 23 | "font-1": $font-1, 24 | "font-2": $font-2, 25 | "font-3": $font-3, 26 | "font-4": $font-4, 27 | "font-5": $font-5, 28 | "heading-6": $heading-6, 29 | "heading-5": $heading-5, 30 | "heading-4": $heading-4, 31 | "heading-3": $heading-3, 32 | "heading-2": $heading-2, 33 | "heading-1": $heading-1, 34 | ); -------------------------------------------------------------------------------- /sass/styles/applications/dukaan/_application.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/sass/styles/applications/dukaan/_application.scss -------------------------------------------------------------------------------- /sass/styles/applications/dukaan/app.scss: -------------------------------------------------------------------------------- 1 | @import "../../settings/settings.color"; 2 | @import "../../settings/settings.global"; 3 | @import "../../settings/settings.font"; 4 | @import "../../tools"; 5 | @import "../../generic/normalize"; 6 | @import "../../generic/reset"; 7 | @import "../../utilities"; 8 | @import "../../animations"; 9 | @import "../../elements"; 10 | @import "../../objects"; 11 | @import "../../components"; 12 | @import "../../media-query"; 13 | 14 | //TODO: OPTION TO SELECT THEME AND INSERT THAT THEME HERE 15 | @import "../../themes"; 16 | @import "application"; 17 | @import "../../trumps"; 18 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/_application.scss: -------------------------------------------------------------------------------- 1 | .a-hb { 2 | @import "buttons.scss"; 3 | @import "tab-nav.scss"; 4 | @import "submissions-table.scss"; 5 | @import "dropdown.scss"; 6 | @import "textarea.scss"; 7 | @import "border-card.scss"; 8 | @import "progress.scss"; 9 | } 10 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/_components.scss: -------------------------------------------------------------------------------- 1 | @import "./components/daily-goal-card"; 2 | @import "./components/dcb-card"; 3 | @import "./components/dcb-home"; 4 | // @import "./components/divided-list-horizontal"; 5 | @import "./components/previous-dcb"; 6 | @import "./components/code-editor.scss"; 7 | @import "./components/code-window.scss"; 8 | @import "./components/competition-card.scss"; 9 | @import "./components/faq-card.scss"; 10 | @import "./components/dashboard.scss"; 11 | @import "./components/admission.scss"; 12 | @import "./components/contest-card.scss"; 13 | @import "./components/test-cases-card.scss"; 14 | @import "./components/congo-card.scss"; 15 | @import "./components/badges.scss"; 16 | @import "./components/404page.scss"; 17 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/_settings.scss: -------------------------------------------------------------------------------- 1 | @import "settings/colors.scss" 2 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/app.scss: -------------------------------------------------------------------------------- 1 | @import "../../settings/settings.color"; 2 | @import "../../settings/settings.global"; 3 | @import "../../settings/settings.font"; 4 | @import "settings"; 5 | @import "../../tools"; 6 | @import "../../generic/normalize"; 7 | @import "../../generic/reset"; 8 | @import "../../utilities"; 9 | @import "../../animations"; 10 | @import "../../elements"; 11 | @import "../../objects"; 12 | @import "../../components"; 13 | @import "../../media-query"; 14 | 15 | //TODO: OPTION TO SELECT THEME AND INSERT THAT THEME HERE 16 | @import "../../themes"; 17 | @import "application"; 18 | @import "components"; 19 | @import "../../trumps"; 20 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/border-card.scss: -------------------------------------------------------------------------------- 1 | @media screen and (max-width: 767px) { 2 | .border-card { 3 | border-radius: 5px; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/buttons.scss: -------------------------------------------------------------------------------- 1 | .button-solid { 2 | &.button-blue { 3 | background-image: $button-gradient-blue; 4 | } 5 | } 6 | 7 | .button-dashed { 8 | font-weight: $bold; 9 | 10 | &.button-blue { 11 | border: solid 1px $hb-blue; 12 | color: $hb-blue; 13 | 14 | &:hover { 15 | background-image: $gradient-blue; 16 | } 17 | } 18 | 19 | &.button-purple { 20 | border: solid 1px $purple; 21 | color: $purple; 22 | 23 | &:hover { 24 | background-image: $gradient-dpurple; 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/404page.scss: -------------------------------------------------------------------------------- 1 | .font-superlarge { 2 | font-size: 9rem; 3 | } 4 | 5 | .subheading { 6 | font-size: 2.571rem; 7 | margin-top: -2.143rem; 8 | } 9 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/admission.scss: -------------------------------------------------------------------------------- 1 | .admission-card { 2 | @media screen and (max-width: 1199px) { 3 | .divided-list { 4 | .list-heading { 5 | font-size: $font-sm !important; 6 | } 7 | 8 | .list-data { 9 | font-size: $font-xs !important; 10 | } 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/badges.scss: -------------------------------------------------------------------------------- 1 | .badge-container { 2 | position: relative; 3 | 4 | .badge-number { 5 | position: absolute; 6 | display: flex; 7 | flex-direction: row; 8 | align-items: center; 9 | justify-content: center; 10 | width: 28%; 11 | height: 25%; 12 | background-color: $white; 13 | border-radius: 50%; 14 | top: 10%; 15 | right: -8%; 16 | border: 2px solid #6fd9fc; 17 | color: #6fd9fc; 18 | font-size: 0.7vw; 19 | 20 | @media screen and (max-width: 767px) { 21 | font-size: 2vw; 22 | } 23 | } 24 | 25 | .badge-number--blue { 26 | border-color: #6fd9fc; 27 | color: #6fd9fc; 28 | } 29 | 30 | .badge-number--orange { 31 | border-color: #f46e3c; 32 | color: #f46e3c; 33 | } 34 | 35 | .badge-number--red { 36 | border-color: #b81a69; 37 | color: #b81a69; 38 | } 39 | 40 | .badge-number--yellow { 41 | border-color: #f8c332; 42 | color: #f8c332; 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/code-editor.scss: -------------------------------------------------------------------------------- 1 | .c-code-card { 2 | height: 100vh; 3 | color: $global-font-text-color; 4 | background-color: $code-editor; 5 | 6 | textarea { 7 | background-color: $code-editor-grey; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/competition-card.scss: -------------------------------------------------------------------------------- 1 | .c-competition-card { 2 | .divided-list { 3 | @media screen and (max-width: 991px) { 4 | .list-heading { 5 | font-size: $font-xs !important; 6 | } 7 | 8 | .list-data { 9 | font-size: $card-md; 10 | } 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/congo-card.scss: -------------------------------------------------------------------------------- 1 | .congo-card { 2 | &__backdrop { 3 | opacity: 0.45; 4 | } 5 | 6 | &__divider { 7 | height: 4px; 8 | width: 25%; 9 | background-color: $white; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/contest-card.scss: -------------------------------------------------------------------------------- 1 | .contest-card { 2 | background: transparent; 3 | 4 | .head { 5 | height: 180px; 6 | } 7 | 8 | .foot { 9 | padding-top: 75px !important; 10 | } 11 | 12 | &__img-head { 13 | height: 210px; 14 | 15 | .back-img { 16 | top: 0; 17 | left: 0; 18 | z-index: -5; 19 | } 20 | } 21 | 22 | &__header-img { 23 | height: 55%; 24 | right: 5%; 25 | bottom: -5%; 26 | 27 | @media screen and (min-width: 993px) { 28 | &--narrow { 29 | width: 45%; 30 | } 31 | } 32 | } 33 | 34 | &__course-logo { 35 | left: 10%; 36 | bottom: -50px; 37 | background: inherit; 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/daily-goal-card.scss: -------------------------------------------------------------------------------- 1 | .c-daily-goal-card { 2 | text-align: center; 3 | 4 | .divider-h { 5 | background-clip: content-box; 6 | } 7 | 8 | @include progress(10px, $gradient-blue); 9 | } 10 | 11 | @media screen and (max-width: 1200px) { 12 | .c-daily-goal-card { 13 | padding: 30px; 14 | } 15 | } 16 | 17 | @media screen and (max-width: 992px) { 18 | .c-daily-goal-card { 19 | padding: 20px; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/dcb-card.scss: -------------------------------------------------------------------------------- 1 | .c-dcb-card { 2 | color: $white; 3 | 4 | .divided-list { 5 | .list-item { 6 | &:not(:last-child) { 7 | border-right: solid 1px $white; 8 | } 9 | } 10 | 11 | .list-heading { 12 | color: #fc6; 13 | } 14 | } 15 | 16 | @media screen and (max-width: 991px) { 17 | .divided-list { 18 | .list-heading { 19 | font-size: $card-md; 20 | } 21 | 22 | .list-data { 23 | font-size: $card-md; 24 | } 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/dcb-home.scss: -------------------------------------------------------------------------------- 1 | .c-dcb-home { 2 | overflow-x: hidden; 3 | 4 | .dcb-body { 5 | text-align: center; 6 | 7 | .c-dcb-card { 8 | text-align: left; 9 | } 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/faq-card.scss: -------------------------------------------------------------------------------- 1 | .c-faq-card { 2 | max-height: 725px; 3 | overflow-y: auto; 4 | } 5 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/previous-dcb.scss: -------------------------------------------------------------------------------- 1 | .c-previous-dcb { 2 | padding: 40px; 3 | 4 | h4 { 5 | color: #111f31; 6 | } 7 | 8 | .divided-list { 9 | .list-heading { 10 | color: $hb-blue; 11 | font-size: $font-xs; 12 | } 13 | 14 | .list-data { 15 | color: #111f31; 16 | font-size: $font-xs; 17 | } 18 | } 19 | 20 | @media screen and (max-width: 575px) { 21 | .divided-list { 22 | .list-heading { 23 | font-size: $card-md; 24 | } 25 | 26 | .list-data { 27 | font-size: $card-md; 28 | } 29 | } 30 | } 31 | 32 | @media screen and (max-width: 767px) { 33 | padding: 20px; 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/components/test-cases-card.scss: -------------------------------------------------------------------------------- 1 | .test-cases-card { 2 | &__active { 3 | background-color: $white; 4 | } 5 | 6 | &__grey-heading { 7 | background-color: #ebebeb; 8 | } 9 | 10 | &__icon { 11 | height: 15px; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/dropdown.scss: -------------------------------------------------------------------------------- 1 | // has to be removed after using bootstrap dropdowns 2 | .dropdown { 3 | border: solid 1px $t-heading-border; 4 | border-radius: 5px; 5 | } 6 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/progress.scss: -------------------------------------------------------------------------------- 1 | progress::-moz-progress-bar { 2 | background-image: $gradient-orange; 3 | } 4 | 5 | progress::-ms-fill { 6 | background-image: $gradient-orange; 7 | } 8 | 9 | progress::-webkit-progress-value { 10 | background-image: $gradient-orange; 11 | } 12 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/settings/colors.scss: -------------------------------------------------------------------------------- 1 | $grey: #f3f3f3; 2 | $code-editor-grey: #1e1e1e; 3 | 4 | //Gradients 5 | $gradient-purple-blue: linear-gradient(to right, #8108da, #350ed8); 6 | $gradient-lgreen: linear-gradient(to right, #82da3b, #27a87c); 7 | 8 | //Background Colors 9 | $bg-color-list: map-merge( 10 | $bg-color-list, 11 | ( 12 | "grey": $grey 13 | ) 14 | ); 15 | 16 | //Text Colors 17 | $text-color-list: map-merge( 18 | $text-color-list, 19 | ( 20 | "grey": $grey, 21 | "dark-grey": $dark-grey 22 | ) 23 | ); 24 | 25 | //Background Gradients 26 | $gradient-map: map-merge( 27 | $gradient-map, 28 | ( 29 | "purple-blue": $gradient-purple-blue, 30 | "lgreen": $gradient-lgreen, 31 | ) 32 | ); 33 | 34 | 35 | //Border card 36 | $border-card-border-color: #f3f3f3; 37 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/submissions-table.scss: -------------------------------------------------------------------------------- 1 | .c-hb-leaderboard { 2 | table { 3 | td:first-child { 4 | text-align: center; 5 | } 6 | } 7 | 8 | thead { 9 | color: $orange; 10 | } 11 | 12 | tbody { 13 | text-align: left; 14 | } 15 | 16 | &.profile { 17 | table { 18 | td:first-child { 19 | font-weight: $bold; 20 | font-size: $font-sm; 21 | text-align: left; 22 | } 23 | 24 | tbody { 25 | td { 26 | font-weight: $semi-bold; 27 | } 28 | } 29 | } 30 | } 31 | } 32 | 33 | table.hover { 34 | tr:hover { 35 | background-color: $hover-grey; 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/tab-nav.scss: -------------------------------------------------------------------------------- 1 | .tab-nav-underline { 2 | & .tab { 3 | &:hover { 4 | color: $orange; 5 | } 6 | 7 | &.active { 8 | border-bottom: solid 2px $orange; 9 | color: $orange; 10 | } 11 | 12 | padding: 15px 0; 13 | flex-grow: 1; 14 | text-align: center; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /sass/styles/applications/hb/textarea.scss: -------------------------------------------------------------------------------- 1 | textarea { 2 | background-color: #f3f3f3; 3 | border-radius: 5px; 4 | padding: 1rem; 5 | } 6 | -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/_application.scss: -------------------------------------------------------------------------------- 1 | .a-hire { 2 | margin-bottom: 8rem; 3 | 4 | @import "hiring-landing.scss"; 5 | @import "hamburger-nav.scss"; 6 | @import "topnav.scss"; 7 | @import "form-input.scss"; 8 | @import "tables.scss"; 9 | } 10 | -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/_components.scss: -------------------------------------------------------------------------------- 1 | @import "components/topnav"; 2 | @import "components/hiring-modal.scss"; 3 | @import "components/profile.scss"; -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/_objects.scss: -------------------------------------------------------------------------------- 1 | @import "objects/buttons.scss"; -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/_settings.scss: -------------------------------------------------------------------------------- 1 | @import "settings/colors.scss" 2 | -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/app.scss: -------------------------------------------------------------------------------- 1 | @import "../../settings/settings.color"; 2 | @import "../../settings/settings.global"; 3 | @import "../../settings/settings.font"; 4 | @import "settings"; 5 | @import "../../tools"; 6 | @import "../../generic/normalize"; 7 | @import "../../generic/reset"; 8 | @import "../../utilities"; 9 | @import "../../animations"; 10 | @import "../../elements"; 11 | @import "../../objects"; 12 | @import "objects"; 13 | @import "../../components"; 14 | @import "../../media-query"; 15 | 16 | //TODO: OPTION TO SELECT THEME AND INSERT THAT THEME HERE 17 | @import "../../themes"; 18 | @import "application"; 19 | @import "components"; 20 | @import "../../trumps"; 21 | -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/components/hiring-modal.scss: -------------------------------------------------------------------------------- 1 | .hiring-modal { 2 | @media screen and (max-width: 767px){ 3 | width: 90% !important; 4 | } 5 | 6 | width: 50% !important; 7 | padding: 0 !important; 8 | } -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/components/profile.scss: -------------------------------------------------------------------------------- 1 | .profile-left-pane { 2 | @media screen and (max-width: 767px){ 3 | border-right: unset !important; 4 | } 5 | } -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/form-input.scss: -------------------------------------------------------------------------------- 1 | .search-bar { 2 | height: 40px; 3 | border: none; 4 | } 5 | 6 | .select-container { 7 | border: unset; 8 | 9 | select { 10 | height: 40px; 11 | padding: 0.5rem 3rem 0.5rem 2rem; 12 | } 13 | 14 | &::after { 15 | content: unset; 16 | } 17 | 18 | &::before { 19 | content: ""; 20 | position: absolute; 21 | display: inline-block; 22 | width: 0; 23 | height: 0; 24 | top: 0; 25 | bottom: 0; 26 | right: 1.5rem; 27 | margin: auto; 28 | border-style: solid; 29 | border-width: 7px 4px 0 4px; 30 | border-color: #aaaaaa transparent transparent transparent; 31 | transition: all 250ms; 32 | } 33 | 34 | &:active { 35 | select { 36 | background-color: $hover-grey; 37 | } 38 | 39 | &::before { 40 | border-width: 0 4px 7px 4px; 41 | border-color: transparent transparent #aaaaaa transparent; 42 | } 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/hamburger-nav.scss: -------------------------------------------------------------------------------- 1 | @media screen and (max-width: 767px) { 2 | .hamburger-nav { 3 | &__top-bar { 4 | height: 70px; 5 | } 6 | } 7 | } -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/hiring-landing.scss: -------------------------------------------------------------------------------- 1 | .hiring-landing { 2 | &__main-section { 3 | padding: 4rem 8.5rem; 4 | 5 | @media screen and (max-width: 1199px) { 6 | padding: 4rem 5rem; 7 | } 8 | 9 | @media screen and (max-width: 575px) { 10 | padding: 4rem 2rem; 11 | } 12 | } 13 | 14 | &__form-section { 15 | @media screen and (min-width: 992px) { 16 | height: 640px; 17 | } 18 | 19 | &__back-img { 20 | bottom: -20%; 21 | 22 | @media screen and (max-width: 1499px) { 23 | bottom: -5%; 24 | } 25 | 26 | @media screen and (max-width: 1199px) { 27 | bottom: 0; 28 | } 29 | } 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/objects/buttons.scss: -------------------------------------------------------------------------------- 1 | .button-solid { 2 | &.lg { 3 | padding: 13px 20px; 4 | border-radius: 30px; 5 | } 6 | } 7 | 8 | .button-dashed { 9 | font-weight: $bold; 10 | 11 | &.lg { 12 | padding: 13px 20px; 13 | border-radius: 30px; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/settings/colors.scss: -------------------------------------------------------------------------------- 1 | $grey: #f3f3f3; 2 | 3 | //Background Colors 4 | $bg-color-list: map-merge( 5 | $bg-color-list, 6 | ( 7 | "grey": $grey 8 | ) 9 | ); 10 | 11 | //Text Colors 12 | $text-color-list: map-merge( 13 | $text-color-list, 14 | ( 15 | "grey": $grey, 16 | "dark-grey": $dark-grey, 17 | "orange": $orange 18 | ) 19 | ); 20 | 21 | //Border card 22 | $border-card-border-color: #f3f3f3; 23 | 24 | //Tags 25 | $tag-dashed-border-color: $orange; 26 | $tag-dashed-text-color: $orange; 27 | 28 | 29 | //Pills 30 | $pill-dashed-border-color: $orange; 31 | $pill-dashed-text-color: $orange; -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/tables.scss: -------------------------------------------------------------------------------- 1 | .horizontal-scrolling-table { 2 | table { 3 | thead { 4 | td, 5 | th { 6 | padding-bottom: 1rem; 7 | } 8 | } 9 | 10 | thead, 11 | tbody { 12 | text-align: left; 13 | } 14 | 15 | td, 16 | th { 17 | padding-left: 1rem; 18 | padding-right: 1rem; 19 | 20 | max-width: 250px; 21 | } 22 | 23 | @media screen and (min-width: 768px) { 24 | td, 25 | th { 26 | max-width: 350px; 27 | } 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sass/styles/applications/hiringblocks/topnav.scss: -------------------------------------------------------------------------------- 1 | .c-topnav { 2 | height: 70px; 3 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/_application.scss: -------------------------------------------------------------------------------- 1 | @import "components"; 2 | 3 | .a-ocb { 4 | 5 | margin-bottom: 8rem; 6 | 7 | @import "tab-nav.scss"; 8 | @import "_elements.scss"; 9 | @import "_objects.scss"; 10 | @import "progress.scss"; 11 | @import "card-mentor.scss"; 12 | @import "timeline.scss"; 13 | @import "form-input.scss"; 14 | @import "hamburger-nav.scss"; 15 | @import "img-card.scss"; 16 | @import "divided-list-horizontal.scss"; 17 | @import "know-your-mentor.scss"; 18 | @import "horizontal-quiz-card.scss"; 19 | } 20 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/_elements.scss: -------------------------------------------------------------------------------- 1 | @import "elements/buttons.scss"; 2 | @import "elements/card-mentors.scss"; -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/_objects.scss: -------------------------------------------------------------------------------- 1 | @import "objects/form-input.scss"; 2 | @import "objects/comparison-table.scss"; -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/_settings.scss: -------------------------------------------------------------------------------- 1 | @import "settings/colors.scss"; 2 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/app.scss: -------------------------------------------------------------------------------- 1 | @import "../../settings/settings.color"; 2 | @import "../../settings/settings.global"; 3 | @import "../../settings/settings.font"; 4 | @import "settings"; 5 | @import "../../tools"; 6 | @import "../../generic/normalize"; 7 | @import "../../generic/reset"; 8 | @import "generics.scss"; 9 | @import "../../utilities"; 10 | @import "../../animations"; 11 | @import "../../elements"; 12 | @import "../../objects"; 13 | @import "../../components"; 14 | @import "../../media-query"; 15 | 16 | //TODO: OPTION TO SELECT THEME AND INSERT THAT THEME HERE 17 | @import "../../themes"; 18 | @import "application"; 19 | @import "components"; 20 | @import "../../trumps"; 21 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/card-mentor.scss: -------------------------------------------------------------------------------- 1 | .card-mentor { 2 | display: flex; 3 | align-items: center; 4 | margin: 0; 5 | 6 | &::after { 7 | content: ""; 8 | display: block; 9 | clear: both; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/about-course/accordion.scss: -------------------------------------------------------------------------------- 1 | .c-about-accordion { 2 | @include li-left-right-padding(right, 26%); 3 | 4 | .row { 5 | padding-right: 3%; 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/about-course/buy-right.scss: -------------------------------------------------------------------------------- 1 | .c-buy-right { 2 | @include dimensions(100%, auto); 3 | 4 | .border-card { 5 | @include dimensions(100%, 100%); 6 | 7 | padding: 0; 8 | overflow: hidden; 9 | } 10 | 11 | .button-container { 12 | margin: 4rem 0; 13 | } 14 | 15 | .button-solid { 16 | margin-right: 4%; 17 | } 18 | 19 | .course-features { 20 | padding: 0 3.6rem; 21 | margin-bottom: 2rem; 22 | } 23 | 24 | .video { 25 | @include dimensions(100%, 300px); 26 | 27 | border: none; 28 | } 29 | 30 | .footer { 31 | padding: 5rem 2.5rem 2rem 3.6rem; 32 | font-size: $font-mds; 33 | font-weight: $extra-bold; 34 | background-image: linear-gradient(30deg, #333, #000); 35 | position: relative; 36 | 37 | .floating-img { 38 | max-width: 80px !important; 39 | position: absolute; 40 | top: -23%; 41 | } 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/about-course/buy-top.scss: -------------------------------------------------------------------------------- 1 | %button-config { 2 | @include dimensions(100%, 42px); 3 | @include border-radius(40px); 4 | 5 | font-size: $font-xs; 6 | font-weight: $font-medium; 7 | max-width: 190px; 8 | } 9 | 10 | .c-buy-top { 11 | @include dimensions(100%, auto); 12 | 13 | position: fixed; 14 | top: 70px; 15 | z-index: 300; 16 | padding: 10px 4%; 17 | background-color: $vp-background; 18 | transition: all 0.35s ease; 19 | 20 | .card-image { 21 | margin: 0; 22 | max-width: 70px; 23 | min-width: 60px; 24 | } 25 | 26 | .heading-d { 27 | margin: 0; 28 | padding-left: 3%; 29 | } 30 | 31 | .button-solid { 32 | @extend %button-config; 33 | 34 | margin-right: 3%; 35 | } 36 | 37 | .button-dashed { 38 | @extend %button-config; 39 | } 40 | 41 | &.slide-up { 42 | transform: translateY(-350px); 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/classroom-layout.scss: -------------------------------------------------------------------------------- 1 | .progress-text { 2 | font-size: $font-xl; 3 | text-align: center; 4 | } 5 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/content/document.scss: -------------------------------------------------------------------------------- 1 | .c-document { 2 | min-height: 566px; 3 | 4 | .markdown { 5 | height: 465px; 6 | overflow: auto; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/content/pb-leaderboard.scss: -------------------------------------------------------------------------------- 1 | .c-pb-leaderboard { 2 | padding: 40px 0; 3 | 4 | .badge { 5 | @include dimensions(108px, 126px); 6 | @include margin(0, auto, 25px, auto); 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/content/pb-statement.scss: -------------------------------------------------------------------------------- 1 | .c-pb-statement { 2 | @include padding-mixin(30px, 56px, 30px, 30px); 3 | 4 | .para { 5 | margin: 25px 0; 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/content/problem.scss: -------------------------------------------------------------------------------- 1 | .c-pb { 2 | height: 100%; 3 | position: relative; 4 | } 5 | 6 | .pb-desk { 7 | @include dimensions(30%, 100%); 8 | 9 | overflow-y: auto; 10 | transition: transform 0.35s ease; 11 | background: $white; 12 | position: relative; 13 | float: left; 14 | 15 | &.collapse { 16 | transform: translateX(-40%); 17 | } 18 | 19 | .tab-nav { 20 | background: $white; 21 | color: $global-font-text-color; 22 | padding: 0; 23 | box-shadow: 0 14px 41px 0 rgba(51, 51, 51, 0.1); 24 | position: sticky; 25 | top: 0; 26 | z-index: 100; 27 | } 28 | 29 | .tab-items { 30 | font-size: $font-sm; 31 | } 32 | 33 | &::-webkit-scrollbar { 34 | display: none; 35 | } 36 | } 37 | 38 | @media screen and (max-width: 767px) { 39 | .c-pb { 40 | display: none; 41 | } 42 | 43 | .c-pb-alert { 44 | display: block; 45 | padding: 20px; 46 | text-align: center; 47 | color: black; 48 | background: white; 49 | } 50 | 51 | .c-content-section .section.collapse { 52 | transform: none; 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/content/video.scss: -------------------------------------------------------------------------------- 1 | .c-video { 2 | height: 566px; 3 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/course-card-buy.scss: -------------------------------------------------------------------------------- 1 | .course-logo { 2 | height: 60px; 3 | width: 60px; 4 | border-radius: 30px; 5 | border: solid 1.5px $white; 6 | position: relative; 7 | padding: 0.75rem; 8 | background: inherit; 9 | } 10 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/course-card.scss: -------------------------------------------------------------------------------- 1 | .course-card { 2 | background: transparent; 3 | 4 | .head { 5 | height: 180px; 6 | } 7 | 8 | .foot { 9 | padding-top: 60px !important; 10 | } 11 | 12 | &__difficulty { 13 | margin-top: -0.5rem; 14 | } 15 | 16 | &__img-head { 17 | height: 210px; 18 | 19 | .back-img { 20 | top: 0; 21 | left: 0; 22 | z-index: -5; 23 | } 24 | } 25 | 26 | &__header-img { 27 | height: 55%; 28 | right: 5%; 29 | bottom: -5%; 30 | 31 | @media screen and (min-width: 993px) { 32 | &--narrow { 33 | width: 45%; 34 | } 35 | } 36 | } 37 | 38 | &__course-logo { 39 | left: 5%; 40 | bottom: -40px; 41 | background: inherit; 42 | border: solid 1px $white; 43 | } 44 | } 45 | 46 | .mentor-card { 47 | .head { 48 | height: 160px; 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/course-logos.scss: -------------------------------------------------------------------------------- 1 | .course-list-logo { 2 | max-width: 60px !important; 3 | border-radius: 5px; 4 | } 5 | 6 | .course-info-card-logo { 7 | border: solid 1px $white; 8 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/csv/csv.scss: -------------------------------------------------------------------------------- 1 | @import './submissions.scss'; 2 | 3 | .c-csv { 4 | height: 100%; 5 | background-color: white; 6 | overflow: auto; 7 | 8 | .top { 9 | padding: 2.5rem 2.5rem 65px; 10 | 11 | .description { 12 | color: #666; 13 | font-size: 1.1rem; 14 | } 15 | } 16 | 17 | .bottom { 18 | position: sticky; 19 | display: flex; 20 | justify-content: space-between; 21 | align-items: center; 22 | flex-wrap: wrap; 23 | bottom: 0; 24 | 25 | @include dimensions(100%, 65px); 26 | 27 | background-color: white; 28 | padding: 0 1rem; 29 | box-shadow: 0 -2px 12px 0 rgba(0, 0, 0, 0.1); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/csv/submissions.scss: -------------------------------------------------------------------------------- 1 | .c-csv-submissions { 2 | padding: 2.5rem 1.5rem; 3 | 4 | .submission { 5 | .large-font { 6 | font-size: 2rem; 7 | } 8 | } 9 | } 10 | 11 | .c-csv-submission { 12 | padding: 2.5rem 3rem; 13 | 14 | * { 15 | display: flex; 16 | justify-content: center; 17 | } 18 | 19 | button { 20 | max-width: unset; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/dashboard.scss: -------------------------------------------------------------------------------- 1 | .c-course-progress { 2 | padding: 3rem 6rem; 3 | color: white; 4 | } 5 | 6 | .c-course-progress, 7 | .c-my-course-card { 8 | @include progress(10px, $button-element-level); 9 | } 10 | 11 | .c-dashboard-doubts, 12 | .c-announcements { 13 | max-height: 830px; 14 | overflow-y: auto; 15 | } 16 | 17 | .c-leaderboard { 18 | max-height: 460px; 19 | overflow-y: auto; 20 | } 21 | 22 | .c-certificate { 23 | position: relative; 24 | background-image: $gradient-blue; 25 | font-weight: $extra-bold; 26 | padding: 30px; 27 | 28 | .tick { 29 | &::after { 30 | border-left: solid 2px $blue; 31 | border-bottom: solid 2px $blue; 32 | } 33 | } 34 | } 35 | 36 | @media all and (max-width: 575px) { 37 | .c-content-accordion, 38 | .c-about-accordion { 39 | @include li-left-right-padding(left, 15%); 40 | 41 | .list-divided > .row { 42 | min-height: 70px; 43 | } 44 | } 45 | } 46 | 47 | @media screen and (max-width: 767px) { 48 | .c-course-progress { 49 | padding: 3rem 4rem; 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/difficulty-dots.scss: -------------------------------------------------------------------------------- 1 | %diff { 2 | display: inline-block; 3 | margin-right: 3px; 4 | border-radius: 50%; 5 | width: 5px; 6 | height: 5px; 7 | } 8 | 9 | .difficulty-dots { 10 | position: absolute; 11 | font-size: $card-sm; 12 | 13 | .pos-diff { 14 | @extend %diff; 15 | 16 | background: orange; 17 | } 18 | 19 | .neg-diff { 20 | @extend %diff; 21 | 22 | background: white; 23 | } 24 | } 25 | 26 | .difficulty-div { 27 | position: absolute; 28 | right: 6%; 29 | top: 30px; 30 | } 31 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/doubts.scss: -------------------------------------------------------------------------------- 1 | .c-doubts { 2 | background-color: #111; 3 | color: $white; 4 | overflow-y: auto; 5 | 6 | .position-sticky { 7 | background-color: #111; 8 | } 9 | 10 | input { 11 | margin: 15px 0; 12 | background-color: #272727; 13 | } 14 | 15 | .stars { 16 | display: flex; 17 | width: 70%; 18 | justify-content: space-between; 19 | 20 | i { 21 | font-size: 1.5rem; 22 | } 23 | } 24 | 25 | .tab-nav-underline { 26 | background-color: $black; 27 | } 28 | 29 | &.resolved { 30 | div { 31 | display: flex; 32 | justify-content: center; 33 | padding: 5px 30px; 34 | 35 | &:last-child { 36 | padding: 5px 60px 40px; 37 | text-align: center; 38 | font-style: italic; 39 | color: whitesmoke; 40 | opacity: 0.5; 41 | } 42 | } 43 | } 44 | 45 | input, 46 | textarea { 47 | background-color: #111; 48 | padding: 6px; 49 | border-bottom: 1px solid grey; 50 | color: grey; 51 | max-height: 80px; 52 | } 53 | 54 | textarea:placeholder { 55 | color: #999; 56 | } 57 | 58 | p { 59 | margin: 0.1rem 0; 60 | } 61 | } 62 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/feedback-modal.scss: -------------------------------------------------------------------------------- 1 | .c-feedback-modal { 2 | @include padding-mixin (5%, 10%, 10%, 10%); 3 | 4 | .title { 5 | margin: 30px 0; 6 | } 7 | 8 | .button-solid { 9 | margin-top: 50px; 10 | } 11 | 12 | .input-textarea { 13 | border-radius: 10px; 14 | resize: none; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/goodies-card.scss: -------------------------------------------------------------------------------- 1 | .goodies-card { 2 | position: relative; 3 | 4 | .free-tag { 5 | top: 10%; 6 | right: 12%; 7 | } 8 | 9 | &::after { 10 | content: ""; 11 | position: absolute; 12 | left: 0; 13 | bottom: 25%; 14 | height: 25%; 15 | width: 6px; 16 | background: $gradient-orange; 17 | } 18 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/hiring-banner.scss: -------------------------------------------------------------------------------- 1 | .c-home-banner { 2 | @include dimensions(100%, 500px); 3 | 4 | background-image: url('/images/home_bg.jpg'); 5 | padding: 30px 5%; 6 | display: flex; 7 | justify-content: space-between; 8 | 9 | .li-left { 10 | .button-solid { 11 | color: #692fdc; 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/job-description.scss: -------------------------------------------------------------------------------- 1 | @media screen and (max-width: 767px) { 2 | .c-job-description { 3 | .img-desc { 4 | border-right: none; 5 | } 6 | 7 | .job-description { 8 | border: none; 9 | } 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/my-course-card.scss: -------------------------------------------------------------------------------- 1 | .c-my-course-card { 2 | height: 460px; 3 | 4 | .card-mentor { 5 | margin: 15px 0; 6 | } 7 | } 8 | 9 | @media screen and (max-width: 767px) { 10 | .c-my-course-card { 11 | height: auto; 12 | } 13 | } 14 | 15 | @media screen and (max-width: 575px) { 16 | .c-my-course-card { 17 | .course-progress { 18 | margin-bottom: 10px; 19 | } 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/nagarro-banner.scss: -------------------------------------------------------------------------------- 1 | .c-nagarro-banner { 2 | background-color: #f5fcff; 3 | color: #69c; 4 | 5 | .title { 6 | color: #384181; 7 | } 8 | 9 | .button-solid { 10 | background: linear-gradient(to right, #384181, #346e98); 11 | } 12 | 13 | .logo { 14 | position: absolute; 15 | width: 140px; 16 | right: 12%; 17 | top: 100px; 18 | z-index: 2; 19 | } 20 | } 21 | 22 | @media screen and (max-width: 992px) { 23 | .c-nagarro-banner { 24 | .button-solid { 25 | margin: 0 auto; 26 | } 27 | 28 | .logo { 29 | width: 80px; 30 | right: 0; 31 | top: 50px; 32 | } 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/notification.scss: -------------------------------------------------------------------------------- 1 | .c-notification { 2 | text-transform: none; 3 | right: 0; 4 | left: unset; 5 | display: none; 6 | margin-top: 26px; 7 | } 8 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/offerings.scss: -------------------------------------------------------------------------------- 1 | .c-offerings { 2 | .heading { 3 | margin: { 4 | top: 40px; 5 | bottom: 35px; 6 | } 7 | font-size: $font-mds; 8 | font-weight: $bold; 9 | } 10 | 11 | .border-card { 12 | max-width: 205px; 13 | margin: 0 auto; 14 | } 15 | } 16 | 17 | @media all and (max-width: 575px) { 18 | .c-offerings { 19 | .offering-card-heading { 20 | margin-bottom: 15px; 21 | } 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/otp-enroll.scss: -------------------------------------------------------------------------------- 1 | .c-otp-enroll { 2 | @include dimensions(100%, auto); 3 | @include padding-s(15px, 50px); 4 | 5 | background: $nav-border; 6 | font-weight: $font-medium; 7 | 8 | .input-search { 9 | @include border-radius(37px); 10 | 11 | background-color: $otp-input-bg; 12 | width: 100%; 13 | max-width: 365px; 14 | float: right; 15 | } 16 | 17 | .button-solid { 18 | float: right; 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/overview-course.scss: -------------------------------------------------------------------------------- 1 | .c-course-progress { 2 | padding: 3rem 6rem; 3 | color: white; 4 | } 5 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/player-modal.scss: -------------------------------------------------------------------------------- 1 | .c-player-modal { 2 | z-index: 101 !important; 3 | 4 | .footer { 5 | label { 6 | height: 20px; 7 | } 8 | } 9 | } 10 | 11 | @media (max-width: 767px) { 12 | .c-player-modal { 13 | display: none; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/qna.scss: -------------------------------------------------------------------------------- 1 | .c-qna { 2 | 3 | .circle-back { 4 | position: absolute; 5 | opacity: 0.3; 6 | } 7 | 8 | .circle-front { 9 | transform: translate(16.5%, 16.5%); 10 | } 11 | } 12 | 13 | .c-qna-attempt { 14 | height: 100%; 15 | background-color: $white; 16 | display: flex; 17 | 18 | .quiz-content { 19 | overflow: auto; 20 | } 21 | 22 | .quiz-status { 23 | background-color: $grey-choices; 24 | overflow: auto; 25 | padding: 1rem 0; 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/rating-card.scss: -------------------------------------------------------------------------------- 1 | .c-rating-card { 2 | @include border-radius(15px); 3 | 4 | padding: 25px 18px; 5 | height: 225px; 6 | margin-bottom: 30px; 7 | 8 | .heading { 9 | font-size: $font-sm; 10 | margin-top: 15px; 11 | font-weight: $semi-bold; 12 | } 13 | 14 | .rating { 15 | margin: { 16 | top: 8px; 17 | bottom: 15; 18 | } 19 | } 20 | 21 | .review { 22 | height: 82px; 23 | overflow-y: auto; 24 | } 25 | 26 | .pos-rating, 27 | .neg-rating { 28 | font-size: $font-xs; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/rating-stats.scss: -------------------------------------------------------------------------------- 1 | .c-rating-stats { 2 | margin-bottom: 30px; 3 | 4 | progress { 5 | margin-bottom: 15px; 6 | } 7 | 8 | .score { 9 | min-width: 131px; 10 | transform: translateY(-10px); 11 | 12 | .rating { 13 | margin: 3px 0 10px 0; 14 | } 15 | 16 | .pos-rating, 17 | .neg-rating { 18 | font-size: $font-xl; 19 | } 20 | } 21 | 22 | .stats { 23 | .rating { 24 | transform: translateY(-6px); 25 | } 26 | 27 | .pos-rating, 28 | .neg-rating { 29 | font-size: $font-sm; 30 | } 31 | } 32 | 33 | .font-lg { 34 | font-size: 4.7143rem !important; 35 | } 36 | } 37 | 38 | @media screen and (max-width: 575px) { 39 | .c-rating-stats { 40 | .stats { 41 | .rating { 42 | display: none; 43 | } 44 | } 45 | 46 | .score { 47 | min-width: 105px; 48 | transform: translateY(-7px); 49 | } 50 | 51 | .font-lg { 52 | font-size: 2rem; 53 | } 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/referral-code.scss: -------------------------------------------------------------------------------- 1 | .c-referral-code { 2 | width: 100%; 3 | background: $button-gradient; 4 | display: flex; 5 | color: $white; 6 | 7 | .code { 8 | border: 1px dashed; 9 | font-size: 2rem; 10 | } 11 | } 12 | 13 | @media screen and (min-width: 992px) { 14 | .c-referral-code { 15 | justify-content: space-between; 16 | padding: 15px, 50px; 17 | 18 | .coupon { 19 | display: flex; 20 | align-items: center; 21 | 22 | .text { 23 | margin-right: 10px; 24 | } 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/run-card.scss: -------------------------------------------------------------------------------- 1 | .c-run-card { 2 | padding: 8% 7%; 3 | 4 | .divider-v { 5 | height: 35px; 6 | margin: 0 3%; 7 | } 8 | 9 | .divider-h { 10 | margin: 2rem 0; 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/sidebar.scss: -------------------------------------------------------------------------------- 1 | .sidebar { 2 | display: none; 3 | } 4 | 5 | @media screen and (max-width: 875px) { 6 | .sidebar { 7 | display: block; 8 | position: fixed; 9 | 10 | @include dimensions(55vw, 100%); 11 | 12 | top: 0; 13 | left: 0; 14 | z-index: 200; 15 | background-color: $white; 16 | transition: margin 0.5s; 17 | overflow-x: hidden; 18 | 19 | .close { 20 | font-size: 24px; 21 | cursor: pointer; 22 | float: right; 23 | opacity: 0.4; 24 | } 25 | 26 | .lower-half { 27 | .copyright-heading { 28 | position: absolute; 29 | bottom: 4%; 30 | } 31 | } 32 | 33 | &.sidebar-none { 34 | margin-left: -55vw; 35 | } 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/sidenav.scss: -------------------------------------------------------------------------------- 1 | .c-sidenav { 2 | width: 100vw; 3 | } 4 | 5 | @media (min-width: 768px) { 6 | .c-sidenav { 7 | width: 12vw; 8 | } 9 | 10 | .ml-sidenav { 11 | margin-left: 12vw; 12 | } 13 | 14 | .ml-sidenav-neg { 15 | margin-left: -12vw; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/testimonial.scss: -------------------------------------------------------------------------------- 1 | .c-testimonial { 2 | .dialog { 3 | height: 206px; 4 | 5 | .content { 6 | height: 80px; 7 | overflow: auto; 8 | margin-bottom: 10px; 9 | font-size: $font-xs; 10 | } 11 | 12 | .footer { 13 | @include flexbox(column, false, flex-end); 14 | 15 | text-align: right; 16 | } 17 | 18 | .img-container { 19 | max-height: 30px; 20 | width: 25%; 21 | overflow: hidden; 22 | } 23 | } 24 | } 25 | 26 | .c-testimonial-video { 27 | text-align: center; 28 | position: relative; 29 | padding-top: 70px; 30 | 31 | .back-div { 32 | height: 65%; 33 | } 34 | 35 | .video-container { 36 | @include dimensions(85%, 425px); 37 | 38 | border-radius: 10px; 39 | overflow: hidden; 40 | margin: 50px auto; 41 | } 42 | 43 | iframe { 44 | @include dimensions(100%, 100%); 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/topnav.scss: -------------------------------------------------------------------------------- 1 | .topnav { 2 | width: 88vw; 3 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/track-card.scss: -------------------------------------------------------------------------------- 1 | .track-card { 2 | &__head { 3 | height: 150px; 4 | position: relative; 5 | color: white; 6 | 7 | &__logo { 8 | position: absolute; 9 | left: 1.5rem; 10 | bottom: -40px; 11 | border: 2px solid white; 12 | border-radius: 50%; 13 | } 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/tracks.scss: -------------------------------------------------------------------------------- 1 | .track-indicator { 2 | position: absolute; 3 | top: 1.9rem; 4 | left: -7px; 5 | font-size: 3rem; 6 | color: $hover-grey; 7 | 8 | &.complete { 9 | -webkit-text-fill-color: transparent; 10 | -webkit-background-clip: text; 11 | background-clip: text; 12 | background-image: $gradient-orange; 13 | } 14 | } 15 | 16 | .tracks-container { 17 | padding-left: 7.325%; 18 | 19 | .track-indicator { 20 | top: 45%; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/components/upgrade-modal.scss: -------------------------------------------------------------------------------- 1 | .upgrade-modal { 2 | .close { 3 | position: absolute; 4 | top: 1.5rem; 5 | right: 3rem; 6 | 7 | @media screen and (max-width: 767px) { 8 | right: 1.5rem; 9 | } 10 | } 11 | 12 | .feature-list { 13 | @media screen and (min-width: 576px) { 14 | border-right: solid 1px $search-box-color; 15 | } 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/divided-list-horizontal.scss: -------------------------------------------------------------------------------- 1 | .divided-list { 2 | & > * { 3 | &:not(:last-child) { 4 | border-right: solid 1px $hover-grey; 5 | } 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/elements/buttons.scss: -------------------------------------------------------------------------------- 1 | .button-solid { 2 | font-weight: $bold; 3 | display: inline-block; 4 | 5 | &.button-grey { 6 | background: $light-grey; 7 | color: #666666; 8 | } 9 | } 10 | 11 | .button-dashed { 12 | font-weight: $bold; 13 | display: inline-block; 14 | } 15 | 16 | .animated-icon-button { 17 | display: flex; 18 | align-items: center; 19 | background: $interview-grey !important; 20 | 21 | img { 22 | transition: all 0.2s ease-in-out; 23 | } 24 | 25 | &:hover { 26 | img { 27 | transform: scale(2.5); 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/elements/card-mentors.scss: -------------------------------------------------------------------------------- 1 | .card-mentors { 2 | width: 35px; 3 | height: 35px; 4 | border: solid 1px $white; 5 | } 6 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/form-input.scss: -------------------------------------------------------------------------------- 1 | .select-container { 2 | border-bottom: unset; 3 | 4 | &::after { 5 | top: 45%; 6 | right: 0.6rem; 7 | } 8 | 9 | select { 10 | &:active { 11 | background: $hover-grey; 12 | } 13 | } 14 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/generics.scss: -------------------------------------------------------------------------------- 1 | body { 2 | padding-top: 62px; 3 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/hamburger-nav.scss: -------------------------------------------------------------------------------- 1 | @media screen and (max-width: 767px) { 2 | .hamburger-nav { 3 | &__ham-logo { 4 | width: 45%; 5 | } 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/img-card.scss: -------------------------------------------------------------------------------- 1 | .img-card { 2 | .head { 3 | position: relative; 4 | 5 | .card-badge { 6 | position: absolute; 7 | width: 20%; 8 | right: -2%; 9 | bottom: 20%; 10 | } 11 | } 12 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/know-your-mentor.scss: -------------------------------------------------------------------------------- 1 | .know-your-mentor { 2 | position: relative; 3 | 4 | .beige { 5 | color: #d69d72; 6 | } 7 | 8 | &__tag { 9 | background: #d69d72; 10 | position: absolute; 11 | letter-spacing: 3px; 12 | padding: 9px 25px; 13 | border-radius: 40px; 14 | line-height: 22px; 15 | top: -20px; 16 | width: fit-content; 17 | left: calc(50% - 105px); 18 | z-index: 10; 19 | } 20 | 21 | &__teacher { 22 | position: absolute; 23 | bottom: -4px; 24 | right: 15%; 25 | 26 | img { 27 | height: 190px; 28 | } 29 | 30 | &--left { 31 | left: 1rem; 32 | } 33 | 34 | @media screen and (max-width: 767px) { 35 | right: 0; 36 | 37 | img { 38 | height: 250px; 39 | } 40 | } 41 | } 42 | 43 | &__skewed-container { 44 | background: #2a2e37; 45 | clip-path: polygon(5% 0%, 100% 0%, 100% 100%, 0% 100%); 46 | border-radius: 10px; 47 | } 48 | 49 | .big-screen-padding { 50 | padding-left: 150px; 51 | } 52 | 53 | @media screen and (max-width: 575px) { 54 | &__skewed-container { 55 | clip-path: unset; 56 | } 57 | 58 | .big-screen-padding { 59 | padding-left: unset; 60 | } 61 | } 62 | } 63 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/objects/form-input.scss: -------------------------------------------------------------------------------- 1 | div.input-radio { 2 | display: flex; 3 | 4 | input { 5 | display: none; 6 | } 7 | 8 | label { 9 | cursor: pointer; 10 | display: flex; 11 | align-items: center; 12 | } 13 | 14 | label::before { 15 | content: ""; 16 | display: block; 17 | margin: auto; 18 | width: 25px; 19 | height: 25px; 20 | background-color: $t-heading-border; 21 | border-radius: 20px; 22 | } 23 | 24 | &.small { 25 | label::before { 26 | width: 15px; 27 | height: 15px; 28 | } 29 | } 30 | 31 | &.gradient-input { 32 | input:checked ~ label::before { 33 | content: ""; 34 | background: $gradient-orange; 35 | } 36 | } 37 | 38 | input:checked ~ label::before { 39 | content: "\2713"; 40 | color: $salmon; 41 | } 42 | } -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/progress.scss: -------------------------------------------------------------------------------- 1 | progress { 2 | &.progress-orange { 3 | &::-webkit-progress-value { 4 | background-image: $gradient-orange; 5 | } 6 | 7 | &::-moz-progress-bar { 8 | background-image: $gradient-orange; 9 | } 10 | 11 | &::-ms-fill { 12 | background-image: $gradient-orange; 13 | } 14 | } 15 | 16 | &.progress-green { 17 | &::-webkit-progress-value { 18 | background-image: $gradient-green; 19 | } 20 | 21 | &::-moz-progress-bar { 22 | background-image: $gradient-green; 23 | } 24 | 25 | &::-ms-fill { 26 | background-image: $gradient-green; 27 | } 28 | } 29 | 30 | &.progress-yellow { 31 | &::-webkit-progress-value { 32 | background-image: $gradient-yellow; 33 | } 34 | 35 | &::-moz-progress-bar { 36 | background-image: $gradient-yellow; 37 | } 38 | 39 | &::-ms-fill { 40 | background-image: $gradient-yellow; 41 | } 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/settings/colors.scss: -------------------------------------------------------------------------------- 1 | $grey: #666; 2 | $grey-2: #BDBDBD; 3 | $grey-3: #828282; 4 | 5 | $border-grey: #2b2f37; 6 | $border-divider: #2C2D30; 7 | $global-font-text-color: $white; 8 | 9 | $background-main: #15171E; 10 | $background-main-1: #08090C; 11 | $background-main-2: #151712; 12 | $background-main-3: #1E212B; 13 | 14 | $hover-grey: #08090C; 15 | 16 | $gradient-pink: linear-gradient(180deg, #BB6BD9 0%, #7F39AD 100%); 17 | 18 | //Text Colors 19 | $text-color-list: map-merge( 20 | $text-color-list, 21 | ( 22 | "grey": $grey, 23 | "grey-2": $grey-2, 24 | "grey-3": $grey-3, 25 | "dark-orange": $orange, 26 | ) 27 | ); 28 | 29 | //BACKGROUND COLORS 30 | $bg-color-list: map-merge( 31 | $bg-color-list, 32 | ( 33 | "grey": $grey, 34 | "background-main": $background-main, 35 | "background-main-1": $background-main-1, 36 | "background-main-2": $background-main-2, 37 | "background-main-3": $background-main-3 38 | ) 39 | ); 40 | 41 | $gradient-map: map-merge( 42 | $gradient-map, 43 | ("gradient-pink-2": $gradient-pink ) 44 | ) 45 | -------------------------------------------------------------------------------- /sass/styles/applications/online-cb/tab-nav.scss: -------------------------------------------------------------------------------- 1 | .tab-nav-underline { 2 | border-bottom: solid 1px $search-box-color; 3 | 4 | &.inverted { 5 | border-bottom: solid 1px $border-grey; 6 | } 7 | 8 | & .tab { 9 | bottom: -1px; 10 | 11 | &:hover { 12 | color: $orange; 13 | } 14 | 15 | &.active { 16 | border-bottom: solid 1px $orange; 17 | color: $orange; 18 | font-weight: $bold; 19 | } 20 | 21 | margin-right: 3rem; 22 | font-size: $font-sm; 23 | font-weight: $font-normal; 24 | padding-left: 0; 25 | padding-right: 0; 26 | } 27 | } -------------------------------------------------------------------------------- /sass/styles/components/backdrop.scss: -------------------------------------------------------------------------------- 1 | .backdrop { 2 | z-index: 1; 3 | position: relative; 4 | display: inline-block; 5 | margin: 0 1.5rem; 6 | 7 | &:before { 8 | content: ""; 9 | z-index: 0; 10 | position: absolute; 11 | height: calc(100% + 2rem); 12 | width: calc(100% + 3rem); 13 | left: -1.5rem; 14 | top: -1rem; 15 | border-radius: 10px; 16 | background: $light-grey; 17 | opacity: 0.3; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /sass/styles/components/cb-navbar/index.scss: -------------------------------------------------------------------------------- 1 | .cb-navbar-side { 2 | border-right: 1px solid $border-divider; 3 | } 4 | 5 | .cb-navbar-side > div { 6 | border-bottom: 1px solid $border-divider; 7 | } 8 | 9 | .cb-navbar-side > div:first-child { 10 | padding: 4.5rem 0; 11 | } 12 | 13 | // show hover effect on clickables 14 | .cb-navbar-side > div:not(:first-child):hover { 15 | cursor: pointer; 16 | } 17 | 18 | .cb-navbar-side > div.selected { 19 | position: relative; 20 | } 21 | 22 | .cb-navbar-side > div.selected::after { 23 | content: ''; 24 | width: 3px; 25 | height: 100%; 26 | display: block; 27 | position: absolute; 28 | background-image: linear-gradient(30deg, #ec6333, #f19633); 29 | top: 0; 30 | right: 0; 31 | } 32 | 33 | .cb-navbar-expanded { 34 | box-shadow: 0 17px 54px 6px rgba(51, 51, 51, 0.04); 35 | } 36 | -------------------------------------------------------------------------------- /sass/styles/components/grid.scss: -------------------------------------------------------------------------------- 1 | // CONTAINER 2 | 3 | @media (min-width: 576px) { 4 | .container { 5 | max-width: 540px; 6 | } 7 | } 8 | 9 | @media (min-width: 768px) { 10 | .container { 11 | max-width: 720px; 12 | padding: 0; 13 | } 14 | } 15 | 16 | @media (min-width: 992px) { 17 | .container { 18 | max-width: 960px; 19 | } 20 | } 21 | 22 | @media (min-width: 1200px) { 23 | .container { 24 | max-width: 1230px; 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /sass/styles/components/hello-intern.scss: -------------------------------------------------------------------------------- 1 | .gradient-text-hi-orange, 2 | .gradient-text-hi-pink, 3 | .gradient-text-hi-blue, 4 | .gradient-text-hi-purple { 5 | -webkit-text-fill-color: transparent; 6 | -webkit-background-clip: text; 7 | background-clip: text; 8 | font-size: 28px; 9 | } 10 | 11 | .gradient-text-hi-orange { 12 | background-image: $hi-gradient-pink-orange-lr; 13 | } 14 | 15 | .gradient-text-hi-pink { 16 | background-image: $hi-gradient-dpink-lr; 17 | } 18 | 19 | .gradient-text-hi-blue { 20 | background-image: $hi-gradient-blue-lr; 21 | } 22 | 23 | .gradient-text-hi-purple { 24 | background-image: $hi-gradient-purple-lr; 25 | } 26 | 27 | .overlay-icon { 28 | position: absolute; 29 | right: 10%; 30 | top: 10%; 31 | } 32 | -------------------------------------------------------------------------------- /sass/styles/components/img-review-card.scss: -------------------------------------------------------------------------------- 1 | .img-review-card { 2 | border-radius: 5px; 3 | position: relative; 4 | overflow: visible; 5 | padding-top: 5.5rem !important; 6 | 7 | .author { 8 | position: absolute; 9 | top: -50px; 10 | left: calc(50% - 50px); 11 | } 12 | 13 | .icon { 14 | position: absolute; 15 | left: 10%; 16 | top: -20px; 17 | } 18 | 19 | .review-body { 20 | max-height: 250px; 21 | overflow-y: auto; 22 | } 23 | } -------------------------------------------------------------------------------- /sass/styles/components/indicator.scss: -------------------------------------------------------------------------------- 1 | .indicator { 2 | position: absolute; 3 | top: -5%; 4 | left: -2.10rem; 5 | font-size: 2rem; 6 | -webkit-text-fill-color: transparent; 7 | -webkit-background-clip: text; 8 | background-clip: text; 9 | background-image: $gradient-orange; 10 | } 11 | -------------------------------------------------------------------------------- /sass/styles/components/modal.scss: -------------------------------------------------------------------------------- 1 | .c-modal { 2 | .modal-dialog { 3 | max-width: unset; 4 | } 5 | 6 | .modal-content { 7 | @include border-radius(10px); 8 | 9 | border: none; 10 | margin: 0 auto; 11 | display: block; 12 | box-shadow: none; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /sass/styles/components/problem-list.scss: -------------------------------------------------------------------------------- 1 | .c-problem-list { 2 | padding: 40px; 3 | 4 | h4 { 5 | color: #111f31; 6 | } 7 | 8 | .divided-list { 9 | .list-heading { 10 | color: $hb-blue; 11 | font-size: $font-xs; 12 | } 13 | 14 | .list-data { 15 | color: #111f31; 16 | font-size: $font-xs; 17 | } 18 | } 19 | 20 | @media screen and (max-width: 575px) { 21 | .divided-list { 22 | .list-heading { 23 | font-size: $card-md; 24 | } 25 | 26 | .list-data { 27 | font-size: $card-md; 28 | } 29 | } 30 | } 31 | 32 | @media screen and (max-width: 767px) { 33 | padding: 20px; 34 | } 35 | 36 | .divider-h { 37 | background-clip: content-box; 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /sass/styles/components/review-pad.scss: -------------------------------------------------------------------------------- 1 | .c-review-pad { 2 | margin: 2rem 0; 3 | 4 | @include flexbox(column, center, center); 5 | 6 | .title { 7 | font-size: $font-md; 8 | padding: 2rem 0; 9 | } 10 | } 11 | 12 | .options { 13 | display: grid; 14 | grid-template-columns: repeat(3, 80px); 15 | place-items: center; 16 | 17 | .circle { 18 | @include flexbox(row, center, center); 19 | @include dimensions(40px, 40px); 20 | @include border-radius(50%); 21 | 22 | background-color: $navLink; 23 | color: $white; 24 | margin: 10px 0; 25 | cursor: pointer; 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /sass/styles/components/searchbar.scss: -------------------------------------------------------------------------------- 1 | .searchbar { 2 | input { 3 | border-radius: 25px; 4 | position: relative; 5 | background-color: $white; 6 | height: 50px; 7 | width: 100%; 8 | color: $black; 9 | } 10 | 11 | img { 12 | position: absolute; 13 | bottom: 20%; 14 | right: 3%; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /sass/styles/components/side-nav.scss: -------------------------------------------------------------------------------- 1 | .nav-info { 2 | font-size: $font-sm; 3 | 4 | .card { 5 | @include padding-mixin(90px, 0, 50px, 0); 6 | 7 | text-align: center; 8 | } 9 | 10 | .profile-pic { 11 | @include padding-mixin(60px, 0, 0, 0); 12 | } 13 | 14 | .faded { 15 | color: $default-accordion-font; 16 | } 17 | 18 | .round-img { 19 | @include dimensions(120px, 120px); 20 | 21 | margin-right: 28px; 22 | } 23 | 24 | .profile-container { 25 | position: absolute; 26 | width: 100%; 27 | top: 0; 28 | z-index: 100; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sass/styles/components/tracks.scss: -------------------------------------------------------------------------------- 1 | .track-indicator { 2 | position: absolute; 3 | top: 1.9rem; 4 | left: -7px; 5 | font-size: 3rem; 6 | color: $hover-grey; 7 | 8 | &.complete { 9 | -webkit-text-fill-color: transparent; 10 | -webkit-background-clip: text; 11 | background-clip: text; 12 | background-image: $gradient-orange; 13 | } 14 | } 15 | 16 | .tracks-container { 17 | padding-left: 7.325%; 18 | 19 | .track-indicator { 20 | top: 45%; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /sass/styles/elements/button.scss: -------------------------------------------------------------------------------- 1 | button { 2 | padding: 0; 3 | 4 | &:disabled { 5 | color: $dark-grey; 6 | cursor: default; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /sass/styles/elements/floating-ad.scss: -------------------------------------------------------------------------------- 1 | .floating-ad { 2 | position: fixed; 3 | bottom: 100px; 4 | left: 7.142rem; 5 | width: fit-content; 6 | 7 | & > .card { 8 | box-shadow: 7px 7px 15px 0px rgba(0, 0, 0, 0.15); 9 | } 10 | 11 | @media screen and (max-width: 1199px) { 12 | left: 6rem; 13 | } 14 | 15 | @media screen and (max-width: 991px) { 16 | left: 4.5rem; 17 | } 18 | 19 | @media screen and (max-width: 767px) { 20 | left: 4rem; 21 | } 22 | 23 | @media screen and (max-width: 575px) { 24 | left: 2.5rem; 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /sass/styles/elements/heading.scss: -------------------------------------------------------------------------------- 1 | h1, 2 | h2, 3 | h3, 4 | h4, 5 | h5, 6 | h6 { 7 | margin: 0; 8 | font-weight: $extra-bold; 9 | } 10 | 11 | h1 { 12 | font-size: $font-xxl; 13 | } 14 | 15 | h2 { 16 | font-size: $font-xl; 17 | } 18 | 19 | h3 { 20 | font-size: $font-lg; 21 | } 22 | 23 | h4 { 24 | font-size: $font-md; 25 | } 26 | 27 | h5 { 28 | font-size: $font-mds; 29 | } 30 | 31 | h6 { 32 | font-size: $font-sm; 33 | } 34 | -------------------------------------------------------------------------------- /sass/styles/elements/input.scss: -------------------------------------------------------------------------------- 1 | input { 2 | &[type=text], 3 | &[type=textarea], 4 | &[type=password] { 5 | border: none; 6 | } 7 | 8 | &[disabled] { 9 | background: $disabled-input; 10 | } 11 | } 12 | 13 | textarea { 14 | border: none; 15 | } 16 | -------------------------------------------------------------------------------- /sass/styles/elements/progress.scss: -------------------------------------------------------------------------------- 1 | progress { 2 | @include dimensions(100%, 7px); 3 | @include border-radius(7px); 4 | 5 | display: block; 6 | background-color: $grey-dark; 7 | } 8 | 9 | progress::-moz-progress-bar { 10 | @include border-radius(7px); 11 | 12 | display: block; 13 | background-color: $grey-dark; 14 | } 15 | 16 | progress::-webkit-progress-bar { 17 | @include dimensions(100%, 7px); 18 | @include border-radius(7px); 19 | 20 | display: block; 21 | background-color: $grey-dark; 22 | } 23 | 24 | progress::-ms-fill { 25 | @include dimensions(100%, 7px); 26 | @include border-radius(7px); 27 | 28 | display: block; 29 | background-color: $grey-dark; 30 | } 31 | 32 | progress::-webkit-progress-value { 33 | @include border-radius(7px); 34 | 35 | display: block; 36 | background-color: $grey-dark; 37 | } 38 | 39 | .progress-lock { 40 | position: absolute; 41 | display: flex; 42 | flex-direction: column; 43 | align-items: center; 44 | bottom: 5%; 45 | 46 | &__bubble { 47 | display: none; 48 | max-width: 110px; 49 | text-align: center; 50 | } 51 | 52 | &:hover > &__bubble { 53 | display: block; 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /sass/styles/elements/small-animations.scss: -------------------------------------------------------------------------------- 1 | .pulse { 2 | display: flex; 3 | align-items: center; 4 | justify-content: center; 5 | height: 1px; 6 | width: 1px; 7 | border-radius: 50%; 8 | position: relative; 9 | border: none; 10 | box-shadow: 0 0 0 0 #333; 11 | 12 | &:hover { 13 | animation: pulse 1.5s infinite cubic-bezier(0.2, 0, 0, 1); 14 | } 15 | 16 | @keyframes pulse { 17 | to { 18 | box-shadow: 0 0 0 60px rgba(150, 150, 150, 0); 19 | } 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /sass/styles/elements/tag.scss: -------------------------------------------------------------------------------- 1 | .side-tag { 2 | position: relative; 3 | 4 | &::after { 5 | content: " "; 6 | position: absolute; 7 | left: -2.1428rem; 8 | bottom: 0; 9 | width: 4px; 10 | height: 100%; 11 | background: $gradient-yellow; 12 | } 13 | 14 | &--wide { 15 | &::after { 16 | width: 8px; 17 | } 18 | } 19 | 20 | &--orange { 21 | &::after { 22 | background: $gradient-orange !important; 23 | } 24 | } 25 | 26 | &--blue { 27 | &::after { 28 | background: $gradient-blue !important; 29 | } 30 | } 31 | 32 | &--purple { 33 | &::after { 34 | background: $gradient-purple !important; 35 | } 36 | } 37 | 38 | &--std { 39 | &::after { 40 | left: -3rem; 41 | 42 | @media screen and (max-width: 767px){ 43 | left: -1.5rem; 44 | } 45 | } 46 | } 47 | } -------------------------------------------------------------------------------- /sass/styles/elements/ul-li.scss: -------------------------------------------------------------------------------- 1 | ul { 2 | padding: 0; 3 | } 4 | -------------------------------------------------------------------------------- /sass/styles/media-query/font.scss: -------------------------------------------------------------------------------- 1 | html { 2 | @media screen and (max-width: 991px) { 3 | font-size: 12px; 4 | } 5 | 6 | @media screen and (max-width: 767px) { 7 | font-size: 11px; 8 | } 9 | 10 | @media screen and (max-width: 575px) { 11 | font-size: 10px; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /sass/styles/objects/back-div.scss: -------------------------------------------------------------------------------- 1 | // div to provide background with negative z-index 2 | * > .back-div { 3 | position: relative; 4 | } 5 | 6 | .back-div { 7 | @include dimensions(100%, 80%); 8 | 9 | background-color: #fdfdfd; 10 | position: absolute; 11 | z-index: -1; 12 | top: 0; 13 | left: 0; 14 | } 15 | -------------------------------------------------------------------------------- /sass/styles/objects/border-card.scss: -------------------------------------------------------------------------------- 1 | %border-card { 2 | @include dimensions(100%, auto); 3 | 4 | border-radius: 10px; 5 | border: solid 1px $border-card-border-color; 6 | background-color: $white; 7 | overflow: hidden; 8 | } 9 | 10 | .border-card { 11 | @extend %border-card; 12 | 13 | padding: 2.1428rem; 14 | } 15 | 16 | .card-tag { 17 | position: absolute; 18 | right: 0; 19 | border-right: solid 3px $orange; 20 | } 21 | -------------------------------------------------------------------------------- /sass/styles/objects/bottom-nav.scss: -------------------------------------------------------------------------------- 1 | @media screen and (max-width: 767px) { 2 | .bottom-nav { 3 | position: fixed; 4 | bottom: 0; 5 | left: 0; 6 | width: 100vw !important; 7 | z-index: 500; 8 | border-radius: unset; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /sass/styles/objects/breadcrumbs.scss: -------------------------------------------------------------------------------- 1 | .breadcrumbs { 2 | .active { 3 | color: unset; 4 | } 5 | 6 | & > * { 7 | display: inline-block; 8 | position: relative; 9 | 10 | &::after { 11 | content: "\232a"; 12 | display: block; 13 | position: absolute; 14 | left: -3px; 15 | top: 0; 16 | } 17 | 18 | &:first-of-type::after { 19 | display: none; 20 | } 21 | 22 | &:last-child { 23 | font-weight: $regular; 24 | } 25 | 26 | &:first-child { 27 | padding-left: 0 !important; 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sass/styles/objects/card.scss: -------------------------------------------------------------------------------- 1 | .card { 2 | @include border-radius(15px); 3 | 4 | padding: 30px; 5 | // box-shadow: 0 20px 57px 0 $card-box-shadow; 6 | background: $white; 7 | } 8 | 9 | .card-image { 10 | width: 17%; 11 | } 12 | 13 | .c-card-carousel { 14 | flex-wrap: nowrap; 15 | overflow-x: auto; 16 | scrollbar-width: none; 17 | justify-content: flex-start; 18 | align-items: stretch; 19 | width: 100%; 20 | 21 | &::-webkit-scrollbar { 22 | display: none; 23 | } 24 | } 25 | 26 | @media screen and (max-width: 767px) { 27 | .c-card-carousel-small { 28 | flex-wrap: nowrap; 29 | overflow-x: auto; 30 | scrollbar-width: none; 31 | justify-content: flex-start; 32 | align-items: stretch; 33 | width: 100%; 34 | 35 | &::-webkit-scrollbar { 36 | display: none; 37 | } 38 | } 39 | } 40 | 41 | @each $size, $label in (576px, sm), (768px, md), (992px, lg) { 42 | @media screen and (max-width: $size) { 43 | .c-card-carousel-#{$label} { 44 | flex-wrap: nowrap; 45 | overflow-x: auto; 46 | scrollbar-width: none; 47 | justify-content: flex-start; 48 | align-items: stretch; 49 | width: 100%; 50 | 51 | &::-webkit-scrollbar { 52 | display: none; 53 | } 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /sass/styles/objects/copy-code.scss: -------------------------------------------------------------------------------- 1 | .copy-code { 2 | cursor: pointer; 3 | 4 | &:hover { 5 | position: relative; 6 | color: #d4d4d4; 7 | display: flex; 8 | align-items: center; 9 | justify-content: center; 10 | 11 | &::after { 12 | content: "Copy"; 13 | font-size: card-sm; 14 | font-weight: $bold; 15 | color: $black; 16 | position: absolute; 17 | z-index: 1; 18 | } 19 | } 20 | } -------------------------------------------------------------------------------- /sass/styles/objects/curtain.scss: -------------------------------------------------------------------------------- 1 | .curtains { 2 | @include dimensions(100vw, 100vh); 3 | 4 | display: flex; 5 | position: relative; 6 | overflow: hidden; 7 | 8 | .left-curtain, 9 | .right-curtain { 10 | @include dimensions(30%, 100%); 11 | 12 | min-width: 30%; 13 | transition: all 0.35s ease; 14 | overflow-y: auto; 15 | position: relative; 16 | 17 | & > * { 18 | @include dimensions(100%, 100%); 19 | 20 | position: absolute; 21 | z-index: 0; 22 | transition: all 0.35s ease; 23 | } 24 | } 25 | 26 | .left-curtain.collapse, 27 | .right-curtain.collapse { 28 | width: 0; 29 | min-width: unset; 30 | position: static; 31 | transition: all 0.35s ease; 32 | } 33 | 34 | .left-curtain.collapse { 35 | & > * { 36 | transform: translateX(-40%); 37 | } 38 | } 39 | 40 | .right-curtain.collapse { 41 | & > * { 42 | transform: translateX(40%); 43 | } 44 | } 45 | 46 | .main { 47 | height: 100%; 48 | flex: auto; 49 | transition: all 0.35s ease; 50 | z-index: 100; 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /sass/styles/objects/dialog.scss: -------------------------------------------------------------------------------- 1 | .dialog { 2 | border: solid 1px #e8e8e8; 3 | border-radius: 10px; 4 | position: relative; 5 | padding: 2.2rem; 6 | 7 | &::before { 8 | content: ""; 9 | position: absolute; 10 | bottom: -30px; 11 | right: 10%; 12 | width: 0; 13 | height: 0; 14 | border-style: solid; 15 | border-width: 30px 35px 0 0; 16 | border-color: #e8e8e8 transparent transparent transparent; 17 | } 18 | 19 | &::after { 20 | content: ""; 21 | position: absolute; 22 | bottom: -28px; 23 | right: 10%; 24 | width: 0; 25 | height: 0; 26 | border-style: solid; 27 | border-width: 29px 34px 0 0; 28 | border-color: #fff transparent transparent transparent; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sass/styles/objects/divided-list-horizontal.scss: -------------------------------------------------------------------------------- 1 | .divided-list { 2 | list-style: none; 3 | display: flex; 4 | 5 | .list-heading { 6 | font-size: $font-sm; 7 | } 8 | 9 | .list-data { 10 | font-size: $font-sm; 11 | } 12 | 13 | & > * { 14 | display: inline-block; 15 | 16 | &:not(:last-child) { 17 | border-right: solid 1px $faded-text; 18 | } 19 | 20 | &:first-child { 21 | padding-left: 0 !important; 22 | } 23 | 24 | &:last-child { 25 | padding-right: 0 !important; 26 | } 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /sass/styles/objects/divider.scss: -------------------------------------------------------------------------------- 1 | //
divider horizontal 2 | .divider-h { 3 | @include dimensions(100%, 1px); 4 | 5 | background: $border-divider; 6 | 7 | &.content-divider { 8 | background-clip: content-box !important; 9 | } 10 | } 11 | 12 | //
divider vertical 13 | .divider-v { 14 | @include dimensions(1px, 100%); 15 | 16 | background: $border-divider; 17 | } 18 | -------------------------------------------------------------------------------- /sass/styles/objects/fade.scss: -------------------------------------------------------------------------------- 1 | %fade { 2 | content: ''; 3 | position: absolute; 4 | right: 0; 5 | top: 0; 6 | height: 100%; 7 | background-color: $white; 8 | display: block; 9 | z-index: 100; 10 | } 11 | 12 | .fade-left::before { 13 | @extend %fade; 14 | 15 | left: 0; 16 | width: 1rem; 17 | box-shadow: 0.5rem 0 0.75rem $white; 18 | border-top-right-radius: 10px; 19 | border-bottom-right-radius: 10px; 20 | } 21 | 22 | .fade-right::after { 23 | @extend %fade; 24 | 25 | right: 0; 26 | width: 1rem; 27 | box-shadow: -0.5rem 0 0.75rem $white; 28 | border-top-left-radius: 10px; 29 | border-bottom-left-radius: 10px; 30 | } -------------------------------------------------------------------------------- /sass/styles/objects/fader.scss: -------------------------------------------------------------------------------- 1 | // KEEP PARENT'S POSITION RELATIVE 2 | .fader { 3 | @include dimensions(100%, 100%); 4 | 5 | position: absolute; 6 | background-color: $modal-fader; 7 | opacity: 0.21; 8 | z-index: 10; 9 | top: 0; 10 | left: 0; 11 | } 12 | -------------------------------------------------------------------------------- /sass/styles/objects/home.search.scss: -------------------------------------------------------------------------------- 1 | .input-search { 2 | @include border-radius(28px); 3 | 4 | input { 5 | background-color: transparent; 6 | } 7 | 8 | position: relative; 9 | border: none; 10 | background-color: transparent; 11 | font-size: $font-sm; 12 | } 13 | 14 | .input-search > img { 15 | width: 18px; 16 | height: 18px; 17 | top: 30%; 18 | left: 89%; 19 | position: absolute; 20 | } 21 | -------------------------------------------------------------------------------- /sass/styles/objects/hoverable.scss: -------------------------------------------------------------------------------- 1 | .hoverable { 2 | position: relative; 3 | 4 | &:hover { 5 | .pop-up { 6 | display: block; 7 | } 8 | } 9 | 10 | .pop-up { 11 | position: absolute; 12 | display: none; 13 | z-index: 200; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /sass/styles/objects/img-card.scss: -------------------------------------------------------------------------------- 1 | .img-card { 2 | @extend %border-card; 3 | 4 | .head { 5 | color: white; 6 | position: relative; 7 | transition: all 0.35s ease; 8 | 9 | .content { 10 | @include dimensions(100%, 100%); 11 | 12 | padding: 1.8rem; 13 | position: relative; 14 | } 15 | 16 | &__course-logo { 17 | height: 60px; 18 | width: 60px; 19 | background: inherit; 20 | border: solid 1px $white; 21 | border-radius: 30px; 22 | padding: 0.5rem; 23 | position: relative; 24 | overflow: hidden; 25 | } 26 | } 27 | 28 | .foot { 29 | padding: 20px 30px; 30 | position: relative; 31 | } 32 | 33 | .round-img-b { 34 | @include dimensions(86px, 86px); 35 | 36 | min-height: 86px; 37 | position: absolute; 38 | bottom: -43px; 39 | left: 30px; 40 | } 41 | } 42 | 43 | .back-img { 44 | position: absolute; 45 | width: 100%; 46 | height: 100%; 47 | object-fit: cover; 48 | border-radius: inherit; 49 | } 50 | -------------------------------------------------------------------------------- /sass/styles/objects/img-desc.scss: -------------------------------------------------------------------------------- 1 | .img-desc { 2 | @include flexbox(row); 3 | 4 | & .description { 5 | @include flexbox(column, space-between); 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /sass/styles/objects/img-ring.scss: -------------------------------------------------------------------------------- 1 | .img-ring { 2 | border-radius: 50%; 3 | border: solid 2px $orange; 4 | padding: 0.25rem; 5 | position: relative; 6 | 7 | .img { 8 | position: absolute; 9 | width: 90%; 10 | height: 90%; 11 | top: 5%; 12 | left: 5%; 13 | } 14 | 15 | &.profile-img { 16 | height: 150px; 17 | width: 150px; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /sass/styles/objects/info-popup.scss: -------------------------------------------------------------------------------- 1 | .info-popup { 2 | cursor: pointer; 3 | display: inline-block; 4 | 5 | &:hover { 6 | transform: scale(1.5); 7 | position: relative; 8 | 9 | &::after { 10 | content: "You will only be able to attempt this test again after 15 days!"; 11 | position: absolute; 12 | padding: 0.5rem; 13 | border-radius: 5px; 14 | border: solid 1px $orange; 15 | background-color: $white; 16 | width: max-content; 17 | font-size: $card-sm; 18 | top: -40px; 19 | left: -200px; 20 | } 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /sass/styles/objects/masonry.scss: -------------------------------------------------------------------------------- 1 | .masonry-plain { 2 | -webkit-column-count: 2; 3 | -moz-column-count: 2; 4 | column-count: 2; 5 | -webkit-column-gap: 1.5rem; 6 | -moz-column-gap: 1.5rem; 7 | column-gap: 1.5rem; 8 | 9 | .masonry-item { 10 | display: inline-block; 11 | width: 100%; 12 | transition: 1s ease all; 13 | box-sizing: border-box; 14 | -moz-box-sizing: border-box; 15 | -webkit-box-sizing: border-box; 16 | } 17 | } 18 | 19 | .grid-container { 20 | display: grid; 21 | grid-template-columns: repeat(3, minmax(180px, 1fr)); 22 | grid-gap: 25px; 23 | grid-auto-rows: minmax(200px, auto); 24 | grid-auto-flow: dense; 25 | 26 | @media screen and (max-width: 767px){ 27 | grid-template-columns: 100%; 28 | } 29 | 30 | .grid-item { 31 | &--primary { 32 | grid-column-start: 1; 33 | grid-column-end: 3; 34 | } 35 | } 36 | } -------------------------------------------------------------------------------- /sass/styles/objects/notification.scss: -------------------------------------------------------------------------------- 1 | .notification { 2 | position: relative; 3 | 4 | &::after { 5 | content: ''; 6 | 7 | @include position(absolute, -4px, -4px); 8 | @include dimensions(8px, 8px); 9 | 10 | border-radius: 50%; 11 | background-color: $salmon; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /sass/styles/objects/progress.scss: -------------------------------------------------------------------------------- 1 | @mixin progress($height: 10px, $value-color: $faded-cont, $background: $nav-border) { 2 | progress { 3 | height: $height; 4 | background-color: $background; 5 | } 6 | 7 | progress::-moz-progress-bar { 8 | background-color: $value-color; 9 | background-image: $value-color; 10 | } 11 | 12 | progress::-webkit-progress-bar { 13 | height: $height; 14 | background-color: $background; 15 | } 16 | 17 | progress::-webkit-progress-value { 18 | background-color: $value-color; 19 | background-image: $value-color; 20 | } 21 | 22 | progress:-ms-fill { 23 | height: $height; 24 | background-color: $value-color; 25 | background-image: $value-color; 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /sass/styles/objects/radial-progress.scss: -------------------------------------------------------------------------------- 1 | .radial-progress { 2 | width: 100%; 3 | height: 100%; 4 | 5 | .track, 6 | .fill { 7 | fill: rgba(0, 0, 0, 0); 8 | stroke-width: 10; 9 | transform: rotate(90deg) translate(0px, -80px); 10 | } 11 | 12 | .track { 13 | stroke: rgba(255, 255, 255, 0.2); 14 | } 15 | 16 | .fill { 17 | stroke: rgb(255, 255, 255); 18 | stroke-dasharray: 219.99078369140625; 19 | stroke-dashoffset: -219.99078369140625; 20 | transition: stroke-dashoffset 1s; 21 | } 22 | 23 | &.orange .fill { 24 | stroke: $orange; 25 | } 26 | 27 | &.yellow .fill { 28 | stroke: $yellow; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sass/styles/objects/round-image.scss: -------------------------------------------------------------------------------- 1 | %round-img { 2 | @include border-radius(50%); 3 | 4 | overflow: hidden; 5 | } 6 | 7 | //round-img with border 8 | .round-img-b { 9 | @extend %round-img; 10 | 11 | @include border(solid, 4px, white); 12 | } 13 | 14 | .round { 15 | @extend %round-img; 16 | } 17 | 18 | @media screen and (max-width: 575px) { 19 | .round-img-b { 20 | @include border(solid, 2px, $white); 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /sass/styles/objects/scrollables.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/coding-blocks/motley/8eccfee4cc1297bc73d36e8bf6fb5c54e473b2dc/sass/styles/objects/scrollables.scss -------------------------------------------------------------------------------- /sass/styles/objects/searchbox.scss: -------------------------------------------------------------------------------- 1 | .search-box { 2 | width: 100%; 3 | max-height: 400px; 4 | overflow-y: scroll; 5 | position: absolute; 6 | z-index: 300; 7 | top: 55px; 8 | background-color: white; 9 | box-shadow: 0 20px 57px 0 rgba(51, 51, 51, 0.1); 10 | } 11 | 12 | .search-content { 13 | height: 100%; 14 | padding: 30px; 15 | 16 | &:not(:first-of-type) { 17 | border-top: 1px solid $nav-border; 18 | } 19 | } 20 | 21 | .img-container > img { 22 | margin-left: 0; 23 | } 24 | 25 | .heading-container { 26 | padding-left: 0; 27 | } 28 | 29 | .heading-container > p:nth-child(2) { 30 | margin-top: 5px; 31 | color: #ed7492; 32 | } 33 | 34 | .heading-container > p:nth-child(1) { 35 | margin-bottom: 1px; 36 | } 37 | -------------------------------------------------------------------------------- /sass/styles/objects/star.scss: -------------------------------------------------------------------------------- 1 | .pos-rating { 2 | font-size: $font-sm; 3 | color: $rating-star; 4 | } 5 | 6 | .neg-rating { 7 | font-size: $font-sm; 8 | color: $default-border; 9 | } 10 | -------------------------------------------------------------------------------- /sass/styles/objects/status-circle.scss: -------------------------------------------------------------------------------- 1 | .status-circle { 2 | position: relative; 3 | padding-bottom: 100%; 4 | box-sizing: content-box; 5 | } 6 | 7 | .circle-back { 8 | @include border-radius(50%); 9 | } 10 | 11 | .circle-front { 12 | @include border-radius(50%); 13 | position: absolute; 14 | } 15 | 16 | .progress-text { 17 | color: $white; 18 | 19 | @include textalign(center); 20 | } 21 | -------------------------------------------------------------------------------- /sass/styles/objects/tables.scss: -------------------------------------------------------------------------------- 1 | .horizontal-scrolling-table { 2 | overflow-x: auto; 3 | } 4 | -------------------------------------------------------------------------------- /sass/styles/objects/tags.scss: -------------------------------------------------------------------------------- 1 | %tag { 2 | @include border-radius(50px); 3 | @include selector(none); 4 | 5 | padding: 5px 7px; 6 | font-size: $card-md; 7 | } 8 | 9 | .tag { 10 | @extend %tag; 11 | background-color: $nav-border; 12 | 13 | &.tag-red { 14 | color: white; 15 | background-image: $button-gradient; 16 | } 17 | 18 | &.tag-orange { 19 | color: white; 20 | background-image: $gradient-orange; 21 | } 22 | } 23 | 24 | .tag-dashed { 25 | @extend %tag; 26 | 27 | color: $tag-dashed-text-color; 28 | border: solid 1px $tag-dashed-border-color; 29 | } -------------------------------------------------------------------------------- /sass/styles/objects/threads.scss: -------------------------------------------------------------------------------- 1 | .threads { 2 | &.invert { 3 | background-color: $threads-invert; 4 | color: $white; 5 | } 6 | 7 | .thread { 8 | padding: { 9 | bottom: 20px; 10 | left: 5%; 11 | } 12 | border-left: 1px solid $threads-separator; 13 | 14 | &:not(:last-child)::after { 15 | content: ""; 16 | height: 1px; 17 | background-color: $threads-separator; 18 | margin-top: 10px; 19 | display: block; 20 | opacity: 0.6; 21 | } 22 | 23 | &:first-child { 24 | padding-top: 20px; 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /sass/styles/objects/tick.scss: -------------------------------------------------------------------------------- 1 | .tick { 2 | position: relative; 3 | 4 | &::after { 5 | content: ''; 6 | 7 | @include dimensions(60%, 25%); 8 | 9 | position: absolute; 10 | left: 20%; 11 | top: 30%; 12 | z-index: 100; 13 | border-left: solid 2px white; 14 | border-bottom: solid 2px white; 15 | transform: rotate(-45deg); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /sass/styles/objects/timer.scss: -------------------------------------------------------------------------------- 1 | .timer { 2 | margin: 0; 3 | 4 | .timer-item { 5 | padding: 0 1rem 0 0; 6 | float: left; 7 | display: inline-block; 8 | 9 | .list-heading { 10 | font-size: $font-md; 11 | text-align: center; 12 | } 13 | 14 | .list-data { 15 | font-size: $card-md; 16 | text-align: center; 17 | } 18 | } 19 | 20 | &--dots { 21 | .timer-item { 22 | padding: 0 1.5rem 0 0; 23 | position: relative; 24 | 25 | &:not(:last-child)::after { 26 | content: ":"; 27 | font-size: $font-md; 28 | font-weight: $extra-bold; 29 | color: $white; 30 | position: absolute; 31 | right: 0.7rem; 32 | top: 0; 33 | } 34 | } 35 | 36 | .list-heading { 37 | font-weight: $extra-bold; 38 | } 39 | 40 | .list-data { 41 | font-size: $card-sm; 42 | } 43 | } 44 | } 45 | 46 | ul.divided-list.timer > *:not(:last-child) { 47 | border-right: unset; 48 | } 49 | -------------------------------------------------------------------------------- /sass/styles/objects/video-player.scss: -------------------------------------------------------------------------------- 1 | .video-player { 2 | @include dimensions(100%, 100%); 3 | 4 | background: $black; 5 | position: relative; 6 | 7 | video { 8 | @include dimensions(100%, 100%); 9 | 10 | border: none; 11 | } 12 | 13 | iframe { 14 | @include dimensions(100%, 100%); 15 | 16 | border: none; 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /sass/styles/settings/settings.global.scss: -------------------------------------------------------------------------------- 1 | $global-line-height: 24px !default; 2 | $global-border-radius: 50% !default; 3 | 4 | //button 5 | $global-button-border-radius: 42.5px !default; 6 | $global-transition: all 300ms ease-in-out !default; 7 | 8 | $dashed-button-width: 173px; 9 | $dashed-button-height: 40px; 10 | $dashed-border-radius: 22px; 11 | $dashed-button-color: $button-element-level; 12 | $dashed-button-background: $transparent; 13 | $dashed-button-weight: 800; 14 | 15 | $solid-button-background: $color-button-primary; 16 | $solid-button-color: $white; 17 | $solid-button-width: 110px; 18 | $solid-button-height: 40px; 19 | $solid-button-border-radius: 42.5px; 20 | $solid-button-weight: 800; 21 | 22 | $circle-button-background: $nav-border; 23 | $circle-button-color: $white; 24 | $circle-button-width: 70px; 25 | $circle-button-height: 70px; 26 | $circle-button-border-radius: 50%; 27 | 28 | //Font 29 | $global-font-family: 'Mulish', sans-serif; 30 | $global-font-style: normal !default; 31 | $global-font-weight: normal !default; 32 | $global-font-size: 14px; 33 | 34 | $global-container-width: 551px; 35 | $global-container-height: 106px; 36 | -------------------------------------------------------------------------------- /sass/styles/settings/settings.objects.scss: -------------------------------------------------------------------------------- 1 | /** 2 | ~~~~~~~~~~~~~~~~~~~~~~~~~~~ 3 | Objects Config File 4 | ~~~~~~~~~~~~~~~~~~~~~~~~~~~ 5 | 6 | File contains the object specific and varying configuration for the following listed objects - 7 | - Border Card 8 | - Img Ring 9 | **/ 10 | 11 | 12 | // Border Card 13 | $border-card-radius : 15px; 14 | 15 | //Img Ring 16 | $img-ring-border: solid 2px $orange; -------------------------------------------------------------------------------- /sass/styles/themes/cricket-cup.scss: -------------------------------------------------------------------------------- 1 | //Theme for CricketCup 2 | 3 | .main-nav, 4 | .sidebar { 5 | %red-blue-gradient { 6 | background-image: linear-gradient(to right, #e9414d, #2d2982); 7 | } 8 | 9 | .button-dashed { 10 | @extend %red-blue-gradient; 11 | 12 | -webkit-text-fill-color: transparent; 13 | background-clip: text; 14 | -webkit-background-clip: text; 15 | border: 2px solid $cricket-cup; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /sass/styles/tools/list.scss: -------------------------------------------------------------------------------- 1 | @mixin li-left-right-padding($direction, $padding) { 2 | @if $direction == left { 3 | .li-left { 4 | & > *:not(:last-child) { 5 | padding-right: $padding; 6 | } 7 | } 8 | } 9 | 10 | @if $direction == right { 11 | .li-right { 12 | & > *:not(:first-child) { 13 | padding-left: $padding; 14 | } 15 | } 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /sass/styles/tools/position.scss: -------------------------------------------------------------------------------- 1 | @mixin position($type, $top:false, $right:false, $bottom:false, $left:false) { 2 | position: $type; 3 | 4 | @if $top { top: $top; } 5 | 6 | @if $left { left: $left; } 7 | 8 | @if $bottom { bottom: $bottom; } 9 | 10 | @if $right { right: $right; } 11 | } 12 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.border-radius.scss: -------------------------------------------------------------------------------- 1 | 2 | @mixin border-radius($radius: $global-border-radius, $moz: true, $webkit: true, $ms:true) { 3 | @if $moz { -moz-border-radius: $radius; } 4 | 5 | @if $webkit { -webkit-border-radius: $radius; } 6 | 7 | @if $ms { -ms-border-radius: $radius; } 8 | 9 | border-radius: $radius; 10 | } 11 | 12 | .border-radius-none { 13 | border-radius: unset !important; 14 | } 15 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.border.scss: -------------------------------------------------------------------------------- 1 | @mixin border($type, $width, $color) { 2 | border: $type $width $color; 3 | } 4 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.dimensions.scss: -------------------------------------------------------------------------------- 1 | 2 | @mixin dimensions($width: $global-container-width, $height: $global-container-height) { 3 | width: $width; 4 | height: $height; 5 | } 6 | 7 | @mixin max-dimensions($max-width, $max-height) { 8 | max-width: $max-width; 9 | max-height: $max-height; 10 | } 11 | 12 | @mixin min-dimensions($min-width, $min-height) { 13 | min-width: $min-width; 14 | min-height: $min-height; 15 | } 16 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.display.scss: -------------------------------------------------------------------------------- 1 | @mixin display($dis) { 2 | display: $dis; 3 | } 4 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.flexbox.scss: -------------------------------------------------------------------------------- 1 | @mixin flexbox($direction, $justify-content: false, $align-items: false, $webkit: true, $ms:true) { 2 | @if ($webkit) { display: -webkit-box; } 3 | 4 | @if ($webkit) { display: -webkit-flex; } 5 | 6 | @if ($ms) { display: -ms-flexbox; } 7 | 8 | display: flex; 9 | 10 | @if ($webkit) { -webkit-flex-direction: $direction; } 11 | 12 | flex-direction: $direction; 13 | 14 | @if ($justify-content) { justify-content: $justify-content; } 15 | 16 | @if ($align-items) { align-items: $align-items; } 17 | } 18 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.float.scss: -------------------------------------------------------------------------------- 1 | @mixin float($float) { 2 | @if $float == right { 3 | float: right; 4 | } 5 | 6 | @else if $float == left { 7 | float: left; 8 | } 9 | 10 | @else { 11 | float: none; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.fonts.scss: -------------------------------------------------------------------------------- 1 | @mixin font($global-font, $global-size, $global-weight) { 2 | font-family: $global-font; 3 | font-size: $global-size; 4 | font-weight: $global-weight; 5 | } 6 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.margin.scss: -------------------------------------------------------------------------------- 1 | 2 | //Margin mixin (top, right, bottom, left) 3 | @mixin margin($top, $right, $bottom, $left) { 4 | margin: { 5 | top: $top; 6 | right: $right; 7 | bottom: $bottom; 8 | left: $left; 9 | } 10 | } 11 | 12 | //Margin Shorthand mixin (top-bottom, right-left) 13 | @mixin margin-s($top-bottom, $right-left) { 14 | margin: $top-bottom $right-left; 15 | } 16 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.multiply-px.scss: -------------------------------------------------------------------------------- 1 | @function multiply-px($value1, $value2) { 2 | @return ($value1) * ($value2); 3 | } 4 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.padding.scss: -------------------------------------------------------------------------------- 1 | //Padding mixin (top, right, bottom, left) 2 | @mixin padding-mixin($top, $right, $bottom, $left) { 3 | padding: { 4 | top: $top; 5 | right: $right; 6 | bottom: $bottom; 7 | left: $left; 8 | } 9 | } 10 | 11 | //Padding Shorthand mixin (top-bottom, right-left) 12 | @mixin padding-s($top-bottom, $right-left) { 13 | padding: $top-bottom $right-left; 14 | } 15 | 16 | @mixin padding-y($top-bottom) { 17 | padding: { 18 | top: $top-bottom; 19 | bottom: $top-bottom; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.textalign.scss: -------------------------------------------------------------------------------- 1 | @mixin textalign($textalign) { 2 | @if $textalign == right { 3 | text-align: right; 4 | } 5 | 6 | @else if $textalign == center { 7 | text-align: center; 8 | } 9 | 10 | @else { 11 | text-align: left; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /sass/styles/tools/tools.width.scss: -------------------------------------------------------------------------------- 1 | @mixin width-fit($moz: true, $webkit: true, $ms: true) { 2 | width: fit-content; 3 | 4 | @if ($moz) { width: -moz-fit-content; } 5 | 6 | @if ($webkit) { width: -webkit-fit-content; } 7 | 8 | @if ($ms) { width: -ms-fit-content; } 9 | } 10 | -------------------------------------------------------------------------------- /sass/styles/trumps/home.scss: -------------------------------------------------------------------------------- 1 | .play-store-button { 2 | background-color: #2c2d32; 3 | background-image: none; 4 | font-size: $font-sm; 5 | padding: 6px 24px; 6 | display: flex; 7 | align-items: center; 8 | 9 | .text { 10 | display: inline-block; 11 | padding-left: 5px; 12 | text-align: left; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /sass/styles/trumps/trump.scss: -------------------------------------------------------------------------------- 1 | .overflow-hidden { 2 | overflow: hidden !important; 3 | } 4 | -------------------------------------------------------------------------------- /sass/styles/utilities/aspect-ratio.scss: -------------------------------------------------------------------------------- 1 | @mixin aspect-ratio($width, $height) { 2 | .u-ar-#{$width}-to-#{$height} { 3 | position: relative; 4 | padding-bottom: 100% * ($height / $width); 5 | 6 | & > * { 7 | @include dimensions(100%, 100%); 8 | @include position(absolute, 0, false, false, 0); 9 | } 10 | } 11 | } 12 | 13 | @include aspect-ratio(1, 1); 14 | -------------------------------------------------------------------------------- /sass/styles/utilities/background.scss: -------------------------------------------------------------------------------- 1 | @each $name, $type in (fingerprint, svg), (user, svg), (mail, svg), (lines, svg) { 2 | .#{$name}-bg { 3 | background-image: url("https://minio.codingblocks.com/motley/#{$name}.#{$type}"); 4 | } 5 | } 6 | 7 | .bg-none { 8 | background: transparent !important; 9 | } 10 | 11 | .bg-inherit { 12 | background: inherit; 13 | } 14 | 15 | .hover-grey { 16 | &:hover { 17 | background: $hover-grey; 18 | } 19 | } 20 | 21 | .hover-indicator { 22 | &:hover { 23 | background: $hover-grey; 24 | position: relative; 25 | 26 | &::after { 27 | content: ""; 28 | position: absolute; 29 | height: 60%; 30 | width: 1.25%; 31 | top: 20%; 32 | left: 0; 33 | background: $gradient-orange; 34 | } 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /sass/styles/utilities/color.scss: -------------------------------------------------------------------------------- 1 | // COLORS 2 | 3 | @each $abbrev, $color in $text-color-list { 4 | .#{$abbrev} { 5 | color: $color !important; 6 | } 7 | } 8 | 9 | @each $abbrev, $color in $gradient-text-color-list { 10 | .gradient-text-#{$abbrev} { 11 | -webkit-text-fill-color: transparent; 12 | -webkit-background-clip: text; 13 | background-clip: text; 14 | background-image: $color; 15 | } 16 | } 17 | 18 | //BACKGROUND COLORS 19 | 20 | @each $abbrev, $color in $bg-color-list { 21 | .bg-#{$abbrev} { 22 | background-color: $color !important; 23 | } 24 | } 25 | 26 | .invert { 27 | background-color: $invert; 28 | color: $white; 29 | } 30 | 31 | // GRADIENTS 32 | 33 | $gradient-list: (black, "lr", linear-gradient(30deg, #333, #000)), 34 | (black, "bt", linear-gradient(30deg, #333, #000)); 35 | 36 | // @each $type, $direction, $value in $gradient-list { 37 | // .gradient-#{$type}-#{$direction}{ 38 | // background-image: linear-gradient(30deg, #333333, #000000) !important; 39 | // } 40 | // } 41 | 42 | // Gradient Backgrounds 43 | @each $label, $gradient in $gradient-map { 44 | .bg-gradient-#{$label} { 45 | background: $gradient; 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /sass/styles/utilities/display.scss: -------------------------------------------------------------------------------- 1 | @each $dis in (block), (inline), (inline-block), (flex), (none) { 2 | .display-#{$dis} { 3 | @include display($dis !important); 4 | } 5 | } 6 | 7 | // display-none for screen sizes 8 | 9 | @each $size, $label in (575px, xs), (767px, sm), (991px, md) { 10 | @media screen and(max-width: $size) { 11 | .dsp-none-#{$label} { 12 | display: none !important; 13 | } 14 | } 15 | } 16 | 17 | .screen-height { 18 | height: 100vh; 19 | } 20 | 21 | .screen-width { 22 | width: 100vh; 23 | } 24 | 25 | .no-scrollbar { 26 | scrollbar-width: none; 27 | 28 | &::-webkit-scrollbar { 29 | display: none; 30 | } 31 | } 32 | 33 | .d-phone-none { 34 | @media screen and (max-width: 767px) { 35 | display: none; 36 | } 37 | } 38 | 39 | .d-tab-none { 40 | @media screen and (max-width: 991px) { 41 | display: none; 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /sass/styles/utilities/flexbox.scss: -------------------------------------------------------------------------------- 1 | .flex-row { 2 | @include flexbox(row); 3 | 4 | justify-content: flex-start; 5 | align-items: center; 6 | } 7 | 8 | .flex-col { 9 | @include flexbox(column); 10 | 11 | justify-content: flex-start; 12 | align-items: center; 13 | } 14 | 15 | .all-center { 16 | display: flex; 17 | justify-content: center; 18 | align-items: center; 19 | } 20 | 21 | .flex-1 { 22 | flex: 1; 23 | } 24 | -------------------------------------------------------------------------------- /sass/styles/utilities/floating.scss: -------------------------------------------------------------------------------- 1 | .float-left { 2 | float: left; 3 | } 4 | 5 | .float-right { 6 | float: right; 7 | } 8 | 9 | .float-clear { 10 | clear: both; 11 | } -------------------------------------------------------------------------------- /sass/styles/utilities/font.scss: -------------------------------------------------------------------------------- 1 | // Font Size 2 | @each $type, $size in $text-size-list { 3 | .#{$type} { 4 | font-size: $size !important; 5 | } 6 | } 7 | 8 | // Font Weight 9 | @each $type, $weight in $text-weight-list { 10 | .#{$type} { 11 | font-weight: $weight !important; 12 | } 13 | } 14 | 15 | // Font Style 16 | .i { 17 | font-style: italic !important; 18 | } 19 | 20 | .stroke-font { 21 | -webkit-text-stroke: 1px $white; 22 | color: rgba($color: #ffffff, $alpha: 0); 23 | 24 | &--white { 25 | -webkit-text-stroke: 1px $white; 26 | } 27 | } 28 | 29 | .text-clamp-ellipses { 30 | display: -webkit-box; 31 | -webkit-box-orient: vertical; 32 | overflow: hidden; 33 | 34 | &--2 { 35 | -webkit-line-clamp: 2; 36 | } 37 | 38 | &--3 { 39 | -webkit-line-clamp: 3; 40 | } 41 | } 42 | 43 | .underline-highlight { 44 | position: relative; 45 | z-index: 2; 46 | 47 | &::after { 48 | content: ""; 49 | width: 100%; 50 | height: 10px; 51 | background-color: $orange; 52 | z-index: -1; 53 | position: absolute; 54 | bottom: 0; 55 | left: 0; 56 | } 57 | 58 | &--gradient-orange { 59 | &::after { 60 | background: $gradient-orange; 61 | } 62 | } 63 | } 64 | -------------------------------------------------------------------------------- /sass/styles/utilities/grid/grid.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Grid Options 3 | // 4 | // To avoid your options getting overridden by an update, 5 | // copy and paste the below options to your own sass file 6 | // and include it before this file. 7 | 8 | // Grid breakpoints 9 | // 10 | // Define the minimum dimensions at which your layout will change, 11 | // adapting to different screen sizes, for use in media queries. 12 | 13 | $grid-breakpoints: ( 14 | xs: 0, 15 | sm: 576px, 16 | md: 768px, 17 | lg: 992px, 18 | xl: 1200px 19 | ) !default; 20 | 21 | // Grid containers 22 | // 23 | // Define the maximum width of `.container` for different screen sizes. 24 | 25 | $container-max-widths: ( 26 | sm: 540px, 27 | md: 720px, 28 | lg: 960px, 29 | xl: 1140px 30 | ) !default; 31 | 32 | // Grid columns 33 | // 34 | // Set the number of columns and specify the width of the gutters. 35 | 36 | $grid-columns: 12 !default; 37 | $grid-gutter-width: 30px !default; 38 | 39 | // END of Grid Options 40 | 41 | // Bootstrap file imports 42 | @import "breakpoints/mixins/breakpoints"; 43 | @import "grid/bootstrap-grid"; 44 | @import "sizing/utilities/sizing"; 45 | @import "layout/utilities/spacing"; 46 | @import "layout/mixins/visibility"; 47 | @import "layout/utilities/visibility"; 48 | -------------------------------------------------------------------------------- /sass/styles/utilities/grid/grid/bootstrap-grid.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap Grid v4.0.0 (https://getbootstrap.com) 3 | * Copyright 2011-2018 The Bootstrap Authors 4 | * Copyright 2011-2018 Twitter, Inc. 5 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 6 | */ 7 | 8 | @at-root { 9 | @-ms-viewport { width: device-width; } // stylelint-disable-line at-rule-no-vendor-prefix 10 | } 11 | 12 | html { 13 | box-sizing: border-box; 14 | -ms-overflow-style: scrollbar; 15 | } 16 | 17 | *, 18 | *::before, 19 | *::after { 20 | box-sizing: inherit; 21 | } 22 | 23 | @import "functions"; 24 | @import "variables"; 25 | @import "mixins/breakpoints"; 26 | @import "mixins/grid-framework"; 27 | @import "mixins/grid"; 28 | @import "grid"; 29 | @import "utilities/display"; 30 | @import "utilities/flex"; 31 | -------------------------------------------------------------------------------- /sass/styles/utilities/grid/layout/mixins/_visibility.scss: -------------------------------------------------------------------------------- 1 | // stylelint-disable declaration-no-important 2 | 3 | // Visibility 4 | 5 | @mixin invisible($visibility) { 6 | visibility: $visibility !important; 7 | } 8 | -------------------------------------------------------------------------------- /sass/styles/utilities/grid/layout/utilities/_visibility.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Visibility utilities 3 | // 4 | 5 | .visible { 6 | @include invisible(visible); 7 | } 8 | 9 | .invisible { 10 | @include invisible(hidden); 11 | } 12 | -------------------------------------------------------------------------------- /sass/styles/utilities/grid/sizing/utilities/_sizing.scss: -------------------------------------------------------------------------------- 1 | // stylelint-disable declaration-no-important 2 | 3 | // Width and height 4 | 5 | @each $prop, $abbrev in (width: w, height: h) { 6 | @each $size, $length in $sizes { 7 | .#{$abbrev}-#{$size} { #{$prop}: $length !important; } 8 | } 9 | } 10 | 11 | .mw-100 { max-width: 100% !important; } 12 | .mh-100 { max-height: 100% !important; } 13 | -------------------------------------------------------------------------------- /sass/styles/utilities/overflow.scss: -------------------------------------------------------------------------------- 1 | $overflow: (auto) (hidden) (scroll) (visible); 2 | 3 | @each $label in $overflow { 4 | .overflow-#{$label} { 5 | overflow: $label !important; 6 | } 7 | } 8 | 9 | @each $label in $overflow { 10 | .overflow-x-#{$label} { 11 | overflow-x: $label !important; 12 | } 13 | } 14 | 15 | @each $label in $overflow { 16 | .overflow-y-#{$label} { 17 | overflow-y: $label !important; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /sass/styles/utilities/position.scss: -------------------------------------------------------------------------------- 1 | @each $type in ("static") ("relative") ("absolute") ("sticky") ("fixed") { 2 | .position-#{$type} { 3 | position: #{$type}; 4 | } 5 | } 6 | 7 | .tl, 8 | .tr { 9 | top: 0; 10 | } 11 | 12 | .tl { 13 | left: 0; 14 | } 15 | 16 | .tr { 17 | right: 0; 18 | } 19 | 20 | .bl, 21 | .br { 22 | bottom: 0; 23 | } 24 | 25 | .bl { 26 | left: 0; 27 | } 28 | 29 | .br { 30 | right: 0; 31 | } 32 | 33 | .z-neg { 34 | z-index: -1; 35 | } 36 | 37 | .z-pos { 38 | z-index: 1; 39 | } 40 | 41 | .mt-neg-70 { 42 | margin-top: -70px; 43 | } 44 | -------------------------------------------------------------------------------- /sass/styles/utilities/scrollbar.scss: -------------------------------------------------------------------------------- 1 | ::-webkit-scrollbar { 2 | background-color: $white; 3 | width: 12px; 4 | } 5 | 6 | ::-webkit-scrollbar-track { 7 | background-color: $white; 8 | 9 | &:hover { 10 | background-color: $scrollbar-color; 11 | } 12 | } 13 | 14 | ::-webkit-scrollbar-thumb { 15 | background-color: $dark-grey-list; 16 | border-radius: 12px; 17 | border: 3px solid $white; 18 | 19 | &:hover { 20 | border: 2px solid $scrollbar-color; 21 | } 22 | } 23 | 24 | .gradient-orange-scroll { 25 | &::-webkit-scrollbar-thumb { 26 | &:hover { 27 | background: $gradient-orange; 28 | } 29 | } 30 | } 31 | 32 | .transparent-scroll { 33 | overflow: overlay; 34 | 35 | &::-webkit-scrollbar { 36 | background: transparent; 37 | } 38 | 39 | &::-webkit-scrollbar-track { 40 | background-color: transparent; 41 | 42 | &:hover { 43 | background-color: unset; 44 | } 45 | } 46 | 47 | &::-webkit-scrollbar-thumb { 48 | background-color: rgba($color: #fff, $alpha: 0.5); 49 | border-radius: 12px; 50 | border: unset; 51 | 52 | &:hover { 53 | border: unset; 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /sass/styles/utilities/selector.scss: -------------------------------------------------------------------------------- 1 | @mixin selector ($value) { 2 | -webkit-user-select: $value; 3 | -moz-user-select: $value; 4 | -ms-user-select: $value; 5 | user-select: $value; 6 | } 7 | 8 | .a-selectable { 9 | @include selector(none); 10 | } 11 | -------------------------------------------------------------------------------- /sass/styles/utilities/transition.scss: -------------------------------------------------------------------------------- 1 | .hiding-section { 2 | // transition: height 0.25s ease-in-out; 3 | margin-bottom: 1.5rem; 4 | 5 | &--hidden { 6 | // height: 0; 7 | // opacity: 0; 8 | margin-bottom: 0; 9 | display: none; 10 | } 11 | } -------------------------------------------------------------------------------- /sass/styles/utilities/width-limiter.scss: -------------------------------------------------------------------------------- 1 | .width-limiter { 2 | max-width: 1500px; 3 | margin: 0 auto; 4 | } 5 | -------------------------------------------------------------------------------- /sass/styles/utilities/width-x-height.scss: -------------------------------------------------------------------------------- 1 | @for $i from 1 through 15 { 2 | $width: ($i * 10px); 3 | $height: ($i * 10px); 4 | 5 | .s-#{$i * 10}x#{$i * 10} { 6 | @include dimensions($width, $height); 7 | } 8 | } 9 | 10 | .wh-100 { 11 | @include dimensions(100%, 100%); 12 | } 13 | 14 | .h-inherit { 15 | height: inherit; 16 | } 17 | --------------------------------------------------------------------------------