Product backlog module

Developer
Nika Zawila
Size
2,488 Kb
Views
18,216
  1. Product backlog module Previews
  2. Product backlog module HTML Codes
  3. Product backlog module CSS Codes

How do I make an product backlog module?

Mobile app interface for product backlog.Based on http://drbl.in/jSsf by Janko Jovanovic (http://jankoatwarpspeed.com). What is a product backlog module? How do you make a product backlog module? This script and codes were developed by Nika Zawila on 15 October 2022, Saturday.

Product backlog module Previews
IQ Test

Product backlog module - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Product backlog module</title> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="app"> <header class="app__header"> <h1 class="app__header-title">Product Backlog</h1> <a href="#" class="app__link-back"> <i class="fa fa-arrow-left"></i> </a> <a href="#" class="app__link-settings"> <i class="fa fa-gear"></i> </a> </header> <div class="app__body"> <div class="log"> <div class="log__header"> <a href="#" class="log__ticket">#1355</a> <span class="log__badge">5</span> <i class="fa fa-heart log__icon"></i> </div> <div class="log__body"> Default notification for a new user </div> </div> <div class="log"> <div class="log__header"> <a href="#" class="log__ticket">#4211</a> <span class="log__badge">8</span> </div> <div class="log__body"> Add a box for a freemium plan to pricing page </div> </div> <div class="log log--critical"> <div class="log__header"> <a href="#" class="log__ticket">#0149</a> <span class="log__badge">20</span> </div> <div class="log__body"> Test what works better: editing an item in-place or in overlay </div> </div> <div class="log log--urgent"> <div class="log__header"> <a href="#" class="log__ticket">#1728</a> <span class="log__badge">8</span> </div> <div class="log__body"> Restyle alternate rows in search result table </div> </div> <div class="log"> <div class="log__header"> <a href="#" class="log__ticket">#3392</a> <span class="log__badge">8</span> </div> <div class="log__body"> Add icons for impediments, warnings, information and errors </div> </div> </div>
</div>
</body>
</html>

Product backlog module - Script Codes CSS Codes

body { background: #222; font-family: 'Open Sans', sans-serif; font-size: 18px; font-weight: lighter; color: #C3D2D3;
}
/* --- APP --- */
.app { width: 330px; margin: 40px auto;
}
.app__header { background: #61C3B9; border-radius: 20px 20px 0 0; text-align: center; position: relative; padding: 12px 30px;
}
.app__header-title { display: inline-block; font-size: 20px; line-height: 1.25; color: #D5E6E8;
}
.app__link-back,
.app__link-settings { text-decoration: none; color: #D5E6E8; position: absolute; top: 15px;
}
.app__link-back { left: 20px;
}
.app__link-settings { right: 20px;
}
.app__body { background: #3E4D68; border-radius: 0 0 20px 20px;
}
/* --- LOG --- */
.log { font-size: 14px; padding: 20px; border-top: 1px solid #2B3547;
}
.log--critical { box-shadow: 6px 0 0 #E77A7A inset;
}
.log--urgent { box-shadow: 6px 0 0 #F6B07D inset;
}
.log__header { position: relative; font-size: 12px; font-weight: bold;
}
.log__ticket { text-decoration: none; color: #4BCBD8;
}
.log__badge { background: #57657E; padding: 3px 5px; border-radius: 5px; min-width: 15px; text-align: center; display: inline-block;
}
.log__body { padding-top: 10px; line-height: 1.25;
}
.log__icon { color: #E77A7A; font-size: 12px; position: absolute; top: 5px; right: 0;
}
Product backlog module - Script Codes
Product backlog module - Script Codes
Home Page Home
Developer Nika Zawila
Username nikazawila
Uploaded October 15, 2022
Rating 3.5
Size 2,488 Kb
Views 18,216
Do you need developer help for Product backlog module?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Nika Zawila (nikazawila) Script Codes
Name
Buttons with badges
Cashflow app module
Credit Card Template
Menu
Dropdown menu
Player
Weather widget
A Pen by Nika Zawila
Music player
Password reset form
Create amazing video scripts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!