Prose.io repo icon

Developer
Niels Oeltjen
Size
2,162 Kb
Views
32,384
  1. Prose.io repo icon Previews
  2. Prose.io repo icon HTML Codes
  3. Prose.io repo icon CSS Codes

How do I make an prose.io repo icon?

The prose.io repo icon was screaming for a css-only update. What is a prose.io repo icon? How do you make a prose.io repo icon? This script and codes were developed by Niels Oeltjen on 08 September 2022, Thursday.

Prose.io repo icon Previews
IQ Test

Prose.io repo icon - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Prose.io repo icon</title> <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> <!-- This book icon comes from a great app to manage your text files on github. I like the UI but the sprite-based approach was screaming for an update. http://prose.io/
-->
<a href="http://prose.io/"> <span>repo.github.com</span>
</a> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
</body>
</html>

Prose.io repo icon - Script Codes CSS Codes

@import url(https://fonts.googleapis.com/css?family=Open+Sans:300);
a { position: relative; display: inline-block; vertical-align: middle; height: 180px; width: 140px; background: #E0E7EB; -webkit-border-radius: 6px 2px 0 6px; -moz-border-radius: 6px 2px 0 6px; border-radius: 6px 2px 0 6px; border: 1px solid #C3CCD0; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0), 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 0 rgba(255, 255, 255, 0), 0 0 10px rgba(0, 0, 0, 0.1); text-align: center; text-decoration: none;
}
a:after,
a:before { border: 1px solid #C3CCD0; content: ""; position: absolute; left: -1px; right: -1px;
}
a:before { height: 15px; bottom: -1px; border-radius: 6px 0 0 6px; background: #d2dce0; background: -moz-linear-gradient(top, #d2dce0 0%, #e0e7eb 50%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d2dce0), color-stop(50%,#e0e7eb)); background: -webkit-linear-gradient(top, #d2dce0 0%,#e0e7eb 50%); background: -o-linear-gradient(top, #d2dce0 0%,#e0e7eb 50%); background: -ms-linear-gradient(top, #d2dce0 0%,#e0e7eb 50%); background: linear-gradient(to bottom, #d2dce0 0%,#e0e7eb 50%);
}
a:after { height: 7px; bottom: 3px; border-radius: 4px 0 0 4px;
}
a span { color: #526066; font: 13px/20px 'Open Sans', sans-serif;
}
a span:after { position: absolute; bottom: 7px; left: 0; width: 100%; content: ""; border-bottom: 1px solid #C3CCD0;
}
a span:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-top: -20px;
}
/* Presentation */
body { background: #e7eef2; text-align: center; padding: 60px;
}
Prose.io repo icon - Script Codes
Prose.io repo icon - Script Codes
Home Page Home
Developer Niels Oeltjen
Username NielsOeltjen
Uploaded September 08, 2022
Rating 3
Size 2,162 Kb
Views 32,384
Do you need developer help for Prose.io repo icon?

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!

Niels Oeltjen (NielsOeltjen) Script Codes
Name
Large menu pattern
Layout states using jQuery and Data Attributes
Semantic vertical centering
Simple spinner
Emoji selectors
Sweet star loader
Nice outline hover effect
Another nice loader
Animated css matrix type
SVG icons coloured using js and hash
Create amazing sales emails 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!