working on it ...

Filters

Explore Public Snippets

Sort by

Found 47k snippets

    public by louie143 modified Sep 6, 2017  59  0  3  0

    sadasd

    sdadas
    <!DOCTYPE HTML>
    <html>
    	<head>
    		 <link rel="icon" type="image/jpg" href="images/tablogo.jpg">
    		<title>Niprosoft - Home</title>
    		<meta charset="utf-8" />
    		<meta name="viewport" content="width=device-width, initial-scale=1" />
    		<link rel="stylesheet" href="assets/css/main.css" />
    	</head>
    	<body>
    
    		<!-- Header -->
    			<header id="header">
    				<div class="inner">
    					<a href="index.html" class="logo">Niprosoft</a>
    					<nav id="nav">
    						<a href="index.html">Home</a>
    						<a href="NiprosSoft Under Construction.html">Apps</a>
    						<a href="NiprosSoft Games.html">Games</a>
    						<a href="NiprosSoft Under Construction.html">Websites</a>
    						<a href="NiprosSoft Under Construction.html">Software</a>
    						<a href="NiprosSoft About Niprosoft.html">About NiproSoft</a>
    						<a href="NiprosSoft Privacy Policy.html">NiproSoft Privacy Policy</a>
    					</nav>
    					<a href="#navPanel" class="navPanelToggle"><span class="fa fa-bars"></span></a>
    				</div>
    			</header>
    
    		<!-- Banner -->
    			<section id="banner">
    				<h1>Welcome to NiproSoft</h1>
    				<p>An Apps, Games, Websites, Software Developer Company</p>
    			</section>
    
    		<!-- Three -->
    			<section id="three" class="wrapper special">
    				<div class="inner">
    					<header class="align-center">
    						<h2>Trending</h2>
    						<p><b>Apps Games Websites Softwares</b></p>
    					</header>
    					<div class="flex flex-2">
    						<article>
    							<div class="image fit">
    								<img src="images/ddr 2.jpg" alt="Pic 01" />
    							</div>
    							<header>
    								<h3><a href="NiprosSoft Dutertes Drop Rescue.html">Duterte's Drop Rescue</a></h3>
    							</header>
    							<p>Drop Rescue Is an 2d Game Created By NiproSoft.It Is Available In Android And IOS Mobile.The Mechanics Is Save Duterte Drop Him In The Grass Block. Its Official Free Download It Know And Enjoy</p>
    							<footer>
    								<a href="NiprosSoft Dutertes Drop Rescue.html" class="button special">More</a>
    							</footer>
    						</article>
    						<article>
    							<div class="image fit">
    								<img src="images/ad1.jpg" alt="Pic 02" />
    							</div>
    							<header>
    								<h3><a href="NiprosSoft Angry Duterte.html">Angry Duterte</a></h3>
    							</header>
    							<p>Dish out revenge on the greedy Enemy's Who Stole The money. Use the unique powers of each Player to destroy the Enemy's’ defenses. Angry Duterte features challenging physics-based gameplay and </p>
    							<footer>
    								<a href="NiprosSoft Angry Duterte.html" class="button special">More</a>
    							</footer>
    						</article>
    					</div>
    				</div>
    			</section>
    
    		<!-- Footer -->
    			<footer id="footer">
    				<div class="inner">
    					<div class="flex">
    						<div class="copyright">
    							<b>&copy; NiproSoft 2017: </b><a href="https://niprosot.esy.es"></a>. 
    						</div>
    						<ul class="icons">
    							<li><a href="https://m.facebook.com/niprosoft" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
    							<li><a href="https://www.twitter.com/niprosoftgames" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
    							<li><a href="https://www.linkedin.com/in/niprosoft-company-8b2861144/" class="icon fa-linkedin"><span class="label">linkedIn</span></a></li>
    							<li><a href="https://www.pinterest.com/niprosoft" class="icon fa-pinterest-p"><span class="label">Pinterest</span></a></li>
    							<li><a href="https://vimeo.com/niprosoft" class="icon fa-vimeo"><span class="label">Vimeo</span></a></li>
    						</ul>
    					</div>
    				</div>
    			</footer>
    <!-- Scripts -->
    			<script src="assets/js/jquery.min.js"></script>
    			<script src="assets/js/skel.min.js"></script>
    			<script src="assets/js/util.js"></script>
    			<script src="assets/js/main.js"></script>
    
    	</body>
    </html>
    

    public by eliev modified Jun 4, 2017  202  10  3  0

    Logo - with animation full CSS

    amazing way to present a logo in SVG
    <div class="codepad-logo">
        <div class="logo"></div>
    </div>
    
    <style>
    html,
    body {
      height: 100%;
    }
    
    body {
      position: relative;
      background-color: #0f222b;
    }
    
    *,
    *::before,
    *::after {
      box-sizing: border-box;
    }
    
    .codepad-logo, 
    .codepad-logo::before, 
    .codepad-logo::after {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
    }
    
    .codepad-logo {
      width: 200px;
      height: 200px;
      margin: auto;
      color: #3498db;
      border-radius: 6px;
      box-shadow: inset 0 0 0 1px #3498db;
      transform: rotate(45deg);
    }
    
    .logo {
        background: url("https://nucleos.ch/images/logo.svg") no-repeat 50%/70%;
        width: 100%;
        height: 100%;
        transform: rotate(-45deg);
    }
    
    .codepad-logo::before, 
    .codepad-logo::after {
      content: '';
      z-index: -1;
      margin: -5%;
      box-shadow: inset 0 0 0 2px;
      border-radius: 6px;
      animation: clipIt 8s linear infinite;
    }
    .codepad-logo::before {
      animation-delay: -4s;
    }
    
    @keyframes clipIt {
      0%, 100% { clip: rect(0px, 220px, 2px, 0px); }
      25%      { clip: rect(0px, 2px, 220px, 0px); }
      50%      { clip: rect(218px, 220px, 220px, 0px); }
      75%      { clip: rect(0px, 220px, 220px, 218px); }
    }
    
    </style>            

    public by nand3 modified May 28, 2017  262  0  4  1

    hello word

    <html>
    <body>
    <h1>hello word</h1>
    </body>
    
    </html>            

    public by lindao modified May 5, 2017  745  7  4  0

    image_amp_by_lindao

    <img class="img img-responsive center-block" src="images/feriekredit.png"><br>       

    public by makli1971 modified Mar 13, 2017  883  8  5  0

    HTML5 Basic Template

    This snippet is a simple, basic HTML5-Template. I use it for getting support when creating a HTML5-Page from scratch.
    <!DOCTYPE html>
    <html>
    <head>
    	<meta charset="utf-8">
    	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    	<link rel="stylesheet" href="styles.css">
    	<script src="script.js"></script>
    </head>
    <body>
    
    </body>
    </html>

    public by cwilli34 modified Feb 21, 2017  53  1  1  0

    Center images with caption aligning beneath the image.

    Center images with caption aligning beneath the image.: center_image.html
    <div style="display: block; text-align: center;">
      <div style="display: inline-block">
        <div class="wrapper" style="display: table; text-align: left">
          <a href="#" target="_blank"><img alt="Wib Ami Video" src="/assets/225577/fullsize/wib_ami_video.jpg" style="display: block; text-align: center;"></a>
          <div class="caption" style="display: table-caption; caption-side: bottom;">Ami: Network means an open, helping hand</div>
        </div>
      </div>
    </div>
    
    

    public by Bobby Kozora modified Oct 21, 2016  891  0  3  0

    Outlook Email UL Fix

    Outlook Email UL Fix: outlook-ul-fix.html
    <!--[if gte mso 9]>
    <style>
    .fixed-ul li {
        text-indent: -1em; /* Normalise space between bullets and text */
    }
    </style>
    <![endif]-->
    
    <!-- -->
    
    <ul style=" margin:0px 0px 0px 15px; list-style:disc; padding-left: 0px;" class="fixed-ul">
      <li style=" margin: 0 px; padding: 0px; color: #f17a21;">...</li>
    </ul>
    
    
    

    public by passh modified Oct 19, 2016  10101  8  4  1

    HTML TWIG TEMPLATE BASIC

    basic twig html template
    {# HTML TEMPLATE TWIG TEMPLATE BASIC by Passh#}
    <!DOCTYPE HTML>
    
    <html lang="es">
    	<body>
    
    			<head>
    					<meta charset="utf-8" />
    					<title>
    							{% block titulo %} 
    								HTML TWIG TEMPLATE
    							{%endblock%}
    					</title>
    			</head>
    	</body>
    	<footer>by Passh</footer>
    </html>

    public by willamecm modified Oct 12, 2016  9739  15  4  0

    HTML 5 - Estrutura

    aqui vamos ter a estrutura do html 5
    <!DOCTYPE html>
    <html lang="pt-br">
    	<head>
           <meta charset="utf-8"/>
           <title>título da página</title>
       </head>
       
       <body>
           
       </body>
    </html>

    public by strela modified Sep 29, 2016  7722  12  4  0

    form validation

    <html>
    
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
      <link rel="stylesheet" type="text/css" href="form.css">
    
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    
      <title>
        Form
      </title>
    </head>
    
    <body>
    
      <form id="resume_form" class="jotform-form" action="#" method="post"
        enctype="multipart/form-data" name="resume_form" accept-charset="utf-8"
        novalidate="true">
    
        <div class="form-all">
          <ul class="form-section page-section">
          <li class="form-line form-line-column form-col-1 jf-required" data-type="control_textbox">
            <label class="form-label form-label-top"for="name">
              Name
              <span class="form-required">
                *
              </span>
            </label>
            <div class="form-input-wide jf-required">
              <input id="name" name="name" class="form-textbox validate_required form-validation-error" data-type="input-textbox" size="50" value="" type="text">
            </div>
          </li>
          <li class="form-line form-line-column form-col-2" data-type="control_textbox">
            <label class="form-label form-label-top" for="phone"> Phone </label>
            <div class="form-input-wide jf-required">
              <input id="phone" name="phone" class=" form-textbox" data-type="input-textbox" size="50" value="" type="text">
            </div>
          </li>
          <li class="form-line form-line-column form-col-3" data-type="control_textarea">
            <label class="form-label form-label-top" for="comments"> Comments </label>
            <div class="form-input-wide jf-required">
              <textarea id="comments" name="comments" class="form-textarea" cols="35" rows="6"></textarea>
            </div>
          </li>
          <li class="form-line form-line-column form-col-4" data-type="control_fileupload">
            <label class="form-label form-label-top" for="attachment"> Attachment </label>
            <div class="form-input-wide jf-required">
              <input id="attachment" name="attachment" class="form-upload validate_upload" data-imagevalidate="yes" file-maxsize="1024" file-minsize="0" file-limit="0" type="file">
            </div>
          </li>
          <li class="form-line" data-type="control_button">
            <div class="form-input-wide">
              <div style="text-align:right" class="form-buttons-wrapper">
                <button type="submit" class="form-submit-button">
                  Submit
                </button>
              </div>
            </div>
          </li>
        </ul>
        </div>
    
      </form>
    
      <form id="contact_form" class="jotform-form" action="#" method="post"
        enctype="multipart/form-data" name="contact_form" accept-charset="utf-8"
        novalidate="true">
        <div class="form-all">
          <ul class="form-section page-section">
            <li class="form-line form-line-column form-col-1 jf-required" data-type="control_textbox">
              <label class="form-label form-label-top" for="name">
                Name
                <span class="form-required">
                  *
                </span>
              </label>
              <div class="form-input-wide jf-required">
                <input id="name" name="name" class=" form-textbox validate_required form-validation-error" data-type="input-textbox" size="50" value="" type="text">
              </div>
            </li>
            <li class="form-line form-line-column form-col-2 jf-required" data-type="control_textbox">
              <label class="form-label form-label-top" for="email">
                Email
                <span class="form-required">
                  *
                </span>
              </label>
              <div class="form-input-wide jf-required">
                <input id="email" name="email" class=" form-textbox validate_required validate_email" data-type="input-textbox" size="50" value="" type="text">
              </div>
            </li>
            <li class="form-line form-line-column form-col-3 jf-required" data-type="control_textarea">
              <label class="form-label form-label-top" for="message">
                Message
                <span class="form-required">
                  *
                </span>
              </label>
              <div class="form-input-wide jf-required">
                <textarea id="message" name="message" class="form-textarea validate_required" cols="35" rows="6"></textarea>
              </div>
            </li>
            <li class="form-line" data-type="control_button">
              <div class="form-input-wide">
                <div style="text-align:right" class="form-buttons-wrapper">
                  <button type="submit" class="form-submit-button">
                    Submit
                  </button>
                </div>
              </div>
            </li>
          </ul>
        </div>
    
    <script type="text/javascript">
    VALIDATIONS = {
      REQUIRED: 0,
      EMAIL: 1,
      FILE: 2,
    }
    EXCEPTIONS = {
      REQUIRED: "This field is required.",
      EMAIL: "Enter a valid e-mail address.",
      FILE_TYPE: "Invalid file extention.",
      FILE_SIZE: "Invalid file size.",
      FORM: "There are errors on the form. Please fix them before continuing.",
    }
    
    function generate_form_error(message) {
      error = $("<div></div>").addClass("form-button-error").append(
        $("<p></p>").text(message)
      )
      return error;
    }
    function generate_error(message) {
      error = $("<div></div>").addClass("form-error-message").append(
        $("<img>").attr("src", "exclamation-octagon.png").css("margin-right", "5px").attr("align", "left")
      ).append(
        document.createTextNode(message)
      ).append(
        $("<div></div>").addClass("form-error-arrow").append(
          $("<div></div>").addClass("form-error-arrow-inner")
        )
      )
      return error;
    }
    function clear_errors(input) {
      input.parent().find(".form-error-message").each(function() {
        $(this).remove();
      })
    }
    function add_error(input, message) {
      input.parent().append(generate_error(message));
    }
    function isValidEmailAddress(emailAddress) {
        var pattern = /^([a-z\d!#$%&'*+\-\/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+(\.[a-z\d!#$%&'*+\-\/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+)*|"((([ \t]*\r\n)?[ \t]+)?([\x01-\x08\x0b\x0c\x0e-\x1f\x7f\x21\x23-\x5b\x5d-\x7e\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|\\[\x01-\x09\x0b\x0c\x0d-\x7f\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))*(([ \t]*\r\n)?[ \t]+)?")@(([a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.)+([a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.?$/i;
        return pattern.test(emailAddress);
    };
    function validate(input, type) {
      if (input.parent().find(".form-error-message").length > 0) {
        return false;
      }
      switch (type) {
        case VALIDATIONS.REQUIRED:
          clear_errors(input);
          if (input.val().length === 0)
            add_error(input, EXCEPTIONS.REQUIRED);
          break;
        case VALIDATIONS.EMAIL:
          clear_errors(input);
          if (!isValidEmailAddress(input.val()))
            add_error(input, EXCEPTIONS.EMAIL);
          break;
        case VALIDATIONS.FILE:
          clear_errors(input);
          var ext = $(this).val().split('.').pop().toLowerCase();
          if($.inArray(ext, ["pdf", "doc", "docx", "xls", "xlsx", "csv", "rtf", "html", "mpg", "flv", "avi", "jpg", "jpeg", "png", "gif"]) == -1)
            add_error($(this), EXCEPTIONS.FILE_TYPE);
          var size = this.files[0].size;
          console.log(ext, size);
          if(size < 0 || size > 1024*1024)
            add_error($(this), EXCEPTIONS.FILE_SIZE);
          break;
        default:
      }
    }
    $("[class^='validate'], [class*=' validate'], :not([class*=' validate_upload'])").focus(function() {
      clear_errors($(this));
    })
    $(".validate_required").focusout(function() {
      validate($(this), VALIDATIONS.REQUIRED);
    })
    $(".validate_email").focusout(function() {
      validate($(this), VALIDATIONS.EMAIL);
    })
    $(".validate_upload").bind("change", function (e) {
      validate($(this), VALIDATIONS.FILE);
    })
    $(".form-submit-button").click(function() {
      $(this).parents("form").find(".validate_required").each(function() {
        validate($(this), VALIDATIONS.REQUIRED);
      })
      if ($(this).parents("form").find(".form-error-message").length > 0) {
        $(this).parent().parent().find(".form-button-error").each(function() {
          $(this).remove();
        })
        $(this).parent().parent().append(generate_form_error(EXCEPTIONS.FORM));
        return false;
      }
    })
    </script>
    
    </body>
    </html>
    
    • Public Snippets
    • Channels Snippets