Skip to content

I have create changes in background color. #7

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
jatin-jangir wants to merge 5 commits into
base: master
Choose a base branch
from
Open

I have create changes in background color. #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
3955114
Update style.css
jatin-jangir May 27, 2021
18c30f1
Update index.html
jatin-jangir May 27, 2021
b7d40a5
Update script.js
jatin-jangir May 27, 2021
4647815
Update index.html
jatin-jangir May 29, 2021
806b2e7
Merge pull request #1 from jatin-jangir/jatin-jangir-patch-1-1
jatin-jangir May 29, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 8 additions & 2 deletions notes-app/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Notes App</title>
<title>Notes App clone</title>
<link rel="stylesheet" href="style.css" />
<link
rel="stylesheet"
Expand All @@ -12,7 +12,13 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/1.1.1/marked.min.js"></script>
<script src="script.js" defer></script>
</head>
<body>
<body id="bd" style="background-color: #a8dfee;">
<button class="col" id="col" onclick="dark()" ondblclick="light()">
dark theme
</button>
<button class="col2" id="col2" onclick="light()">
light theme
</button>
<button class="add" id="add">
<i class="fas fa-plus"></i> Add note
</button>
Expand Down
12 changes: 9 additions & 3 deletions notes-app/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
const addBtn = document.getElementById("add");

const notes = JSON.parse(localStorage.getItem("notes"));

if (notes) {
Expand All @@ -11,13 +10,20 @@ if (notes) {
addBtn.addEventListener("click", () => {
addNewNote();
});

function dark() {
window.alert("we are changing to dark theme");
document.getElementById("bd").style.backgroundColor="#2a4952";
}
function light() {
window.alert("we are changing to light theme");
document.getElementById("bd").style.backgroundColor="#a8dfee";
}
function addNewNote(text = "") {
const note = document.createElement("div");
note.classList.add("note");

note.innerHTML = `
<div class="notes">
<div class="notes" id ="notes">
<div class="tools">
<button class="edit"><i class="fas fa-edit"></i></button>
<button class="delete"><i class="fas fa-trash-alt"></i></button>
Expand Down
44 changes: 33 additions & 11 deletions notes-app/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,16 +5,37 @@
}

body {
background-color: #7bdaf3;

display: flex;
flex-wrap: wrap;
font-family: "Poppins", sans-serif;
margin: 0;
padding-top: 3rem;
}

.col2 {
background-color: #eef5e0;
border-radius: 3px;
border: none;
color: rgb(78, 71, 71);
cursor: pointer;
padding: 0.5rem 1rem;
position: fixed;
top: 6rem;
right: 1rem;
}
.col {
background-color: #4a4b48;
border-radius: 3px;
border: none;
color: white;
cursor: pointer;
padding: 0.5rem 1rem;
position: fixed;
top: 3.5rem;
right: 1rem;
}
.add {
background-color: #9ec862;
background-color: #6f7961;
border-radius: 3px;
border: none;
color: white;
Expand All @@ -26,15 +47,15 @@ body {
}

.note {
background-color: #fff;
box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.1);
background-color: rgb(233, 232, 232);
box-shadow: 0 0 10px 4px rgba(37, 37, 37, 0.1);
margin: 20px;
height: 400px;
width: 400px;
height: 200px;
width: 300px;
}

.note .tools {
background-color: #9ec862;
background-color: #609fda;
display: flex;
justify-content: flex-end;
padding: 0.5rem;
Expand All @@ -50,9 +71,9 @@ body {
}

.note .main {
background-color: #eee;
background-color: rgb(238, 238, 238);
overflow: hidden;
height: 400px;
height: 200px;
width: 100%;
}

Expand All @@ -61,10 +82,11 @@ body {
font-family: inherit;
font-size: 1.2rem;
border: none;
height: 400px;
height: 200px;
width: 100%;
}

.note .hidden {
display: none;
}

7 changes: 4 additions & 3 deletions todo-app/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,16 +7,17 @@
<link rel="stylesheet" href="style.css" />
<script src="script.js" defer></script>
</head>
<body>
<h1>todos</h1>
<form id="form">
<body id= "bd" style="background-color: #f5f5f5;">
<h1 id ="head" style="color: rgb(179, 131, 226);">todos..</h1>
<form id="form" >
<input
type="text"
id="input"
class="input"
placeholder="Enter your todo"
autocomplete="off"
/>
<button id='dark' class="dark" onclick="darkT()"> dark theme </button>
<ul class="todos" id="todos"></ul>
</form>
<small
Expand Down