fix: ui and removed mockup
This commit is contained in:
pateljannat
@@ -18,7 +18,8 @@
|
||||
"fieldname": "title",
|
||||
"fieldtype": "Data",
|
||||
"in_list_view": 1,
|
||||
"label": "Title"
|
||||
"label": "Title",
|
||||
"reqd": 1
|
||||
},
|
||||
{
|
||||
"fieldname": "description",
|
||||
@@ -30,7 +31,8 @@
|
||||
"fieldtype": "Link",
|
||||
"in_list_view": 1,
|
||||
"label": "Course",
|
||||
"options": "LMS Course"
|
||||
"options": "LMS Course",
|
||||
"reqd": 1
|
||||
},
|
||||
{
|
||||
"fieldname": "lessons",
|
||||
@@ -55,7 +57,7 @@
|
||||
"link_fieldname": "chapter"
|
||||
}
|
||||
],
|
||||
"modified": "2021-08-19 13:43:51.025072",
|
||||
"modified": "2021-08-31 10:43:45.866864",
|
||||
"modified_by": "Administrator",
|
||||
"module": "LMS",
|
||||
"name": "Chapter",
|
||||
|
||||
@@ -22,18 +22,21 @@
|
||||
"fieldtype": "Link",
|
||||
"in_list_view": 1,
|
||||
"label": "Chapter",
|
||||
"options": "Chapter"
|
||||
"options": "Chapter",
|
||||
"reqd": 1
|
||||
},
|
||||
{
|
||||
"fieldname": "title",
|
||||
"fieldtype": "Data",
|
||||
"in_list_view": 1,
|
||||
"label": "Title"
|
||||
"label": "Title",
|
||||
"reqd": 1
|
||||
},
|
||||
{
|
||||
"fieldname": "body",
|
||||
"fieldtype": "Markdown Editor",
|
||||
"label": "Body"
|
||||
"label": "Body",
|
||||
"reqd": 1
|
||||
},
|
||||
{
|
||||
"fieldname": "index_label",
|
||||
@@ -67,7 +70,7 @@
|
||||
],
|
||||
"index_web_pages_for_search": 1,
|
||||
"links": [],
|
||||
"modified": "2021-07-27 16:28:29.203624",
|
||||
"modified": "2021-08-31 10:44:14.168257",
|
||||
"modified_by": "Administrator",
|
||||
"module": "LMS",
|
||||
"name": "Lesson",
|
||||
|
||||
@@ -13,13 +13,14 @@
|
||||
"fieldtype": "Link",
|
||||
"in_list_view": 1,
|
||||
"label": "Lesson",
|
||||
"options": "Lesson"
|
||||
"options": "Lesson",
|
||||
"reqd": 1
|
||||
}
|
||||
],
|
||||
"index_web_pages_for_search": 1,
|
||||
"istable": 1,
|
||||
"links": [],
|
||||
"modified": "2021-07-27 16:53:52.732191",
|
||||
"modified": "2021-08-31 10:44:42.048232",
|
||||
"modified_by": "Administrator",
|
||||
"module": "LMS",
|
||||
"name": "Lessons",
|
||||
|
||||
@@ -70,7 +70,7 @@
|
||||
<a class="stretched-link" href="{{ course.get_learn_url(lesson_index) }}{{ query_parameter }}"></a>
|
||||
|
||||
{% else %}
|
||||
<div class="view-course-link">
|
||||
<div class="view-course-link is-default">
|
||||
View Course <img class="ml-3" src="/assets/community/icons/black-arrow.svg" />
|
||||
</div>
|
||||
<a class="stretched-link" href="/courses/{{ course.name }}"></a>
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
{% if not course.upcoming %}
|
||||
<div class="reviews-parent">
|
||||
{% set reviews = course.get_reviews() %}
|
||||
{% if reviews | length or course.is_eligible_to_review(membership) %}
|
||||
@@ -35,6 +36,10 @@
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="common-card-style thread-card">
|
||||
<span class="text-center"> No Reviews <img src="/assets/community/icons/slash.svg"></span>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
@@ -89,3 +94,4 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
@@ -49,6 +49,15 @@
|
||||
"onboard": 0,
|
||||
"type": "Link"
|
||||
},
|
||||
{
|
||||
"hidden": 0,
|
||||
"is_query_report": 0,
|
||||
"label": "LMS Course Interest",
|
||||
"link_to": "LMS Course Interest",
|
||||
"link_type": "DocType",
|
||||
"onboard": 0,
|
||||
"type": "Link"
|
||||
},
|
||||
{
|
||||
"hidden": 0,
|
||||
"is_query_report": 0,
|
||||
@@ -121,7 +130,7 @@
|
||||
"type": "Link"
|
||||
}
|
||||
],
|
||||
"modified": "2021-06-29 15:11:07.324651",
|
||||
"modified": "2021-08-31 10:33:39.838535",
|
||||
"modified_by": "Administrator",
|
||||
"module": "LMS",
|
||||
"name": "LMS",
|
||||
|
||||
@@ -32,107 +32,10 @@
|
||||
--text-3xl: 22px;
|
||||
}
|
||||
|
||||
body {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.chapter-plan {
|
||||
border-radius: 10px;
|
||||
margin: 20px 0px;
|
||||
padding: 20px;
|
||||
border: 1px solid #ddc;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.chapter-plan h3 {
|
||||
font-size: 1.1em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.batch {
|
||||
border-radius: 10px;
|
||||
margin: 10px 0px;
|
||||
background: white;
|
||||
box-shadow: 0px 5px 10px rgb(0 0 0 / 10%);
|
||||
border: 1px solid #ddc;
|
||||
}
|
||||
|
||||
.batch-details {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.batch .cta {
|
||||
margin-top: 10px;
|
||||
padding: 10px;
|
||||
min-height: 28px;
|
||||
text-align: right;
|
||||
border-top: 1px solid #ddc;
|
||||
}
|
||||
|
||||
.batch .right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
img.profile-photo {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.lesson-type {
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
section {
|
||||
padding: 5rem 0 5rem 0;
|
||||
}
|
||||
|
||||
.batch-header {
|
||||
background: #eee;
|
||||
border: 2px solid #ddd;
|
||||
}
|
||||
|
||||
.page-card {
|
||||
max-width: 360px;
|
||||
padding: 15px;
|
||||
margin: 70px auto;
|
||||
border: 1px solid #d1d8dd;
|
||||
border-radius: 8px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.page-card .page-card-head {
|
||||
padding: 10px 15px;
|
||||
margin: -15px;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #d1d8dd;
|
||||
}
|
||||
|
||||
.page-card .page-card-head .indicator {
|
||||
color: #36414C;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.page-card .page-card-head .indicator::before {
|
||||
margin: 0 6px 0.5px 0px;
|
||||
}
|
||||
|
||||
.page-card .btn {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
input[type=checkbox] {
|
||||
appearance: auto;
|
||||
}
|
||||
|
||||
.progress-image {
|
||||
margin-right: 3px;
|
||||
border-radius: 50px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.course-image {
|
||||
height: 168px;
|
||||
width: 100%;
|
||||
@@ -272,13 +175,11 @@ input[type=checkbox] {
|
||||
|
||||
.view-course-link {
|
||||
height: 32px;
|
||||
background: var(--button-background);
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
padding: 8px 0px 8px;
|
||||
text-align: center;
|
||||
line-height: 135%;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.cards-parent {
|
||||
@@ -578,8 +479,8 @@ input[type=checkbox] {
|
||||
}
|
||||
|
||||
.is-default {
|
||||
background: #98A1A9;
|
||||
color: #ffffff;
|
||||
background: #F4F5F6;
|
||||
color: #1F272E;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
|
||||
4
community/public/icons/slash.svg
Normal file
4
community/public/icons/slash.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 22C17.5228 22 22 17.5229 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5229 6.47715 22 12 22Z" stroke="#4C5A67" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5 4.93005L19.14 19.0701" stroke="#4C5A67" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 428 B |
@@ -22,8 +22,8 @@
|
||||
|
||||
{% macro CourseCardWide(course) %}
|
||||
<div class="common-card-style course-card-wide">
|
||||
<div class="course-image-wide {% if not course.image %} default-image {% endif %}"
|
||||
{% if course.image %}style="background-image: url({{ course.image }});"{% endif %}>
|
||||
<div class="course-image-wide {% if not course.image %} default-image {% endif %}" {% if course.image
|
||||
%}style="background-image: url({{ course.image }});" {% endif %}>
|
||||
<div class="course-tags">
|
||||
{% for tag in course.get_tags() %}
|
||||
<div class="course-card-pills">{{ tag }}</div>
|
||||
@@ -59,8 +59,8 @@
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if course.upcoming %}
|
||||
<button class="button wide-button is-default" id="notify-me" data-course="{{course.name | urlencode}}"
|
||||
{% if is_user_interested %} disabled="disabled" title="Your interest has already been noted." {% endif %} >
|
||||
<button class="button wide-button is-default" id="notify-me" data-course="{{course.name | urlencode}}" {% if
|
||||
is_user_interested %} disabled="disabled" title="Your interest has already been noted." {% endif %}>
|
||||
Notify me when available
|
||||
</button>
|
||||
{% endif %}
|
||||
@@ -70,10 +70,6 @@
|
||||
<img class="ml-2" src="/assets/community/images/play.png" />
|
||||
</div>
|
||||
{% endif %}
|
||||
{% set certificate = course.is_certified() %}
|
||||
{% if certificate %}
|
||||
<a class="button wide-button is-secondary dark-links" href="/courses/{{ course.name }}/{{ certificate }}">Get Certificate</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -101,6 +97,7 @@
|
||||
<!-- Course Outline and Creator -->
|
||||
|
||||
{% macro CourseOutlineAndCreator(course) %}
|
||||
{% set certificate = course.is_certified() %}
|
||||
<div class="course-outline-instructor-parent">
|
||||
<div class="course-home-outline">
|
||||
{{ widgets.CourseOutline(course=course, membership=membership) }}
|
||||
@@ -137,9 +134,13 @@
|
||||
{{ frappe.utils.rounded(progress) }}%
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progress-bar" role="progressbar" style="width: {{ progress }}%"
|
||||
aria-valuenow="{{ progress }}" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div class="progress-bar" role="progressbar" style="width: {{ progress }}%" aria-valuenow="{{ progress }}"
|
||||
aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
{% if certificate %}
|
||||
<a class="muted-text dark-links mt-5 text-center" href="/courses/{{ course.name }}/{{ certificate }}">Get
|
||||
Certificate</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
@@ -1,39 +0,0 @@
|
||||
# Mockups
|
||||
|
||||
HTML Mockups using [Mockdown][].
|
||||
|
||||
[Mockdown]: https://github.com/anandology/mockdown
|
||||
|
||||
## How to use
|
||||
|
||||
**Step 1:** Get into `mockups` directory
|
||||
|
||||
```
|
||||
$ cd mockups
|
||||
```
|
||||
|
||||
**Step 2:** Instal `mockdown`
|
||||
|
||||
```
|
||||
$ pip install mockdown
|
||||
```
|
||||
|
||||
**Step 3:** Start mockdown server
|
||||
|
||||
```
|
||||
$ mockdown
|
||||
...
|
||||
* Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
|
||||
...
|
||||
```
|
||||
|
||||
**Step 4:** See the mockups at <http://localhost:5000/>.
|
||||
|
||||
## How does it work?
|
||||
|
||||
Mockdown uses [Jinja][] templates for writing HTML.
|
||||
|
||||
[Jinja]: https://jinja.palletsprojects.com/
|
||||
|
||||
To make is easy to provide test data, Mockdown looks for YAML file with the same name as the template. For example, `home.html` template uses the data from `home.yml`.
|
||||
|
||||
@@ -1,43 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Required meta tags -->
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<!-- Bootstrap CSS -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
|
||||
<link href="/static/style.css" rel="stylesheet">
|
||||
|
||||
<title>{% block title %}FOSS United{% endblock %}</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-light navbar-expand-lg">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="/"><span>Home</span></a>
|
||||
<button aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation" class="navbar-toggler" data-target="#navbarSupportedContent" data-toggle="collapse" type="button">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="mr-auto navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="/sketches.html">
|
||||
Sketches
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="ml-auto navbar-nav">
|
||||
<!-- post login tools -->
|
||||
<li class="nav-item">
|
||||
<a class="nav-link btn-login-area" href="/login.html">Login</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
{% block content %}
|
||||
<h1>Lorem ipsum...</h1>
|
||||
{% endblock %}
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,114 +0,0 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<div class="course-header">
|
||||
<div class="course-type">course</div>
|
||||
<h1>{{title}}</h1>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-9 col-md-12">
|
||||
<div class="course-details">
|
||||
|
||||
<h2>Course Description</h2>
|
||||
|
||||
<div class="course-description">
|
||||
{{ description }}
|
||||
</div>
|
||||
|
||||
<div class="preview-video">
|
||||
<iframe
|
||||
width="560"
|
||||
height="315"
|
||||
src="{{youtube_embed_url}}"
|
||||
title="YouTube video player"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen></iframe>
|
||||
</div>
|
||||
|
||||
<h2>Upcoming Batches</h2>
|
||||
|
||||
<div class="row">
|
||||
{% for batch in batches %}
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<div class="batch">
|
||||
<div class="batch-details">
|
||||
<div>Session every {{batch.weekdays}}</div>
|
||||
<div>{{batch.timeslot}}</div>
|
||||
<div>Starting from {{batch.start_date}}</div>
|
||||
|
||||
<div class="course-type" style="color: #888; padding: 10px 0px;">mentors</div>
|
||||
|
||||
{% for m in batch.mentors %}
|
||||
<div>
|
||||
<img class="profile-photo" src="{{m.photo_url}}">
|
||||
<span class="instructor-title">{{m.name}}</span>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="cta">
|
||||
<div class="">
|
||||
<button type="button">Join this Batch</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
|
||||
<h2>Course Outline</h2>
|
||||
|
||||
{% for chapter in chapters %}
|
||||
<div class="chapter-plan">
|
||||
<h3><span class="chapter-number">{{loop.index}}</span> {{chapter.title}}</h3>
|
||||
<div class="chapter-description">
|
||||
{{chapter.description}}
|
||||
</div>
|
||||
|
||||
<div class="lessons">
|
||||
{% for lesson in chapter.lessons %}
|
||||
<div class="lesson">
|
||||
<span class="lesson-type"><i class="{{lesson.icon}}"></i></span>
|
||||
<span class="lesson-title">{{lesson.title}}</span>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-3 col-md-12">
|
||||
<div class="sidebar">
|
||||
<h3>Instructor</h3>
|
||||
<div class="instructor">
|
||||
<div class="instructor-title">{{instructor.name}}</div>
|
||||
<div class="instructor-subtitle">Created {{instructor.num_courses}} courses</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar">
|
||||
<h3>Mentors</h3>
|
||||
{% for m in mentors %}
|
||||
<div class="instructor">
|
||||
<div class="instructor-title">{{m.name}}</div>
|
||||
<div class="instructor-subtitle">Mentored {{m.num_courses}} batches</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<div class="notice">
|
||||
Interested to become a mentor?
|
||||
|
||||
<div><a href="#">Apply Now!</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
@@ -1,89 +0,0 @@
|
||||
title: The Joy of Programming
|
||||
description: |
|
||||
Learn the joy of programming by turning the computer into a canvas.
|
||||
youtube_embed_url: "https://www.youtube.com/embed/IFWAYnUeHR8?start=149"
|
||||
stats:
|
||||
chapters: 4
|
||||
lessons: 25
|
||||
videos: 6
|
||||
completed: 287
|
||||
|
||||
instructor:
|
||||
name: Anand Chitipothu
|
||||
num_courses: 4
|
||||
|
||||
mentors:
|
||||
- name: Anand Chitipothu
|
||||
num_courses: 4
|
||||
- name: Rushabh Mehta
|
||||
num_courses: 3
|
||||
- name: Jannat Patel
|
||||
num_courses: 3
|
||||
|
||||
batches:
|
||||
- id: jp01
|
||||
status: scheduled
|
||||
mentors:
|
||||
- name: Anand Chitipothu
|
||||
photo_url: https://pbs.twimg.com/profile_images/2599066714/igu5hx4wlg3mxucodinl.jpeg
|
||||
num_batches: 4
|
||||
start_date: May 3, 2021
|
||||
weekdays: Mon, Thu
|
||||
timeslot: 5:00-6:00 PM
|
||||
|
||||
- id: jp02
|
||||
status: scheduled
|
||||
mentors:
|
||||
- name: Anand Chitipothu
|
||||
photo_url: https://pbs.twimg.com/profile_images/2599066714/igu5hx4wlg3mxucodinl.jpeg
|
||||
num_batches: 4
|
||||
start_date: May 4, 2021
|
||||
weekdays: Tue, Fri
|
||||
timeslot: 5:00-6:00 PM
|
||||
|
||||
- id: jp03
|
||||
status: scheduled
|
||||
mentors:
|
||||
- name: Rusbhabh Mehta
|
||||
photo_url: https://pbs.twimg.com/profile_images/2599066714/igu5hx4wlg3mxucodinl.jpeg
|
||||
num_batches: 4
|
||||
start_date: May 15, 2021
|
||||
weekdays: Sat
|
||||
timeslot: 5:00-6:00 PM
|
||||
|
||||
|
||||
chapters:
|
||||
- title: Getting Started
|
||||
description: |
|
||||
Getting started with programming by turning the computer into a canvas.
|
||||
lessons:
|
||||
- index: 1
|
||||
type: video
|
||||
icon: bi bi-play-circle
|
||||
title: Introduction to Programming
|
||||
- index: 2
|
||||
type: practice
|
||||
icon: bi bi-code-square
|
||||
title: Drawing Shapes
|
||||
|
||||
- title: Repeating Things
|
||||
description: |
|
||||
Isn't it very boring to do the same thing again and again?
|
||||
Well, that is for humans. Computers love to do the same thing again and again.
|
||||
Learn how to tell the computer to repeat multiple times the same task, or
|
||||
with slight change every time.
|
||||
|
||||
lessons:
|
||||
- index: 1
|
||||
type: video
|
||||
icon: bi bi-play-circle
|
||||
title: Rinse and Repeat
|
||||
- index: 2
|
||||
type: practice
|
||||
title: many circles
|
||||
icon: bi bi-check2-circle
|
||||
- index: 3
|
||||
type: practice
|
||||
icon: bi bi-code-square
|
||||
title: print, print, print!
|
||||
|
||||
@@ -1,33 +0,0 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<div class="course-header">
|
||||
<h1>Sketches</h1>
|
||||
</div>
|
||||
|
||||
<div class="row sketches-gallery">
|
||||
{% for s in sketches %}
|
||||
<div class="col-md-3">
|
||||
<div class="sketch-card">
|
||||
<div class="sketch-image">
|
||||
<a href="#">
|
||||
<svg width="300" height="300" viewBox="0 0 300 300" fill="none" stroke="black" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="150" cy="150" r="150.0"></circle>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<div class="sketch-footer">
|
||||
<div class="sketch-title">
|
||||
<a href="#">{{s.title}}</a>
|
||||
</div>
|
||||
<div class="sketch-author">
|
||||
by {{s.author}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -1,38 +0,0 @@
|
||||
sketches:
|
||||
- id: 20
|
||||
title: Big Circle
|
||||
author: Anand Chitipothu
|
||||
- id: 19
|
||||
title: Small Circle
|
||||
author: Anand Chitipothu
|
||||
- id: 18
|
||||
title: Circles in Queue
|
||||
author: Chaitanya
|
||||
- id: 17
|
||||
title: Random Bottom Circles
|
||||
author: Anand Chitipothu
|
||||
- id: 16
|
||||
title: Pipes
|
||||
author: Vishal
|
||||
- id: 15
|
||||
title: New Sketch
|
||||
author: Malleshwari
|
||||
|
||||
- id: 20
|
||||
title: Big Circle
|
||||
author: Anand Chitipothu
|
||||
- id: 19
|
||||
title: Small Circle
|
||||
author: Anand Chitipothu
|
||||
- id: 18
|
||||
title: Circles in Queue
|
||||
author: Chaitanya
|
||||
- id: 17
|
||||
title: Random Bottom Circles
|
||||
author: Anand Chitipothu
|
||||
- id: 16
|
||||
title: Pipes
|
||||
author: Vishal
|
||||
- id: 15
|
||||
title: New Sketch
|
||||
author: Malleshwari
|
||||
@@ -1,221 +0,0 @@
|
||||
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css");
|
||||
|
||||
:root {
|
||||
--c1: #fefae0;
|
||||
--c2: #264653;
|
||||
--c3: #e9c46a;
|
||||
--c4: #2a9d8f;
|
||||
--c5: #f4a261;
|
||||
--c6: #e76f51;
|
||||
|
||||
--c7: #ccd5ae;
|
||||
|
||||
--bg: var(--c1);
|
||||
--header-bg: var(--c2);
|
||||
--header-color: var(--c3);
|
||||
--tag-color: var(--c7);
|
||||
--sidebar-bg: var(--c7);
|
||||
|
||||
--h-color: var(--c2);
|
||||
|
||||
--text-color: #333;
|
||||
--text-color-light: #ccc;
|
||||
|
||||
--cta-color: var(--c4);
|
||||
}
|
||||
|
||||
body {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
background: var(--bg);
|
||||
}
|
||||
|
||||
.navbar-light {
|
||||
border-bottom: 1px solid #E2E6E9;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-top: 20px;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.page-header .page-header{
|
||||
margin-top: 20px;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.course-header {
|
||||
margin-top: 20px;
|
||||
padding: 20px;
|
||||
background: var(--header-bg);
|
||||
color: var(--header-color);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.course-header h1 {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.course-type {
|
||||
text-transform: uppercase;
|
||||
font-size: 1.0em;
|
||||
color: var(--tag-color);
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
background: var(--sidebar-bg);
|
||||
margin: 20px 0px;
|
||||
border-radius: 10px;
|
||||
padding: 1px 20px 20px 20px;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.sidebar h3 {
|
||||
margin-top: 20px;
|
||||
color: var(--c2);
|
||||
}
|
||||
|
||||
.instructor {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.instructor-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.instructor-subtitle {
|
||||
font-size: 0.8em;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.sidebar .notice {
|
||||
padding: 10px;
|
||||
border-radius: 10px;
|
||||
border: 1px dashed var(--text-color);
|
||||
}
|
||||
|
||||
.sidebar .notice a {
|
||||
color: inherit;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.course-details {
|
||||
margin: 20px 0px;
|
||||
}
|
||||
|
||||
.course-details h2 {
|
||||
color: var(--h-color);
|
||||
font-size: 1.4em;
|
||||
font-weight: bold;
|
||||
margin: 20px 0px 10px 0px;
|
||||
}
|
||||
|
||||
.chapter-plan {
|
||||
border-radius: 10px;
|
||||
margin: 20px 0px;
|
||||
padding: 20px;
|
||||
border: 1px solid #ddc;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.chapter-plan h3 {
|
||||
font-size: 1.1em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.chapter-number {
|
||||
background: var(--text-color);
|
||||
color: white;
|
||||
border-radius: 50%;
|
||||
height: 24px;
|
||||
min-width: 24px;
|
||||
align-items: center;
|
||||
padding: 2px 8px 2px 8px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.chapter-description {
|
||||
margin: 20px 0px;
|
||||
}
|
||||
|
||||
.lessons {
|
||||
padding-left: 20px;
|
||||
}
|
||||
.lesson {
|
||||
margin: 5px 0px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.batch {
|
||||
border-radius: 10px;
|
||||
margin: 10px 0px;
|
||||
background: white;
|
||||
border: 1px solid #ddc;
|
||||
}
|
||||
|
||||
.batch-details {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.batch .cta {
|
||||
margin-top: 10px;
|
||||
padding: 10px;
|
||||
min-height: 28px;
|
||||
text-align: right;
|
||||
border-top: 1px solid #ddc;
|
||||
}
|
||||
|
||||
.batch .cta button {
|
||||
background: var(--cta-color);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.batch .right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
img.profile-photo {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.lesson-type {
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.preview-video {
|
||||
text-align: center;
|
||||
margin: 20px 0px;
|
||||
}
|
||||
|
||||
.preview-video iframe {
|
||||
max-width: 100%
|
||||
}
|
||||
|
||||
.sketches-gallery svg {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.sketch-card {
|
||||
background: white;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #ddd;
|
||||
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.sketch-card .sketch-image {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.sketch-footer {
|
||||
padding: 10px;
|
||||
background: #eee;
|
||||
}
|
||||
Reference in New Issue
Block a user