thiscodeWorks - Organizing the best of code online

<!DOCTYPE html>
<html>
<body>

<p>If your browser supports bi-directional override (bdo), the next line will be written from right to left (rtl):</p>

<bdo dir="rtl">This line will be written from right to left</bdo>

</body>
</html>

#undefined

› סטודיו חן - בניה ועיצוב אתרים — וורדפרס

<!-- Google tag (gtag.js) -->

<script async src="https://www.googletagmanager.com/gtag/js?id=G-HTKNHG"></script>
3
<script>
4
  window.dataLayer = window.dataLayer || [];
5
  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());


8
  gtag('config', 'G-H34TKNH5G8');

</script>

#undefined

A Pen by vivek kumar

#undefined

Cool Layout with Complex Chainable Animation

var $cont = document.querySelector(".cont");

var $elsArr = [].slice.call(document.querySelectorAll(".el"));

var $closeBtnsArr = [].slice.call(document.querySelectorAll(".el__close-btn"));



setTimeout(function () {

 $cont.classList.remove("s--inactive");

}, 0);



$elsArr.forEach(function ($el) {

 $el.addEventListener("click", function () {

  if (this.classList.contains("s--active")) return;

  $cont.classList.add("s--el-active");

  this.classList.add("s--active");

 });

});



$closeBtnsArr.forEach(function ($btn) {

 $btn.addEventListener("click", function (e) {

  e.stopPropagation();
20
  $cont.classList.remove("s--el-active");

  document.querySelector(".el.s--active").classList.remove("s--active");

 });

});

#undefined

Edit Themes ‹ taiga.green — WordPress

document.addEventListener('DOMContentLoaded', function() {

    var wishlistButton = document.getElementById('wishlistBtn');



    wishlistButton.addEventListener('click', function() {

        // Create or toggle popup container

        var popupContainer = document.querySelector('.popup');

        if (!popupContainer) {

            popupContainer = document.createElement('div');

            popupContainer.className = 'popup';

            popupContainer.innerHTML = `

                <div class="popup-content">

                    <span class="close" onclick="closePopup()">&times;</span>

                    <h2>Wishlist</h2>

                    ${getWishlistContent()} <!-- Insert WooCommerce Smart Wishlist shortcode content here -->

                    <p><a href="#" id="wishlistLink">View Wishlist</a></p>

                </div>

            `;

            // Set the link to the wishlist page (replace with your wishlist link)

            var wishlistLink = popupContainer.querySelector('#wishlistLink');

            wishlistLink.href = '#'; // replace with your wishlist page URL

            // Append the popup container to the body

            document.body.appendChild(popupContainer);

        } else {

            // Toggle display property

            var currentDisplay = window.getComputedStyle(popupContainer).getPropertyValue('display');

            popupContainer.style.display = currentDisplay === 'none' ? 'block' : 'none';

        }

    });



    // Function to close the popup

    window.closePopup = function() {

        var popupContainer = document.querySelector('.popup');

        if (popupContainer) {

            document.body.removeChild(popupContainer);

        }

#undefined

Darrin Email Address

darrin@cds.direct

#undefined

CDS Mail Form

Name:
[your-name]

Email:
[your-email]

Phone:
[your-number]

City:
[your-city]

State:
[your-state]

Comment:
[your-message]




--
This e-mail was sent from a contact form on Clean Diesel Specialists Inc (https://cleandieselspecialists.com)

#undefined

CDS Form

<p><strong>Name:</strong> (required)
    [text* your-name] </p>

<p><strong>Email:</strong> (required)
    [email* your-email] </p>

<p><strong>Number:</strong>
    [tel your-number] </p>

<p><strong>City:</strong> (required)
    [text* your-city] </p>

<p><strong>State:</strong> (required)
    [text* your-state] </p>

<p><strong>Comment:</strong>
    [textarea your-message 40x3] </p>

[cf7sr-simple-recaptcha]

<p>[submit "Submit"]</p>

#undefined

SLab - Jupyter Notebook

#undefined

Apple Redistribution into Boxes - LeetCode Contest

int minimumBoxes(int* apple, int appleSize, int* capacity, int capacitySize) {

    

}

#undefined

Adicionar novo trecho de código ‹ Pedidos Woo 1.0 — WordPress

add_shortcode('whatsapp_message_url', 'gerar_link_whatsapp_produto2');

function gerar_link_whatsapp_produto2() {
    global $product;
    if (!$product) {
        return 'Produto não disponível.';
    }

    $whatsapp_number = get_option('site-config')['whatsapp_number'];
    $sku_exibe = get_option('site-config')['sku_exibe'];

    if (empty($whatsapp_number)) {
        return 'Número do WhatsApp não configurado.';
    }

    $post_id = $product->get_id();
    $post_title = get_the_title($post_id);
    $post_url = get_permalink($post_id);

    $message = "Olá, gostaria de saber mais sobre este produto:\n\n";
    $message .= "*Produto:* {$post_title}\n";
    $message = htmlentities($message);

    $message_id = uniqid('msg_');

    ob_start();
    ?>
    <script>
    (function($) {
        $(document).ready(function() {
            var messageSelector = '#<?php echo $message_id; ?>';
            var variationForm = $('.variations_form');
            
            variationForm.on('found_variation', function(event, variation) {
                var variationDetails = '';

                <?php if ($sku_exibe === 'true'): ?>
                var productSku = variation.sku ? "*SKU:* " + variation.sku + '\n' : '';
                variationDetails += productSku;
                <?php endif; ?>
                
                var productVariationPrice = variation.display_price ? "*Preço:* R$ " + variation.display_price.toFixed(2).replace('.', ',') + '\n' : '';
                variationDetails += productVariationPrice;

                $.each(variation.attributes, function(key, value) {
                    if (value) {
                        var attribute_name = key.replace('attribute_', '');
                        var normalized_name = attribute_name.replace(/pa_/, '').replace(/_/g, ' ');
                        var cleanValue = value.replace(/-/g, ' ').replace(/^pa_/, '');
                        variationDetails += "*" + normalized_name.capitalize() + ":* " + cleanValue + '\n';
                    }
                });

                variationDetails += "*Link do Produto:* " + "<?php echo $post_url; ?>\n\n";
                var fullMessage = $(messageSelector).data('base-message') + variationDetails + "Obrigado.";
                $(messageSelector).attr('href', function() {
                    return $(this).data('base-url') + '&text=' + encodeURIComponent(fullMessage);
                });
            }).trigger('update_variation_values');
        });

        // Função para capitalizar a primeira letra de cada palavra
        String.prototype.capitalize = function() {
            return this.replace(/(?:^|\s)\S/g, function(a) { return a.toUpperCase(); });
        };
    })(jQuery);
    </script>
    <?php
    $script = ob_get_clean();

    $whatsapp_base_url = "https://api.whatsapp.com/send?phone={$whatsapp_number}";
    $encoded_message = urlencode($message);
    $link = "{$whatsapp_base_url}&text={$encoded_message}";

    return "<a href='{$link}' target='_blank' class='whatsapp-link' id='{$message_id}' data-base-message='{$message}' data-base-url='{$whatsapp_base_url}'>
        <i class='fab fa-whatsapp icon'></i>Pedir via WhatsApp</a>{$script}";
}

#undefined

assignment5 - Jupyter Notebook

learning_rate = 1e-3

model = None
optimizer = None

################################################################################
# TODO: Instantiate and train Resnet-10.                                       #
################################################################################
# *****START OF YOUR CODE (DO NOT DELETE/MODIFY THIS LINE)*****



model = None


# *****END OF YOUR CODE (DO NOT DELETE/MODIFY THIS LINE)*****
################################################################################
#                                 END OF YOUR CODE                             
################################################################################

print_every = 700
train_part34(model, optimizer, epochs=10)
print_every = 100

#undefined

assignment5 - Jupyter Notebook

########################################################################
# TODO: "Implement the forward function for the Resnet specified"        #
# above. HINT: You might need to create a helper class to              # 
# define a Resnet block and then use that block here to create         #
# the resnet layers i.e. conv2_x, conv3_x, conv4_x and conv5_x         #
########################################################################
# *****START OF YOUR CODE (DO NOT DELETE/MODIFY THIS LINE)*****
class ResNet(nn.Module):
    def __init__(self):
        super(ResNet, self).__init__()
        in_channels = 64
        out_channels = 64
        stride = 1
        self.conv1 = nn.Conv2d(3, 64, kernel_size=7, stride=2, padding=3, bias=False)
        self.bn1 = nn.BatchNorm2d(64)
        nn.ReLU()
        self.maxpool = nn.MaxPool2d(kernel_size = 3, stride = 2, padding = 1)
        

        
        pass
    def forward(self):
        pass
    
    
########################################################################
#                             END OF YOUR CODE                         #
########################################################################

#undefined

formatear un pendrive en linux debian

listar dispositivos con 
df
sudo umount /dev/sdb1
sudo mkfs.vfat -F 32 -n "nombredelpendrive" /dev/sdb1

#undefined #svg #allow-svg

Allow SVG Files Upload

/**

 * Allow SVG uploads for administrator users.

 *

 * @param array $upload_mimes Allowed mime types.

 *

 * @return mixed

 */

add_filter(

    'upload_mimes',

    function ( $upload_mimes ) {

        // By default, only administrator users are allowed to add SVGs.

        // To enable more user types edit or comment the lines below but beware of

        // the security risks if you allow any user to upload SVG files.

        if ( ! current_user_can( 'administrator' ) ) {

            return $upload_mimes;

        }



        $upload_mimes['svg']  = 'image/svg+xml';

        $upload_mimes['svgz'] = 'image/svg+xml';



        return $upload_mimes;

#undefined

Swiper Progress Bar [html]

<div class="swiper-container">

    <!-- Additional required wrapper -->

    <div class="swiper-wrapper">

        <!-- Slides -->

        <div class="swiper-slide">Slide 1</div>

        <div class="swiper-slide" data-swiper-autoplay="6000">Slide 2</div>

        <div class="swiper-slide" data-swiper-autoplay="000">Slide 3</div>
8
        <div class="swiper-slide" data-swiper-autoplay="6000">Slide 4</div>

        <div class="swiper-slide" data-swiper-autoplay="5000">Slide 5</div>

    </div>

    <!-- If we need pagination -->

    <div class="swiper-hero-progress"></div>

</div>

#undefined

› סטודיו חן - בניה ועיצוב אתרים — וורדפרס

<!-- Google tag (gtag.js) -->

<script async src="https://www.googletagmanager.com/gtag/js?id=G-2D1ZCVPF"></script>
3
<script>

  window.dataLayer = window.dataLayer || [];

  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());
7


  gtag('config', 'G-72D1ZCV3PF');

</script>

#undefined

Online SQL Editor

-- Online SQL Editor to Run SQL Online.
-- Use the editor to create new tables, insert data and all other SQL operations.
  
SELECT first_name, age
FROM Customers;

#undefined

explicacion de una consula en sql postgres

SELECT clientes.nombre, (
    SELECT COUNT(*) 
    FROM pedidos 
    WHERE pedidos.cliente_id = clientes.id
) AS total_pedidos
FROM clientes;

explicacion:

La consulta que mencionas tiene como objetivo obtener el nombre del cliente, la dirección, la fecha y el total de pedidos realizados por cada cliente. Aquí te explico paso a paso de forma sencilla:


La cláusula SELECT indica las columnas que deseamos mostrar en el resultado de la consulta. En este caso, queremos mostrar el nombre del cliente, la dirección, la fecha y el total de pedidos.

La cláusula FROM especifica las tablas que estamos utilizando en la consulta. En este caso, estamos utilizando las tablas "clientes" y "pedidos".

La cláusula JOIN se utiliza para combinar las filas de las tablas "clientes" y "pedidos" en base a una condición. En este caso, estamos uniendo las filas donde el id_cliente de la tabla "clientes" coincide con el id_cliente de la tabla "pedidos".

La cláusula GROUP BY se utiliza para agrupar los resultados por el nombre del cliente, la dirección y la fecha. Esto nos permite obtener el total de pedidos por cada combinación única de cliente, dirección y fecha.

La cláusula ORDER BY se utiliza para ordenar los resultados de forma ascendente por la fecha de los pedidos.

En resumen, esta consulta nos dará como resultado una lista de clientes con su respectiva dirección, fecha y el total de pedidos realizados por cada cliente, ordenados por fecha de forma ascendente.

Espero que esta explicación te sea útil. Si tienes alguna otra pregunta, no dudes en preguntar.

#undefined

estructura de una sonsulta sql en postgres

SELECT: Esta cláusula se utiliza para seleccionar las columnas que deseas mostrar en los resultados de la consulta. Puedes asignar un alias a cada columna utilizando la palabra reservada "AS". Por ejemplo:

SELECT columna1 AS alias1, columna2 AS alias2

FROM: En esta cláusula, se especifica la tabla o tablas de donde se obtendrán los datos. Puedes asignar un alias a cada tabla utilizando la palabra reservada "AS". Por ejemplo:

FROM tabla AS alias_tabla

WHERE (opcional): Esta cláusula se utiliza para filtrar los datos según una o varias condiciones. Puedes utilizar alias de columna en las condiciones. Por ejemplo:

WHERE alias_columna = valor

GROUP BY (opcional): Si deseas agrupar los resultados según una o varias columnas, puedes utilizar esta cláusula. Puedes utilizar alias de columna en la cláusula GROUP BY. Por ejemplo:

GROUP BY alias_columna

HAVING (opcional): Esta cláusula se utiliza para filtrar los grupos de datos generados por la cláusula GROUP BY. Puedes utilizar alias de columna en las condiciones. Por ejemplo:

HAVING alias_columna = valor

ORDER BY (opcional): Si deseas ordenar los resultados de la consulta según una o varias columnas, puedes utilizar esta cláusula. Puedes utilizar alias de columna en la cláusula ORDER BY. Por ejemplo:

ORDER BY alias_columna ASC

Espero que esta explicación sea útil para comprender la estructura general de una consulta SQL con los alias y la palabra reservada "AS". Si tienes alguna otra pregunta, no dudes en hacerla.

#undefined

ejemplo de consulta ajax-jquery

$.ajax({
    url: 'ruta/al/controlador',
    method: 'GET',
    dataType: 'json',
    success: function(response) {
        // Manipula los datos recibidos en la respuesta
        for (var i = 0; i < response.length; i++) {
            var nombre = response[i].nombre;
            var apellido = response[i].apellido;
            var cedula = response[i].cedula;
            console.log(nombre + ' ' + apellido + ' - ' + cedula);
        }
    },
    error: function(xhr, status, error) {
        // Maneja los errores de la solicitud
        console.error(error);
    }
});

#undefined

Edit Snippet › chen-recipes — וורדפרס

function exclude_pages_from_search($query) {

    if ( $query->is_main_query() && $query->is_search ) {

        // Define the page IDs to exclude

        $exclude_ids = array(214, 222, get_option('page_on_front'));


6
        // Set the 'post__not_in' parameter

        $query->set('post__not_in', $exclude_ids);

    }
9
}



add_action('pre_get_posts', 'exclude_pages_from_search');

#undefined

Edit Snippet › chen-recipes — וורדפרס

function exclude_pages_from_search($query) {

    if ( $query->is_main_query() && $query->is_search ) {

        // Define the page IDs to exclude

        $exclude_ids = array(214, 222, get_option('page_on_front'));


6
        // Set the 'post__not_in' parameter

        $query->set('post__not_in', $exclude_ids);

    }
9
}



add_action('pre_get_posts', 'exclude_pages_from_search');

#undefined

ejemplo basico formulario orientado a objetos jquery

  <!DOCTYPE html>
<html>
<head>
    <title>Formulario con jQuery</title>
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <style>
        .container {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: 50px;
        }
        .form-group {
            margin-bottom: 10px;
        }
        .form-group label {
            display: block;
            font-weight: bold;
        }
        .form-group input {
            width: 200px;
            padding: 5px;
        }
        .submit-btn {
            padding: 10px 20px;
            background-color: #4CAF50;
            color: white;
            border: none;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div id="myForm" class="container">
        <!-- Formulario generado dinámicamente -->
    </div>

    <script>
        class Formulario {
            constructor() {
                this.formulario = document.createElement("form");
                this.formulario.className = "container";
                this.campos = [];

                this.crearCampo("nombre", "Nombre");
                this.crearCampo("apellido", "Apellido");
                this.crearCampo("email", "Email");
                this.crearCampo("telefono", "Teléfono");

                this.botonEnviar = document.createElement("button");
                this.botonEnviar.innerText = "Enviar";
                this.botonEnviar.className = "submit-btn";
                this.botonEnviar.addEventListener("click", this.enviarFormulario.bind(this));

                this.formulario.appendChild(this.botonEnviar);
                document.body.appendChild(this.formulario);
            }

            crearCampo(nombre, etiqueta) {
                const formGroup = document.createElement("div");
                formGroup.className = "form-group";

                const label = document.createElement("label");
                label.innerText = etiqueta;
                formGroup.appendChild(label);

                const input = document.createElement("input");
                input.type = "text";
                input.name = nombre;
                formGroup.appendChild(input);

                this.campos.push(input);

                this.formulario.appendChild(formGroup);
            }

            enviarFormulario() {
                const datos = {};
                for (const campo of this.campos) {
                    datos[campo.name] = campo.value;
                }
                console.log(datos);
            }
        }

        $(document).ready(function() {
            const formulario = new Formulario();
        });
    </script>
</body>
</html>

#undefined

ejemplo #4 formulario formulario avanzado

<!DOCTYPE html>
<html>
<head>
    <title>Formulario con ventana emergente</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> <!-- Enlace al archivo de estilos de Bootstrap -->
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <!-- Inclusión de la biblioteca jQuery -->
    <style>
        #dragon-logo {
            position: absolute; /* Posición absoluta para el logo */
            top: 10px; /* Alineación superior a 10px */
            right: 10px; /* Alineación derecha a 10px */
            width: 50px; /* Ancho del logo */
        }
        input[type="text"], input[type="submit"] {
            margin-bottom: 2px; /* Espacio de 2px entre los campos de texto y el botón */
        }
    </style>
    <script>
        $(document).ready(function() {
            // Crear el formulario
            var formulario = document.createElement("form");
            formulario.classList.add("border", "p-3", "rounded", "bg-light"); // Agregar clases para estilos de borde, relleno y fondo
            formulario.style.display = "flex"; // Establecer el estilo de visualización como flex
            formulario.style.flexDirection = "column"; // Establecer la dirección de los elementos como columna
            formulario.style.alignItems = "center"; // Centrar los elementos horizontalmente

            var titulo = document.createElement("h2");
            titulo.textContent = "Formulario de prueba"; // Establecer el texto del título del formulario
            formulario.appendChild(titulo); // Agregar el título al formulario

            var campoTexto1 = document.createElement("input");
            campoTexto1.type = "text"; // Establecer el tipo de campo como texto
            campoTexto1.name = "nombre"; // Establecer el nombre del campo
            campoTexto1.placeholder = "Nombre"; // Establecer el marcador de posición del campo
            formulario.appendChild(campoTexto1); // Agregar el campo al formulario

            var espacio = document.createElement("br"); // Agregar un salto de línea entre los campos de texto
            formulario.appendChild(espacio);

            var campoTexto2 = document.createElement("input");
            campoTexto2.type = "text"; // Establecer el tipo de campo como texto
            campoTexto2.name = "apellido"; // Establecer el nombre del campo
            campoTexto2.placeholder = "Apellido"; // Establecer el marcador de posición del campo
            formulario.appendChild(campoTexto2); // Agregar el campo al formulario

            var botonEnviar = document.createElement("input");
            botonEnviar.type = "submit"; // Establecer el tipo de botón como enviar
            botonEnviar.value = "Enviar Formulario"; // Establecer el texto del botón
            botonEnviar.classList.add("btn", "btn-info"); // Agregar clases de Bootstrap para estilos de botón
            formulario.appendChild(botonEnviar); // Agregar el botón al formulario

            var contenedor = document.getElementById("miContenedor"); // Obtener el contenedor del formulario
            contenedor.style.display = "flex"; // Establecer el estilo de visualización como flex
            contenedor.style.justifyContent = "center"; // Centrar los elementos horizontalmente
            contenedor.appendChild(formulario); // Agregar el formulario al contenedor

            formulario.addEventListener("submit", function(event) {
                event.preventDefault(); // Evitar el envío del formulario por defecto

                var nombre = campoTexto1.value; // Obtener el valor del campo de nombre
                var apellido = campoTexto2.value; // Obtener el valor del campo de apellido

                var popupForm = $("<div class='modal fade' id='popupForm' tabindex='-1' role='dialog'>" + // Crear la ventana emergente con clase fade
                    "<div class='modal-dialog modal-dialog-centered' role='document'>" + // Centrar la ventana emergente
                    "<div class='modal-content bg-danger'>" + // Agregar clase "danger" para el fondo rojo
                    "<div class='modal-header'>" +
                    "<h5 class='modal-title'>Datos enviados</h5>" +
                    "<button type='button' class='close' data-dismiss='modal' aria-label='Close'>" +
                    "<span aria-hidden='true'>×</span>" +
                    "</button>" +
                    "</div>" +
                    "<div class='modal-body' style='color: white'>" + // Establecer el color del texto en blanco
                    "<p>Nombre: " + nombre + "</p>" +
                    "<p>Apellido: " + apellido + "</p>" +
                "</div>" +
                "</div>" +
                "</div>" +
                "</div>");

            $("body").append(popupForm); // Agregar la ventana emergente al cuerpo del documento

            $("#popupForm").modal("show"); // Mostrar la ventana emergente

            setTimeout(function() {
                $("#popupForm").modal("hide"); // Ocultar la ventana emergente después de 2 segundos
            }, 2000);

            setTimeout(function() {
                campoTexto1.value = ""; // Limpiar el campo de nombre
                campoTexto2.value = ""; // Limpiar el campo de apellido
            }, 3000);
        });
    });
    </script>
</head>
<body>
    <div id="miContenedor" class="container">
        <!-- El formulario y el código JavaScript aquí -->
    </div>
    <img id="dragon-logo" src="dragon.png"> <!-- Agregar el logo al documento -->
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> <!-- Inclusión del archivo de scripts de Bootstrap -->
</body>
</html>

#undefined

Test2

#undefined

If, Else If, Else

#undefined

Unbounce: The Landing Page and Conversion Platform

<link rel="preconnect" href="https://fonts.googleapis.com">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap" rel="stylesheet">

#undefined

SQL Tryit Editor v1.6

SELECT ProductID, ProductName, CategoryName
FROM Products
INNER JOIN Categories ON Products.CategoryID = Categories.CategoryID;

#undefined

SQL Tryit Editor v1.6

SELECT Customers.CustomerName, Orders.OrderID
FROM Customers
LEFT JOIN Orders
ON Customers.CustomerID=Orders.CustomerID
ORDER BY Customers.CustomerName;

#undefined

Create a New Pen

#undefined

P1CH2b JS Web

const articles = document.getElementsByTagName('article');

const paragraphs = document.getElementsByTagName('p');



const firstArticle = articles[0];

const secondParagraph = paragraphs[1];

#undefined

P1CH2b JS Web

const articles = document.getElementsByTagName('article');

const paragraphs = document.getElementsByTagName('p');



const firstArticle = articles[0];

const secondParagraph = paragraphs[1];

#undefined

P1CH2a JS Web

const articles = document.getElementsByTagName('article');

const paragraphs;

#undefined

P1CH2a JS Web

const articles = document.getElementsByTagName('article');

const paragraphs;

#undefined

A Pen by Paulina

<!DOCTYPE html>

<!DOCTYPE html>

<html lang="en" {IF CLASSES}class="classes"{/IF}>



<head>



  <meta charset="UTF-">
8


  {IF PRIVATE}

  <meta name="robots" content="noindex">

  {ELSE}

  <!-- MIT License -->

  {/IF}



  <title>{TITLE}</title>



  {STUFF FOR <HEAD>}



  <link rel="stylesheet" href="{CSS RESET CHOICE}">

  {EXTERNAL CSS}

  <style>

    {EDITOR CSS}

  </style>

#undefined

A Pen by Paulina

body {

  font-family: system-ui;

  background: #f0d06;

  color: white;

  text-align: center;
6
}

#undefined

A Pen by Paulina

<h1>👋 Hello World!</h1>

#undefined

Edit Themes ‹ edgeburg — WordPress

<?php

/**

 * The template for displaying the footer.

 *

 * @package GeneratePress

 */



if ( ! defined( 'ABSPATH' ) ) {

    exit; // Exit if accessed directly.

}

?>



    </div>

</div>



<?php

/**

 * generate_before_footer hook.

 *

 * @since 0.1

 */

do_action( 'generate_before_footer' );

?>



<div <?php generate_do_attr( 'footer' ); ?>>

    <?php

    /**

     * generate_before_footer_content hook.

     *

     * @since 0.1

     */

    do_action( 'generate_before_footer_content' );



    /**

     * generate_footer hook.

     *

     * @since 1.3.

     *

     * @hooked generate_construct_footer_widgets - 5

     * @hooked generate_construct_footer - 10

     */
42
    do_action( 'generate_footer' );



    /**

     * generate_after_footer_content hook.

     *

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h2>My First Page</h2>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = "Hello World!";
</script>

</body>
</html>

#undefined

JS Bin - Collaborative JavaScript Debugging

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>

</body>
</html>

#undefined

Suntamers Window Tinting - Divi>Includes>social_icons.php

<ul class="et-social-icons">

<?php if ( 'on' === et_get_option( 'divi_show_facebook_icon', 'on' ) ) : ?>
	<li class="et-social-icon et-social-facebook">
		<a href="<?php echo esc_url( strval( et_get_option( 'divi_facebook_url', '#' ) ) ); ?>" class="icon">
			<span><?php esc_html_e( 'Facebook', 'Divi' ); ?></span>
		</a>
	</li>
<?php endif; ?>
<?php if ( 'on' === et_get_option( 'divi_show_twitter_icon', 'on' ) ) : ?>
	<li class="et-social-icon et-social-twitter">
		<a href="<?php echo esc_url( strval( et_get_option( 'divi_twitter_url', '#' ) ) ); ?>" class="icon">
			<span><?php esc_html_e( 'X', 'Divi' ); ?></span>
		</a>
	</li>
<?php endif; ?>
<?php $et_instagram_default = ( true === et_divi_is_fresh_install() ) ? 'on' : 'false'; ?>
<?php if ( 'on' === et_get_option( 'divi_show_instagram_icon', $et_instagram_default ) ) : ?>
	<li class="et-social-icon et-social-instagram">
		<a href="<?php echo esc_url( strval( et_get_option( 'divi_instagram_url', '#' ) ) ); ?>" class="icon">
			<span><?php esc_html_e( 'Instagram', 'Divi' ); ?></span>
		</a>
	</li>
<?php endif; ?>
<?php if ( 'on' === et_get_option( 'divi_show_rss_icon', 'on' ) ) : ?>
<?php
	$et_rss_url = ! empty( et_get_option( 'divi_rss_url' ) )
		? et_get_option( 'divi_rss_url' )
		: get_bloginfo( 'rss2_url' );
?>
	<li class="et-social-icon et-social-rss">
		<a href="<?php echo esc_url( $et_rss_url ); ?>" class="icon">
			<span><?php esc_html_e( 'RSS', 'Divi' ); ?></span>
		</a>
	</li>
<?php endif; ?>

</ul>

#undefined

LAB

Q>4 w3 resourse
 

class Employee {
    private int salary;

    public Employee(int salary) {
        this.salary = salary;
    }

    public void work() {
        System.out.println("Employee is working");
    }

    public int getSalary() {
        return salary;
    }
}

class HRManager extends Employee {
    public HRManager(int salary) {
        super(salary);
    }

    @Override
    public void work() {
        System.out.println("HR Manager is managing employees");
    }

    public void addEmployee() {
        System.out.println("HR Manager is adding a new employee");
    }
}

// Main class
 public class Main{
    public static void main(String[] args) {
        Employee emp = new Employee(40000);
        HRManager mgr = new HRManager(70000);

        emp.work();
        System.out.println("Employee salary: " + emp.getSalary());

        mgr.work();
        System.out.println("Manager salary: " + mgr.getSalary());
        mgr.addEmployee();
    }
}
---------------------------------------------------------------------------------------------------------------------------------------
Q>6
 class Animal{
  //method
  public void move(){
    System.out.println("Animal moves");
  }
}
 class cheetah extends Animal{
  public void move(){
    System.out.println("Cheetaj moves fater");
  }
}
public class Main{
  public static void main(String args[]){
    Animal a=new Animal();
    cheetah b= new cheetah();
    a.move();
    b.move();
  }
}
---------------------------------------------------------------------------------------------------------------------------------------
Q>7

class Person {
    private String firstname;
    private String lastname;

    //constructor
    public Person(String firstname, String lastname) {
        this.firstname = firstname;
        this.lastname = lastname;
    }

    //methods
    public String getFirstName() {
        return firstname;
    }

    public String getLastName() {
        return lastname;
    }
}

class Employee extends Person {
    private int empid;
    private String jobtitle;

    public Employee(String firstname, String lastname, int empid, String jobtitle) {
        super(firstname, lastname);
        this.empid = empid;
        this.jobtitle = jobtitle;
    }

    public int getEmpid() {
        return empid;
    }

    public String getLastName() {
        return super.getLastName() + ", " + jobtitle;
    }
}

public class Main {
    public static void main(String args[]) {
        Employee employee1 = new Employee("Kortney", "Rosalee", 4451, "HR Manager");
        System.out.println(employee1.getFirstName() + " " + employee1.getLastName() + " (" + employee1.getEmpid() + ")");
        Employee employee2 = new Employee("Junior", "Philipa", 4452, "Software Manager");
        System.out.println(employee2.getFirstName() + " " + employee2.getLastName() + " (" + employee2.getEmpid() + ")");
    }
}
-----------------------------------------------------------------------------------------------------------------------------
Q>8

class Shape{
 
  public double getPerimeter(){
    return 0.0;
  }
  public double getArea(){
    return 0.0;
  }
}
class Circle extends Shape{
     private double radius;
  public Circle(double radius){
    this.radius=radius;
  }
    public double getPerimeter(){
    return Math.PI*radius*2;
  }
  public double getArea(){
    return Math.PI*radius*radius;
  }
  }
  public class Main{
    public static void main(String args[]){
      double r=8.0;
      Circle c =new Circle(r);
      System.out.println("radius of the circle"+r);
      System.out.println("area of the circle" +c.getArea());
      double r1=3.3;
      Circle c1 =new Circle(r1);
      System.out.println("radius of the circle"+r1);
       System.out.println("area of the circle"+c1.getPerimeter());
    }
  }


---------------------------------------------------------------------------------------------------------------------------------

abstract

abstract class Shape3D{
  public abstract double calculatevol();
  public abstract double calsurfacearea();
}
class Sphere extends Shape3D{
  private double radius;
  public Sphere(double radius){
    this.radius=radius;
  }
  public double calculatevol(){
    return (4.0/3.0)*Math.PI*Math.pow(radius,3);
    
  }
   public  double calsurfacearea(){
    return 4.0*Math.PI*Math.pow(radius,2);
    
  }
  
}
 class Cube extends Shape3D{
   private double sidelength;
    public Cube(double sidelength) {
    this.sidelength = sidelength;
  }
   
 public double calculatevol(){
   return Math.pow(sidelength,3);
 }
 public  double calsurfacearea(){
   return 6*Math.pow(sidelength,2);
 }
 }
 public class Main{
   public static void main(String args[]){
     Shape3D sphere=new Sphere(5.0);
     Shape3D cube=new Cube(5.0);
     System.out.println("sphere volume" + sphere.calculatevol());
     System.out.println("Sphrer surface area" +sphere.calsurfacearea());
     System.out.println("cube volume" + cube.calculatevol());
     System.out.println("cube surface area" +cube.calsurfacearea());
     
   }
 }

---------------------------------------------------------------------------------------------
Q7>
abstract class Vehicle{
  public abstract void StartEngine();
  public abstract void StopEngine();
  
}
class Car extends Vehicle{
  public void StartEngine(){
    System.out.println("Start Engine of the car");
  }
  public void StopEngine(){
    System.out.println("Stop");
  }
}

class Bike extends Vehicle{
  public void StartEngine(){
    System.out.println("Start the BIke engine");
    
  }
  public void StopEngine(){
    System.out.println("Stop");
  }
}

public class Main{
  public static void main(String args[]){
    Vehicle car=new Car();
    Vehicle bike=new Bike();
    car.StartEngine();
    bike.StartEngine();
    car.StopEngine();
    bike.StopEngine();
  }
}
------------------------------------------------------------------------------------------------
Q>10

abstract class Shape2D{
  public abstract void draw();
  public abstract void resize();
}
class Rectangle extends Shape2D{
   public void draw(){
     System.out.println("Rectangle: Drawing a rectangle.");
   }
   public void resize(){
     System.out.println("Rectangle: resize a rectangle.");
   }
}
class Circle extends Shape2D{
   public void draw(){
     System.out.println("Circle: Drawing a Circle.");
   }
   public void resize(){
     System.out.println("Circle: Drawing a Circle.");
   }
}
  public class Main{
  public static void main(String args[]){
    Shape2D rectangle= new Rectangle();
    Shape2D circle =new Circle();
    rectangle.draw();
    rectangle.resize();
    circle.draw();
    circle.resize();
  }
}



Q----------------LAB---------------------------------------------------------------------Q

abstract class Shape {
    abstract double calculateArea();
    abstract double calculatePerimeter();
}

class Rectangle extends Shape {
    private double length;
    private double breadth;

    public Rectangle(double length, double breadth) {
        this.length = length;
        this.breadth = breadth;
    }

    @Override
    public double calculateArea() {
        return length * breadth;
    }

    @Override
    public double calculatePerimeter() {
        return 2 * (length + breadth);
    }
}

class Triangle extends Shape {
    private double side1;
    private double side2;
    private double side3;

    public Triangle(double side1, double side2, double side3) {
        this.side1 = side1;
        this.side2 = side2;
        this.side3 = side3;
    }

    @Override
    public double calculateArea() {
        double s = (side1 + side2 + side3) / 2;
        return Math.sqrt(s * (s - side1) * (s - side2) * (s - side3));
    }

    @Override
    public double calculatePerimeter() {
        return side1 + side2 + side3;
    }
}

public class Main {
    public static void main(String[] args) {
        double length = 4.0;
        double breadth = 3.0;
        Rectangle rectangle = new Rectangle(length, breadth);

        double ts1 = 3.0, ts2 = 4.0, ts3 = 5.0;
        Triangle triangle = new Triangle(ts1, ts2, ts3);

        System.out.println("Length of the Rectangle: " + length);
        System.out.println("Breadth of the Rectangle: " + breadth);
        System.out.println("Area of the Rectangle: " + rectangle.calculateArea());
        System.out.println("Perimeter of the Rectangle: " + rectangle.calculatePerimeter());

        System.out.println("\nSides of the Triangle are: " + ts1 + ',' + ts2 + ',' + ts3);
        System.out.println("Area of the Triangle: " + triangle.calculateArea());
        System.out.println("Perimeter of the Triangle: " + triangle.calculatePerimeter());
    }
}


-----------LAB------------------------------------------------------------------------

class Num {
    protected int number;

    public Num(int number) {
        this.number = number;
    }

    public void shownum() {
        System.out.println("Number: " + number);
    }
}

class HexNum extends Num {
    public HexNum(int number) {
        super(number);
    }

    @Override
    public void shownum() {
        System.out.println("Hexadecimal Value: " + Integer.toHexString(number));
    }
}

public class Main {
    public static void main(String[] args) {
        Num baseNum = new Num(42);
        baseNum.shownum();

        HexNum hexNum = new HexNum(42);
        hexNum.shownum();
    }
}
-

------------------------------------------------------------------------------------------------
import java.util.Scanner;

abstract class BankAccount {
    
     abstract void deposit(double amount);
    abstract void withdraw(double amount);
    
    private double balance;

    public double getBalance() {
        return balance;
    }

    public void setBalance(double balance) {
        this.balance = balance;
    }

   
}

class SavingsAccount extends BankAccount {
    private double interestRate;

    public SavingsAccount(double balance, double interestRate) {
        setBalance(balance);
        this.interestRate = interestRate;
    }

    @Override
    void deposit(double amount) {
        setBalance(getBalance() + amount);
    }

    @Override
    void withdraw(double amount) {
        setBalance(getBalance() - amount);
    }
}

class CurrentAccount extends BankAccount {
    public CurrentAccount(double balance) {
        setBalance(balance);
    }

    @Override
    void deposit(double amount) {
        setBalance(getBalance() + amount);
    }

    @Override
    void withdraw(double amount) {
        setBalance(getBalance() - amount);
    }
}

public class Main {
    public static void main(String[] args) {
        SavingsAccount savingsAccount = new SavingsAccount(5000, 0.05);
        savingsAccount.deposit(1000);
        savingsAccount.withdraw(500);
        System.out.println("Savings Account Balance: " + savingsAccount.getBalance());

        CurrentAccount currentAccount = new CurrentAccount(10000);
        currentAccount.deposit(2000);
        currentAccount.withdraw(1000);
        System.out.println("Current Account Balance: " + currentAccount.getBalance());
    }
}
_______________________________________________________________________________________________

class Main{
    public static void main(String args[]){
        int vcount=0,ccount=0;
        String str="manner            dfg";
        str=str.toLowerCase();
        for(int i=0;i<str.length();i++){
            if(str.charAt(i)=='a'||str.charAt(i)=='e'||str.charAt(i)=='i'||str.charAt(i)=='o'||str.charAt(i)=='u'){
                vcount++;
            }
           //
 else if(str.charAt(i)>='a'&& str.charAt(i)<='z'){
                ccount++;
            }
        }
       System.out.println("number of vowels"+vcount);
       System.out.println("mumber of consonant"+ccount);
    }
}







public class Main{
    public static void main(String args[]){
        String str="Dream big";
        String reversedstr=" ";
        for(int i=str.length()-1;i>=0;i--){
            reversedstr=reversedstr+str.charAt(i);
            
        }
        System.out.println("original string"+str);
        System.out.println("Reversed String"+reversedstr);
    }
}

#undefined

bank account

abstract class BankAccount {
    public abstract void deposit(double amount);
    public abstract void withdraw(double amount);
    
    private String accountNumber;
    private double balance;
    
    public BankAccount(String accountNumber, double balance) {
        this.accountNumber = accountNumber;
        this.balance = balance;
    }

    public String getAccountNumber() {
        return accountNumber;
    }

    public double getBalance() {
        return balance;
    }

    protected void setBalance(double balance) {
        this.balance = balance;
    }

    
}
class SavingsAccount extends BankAccount {
    public SavingsAccount(String accountNumber, double balance) {
        super(accountNumber, balance);
    }

    @Override
    public void deposit(double amount) {
        setBalance(getBalance() + amount);
        System.out.println("Deposit of $" + amount + " successful. Current balance: $" + getBalance());
    }

    @Override
    public void withdraw(double amount) {
        if (getBalance() >= amount) {
            setBalance(getBalance() - amount);
            System.out.println("Withdrawal of $" + amount + " successful. Current balance: $" + getBalance());
        } else {
            System.out.println("Insufficient funds. Withdrawal failed.");
        }
    }
}
class CurrentAccount extends BankAccount {
    public CurrentAccount(String accountNumber, double balance) {
        super(accountNumber, balance);
    }

    @Override
    public void deposit(double amount) {
        setBalance(getBalance() + amount);
        System.out.println("Deposit of $" + amount + " successful. Current balance: $" + getBalance());
    }

    @Override
    public void withdraw(double amount) {
        if (getBalance() >= amount) {
            setBalance(getBalance() - amount);
            System.out.println("Withdrawal of $" + amount + " successful. Current balance: $" + getBalance());
        } else {
            System.out.println("Insufficient funds. Withdrawal failed.");
        }
    }
}

public class Main {
    public static void main(String[] args) {
		double ibal,damt,wamt;
        ibal = 1000.00;
        SavingsAccount savingsAccount = new SavingsAccount("SA001", ibal);
		System.out.println("Savings A/c: Initial Balace: $"+ibal);
		damt = 500.00;
        savingsAccount.deposit(damt);
		wamt = 250.00;
        savingsAccount.withdraw(wamt);
		wamt = 1600.00;
		System.out.println("\nTry to withdraw: $"+wamt);
        savingsAccount.withdraw(wamt);

        System.out.println();
        ibal = 5000.00;
        CurrentAccount currentAccount = new CurrentAccount("CA001", ibal);
		System.out.println("Current A/c: Initial Balace: $"+ibal);
		damt = 2500.00;
        currentAccount.deposit(1000.0);
		wamt = 1250.00;
        currentAccount.withdraw(3000.0);
		wamt = 6000.00;
		System.out.println("\nTry to withdraw: $"+wamt);
        savingsAccount.withdraw(wamt);		
    }
}

#undefined

abstract shape

abstract class Shape {
    abstract double calculateArea();
    abstract double calculatePerimeter();
}

class Circle extends Shape {
    private double radius;

    public Circle(double radius) {
        this.radius = radius;
    }

    @Override
    double calculateArea() {
        return Math.PI * radius * radius;
    }

    @Override
    double calculatePerimeter() {
        return 2 * Math.PI * radius;
    }
}

class Triangle extends Shape {
    private double side1, side2, side3;

    public Triangle(double side1, double side2, double side3) {
        this.side1 = side1;
        this.side2 = side2;
        this.side3 = side3;
    }

    @Override
    double calculateArea() {
        double s = (side1 + side2 + side3) / 2; // Semi-perimeter
        return Math.sqrt(s * (s - side1) * (s - side2) * (s - side3));
    }

    @Override
    double calculatePerimeter() {
        return side1 + side2 + side3;
    }
}

public class Main {
    public static void main(String[] args) {
        //double circleRadius = 4.0;
        Circle circle = new Circle(7);

       // double triangleSide1 = 3.0, triangleSide2 = 4.0, triangleSide3 = 5.0;
        Triangle triangle = new Triangle(3,4,5);

       // System.out.println("Radius of the Circle: " + circleRadius);
        System.out.println("Area of the Circle: " + circle.calculateArea());
        System.out.println("Perimeter of the Circle: " + circle.calculatePerimeter());

        //System.out.println("\nSides of the Triangle are: " + triangleSide1 + ", " + triangleSide2 + ", " + triangleSide3);
        System.out.println("Area of the Triangle: " + triangle.calculateArea());
        System.out.println("Perimeter of the Triangle: " + triangle.calculatePerimeter());
    }
}

#undefined

Very Simple JavaScript innerHTML Example

function ShowHelloMessage() {

    var name = document.getElementById("myname");

    document.getElementById("hellomessage").innerHTML = "Hello, " + name.value;

}

document.getElementById("mybutton").onclick = ShowHelloMessage;

#undefined

Very Simple JavaScript innerHTML Example

body {

  font-size:1em;

  font-family:Arial;

  background:#eee;

}



#hellomessage {

  font-weight:bold;

}

#undefined

Very Simple JavaScript innerHTML Example

<form method="GET">

    What is your name: <input type="text" size="20" id="myname" onkeydown = "if (event.keyCode == 1)  document.getElementById('mybutton').click()"   />
3
  <input type="text" style="display: none;" />

  <button type="button" id="mybutton">Submit</button>

</form>

<div id="hellomessage"></div>

#undefined

Card transitions

*

  box-sizing: border-box



body, html

  width: 0%

  height: 100%

  display: flex

  align-items: center

  justify-content: center
10
  background: orange



.wrapper

  display: flex

  width: 90%

  justify-content: space-around



.card

  width: 280px

  height: 360px

  border-radius: 15px

  padding: 1.5rem

  background: white

  position: relative

#undefined

Card transitions



.wrapper

  .card

    img(src="https://images.unsplash.com/photo-7662022-14fac4c25c?auto=format&fit=crop&w=667&q=0&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D")
5
    .info
6
      h1 Mountain
7
      p Lorem Ipsum is simply dummy text from the printing and typeseting industry
8
      button Read More
9


  .card

    img(src="https://images.unsplash.com/photo-1425342605259-25d80e320565?auto=format&fit=crop&w=750&q=80&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D")

    .info

      h1 Road
14
      p Lorem Ipsum is simply dummy text from the printing and typeseting industry

      button Read More

      

  .card

    img(src="https://images.unsplash.com/photo-1503249023995-51b0f3778ccf?auto=format&fit=crop&w=311&q=80&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D")
19
    .info

#undefined

Material Card with Animated Featured Image

@import url('https://fonts.googleapis.com/css?family=Raleway:00,00');
2
body {   font-family: Helvetica, san-serif;

  background: -webkit-linear-gradient(0deg, #00aaee %, #DD24 90%); /* Chrome 10+, Saf.1+ */
4
  background:    -moz-linear-gradient(90deg, #00aaee 10%, #DD2476 90%); /* FF3.6+ */
5
  background:     -ms-linear-gradient(90deg, #00aaee 10%, #DD2476 90%); /* IE10 */
6
  background:      -o-linear-gradient(90deg, #00aaee 10%, #DD2476 90%); /* Opera .10+ */
7
  background:         linear-gradient(90deg, #00aaee 10%, #DD2476 90%); /* W3C */ }

.transition { transition: .3s cubic-bezier(.3, 0, 0, 1.3) }
9
.card {
10
    background-color: #fff;
11
    bottom: 0;

    box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.3);

  -webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.3);

  -moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.3);

    height: 300px;

    left: 0;

    margin: auto;

#undefined

Material Card with Animated Featured Image

<div class="card transition">

  <h2 class="transition">Awesome Headline</h2>

  <p>Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.</p>

  <div class="cta-container transition"><a href="#" class="cta">Call to action</a></div>

  <div class="card_circle transition"></div>

</div>

#undefined

Live Demo: Using the CSS @import Rule

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-">

    <title>Using the CSS @import Rule</title>

    <style type="text/css">

        @import url("/examples/css/layout.css");
8
        @import url("/examples/css/color.css");

        body {

            color:blue;

            font-size:px;

        }

    </style>
14
</head>

<body>

    <div>

        <h1>Importing External Style Sheet</h1>

        <p>The layout styles of these HTML element is defined in 'layout.css' and colors in 'color.css'.</p>

    </div>

</body>

</html>

#undefined

تمرين HTML

<!DOCTYPE html>
<html>

<body>

  <h1>Personal Information</h1>

  <p>
    My name is [Abdulaziz AL-Qhtani]. I live at [Abha]. I am currently pursuing a degree in [MIS] at [My University Level seven]. You can find more about my university <a href="http://www.kku.edu.sa">here</a>.
  </p>

  <hr>

  <h1>Hobbies</h1>

  <p>
    In my free time, I enjoy [making my coffe]. Here's an image related to one of my hobbies:
  </p>

  <img src="https://www.alwatan.com.sa/uploads/images/2022/03/10/788080.jpg" alt="Image related to my hobby" width="300">

</body>

</html>

#undefined

tcs codevita

#undefined

page layout hook

add_filter('use_block_editor_for_post', '__return_false', 10);
add_filter( 'use_widgets_block_editor', '__return_false' );

#undefined

Edit Snippet ‹ EasyParcel — WordPress

<!DOCTYPE html>

<html lang="en">



<head>

  <meta charset="UTF-">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <style>
8
    /* Overlay styling */

    #overlay {

      display: none;

      position: fixed;

      top: 0;

      left: 0;

      width: %;

      height: 100%;

      background: rgba(0, 0, 0, 0.5); /* More transparent background */

      z-index: 1;

    }



    /* Popup container styling */

    #popup-container {

      display: none;

      position: fixed;

      top: %;

      left: 50%;

      transform: translate(-50%, -50%);

      padding: 20px;

      z-index: 2;

      border-radius: 10px; /* Rounded corners */

      background-color: #fff; /* White background */

      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Box shadow for depth */

    }



    /* Close button styling */

    #close-button {

      color: #000;

      background-color: transparent;

      position: absolute;

      font-size: 18px;

      right: 15px;

      top: 15px;

      cursor: pointer;

      z-index: 3;

    }



    /* Form styles */

    #popup-form {

      text-align: center;

    }
50


    /* Additional styles for form elements */

    #form-heading {

      font-size: 48px;

      color: #bc1d29;

      margin-bottom: 10px;

    }



    #form-subheading {

      font-size: 16px;

      margin-bottom: 20px;

      font-weight: bold;

    }



    #form-text {

      font-size: 12px;

      margin-bottom: 20px;

    }



    #voucher-input {

      width: 100%;

      padding: 10px;

      margin-bottom: 20px;

      box-sizing: border-box;

    }



    #getVoucherBtn {

      padding: 14px;

      margin: 5px;

      cursor: pointer;

      background-color: #bc1d29;

      color: #fff;

      font-size: 14px;

      font-weight: bold;

      border: none;

      width: 100%;

    }



    #noThanksBtn {

      padding: 14px;

      margin: 5px;

      cursor: pointer;

      background-color: #ccc;

      color: #000;

      font-size: 14px;

      font-weight: bold;

      border: none;

      width: 100%;

    }


100
    /* Show-popup container styling */

    #show-popup-container {

      position: fixed;

      bottom: px;

      left: 20px;

      z-index: 4; /* Ensure the button is above the popup */

    }



    /* Show-popup button styling */

    #show-popup {

      cursor: pointer;

      width: auto;

      height: 60px;

      background-color: #bc1d29;

      color: #fff;

      font-size: 18px;

      font-weight: bold;

      border: none;

      border-radius: 0;

      transform: rotate(deg);

      transform-origin: left center;

    }



    #show-popup:hover {

      background-color: #a0f; /* Darker color on hover */

    }



    /* Responsive styles 912px */

    @media (max-width: 840px) {

      #popup-container {

        padding: 40px; /* Adjust padding for smaller screens */

        top: 55%; /* Center vertically */

        left: 38%;

        transform: translate(-50%, -50%); /* Center the container */

      }



      #show-popup-container {

        bottom: px; /* Adjust top position for smaller screens */

        left: 29px; /* Adjust left position for smaller screens */

      }
140

141
      #show-popup {

        font-size: 29px; /* Adjust font size for smaller screens */

        background-color: #bc1d29;

      }



      #show-popup:hover {

        background-color: #a0141f; /* Darker color on hover */

      }

    }



    /* Responsive styles 790px */

    @media only screen and (max-width: 790px) {

      #popup-container {

        padding: 10px; /* Adjust padding for smaller screens */

        top: 55%; /* Center vertically */

        left: 40%;

        transform: translate(-50%, -50%); /* Center the container */

      }



      #show-popup-container {

        bottom: 130px; /* Adjust top position for smaller screens */

        left: 22px; /* Adjust left position for smaller screens */

      }



      #show-popup {

        font-size: 23px; /* Adjust font size for smaller screens */

        background-color: #bc1d29;

        position: fixed; /* Add this line to fix the button position */

      }
170


      #show-popup:hover {

        background-color: #a0141f; /* Darker color on hover */

      }

    }



    /* Responsive styles 430px */

    @media (max-width: 430px) {

      #popup-container {

        padding: 10px; /* Adjust padding for smaller screens */

        top: 60%; /* Center vertically */

        left: 57%;

        transform: translate(-50%, -65%); /* Center the container */

        z-index:1;  

      }



      #show-popup-container {

        bottom: 150px; /* Adjust top position for smaller screens */

        left: 20px; /* Adjust left position for smaller screens */

      }



      #show-popup {

        font-size: 18px; /* Adjust font size for smaller screens */

        background-color: #bc1d29;

      }



      #show-popup:hover {

        background-color: #a0141f; /* Darker color on hover */

      }



      /* Additional styles for form elements in the media query */

      #popup-form {

        text-align: center;

        box-sizing: content-box;

        margin-right: 10px;

      }



      #form-heading {

        font-size: 38px;

        color: #bc1d29;

        margin-bottom: 10px;

      }



      #form-subheading {

        font-size: 14px;

        margin-bottom: 20px;

        font-weight: bold;

      }



      #form-text {

        font-size: 12px;

        margin-bottom: 20px;

      }



      #voucher-input {

        width: 100%;

        padding: 10px;

        margin-bottom: 20px;

        box-sizing: border-box;

      }



      #getVoucherBtn {

        padding: 14px;

        margin: 5px;

        cursor: pointer;

        background-color: #bc1d29;

        color: #fff;

        font-size: 14px;

        font-weight: bold;

        border: none;

        width: 100%;

      }



      #noThanksBtn {

        padding: 14px;

        margin: 5px;

        cursor: pointer;

        background-color: #ccc;

        color: #000;

        font-size: 14px;

        font-weight: bold;

        border: none;

        width: 100%;

      }

    }

  </style>

</head>



<body>



  <div id="show-popup-container">

    <button id="show-popup" onclick="togglePopup()">GET $6 COUPON </button>

  </div>



  <div id="overlay" onclick="closePopup()"></div>



  <div id="popup-container">

    <div id="close-button" onclick="closePopup()">X</div>



    <!-- Form content -->
270
    <div id="popup-form">

      <h1 id="form-heading">First-time here?</h1>

      <p id="form-subheading">Sign up now and get RM5 OFF your first purchase</p>

      <input type="text" id="voucher-input" placeholder="Email Address">

      <button id="getVoucherBtn" onclick="getVoucher()">Get Your Voucher Code Now</button>

      <button id="noThanksBtn" onclick="closePopup()">No Thanks</button>

      <p id="form-text">You are signing up to receive communication via email and can unsubscribe at any time</p>

    </div>

  </div>



  <script>

    function togglePopup() {

      document.getElementById("overlay").style.display = "block";

      document.getElementById("popup-container").style.display = "block";

    }



    function closePopup() {

      document.getElementById("overlay").style.display = "none";

      document.getElementById("popup-container").style.display = "none";

    }



    function getVoucher() {

      // Signup link

      var voucherLink = "https://account.easyparcel.com/register?client_id=c575e8cd-aa46-46db-8308-e18d25bb76c6&redirect_uri=https%3A%2F%2Fapp.easyparcel.com%2Feasyaccount%2Fcallback&state=eyJjbGllbnRfaWQiOiI1M2FmYmQzMS05OGI2LTQ3ODctOWYzOC1kMDY5ZGRkN2RiM2QiLCJyZWRpcmVjdF91cmkiOiJodHRwczovL2FwcC5lYXN5cGFyY2VsLmNvbS9sb2dpbi9vYXV0aC9jYWxsYmFjayIsInN0YXRlIjoie1wicmVmZXJyZXJfY29kZVwiOlwiZDVhZmIyM2RkNTY5MWNiYjAzNDMwMTU5Y2UzODNjZjFRWGd4RDIyOEJIdWt6WUxwZDc5eElnPT1cIn0iLCJjb3VudHJ5IjoibXkiLCJsYW5nIjoiZW4ifQ%3D%3D&country=my";



      // Open the link in a new tab

      window.open(voucherLink, '_blank');



      // Close the form popup after handling the click

      closePopup();

    }

  </script>



</body>



</html>

#undefined

DQLab | Exercise matrixs

library("openxlsx")
library("C50")
library("reshape2")


dataCreditRating <- read.xlsx(xlsxFile="https://storage.googleapis.com/dqlab-dataset/credit_scoring_dqlab.xlsx")


dataCreditRating$risk_rating <- as.factor(dataCreditRating$risk_rating)
input_columns <-c("durasi_pinjaman_bulan", "jumlah_tanggungan")
datafeed <- dataCreditRating[,input_columns]


set.seed(100)
indeks_training_set <- sample(1:nrow(dataCreditRating),800)


input_training_set <- datafeed[indeks_training_set,]
class_training_set <- dataCreditRating[indeks_training_set,]$risk_rating
input_testing_set <- datafeed[-indeks_training_set,]


risk_rating_model <- C5.0(input_training_set, class_training_set,control=C5.0Control(label="Risk_Rating"))


input_testing_set$risk_rating <- dataCreditRating[-indeks_training_set,]$risk_rating
input_testing_set$hasil_prediksi <- predict(risk_rating_model,input_testing_set)
										   
result <- melt(input_testing_set[c("risk_rating","hasil_prediksi")],id.vars="risk_rating")	

head(result)
dcast(data=input_testing_set, hasil_prediksi ~risk_rating)

#undefined

Administrador de módulos • PrestaShop

#undefined

W3Schools Tryit Editor

#!/bin/python3
print("Hello, World!")

#undefined

› סטודיו חן - בניה ועיצוב אתרים — וורדפרס

<!-- Google tag (gtag.js) -->

<script async src="https://www.googletagmanager.com/gtag/js?id=G-0JL9YX"></script>

<script>
4
  window.dataLayer = window.dataLayer || [];
5
  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());


8
  gtag('config', 'G-980JL59Y4X');
9
</script>

#undefined

Add New Snippet › סטודיו חן - בניה ועיצוב אתרים — וורדפרס

#undefined

Dark Neumorphism Circle Loader

<div class="loading-box">

  <p class="loading-title">Loading</p>

  <div class="loading-circle">

    <p class="loading-count"><span id="loadingNumber">0</span>%</p>

  </div>

</div>

#undefined

Plotly.js

<!DOCTYPE html>
<html>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<body>

<div id="myPlot" style="width:100%;max-width:700px"></div>

<script>
const xArray = ["Italy", "France", "Spain", "USA", "Argentina"];
const yArray = [55, 49, 44, 24, 15];

const data = [{
  x:xArray,
  y:yArray,
  type:"bar",
  orientation:"v",
  marker: {color:"rgba(0,0,255,0.6)"}
}];

const layout = {title:"World Wide Wine Production"};

Plotly.newPlot("myPlot", data, layout);
</script>

</body>
</html>

#undefined

Header & Footer ‹ Autoservis Jakovljević — WordPress

#undefined

profitkommando-Title

<!-- Add HTML code to the header or the footer.



For example, you can use the following code for loading the jQuery library from Google CDN:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3..1/jquery.min.js"></script>


6
or the following one for loading the Bootstrap library from jsDelivr:

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha34-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2FCUG65" crossorigin="anonymous">
8

9
-- End of the comment -->

#undefined

PRACTICAL-6 2. Fit a Poisson distribution to the following data and test for its goodness of fit. No. Of patients

2. Fit a Poisson distribution to the following data and test for its goodness of fit.
No. Of patients
0
1
2
3
4
5
6
No. Of days
153
169
72
31
12
6
2
import pandas as pd
import numpy as np
from scipy.stats import poisson
table = pd.read_excel("C:/Users/Naveen/OneDrive/Desktop/Poisson_distribution.xlsx")
table
x = table[' No. Of patients ']
x
f = table[‘No. Of days’]
f
fx =f*x
m = sum(fx)/sum(f)
px = poisson.pmf(x,m)
px1 = np.round(px,4)
px1
ef =sum(f)*px
ef
ef1 = np.round(ef,0)
ef1
15
Peddi Rajini, Assistant Professor, Department of Mathematics and Statistics, BVC, Sainikpuri, Secunderabad
#perform Chi-Square Goodness of Fit Test
stats.chisquare(f_obs=f, f_exp=ef1)
if pval <0.05:
print("reject null hypothesis")
else:
print("accept null hypothesis")

#undefined

Practical - 5 Test for correlation coefficient using Python 1. Find the value of the correlation coefficient and the regression equation to the following table:

Practical - 5
Test for correlation coefficient using Python
1. Find the value of the correlation coefficient and the regression equation to the following table:
Age
43
21
25
42
57
59
Glucose Level
99
65
79
75
87
81
import numpy as np
import pandas as pd
import matplotlib.pyplot as plt # To visualize
from scipy.stats import pearsonr
from sklearn.linear_model import LinearRegression
table = pd.read_excel("C:/Users/Naveen/OneDrive/Desktop/measures of central tendency.xlsx")
print(table.head())
corr = pearsonr(table.marks, table.hours)
corr
plt.scatter(table.marks, table.hours)
plt.xlabel(“Age”)
plt.ylabel(“Glucose Level”)

#undefined

Practical -6 2 tests for goodness of fit using Python 1. For the arrival of the patients at a doctor’s clinic has obtained the following distribution for 445 days. Fit a Binomial distribution for the following data and test for its goodness of fit. No. Of patients

Practical -6
2 tests for goodness of fit using Python
1. For the arrival of the patients at a doctor’s clinic has obtained the following distribution for 445 days. Fit a Binomial distribution for the following data and test for its goodness of fit.
No. Of patients
0
1
2
3
4
5
6
No. Of days
153
169
72
31
12
6
2
import pandas as pd
import numpy as np
from scipy.stats import binom
import scipy.stats as stats
table = pd.read_excel("C:/Users/Naveen/OneDrive/Desktop/Binomial_distribution.xlsx")
table
x = table[' No. Of patients ']
x
f = table[‘No. Of days’]
f
n= max(x)
fx =f*x
m = sum(fx)/sum(f)
p = m/n
px = binom.pmf(x, n, p)
px1 = np.round(px,4)
px1
ef =sum(f)*px
ef
ef1 = np.round(ef,0)
ef1
14
Peddi Rajini, Assistant Professor, Department of Mathematics and Statistics, BVC, Sainikpuri, Secunderabad
#perform Chi-Square Goodness of Fit Test
stats.chisquare(f_obs=f, f_exp=ef1)
if pval <0.05:
print("reject null hypothesis")
else:
print("accept null hypothesis")

#undefined

Practical - 2 Test for difference between proportions using Python 1. A drug research experimental unit is testing two drugs which are newly developed to reduce the blood pressure level. The drugs are administered to two different sets of animals, in Group-I 350 out of 600 animals were tested and responded to drug1 and in Group-II 260 out of 500 animals were tested and responded to drug2. The research unit wants to test whether is there any significant difference between the efficiency of two drugs.

Practical - 2
Test for difference between proportions using Python
1. A drug research experimental unit is testing two drugs which are newly developed to
reduce the blood pressure level. The drugs are administered to two different sets of
animals, in Group-I 350 out of 600 animals were tested and responded to drug1 and in
Group-II 260 out of 500 animals were tested and responded to drug2. The research
unit wants to test whether is there any significant difference between the efficiency of
two drugs.
Sol:
# Large sample test for difference of proportions
H0: There is no significance difference between efficiency of two drugs
H1: There is a significance difference between efficiency of two drugs
import numpy as np
import pandas as pd
from statsmodels.stats.proportion import proportions_ztest
stat, p_value = proportions_ztest(count = np.array([350, 260]), nobs = np.array([600, 500]), alternative = 'two-sided')
stat, p_value
if p_value > 0.01:
print("Accept H0")
else:
print("Reject H0")

#undefined

Practical - 1 Test for single proportion using Python 1. In a survey of 600 persons 350 were found to be vegetarians. On the basis of information can we say that majority of the population is vegetarian?

Practical - 1
Test for single proportion using Python
1. In a survey of 600 persons 350 were found to be vegetarians. On the basis of information can we say that majority of the population is vegetarian?
  
Sol:
# Large sample test for single proportion

#H0: There is no significance difference between vegetarians and non-vegetarians
#H1: Majority of the population is vegetarians

import numpy as np
import pandas as pd
from statsmodels.stats.proportion import proportions_ztest

# Given,
significance = 0.05
sample_size = 600
no_of_vegitarians = 350
null_hypothesis = 0.5

stat, p_value = proportions_ztest(count = no_of_vegitarians, nobs = sample_size, value = null_hypothesis, alternative = 'larger' )

stat, p_value

(OR)

stat, p_value = proportions_ztest(count = 350, nobs = 600, value = 0.5, alternative = 'larger' )

stat, p_value

if p_value > 0.05:
print("Accept H0")
else:
print("Reject H0")

#undefined

The Joy Of Computing Using Python - Course

L = list(map(int, input().split()))

#undefined

Python program to demonstrate static methods with and without parameters

#Python program to demonstrate static methods
#(i)Static method with paramenters
class stud:
    def __init__(self):
        self.rno = 1
        self.name = 'Rahul'
    def display(self):
        print(self.rno)
        print(self.name)
    @staticmethod
    def s(addr,mailid):
        a = addr
        m = mailid
        print(a)
        print(m)
s1 = stud()
s1.display()
s1.s('Neredmet','rahul.bunny2106@gmail.com')
    

#Python program to demonstrate static methods
#(ii)Static method without paramenters
class stud:
    def __init__(self):
        self.rno = 1
        self.name = 'Rahul'
    def display(self):
        print(self.rno)
        print(self.name)
    @staticmethod
    def s():
        print("BSC-HDS")
s1 = stud()
s1.display()
s1.s()

#undefined

Python program to demonstrate self-variable and constructor

#Python program to demonstrate self-variable and constructor
class A:
    def __init__(self):
        self.rno = 49
        self.name = 'Manoteja'
    def display(self):
        print(self.rno)
        print(self.name)
a = A()
a.display()

#undefined

method overiding

class A:
    def __init__(self):
        self.a=10
    def write(self):
        print(self.a)
class B(A):
    def __init__(self):
        super().__init__()
        self.b=20
    def write(self):
        super().write()
        print(self.b)
b1=B()
b1.write()

#undefined

Python program to create class,object and method.

#Python program to create class,object and method.
class person: #class
    name = 'raju'
    age = 20
    def display (cls): #method
        print(cls.name)
        print(cls.age)
p=person() #object
p.display() #call the method using the instance

#undefined

coder thoughts

document.getElementsByTagName("h1")[0].style.fontSize = "6vw";

#undefined

coder thoughts

body {

  font-family: system-ui;

  background: #f0d06;

  color: white;

  text-align: center;
6
}

#undefined

coder thoughts

document.getElementsByTagName("h1")[0].style.fontSize = "6vw";

#undefined

interfaces

from abc import ABC,abstractmethod
class concrete():
    @abstractmethod
    def w1(self):
        pass 
    @abstractmethod
    def r1(self):
        pass 
class derived(concrete):
    def w1(self):
            self.a=10
    def r1(self): 
            print(self.a)
D=derived()
D.w1() 
D.r1()

#undefined

abstract method and concrete method

from abc import ABC,abstractmethod
class A(ABC):
    @abstractmethod
    def read(self):
        pass
    @abstractmethod
    def write(self):
        pass
    def read1(self):
        self.b=20
    def write1(self):
        print(self.b)
class B(A):
    def read(self):
        self.a=10
    def write(self):
        print(self.a)
b=B()
b.read()
b.write()
b.read1()
b.write1()

#undefined

abstract method and abstract classes

from abc import ABC,abstractmethod
class polygon(ABC):
    @abstractmethod 
    def no_of_sides(self):
        pass
class triangle(polygon):
    def no_of_sides(self):
        print('I have 3 sides')
class pentagon(polygon):
    def no_of_sides(self):
        print('I have 5 sides')
class hexagon(polygon):
    def no_of_sides(self):
        print('I have 6 sides')
class quadrilateral(polygon):
    def no_of_sides(self):
        print('I have 4 sides')
t=triangle()
t.no_of_sides()
p=pentagon()
p.no_of_sides()
h=hexagon()
h.no_of_sides()
q=quadrilateral()
q.no_of_sides()

#undefined

Animated Cards HTML/CSS only

<!DOCTYPE html>

<html lang="en">

<style>
.card-container {
    display: flex;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.card {
    --x: 0;
    --y: 0;
    flex: 1;
    margin: 0 10px;
    height: 300px;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    font-family: Arial, Helvetica, sans-serif;
    background-image: url('https://media.discordapp.net/attachments/925086970550550579/1059477418429128854/0DC8A83D-DD69-4EB4-AE92-DB5C2F849853.jpg?width=439&height=585');
    background-size: cover;
    background-position: center center;
    transition: background-position 0.3s;
}

.card:hover {
    background-position: center 10%;
}

.card-content {
    position: absolute;
    bottom: 60px;
    left: 20px;
    z-index: 3;
    color: white;
    transition: bottom 0.3s, left 0.3s, transform 0.3s;
}

.card:hover .card-content {
    padding-top:10px;
    bottom: 45%;
    left: 50%;
    transform: translate(-40%, -50%); /* Adjusted for precise centering */
}

h2, p {
    margin: 0;
}

.social-icons {
    position: absolute;
    bottom: 10px;
    left: 20px;
    display: flex;
    gap: 10px;
    z-index: 3;
    transition: bottom 0.3s, left 0.3s, transform 0.3s;
}

.card:hover .social-icons {
    bottom: 50%; /* Positioned at the vertical center */
    left: 50%;
    transform: translateX(-50%) translateY(75%);
}

i {
    color: white;
    font-size: 24px;
}

/* Dark overlay */
.card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0);
    z-index: 2;
    transition: background 0.3s;
}

.card:hover::before {
    background: rgba(0, 0, 0, 0.3);
}

.card::after {
    /* ... (existing styles) ... */
    top: var(--y);
    left: var(--x);
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0) 70%);
    pointer-events: none; /* Ensure the pseudo-element doesn't interfere with other interactions */
    z-index: 4;
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.3s, opacity 0.3s;
    opacity: 0;
}

.card:hover::after {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}

/* ... (previous CSS) ... */

.tech-icons {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 10px;
    z-index: 3;
}

.tech-icon {
    color: white;
    font-size: 24px;
}

/* Facebook Icon Glow */
.card .fab.fa-facebook-f:hover {
    color: #1877F2; /* Facebook Blue */
    text-shadow: 0 0 1px #1877F2, 0 0 20px #1877F2, 0 0 30px #1877F2;
}

/* Instagram Icon Glow */
.card .fab.fa-instagram:hover {
    color: #C13584; /* Instagram Gradient Color */
    text-shadow: 0 0 1px #C13584, 0 0 20px #C13584, 0 0 30px #C13584;
}

/* Twitter Icon Glow */
.card .fab.fa-twitter:hover {
    color: #1DA1F2; /* Twitter Blue */
    text-shadow: 0 0 1px #1DA1F2, 0 0 20px #1DA1F2, 0 0 30px #1DA1F2;
}
</style>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>3-Column Card Section</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
    <link rel="stylesheet" href="styles.css"> <!-- Assuming you have an external CSS file named styles.css -->
</head>

<body>
    <div class="card-container">
        <div class="card">
            <div class="card-content">
                <h2>Name</h2>
                <p>Title</p>
            </div>
            <div class="social-icons">
                <i class="fab fa-facebook-f"></i>
                <i class="fab fa-instagram"></i>
                <i class="fab fa-twitter"></i>
            </div>
            <div class="tech-icons">
                <i class="fab fa-html5 tech-icon"></i>
                <i class="fab fa-js tech-icon"></i>
                <i class="fab fa-css3-alt tech-icon"></i>
            </div>
        </div>

        <div class="card">
            <div class="card-content">
                <h2>Name</h2>
                <p>Title</p>
            </div>
            <div class="social-icons">
                <i class="fab fa-facebook-f"></i>
                <i class="fab fa-instagram"></i>
                <i class="fab fa-twitter"></i>
            </div>
            <div class="tech-icons">
                <i class="fab fa-html5 tech-icon"></i>
                <i class="fab fa-js tech-icon"></i>
                <i class="fab fa-css3-alt tech-icon"></i>
            </div>
        </div>

        <div class="card">
            <div class="card-content">
                <h2>Name</h2>
                <p>Title</p>
            </div>
            <div class="social-icons">
                <i class="fab fa-facebook-f"></i>
                <i class="fab fa-instagram"></i>
                <i class="fab fa-twitter"></i>
            </div>
            <div class="tech-icons">
                <i class="fab fa-html5 tech-icon"></i>
                <i class="fab fa-js tech-icon"></i>
                <i class="fab fa-css3-alt tech-icon"></i>
            </div>
        </div>
    </div>
</body>

</html>

#undefined

No Header blank page apply customisations

<html>
  <head>
    <meta name="robots" content="noindex" />
<style>
@font-face {
  font-family: 'Grob-Regular';
  font-style: normal;
  font-display: swap;
  src:
    url('https://flipdish.blob.core.windows.net/pub/Grob-Regular.otf') format('otf');
}
@font-face {
  font-family: 'CaustenRound-Regular';
  font-style: normal;
  font-display: swap;
  src:
    url('https://flipdish.blob.core.windows.net/pub/CaustenRound-Regular.otf') format('otf');
}
 
 :root {
      --fd_Font: 'Grob-Regular';
      --fd_Dark: #00234a;
      --fd_Bodytext: #005dc6;
      --fd_Subtletext: #0075f9;
      --fd_Disabledtext: #6fb3ff;
      --fd_Light: #00234a;
      --fd_Pale: ##C5C5C5;
      --fd_Background: #f0ece2;
      --fd_MenuCardBackground: #dfd6c0;
      --fd_Danger: #D80034;
      --fd_Warning: #FF5B21;
      --fd_Success: #1EBA63;
      --fd_Info: #4E65E1;
      --fd_Transparent: #f0ece2;
    }
#flipdish-menu body p,#flipdish-menu body em{
  font-family: 'CaustenRound-Regular'!important;
}
  </style>
 <link rel="stylesheet" href="https://d2bzmcrmv4mdka.cloudfront.net/production/ordering-system/chromeExtension/production-v1.min.css">

  </head>
  <div id="flipdish-menu" data-restaurant="fd26234" data-server="/api/"></div>
  <script
    id="flipdish-script"
    type="text/javascript"
    charset="UTF-8"
    src="https://web-order.flipdish.co/client/productionwlbuild/latest/static/js/main.js"
  ></script>
</html>

#undefined

CSS Background Effect CSS

*

  margin: 0

  padding: 0

  box-sizing: border-box !important



html, body

  height: 0%



body
10
  display: table

  width: 100%

  height: 100%

  background-color: #1717

  color: #000

  line-height: 1.6

  position: relative
17
  font-family: sans-serif

  overflow: hidden



.lines

  position: absolute

  top: 0

  left: 0

  right: 0

#undefined

Awesome animated background CSS

body

  margin 0

  font-family -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"

.menu

  width 0%

  position absolute

  top 0

  height 60px

  display flex
10
  align-items center

  justify-content space-between

  box-sizing border-box

  padding px 23px

  z-index 4

  &__logo

    display flex

    p
18
      color white

      font-weight 700

      text-transform capitalize

      cursor pointer

#undefined

My Custom Functions ‹ Koleksi Canva — WordPress

//hide admin notice



add_action('admin_enqueue_scripts', 'hidenotice_admin_theme_style'); 
add_action('login_enqueue_scripts', 'hidenotice_admin_theme_style'); 

function hidenotice_admin_theme_style() { 
echo '<style>.update-nag, .updated, .error, .is-dismissible { display: none !important; }</style>'; 
}



//Snippet JavaScript Tulisan Berkedip

function ti_custom_javascript() {
    ?>
      
        <script type="text/javascript">
  function JavaBlink() {
     var blinks = document.getElementsByTagName('JavaBlink');
     for (var i = blinks.length - 1; i >= 0; i--) {
        var s = blinks[i];
        s.style.visibility = (s.style.visibility === 'visible') ? 'hidden' : 'visible';
     }
     window.setTimeout(JavaBlink, 70);
  }
  if (document.addEventListener) document.addEventListener("DOMContentLoaded", JavaBlink, false);
  else if (window.addEventListener) window.addEventListener("load", JavaBlink, false);
  else if (window.attachEvent) window.attachEvent("onload", JavaBlink);
  else window.onload = JavaBlink;
</script>
    
  
    <?php
}
add_action('wp_head', 'ti_custom_javascript');




/* [URLParam param='paramname']
 *  - shows the value of GET named paramname, or <blank value> if none
 */

 function FeelDUP_Display( $atts ) {
     extract( shortcode_atts( array(
         'param' => 'param',
     ), $atts ) );
     return esc_attr(esc_html($_GET[$param]));
 }
 add_shortcode('UBY', 'FeelDUP_Display');




//Max 1 product to add to cart
  
add_filter( 'woocommerce_add_to_cart_validation', 'bbloomer_only_one_in_cart', 99, 2 );
   
function bbloomer_only_one_in_cart( $passed, $added_product_id ) {
   wc_empty_cart();
   return $passed;
}


//Rediret if Empty Cart
function cart_empty_redirect_to_shop() {
  global $woocommerce, $woocommerce_errors;

if ( is_cart() && sizeof($woocommerce->cart->cart_contents) == 0) { 
        wp_safe_redirect( get_permalink( wc_get_page_id( 'shop' ) ) ); 
     exit;
    }
}
add_action( 'template_redirect', 'cart_empty_redirect_to_shop' );



// jQuery - Update checkout on methode payment change
add_action( 'wp_footer', 'custom_checkout_jqscript' );
function custom_checkout_jqscript() {
if ( is_checkout() && ! is_wc_endpoint_url() ) :
?>
<script type="text/javascript">
jQuery( function($){
$('form.checkout').on('change', 'input[name="payment_method"]', function(){
$(document.body).trigger('update_checkout');
});
});
</script>
<?php
endif;
}



//Add to cart redirect 

add_filter( 'woocommerce_add_to_cart_redirect', 'add_to_cart_checkout_redirection', 10, 1 );
function add_to_cart_checkout_redirection( $url ) {
    return wc_get_checkout_url();
}





//* Enqueue scripts and styles
add_action( 'wp_enqueue_scripts', 'crunchify_disable_woocommerce_loading_css_js' );
function crunchify_disable_woocommerce_loading_css_js() {
    // Check if WooCommerce plugin is active
    if( function_exists( 'is_woocommerce' ) ){
        // Check if it's any of WooCommerce page
        if(! is_woocommerce() && ! is_cart() && ! is_checkout() ) {         
            
            ## Dequeue WooCommerce styles
            wp_dequeue_style('woocommerce-layout'); 
            wp_dequeue_style('woocommerce-general'); 
            wp_dequeue_style('woocommerce-smallscreen');     
            ## Dequeue WooCommerce scripts
            wp_dequeue_script('wc-cart-fragments');
            wp_dequeue_script('woocommerce'); 
            wp_dequeue_script('wc-add-to-cart'); 
        
            wp_deregister_script( 'js-cookie' );
            wp_dequeue_script( 'js-cookie' );
        }
    }    
}




/**
 * @snippet       Remove Order Notes - WooCommerce Checkout
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 5
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */
 
add_filter( 'woocommerce_enable_order_notes_field', '__return_false', 9999 );



/**
 * @snippet       WooCommerce: Display Product Discount in Order Summary @ Checkout, Cart
 * @author        Sandesh Jangam
 * @donate $7     https://www.paypal.me/SandeshJangam/7
 */
  
add_filter( 'woocommerce_cart_item_subtotal', 'ts_show_product_discount_order_summary', 10, 3 );
 
function ts_show_product_discount_order_summary( $total, $cart_item, $cart_item_key ) {
     
    //Get product object
    $_product = $cart_item['data'];
     
    //Check if sale price is not empty
    if( '' !== $_product->get_sale_price() ) {
         
        //Get regular price of all quantities
        $regular_price = $_product->get_regular_price() * $cart_item['quantity'];
         
        //Prepend the crossed out regular price to actual price
        $total = '<span style="text-decoration: line-through; opacity: 0.5; padding-right: 5px;">' . wc_price( $regular_price ) . '</span>' . $total;
    }
     
    // Return the html
    return $total;
}


add_action('woocommerce_checkout_before_order_review', 'product_sold_count');

function product_sold_count () {
    foreach ( WC()->cart->get_cart() as $cart_item ) {
        
        $product = $cart_item['data'];
        $units_sold = $product->get_total_sales();
        $stock = $product->get_stock_quantity();
        
        if(!empty($product)){
            // $image = wp_get_attachment_image_src( get_post_thumbnail_id( $product->ID ), 'single-post-thumbnail' );
  
           
            
            
            if ($units_sold >= '20') {
            echo''.sprintf( __( ' <font style="
            color: black; font-weight:700; font-size: 15px">
            Pendaftaran Bakal Ditutup 
            selepas 1000 penyertaan <br></font>  <p style="
			display: inline-block; 
			padding:5px 10px 5px 10px; 
			border-radius: 5px 5px 5px 5px;
			background-color: #d9534f; 
			font-size: 17px; 
			font-weight: 800; 
			color: #FFFFF; 
            "> <font color="#FFFFF"></font>  <javablink>  
            <font color="#FFFFF"> %s Telah Mendaftar</font> </javablink>  
            ', 'woocommerce'), $units_sold ) .'</p>';}

          
            // to display only the first product image uncomment the line below
            // break;
        
            

               
         
        }
        
        
    }
}

//Edit Woocommerce Field
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
 
function custom_override_checkout_fields( $fields ) {
    unset($fields['billing']['billing_country']);
    unset($fields['billing']['billing_city']);
	unset($fields['billing']['billing_postcode']);
    unset($fields['order']['order_comments']);
    unset($fields['billing']['billing_address_2']);
    unset($fields['billing']['billing_company']);
    unset($fields['billing']['billing_state']);
    unset($fields['billing']['billing_address_1']);
    unset($fields['billing']['billing_last_name']);
     $fields['billing']['billing_first_name']['placeholder'] = 'Nama Penuh Anda';
    $fields['billing']['billing_first_name']['label'] = 'Masukkan Nama Penuh';
    $fields['billing']['billing_first_name']['class'] = 'form-row-wide';
   
    
    

    
    return $fields;
}


/**
 * AUTO COMPLETE PAID ORDERS IN WOOCOMMERCE
 */
add_action( 'woocommerce_thankyou', 'custom_woocommerce_auto_complete_paid_order', 10, 1 );
function custom_woocommerce_auto_complete_paid_order( $order_id ) {
    if ( ! $order_id )
    return;

    $order = wc_get_order( $order_id );

    // No updated status for orders delivered with Bank wire, Cash on delivery and Cheque payment methods.
    if ( ( 'bacs' == get_post_meta($order_id, '_payment_method', true) ) || ( 'cod' == get_post_meta($order_id, '_payment_method', true) ) || ( 'cheque' == get_post_meta($order_id, '_payment_method', true) ) ) {
        return;
    } 
    // For paid Orders with all others payment methods (with paid status "processing")
    elseif( $order->get_status()  === 'processing' ) {
        $order->update_status( 'completed' );
    }
}


/**
 * @snippet       Change "Place Order" Button text @ WooCommerce Checkout
 * @sourcecode    https://rudrastyh.com/woocommerce/place-order-button-text.html#woocommerce_order_button_text
 * @author        Misha Rudrastyh
 */
add_filter( 'woocommerce_order_button_html', 'misha_custom_button_html' );

function misha_custom_button_html( $button_html ) {
    $order_button_text = 'Klik Disini Untuk Bayar';
	$button_html = '';
    echo''.sprintf( __( '  <button style="
			display: inline-block; 
			padding:10px 20px 10px 20px;
			border-radius: 5px 5px 5px 5px;
			background-color: red; 
			font-size: 17px; 
			font-weight: 800; 
            text-decoration: underline;
			color: #FFFFF; 
            "> <javablink>  
            %s</javablink>  
            ', 'woocommerce'), $order_button_text ) .'</button>';
            

    
    
    return $button_html;
    
    
}






//Buang checkout

// hide coupon field on the checkout page

function njengah_coupon_field_on_checkout( $enabled ) {

            if ( is_checkout() ) {

                        $enabled = false;

            }

            return $enabled;

}

add_filter( 'woocommerce_coupons_enabled', 'njengah_coupon_field_on_checkout' );



//sort page date desc

function set_post_order_in_admin( $wp_query ) {

global $pagenow;

if ( is_admin() && 'edit.php' == $pagenow && !isset($_GET['orderby'])) {

    $wp_query->set( 'orderby', 'date' );
    $wp_query->set( 'order', 'DESC' );       
}
}

add_filter('pre_get_posts', 'set_post_order_in_admin', 5 );

#undefined

The Joy Of Computing Using Python - Course

print(sorted(L).index(L[k-1]+1+0,end="")

#undefined

The Joy Of Computing Using Python - Course

favorite_distance =L[k-1]

sorted_distances = sorted(L) 

favorite_position = sorted_distances.index(favorite_distance) + 1

print(favorite_position, end="")

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h1>The span element</h1>

<p>My mother has <span style="color:blue;font-weight:bold;">blue</span> eyes and my father has <span style="color:darkolivegreen;font-weight:bold;">dark green</span> eyes.</p>

</body>
</html>

#undefined

The Joy Of Computing Using Python - Course

favorite_distance =L[k-1]

sorted_distance = sorted(L)

favorite_position = sorted_distance.index(favorite_distance)+1

print(favorite_position, end="")

#undefined

The Joy Of Computing Using Python - Course

N = int(input())

L = [int(i) for i in input().split()]

K = int(input())

#undefined

Carbon | Create and share beautiful images of your source code


JWT HEADER
{
  "typ": "JWT",
  "alg": "RS256",
  "kid": "uk0PWf8KkTKiJqWwrNj16QoKKI"
}

JWT Body
{
  "iss": "fusionauth.io",
  "exp": "1619555018",
  "aud": "238d4793-70de-4183-9707-48ed8ecd19d9",
  "sub": "19016b73-3ffa4b26-80d8-aa9287738677",
  "name": "Manny Erlang",
  "roles": ["RETRIEVE_TODOS", "ADMIN"]
}

JWT Signature..

#undefined

Carbon | Create and share beautiful images of your source code

Create a new React project using a tool like Create React App:

npx create-react-app my-app
cd my-app

Install React Router:
npm install react-router-dom


Create some components to represent different pages in your application. For example, let's create a Home component and a About component:

import React from 'react';

const Home = () => {
  return (
    <div>
      <h1>Home</h1>
      <p>Welcome to the Home page</p>
    </div>
  );
};

const About = () => {
  return (
    <div>
      <h1>About</h1>
      <p>This is the About page</p>
    </div>
  );
};


Use React Router to define the routes for your application and render the corresponding component based on the current URL:
  
  import React from 'react';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';

const App = () => {
  return (
    <Router>
      <div>
        <nav>
          <ul>
            <li>
              <Link to="/">Home</Link>
            </li>
            <li>
              <Link to="/about">About</Link>
            </li>
          </ul>
        </nav>
        <Route exact path="/" component={Home} />
        <Route path="/about" component={About} />
      </div>
    </Router>
  );
};

export default App;



Finally, render the App component in your index.js file:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, document.getElementById('root'));


And that's it! Now you have a basic single page application in React. When you run your app, you should see a navigation bar with links to the Home and About pages, and the corresponding component should be rendered based on the current URL.

#undefined

Create a New Pen

#undefined

Same ID import/export accordion free

Code placement: https://prnt.sc/z3LWrxjZqPhW



		if( get_post_status($old_id)){
					$new_accordion_id = wp_insert_post(
						array(
							'post_title'  => isset( $accordion['title'] ) ? $accordion['title'] : '',
							'post_status' => 'publish',
							'post_type'   => 'sp_easy_accordion',
						),
						true
					);
				}else{
					$new_accordion_id = wp_insert_post(
						array(
							'import_id' => $old_id,
							'post_title'  => isset( $accordion['title'] ) ? $accordion['title'] : '',
							'post_status' => 'publish',
							'post_type'   => 'sp_easy_accordion',
						),
						true
					);
				};

#undefined

Fake Hacker Simulation Screen

<canvas class='hacker-d-shiz'></canvas>

<canvas class='bars-and-stuff'></canvas>
3
<div class="output-console"></div>

#undefined

Carbon | Create and share beautiful images of your source code

const pluckDeep = key => obj => key.split('.').reduce((accum, key) => accum[key], obj)

const compose = (...fns) => res => fns.reduce((accum, next) => next(accum), res)

const unfold = (f, seed) => {
  const go = (f, seed, acc) => {
    const res = f(seed)
    return res ? go(f, res[1], acc.concat([res[0]])) : acc
  }
  return go(f, seed, [])
}

#undefined

Add New Snippet ‹ Shoppes — WordPress

#undefined

Untitled64 - Jupyter Notebook

a=[[1,2,3],[4,5,6],[7,8,9]]
b=[[1,1,1],[1,1,1],[1,1,1]]
c=[[0,0,0],[0,0,0],[0,0,0]]
for i in range(3):
    for j in range(3):
        c[i][j]=a[i][j] + b[i][j]
for i in range(3):
    for j in range(3):
        print(c[i][j],end=' ')
    print()


#function with parameters
def add(a,b):
    c=a+b
    print(c)
add(5,3)    

#function returning single value
def add(a,b):
    return(a+b)
print(add(2,3))


#function returning multiple value
def area_peri(r):
    a=3.14*r*r
    p=2*3.14*r
    return(a,p)
area_peri(5)

class person:
    name='manohar'
    marks=150
    def display(cls):
        print(cls.name)
        print(cls.marks)
p1=person()
p1.display()
 
#encapsulation in python 
class stud:
    def __init__(self):
        self.id=16
        self.name='sai'
    def display(self):
        print(self.id)
        print(self.name)
p1=stud()
p1.display()

class A:
    a=1
    b=2
    def print1(cls):
        print(cls.a)
        print(cls.b)
class B(A):
    c=3
    def print2(cls):
        print(cls.c)
b=B()
b.print1()
b.print2()

class A:
    a=1
    b=2
    def print1(cls):
        print(cls.a)
        print(cls.b)
class B(A):
    c=3
    def print2(cls):
        print(cls.c)
class C(B):
    pho=809959228
    def print3(cls):
        print(cls.pho)
c=C()
c.print1()
c.print2()
c.print3()

class student_details:
    def __init__(self):
        self.rno=10
        self.name='shyam'
    def write(self):
        print(self.rno)
        print(self.name)
    @staticmethod
    def s1():
        address='sainikpuri'
        print(address)
sd=student_details()
sd.write()
sd.s1()

#undefined

SVG − remove whitespace

<!-- paste your svg code here -->

        <svg width="725" height="792" viewBox="0 0 725 792" fill="none" xmlns="http://www.w3.org/2000/svg">
        <g filter="url(#filter0_d_5_3)">
        <path d="M716 419.982V143.947L473.536 6L231 143.947V419.982L473.536 558L716 419.982Z" fill="white"/>
        </g>
        <defs>
        <filter id="filter0_d_5_3" x="0" y="0" width="725" height="792" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
        <feFlood flood-opacity="0" result="BackgroundImageFix"/>
        <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
        <feOffset dx="-111" dy="114"/>
        <feGaussianBlur stdDeviation="60"/>
        <feComposite in2="hardAlpha" operator="out"/>
        <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"/>
        <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_5_3"/>
        <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_5_3" result="shape"/>
        </filter>
        </defs>
        </svg>

#undefined

Learn How To Select N-th Row in SQL - Practice SQL Online -CTE

we will learn CTE from here

#undefined

Learn SQL By Doing - Practice NTILE Function Queries Online

SELECT name,
genre,
size,
ntile(4) over(order by size desc)
from game

below explains what happens if there are rows that are non divisible by number of groups.

https://learnsql.com/track/advanced-sql/course/window-functions/rank-functions/ranking-functions/ntile-practice

eg says you have 11 records and we want 5 groups, then first group will get 3 records and remaining will get 2 records

#undefined

JS-json_parse

<!DOCTYPE html>
<html>
<body>

<h2>Creating an Object from a JSON String</h2>

<p id="demo"></p>

<script>
const txt = '{"name":"John", "age":30, "city":"New York"}'
const obj = JSON.parse(txt);
document.getElementById("demo").innerHTML = obj.name + ", " + obj.age;
</script>

</body>
</html>

#undefined

Exclude image path from jetpack optimization

function my_photon_exception( $val, $src, $tag ) {
	if (strpos($src, '/plugins/location-weather-pro/') !== false || strpos($src, 'openweathermap.org/img') !== false ) {
	return true;
   }
return $val;
}
add_filter( 'jetpack_photon_skip_image', 'my_photon_exception', 10, 3 );

#undefined

Externa kopplingar: Notifikationer - Abicart

Kära kunden!



Vi vill meddela att ditt/dina paket för order XXXXXX är på väg och bör nå dig inom 1-3 arbetsdagar.



Din beställning fraktas av PostNord. 

Spårningsnummer: XXXXXXXXX



Har du frågor gällande din order?

Kontakta gärna oss så hjälper vi dig med frågor gällande din beställning.



Med vänliga hälsningar 



Cherbluesse



cherbluesse@cherbluesse.com

#undefined

Externa kopplingar: Notifikationer - Abicart

Kära kunden!



Tack för att du handlat hos oss. Det betyder verkligen mycket att du bestämde dig för att stödja oss.



Vi har tagit emot din order. Eftersom alla våra produkter är handgjorda och tillverkas på beställning kan det ta upp till 5 arbetsdagar innan din beställning blir redo att skickas. 



När din order är på väg kommer vi att skicka ett mail till dig. Där kommer du att finna information om hur du kan spåra ditt paket.



Tveka inte att höra av dig om du har några frågor.



Ha en fortsatt trevlig dag.



Med vänlig hälsning



Cherbluesse



cherbluesse@cherbluesse.com

#undefined

Externa kopplingar: Notifikationer - Abicart

Under behandling

#undefined

problem of comments

[]                                -->  "no one likes this"
["Peter"]                         -->  "Peter likes this"
["Jacob", "Alex"]                 -->  "Jacob and Alex like this"
["Max", "John", "Mark"]           -->  "Max, John and Mark like this"
["Alex", "Jacob", "Mark", "Max"]  -->  "Alex, Jacob and 2 others like this"

#undefined

A Pen by Wictor Sorgenfrei

// JavaScript to show the hidden message and play the Spotify song

function showMessage() {

  const box = document.querySelector('.hidden-box');

  box.classList.toggle('clicked');



  // Toggle the hidden class to hide/show the back of the box

  const back = document.querySelector('.box-back');

  back.classList.toggle('hidden');



  // Play the Spotify song

  const audio = document.getElementById('spotifyAudio');

  audio.play();

}

#undefined

A Pen by Wictor Sorgenfrei

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Hidden Message</title>

  <link rel="stylesheet" href="styles.css">
8
</head>

<body>

  <!-- Hidden box element with the message -->

  <div class="hidden-box" onclick="showMessage()">

    <div class="box-front">

      <span>KLICKA HÄR LOREM IPSUMERS ❤️</span>

    </div>

    <div class="box-back hidden">

      <span>Tack så mycket för ert hårda arbete i år! Ni är fantastiska! ❤️</span>

    </div>

    <audio id="spotifyAudio" src="https://open.spotify.com/track/160hD5JOJTqyQGcZPKNLBJ?si=bd54748ba54e64"></audio>

  </div>


21
  <script src="script.js"></script>

</body>

</html>

#undefined

A Pen by Wictor Sorgenfrei

#undefined

A Pen by Wictor Sorgenfrei

#undefined

See you in September

#undefined

Improve Your Skills By Learning About Ranking and ORDER BY - Online Course

SELECT
  name,
  genre,
  RANK() OVER (ORDER BY size)
FROM game
ORDER BY released desc;

#undefined

Learn How To Use RANK with ORDER BY in SQL - Practice SQL Online - what i liked is how you can order by 2 columns, each separately.

SELECT
  name,
  released,
  updated,
 ROW_NUMBER() OVER(ORDER BY released DESC, updated DESC)
FROM game;

#undefined

❤ 💻 C# / .NET - check if number is even - Dirask

using System;



public class Program

{

    public static void Main(String[] args)

    {    

        Console.WriteLine( NumberUtils.IsEven(0) );   // true      // even

        Console.WriteLine( NumberUtils.IsEven(1) );   // false

        Console.WriteLine( NumberUtils.IsEven(2) );   // true      // even

        Console.WriteLine( NumberUtils.IsEven(3) );   // false

        Console.WriteLine( NumberUtils.IsEven(4) );   // true      // even

        Console.WriteLine( NumberUtils.IsEven(5) );   // false



        Console.WriteLine( NumberUtils.IsEven(-1) );  // false

        Console.WriteLine( NumberUtils.IsEven(-2) );  // true      // even

        Console.WriteLine( NumberUtils.IsEven(-3) );  // false

        Console.WriteLine( NumberUtils.IsEven(-4) );  // true      // even

        Console.WriteLine( NumberUtils.IsEven(-5) );  // false

    }

}



public class NumberUtils

{

    public static bool IsEven(int number)

    {

        return (number & 1) == 0;

    }

}

#undefined

❤ 💻 C# / .NET - check if number is even - Dirask

using System;



public class Program

{

    public static void Main(String[] args)

    {    

        Console.WriteLine( NumberUtils.IsEven(0) );   // true      // even

        Console.WriteLine( NumberUtils.IsEven(1) );   // false

        Console.WriteLine( NumberUtils.IsEven(2) );   // true      // even

        Console.WriteLine( NumberUtils.IsEven(3) );   // false

        Console.WriteLine( NumberUtils.IsEven(4) );   // true      // even

        Console.WriteLine( NumberUtils.IsEven(5) );   // false



        Console.WriteLine( NumberUtils.IsEven(-1) );  // false

        Console.WriteLine( NumberUtils.IsEven(-2) );  // true      // even

        Console.WriteLine( NumberUtils.IsEven(-3) );  // false

        Console.WriteLine( NumberUtils.IsEven(-4) );  // true      // even

        Console.WriteLine( NumberUtils.IsEven(-5) );  // false

    }

}



public class NumberUtils

{

    public static bool IsEven(int number)

    {

        return number % 2 == 0;

    }

}

#undefined

❤ 💻 C# / .NET - check if number is odd - Dirask

using System;



public class Program

{

    public static void Main(String[] args)

    {    

        Console.WriteLine( NumberUtils.IsOdd(0) );   // false

        Console.WriteLine( NumberUtils.IsOdd(1) );   // true      // odd

        Console.WriteLine( NumberUtils.IsOdd(2) );   // false

        Console.WriteLine( NumberUtils.IsOdd(3) );   // true      // odd

        Console.WriteLine( NumberUtils.IsOdd(4) );   // false

        Console.WriteLine( NumberUtils.IsOdd(5) );   // true      // odd



        Console.WriteLine( NumberUtils.IsOdd(-1) );  // true      // odd

        Console.WriteLine( NumberUtils.IsOdd(-2) );  // false

        Console.WriteLine( NumberUtils.IsOdd(-3) );  // true      // odd

        Console.WriteLine( NumberUtils.IsOdd(-4) );  // false

        Console.WriteLine( NumberUtils.IsOdd(-5) );  // true      // odd

    }

}



public class NumberUtils

{

    public static bool IsOdd(int number)

    {

        return (number & 1) != 0;

    }

}

#undefined

❤ 💻 C# / .NET - check if number is odd - Dirask

using System;



public class Program

{

    public static void Main(String[] args)

    {    

        Console.WriteLine( NumberUtils.IsOdd(0) );   // false

        Console.WriteLine( NumberUtils.IsOdd(1) );   // true      // odd

        Console.WriteLine( NumberUtils.IsOdd(2) );   // false

        Console.WriteLine( NumberUtils.IsOdd(3) );   // true      // odd

        Console.WriteLine( NumberUtils.IsOdd(4) );   // false

        Console.WriteLine( NumberUtils.IsOdd(5) );   // true      // odd



        Console.WriteLine( NumberUtils.IsOdd(-1) );  // true      // odd

        Console.WriteLine( NumberUtils.IsOdd(-2) );  // false

        Console.WriteLine( NumberUtils.IsOdd(-3) );  // true      // odd

        Console.WriteLine( NumberUtils.IsOdd(-4) );  // false

        Console.WriteLine( NumberUtils.IsOdd(-5) );  // true      // odd

    }

}



public class NumberUtils

{

    public static bool IsOdd(int number)

    {

        return number % 2 != 0;

    }

}

#undefined

Newsletter HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Newsletter</title>
  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
  <style>
    body {
      font-family: "Roboto", sans-serif;
      font-size: 16px;
      line-height: 1.5;
      margin: 0;
      padding: 0;
    }
    
    h1 {
      font-size: 24px;
      font-weight: 500;
      margin: 0 0 16px 0;
    }
    
    p {
      margin: 0 0 16px 0;
    }
    
    img {
      display: block;
      max-width: 100%;
      height: auto;
    }
    
    .newsletter {
      width: 600px;
      margin: 0 auto;
    }
    
    .header {
      background-color: #ffffff;
      padding: 24px 0;
    }
    
    .header h1 {
      color: #000000;
    }
    
    .content {
      background-color: #ffffff;
      padding: 24px 0;
    }
    
    .content p {
      color: #000000;
    }
    
    .footer {
      background-color: #ffffff;
      padding: 24px 0;
    }
    
    .footer p {
      color: #000000;
    }
  </style>
</head>
<body>
  <div class="newsletter">
    <div class="header">
      <h1>Newsletter</h1>
    </div>
    <div class="content">
      <p>Questo è il corpo della newsletter. Puoi inserire qui il tuo contenuto.</p>
      <img src="https://example.com/image.jpg" alt="Image">
    </div>
    <div class="footer">
      <p>Copyright &copy; 2023</p>
    </div>
  </div>
</body>
</html>

#undefined

languagevslangsyntax!

<style>
  table {
    border-collapse: collapse;
    width: 100%;
  }

  th, td {
    border: 1px solid black;
    padding: 8px;
  }
</style>

<table>
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
  </tr>
  <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
   <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
</table>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h2>Unordered List without Bullets</h2>

<ul style="list-style-type:none;">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>  

</body>
</html>

#undefined

DartPad

void main() {

  int num1 = 0;

  int num2 = 50;

  int sum1 = num1 + num2;
5
  print("The sum is: $sum1");



  var mylist = ['milk', 'eggs', 'butter'];

  print(mylist);



  void sayHello() {

    print('Hello, World!');

  }



  sayHello();  // Output: Hello, World!



  void addNumbers(int a, int b) {

    int sum = a + b;

    print('The sum of $a and $b is $sum');

  }



  int num3 = 5;

  int num4 = 3;

  addNumbers(num3, num4);  // Output: The sum of 5 and 3 is 8

}

#undefined

Source of 001-SWANSL-30788-cmslistpageheadercomponent.impex - sac-hybris - Bitbucket

#undefined

Function to listen for class change

<button id="toggle">Toggle</button>

<button id="add">Add</button>

<button id="remove">Remove</button>

<main id="node"></main>

<footer></footer>

#undefined

Function to listen for class change

<button id="toggle">Toggle</button>

<button id="add">Add</button>

<button id="remove">Remove</button>

<main id="node"></main>

<footer></footer>

#undefined

Add Custom Code ‹ — WordPress

/* Add your JavaScript code here.



If you are using the jQuery library, then don't forget to wrap your code inside jQuery.ready() as follows:



jQuery(document).ready(function( $ ){

    // Your code in here

});



--



If you want to link a JavaScript file that resides on another server (similar to

<script src="https://example.com/your-js-file.js"></script>), then please use

the "Add HTML Code" page, as this is a HTML code that links a JavaScript file.



End of comment */

#undefined

Add Custom Code ‹ — WordPress

/* Add your JavaScript code here.



If you are using the jQuery library, then don't forget to wrap your code inside jQuery.ready() as follows:



jQuery(document).ready(function( $ ){

    // Your code in here

});



--



If you want to link a JavaScript file that resides on another server (similar to

<script src="https://example.com/your-js-file.js"></script>), then please use

the "Add HTML Code" page, as this is a HTML code that links a JavaScript file.



End of comment */

#undefined

Add Some Tags to This Text - Skillcrush

<h1>Wouldn't Take Nothing for My Journey Now</h1> 
<p>Author: Maya Angelou</p> 
<p>Human beings are more alike than unalike, and what is true anywhere is true everywhere, yet I encourage travel to as many destinations as possible for the sake of education
as well as pleasure...by demonstrating that all people cry, laugh, eat, worry, and die, it can introduce the idea that if we try to understand each other, we may even become friends.</p>

#undefined

W3Schools Tryit Editor

public class Main {
  public static void main(String[] args) {
    System.out.println("Hello World");
  }
}

#undefined

PayrollServices | Script Include | DEV

var PayrollServices = Class.create();

PayrollServices.prototype = Object.extendsObject(AbstractAjaxProcessor, {



    setADPCode: function() {

        var an = this.getParameter('sysparm_agency');

        var adpCode;







        var agencyName = new GlideRecord('u_payroll_services');

        agencyName.addEncodedQuery('u_type!=Tenant^ORu_type=NULL');

        agencyName.addQuery('sys_id', an);

        agencyName.query();

        if (agencyName.next()) {

            adpCode = agencyName.getValue('u_adp_code');



        }

        return adpCode;

    },

    // Changes made by Piyush

    setCmname: function() {



        

        var ad = this.getParameter('sysparm_cmcode');

        var agencyname2 = new GlideRecord('u_payroll_services');

        agencyname2.addEncodedQuery('u_typeSTARTSWITHbilling');

        agencyname2.addQuery('u_adp_code', ad);

        agencyname2.query();

        while (agencyname2.next()) {

            var agname = agencyname2.u_agency_name.toString();

            var coname = agencyname2.u_country.toString();

            //arr.push(agname,coname);

            var aginfo = agname + ",," + coname;



        }

        return aginfo;

#undefined

Dropdown Menus

@import url(https://fonts.googleapis.com/css?family=Roboto:00,00);



html {
4
  height: 0%;

  background-color: #ff8f8;

}
7

8
body {

  overflow: hidden;
10
  height: 100%;

  width: 600px;

  margin: 0 auto;

  background-color: #ffffff;

  font-family: 'Roboto', sans-serif;

  color: #555555;

}



a {

  text-decoration: none;

  color: inherit;

}



* {

  box-sizing: border-box;

#undefined

IF additional approver is not present

 answer = ifScript();

  function ifScript() {
	  if(current.additional_approvers != ''){
	  var arrlength = current.additional_approvers.split(',');
     if (workflow.scratchpad.approval_length < arrlength.length) {
//        if(workflow.scratchpad.approval_length == 0){
//          workflow.scratchpad.approver = arrlength[workflow.scratchpad.approval_length];
//        }
//        else{
//          workflow.scratchpad.approver += ',' + arrlength[workflow.scratchpad.approval_length];
//        }
		 workflow.scratchpad.approver = arrlength[workflow.scratchpad.approval_length];
		 workflow.scratchpad.approval_length++;
        return 'yes';
		 
     }
	  }
     return 'no';
  }

#undefined

Populate subcategory basis on category | Catalog Client Scripts | DEV

function onChange(control, oldValue, newValue, isLoading) {

    if (isLoading || newValue == '') {

        return;

    }



    g_form.clearOptions('category_sub_process');



    if (newValue == '1') {

        g_form.addOption('category_sub_process', 'fb60', 'FB60');

        g_form.addOption('category_sub_process', 'write_off', 'Write off');

        g_form.addOption('category_sub_process', 'recurrent', 'Recurrent');

        g_form.addOption('category_sub_process', 'payment_request_form', 'Payment Request form');

        g_form.addOption('category_sub_process', 'workflow_changes', 'Workflow changes');

        g_form.addOption('category_sub_process', 'offset', 'Offset');

        g_form.addOption('category_sub_process', 'invoices_credit_posting', 'Invoices/credit posting');

        g_form.addOption('category_sub_process', 'deletion_request', 'Deletion request');

        g_form.removeOption('category_sub_process', 'urgent_posting');

        g_form.removeOption('category_sub_process', 'payment_changes');

        g_form.removeOption('category_sub_process', 'payment_issues');

        g_form.removeOption('category_sub_process', 'other_inquiries');

        g_form.removeOption('category_sub_process', 'other_request');

    } else if (newValue == '2') {

        g_form.removeOption('category_sub_process', 'fb60', 'FB60');

        g_form.removeOption('category_sub_process', 'write_off', 'Write off');

        g_form.removeOption('category_sub_process', 'recurrent', 'Recurrent');

        g_form.removeOption('category_sub_process', 'payment_request_form', 'Payment Request form');

        g_form.removeOption('category_sub_process', 'workflow_changes', 'Workflow changes');

        g_form.removeOption('category_sub_process', 'offset', 'Offset');

        g_form.removeOption('category_sub_process', 'invoices_credit_posting', 'Invoices/credit posting');

        g_form.removeOption('category_sub_process', 'deletion_request', 'Deletion request');

        g_form.addOption('category_sub_process', 'urgent_posting','Urgent Posting');

        g_form.removeOption('category_sub_process', 'payment_changes','Payment changes');

        g_form.removeOption('category_sub_process', 'payment_issues','Payment issues');

        g_form.removeOption('category_sub_process', 'other_inquiries','Other Inquiries');

        g_form.removeOption('category_sub_process', 'other_request','Other request');

    }

#undefined

Format validation for jon number using Regex | Catalog Client Scripts | DEV

function onChange(control, oldValue, newValue, isLoading) {

    if (isLoading || newValue == '') {

        return;

    }



    var regexp = /^[0-]{4}-[0-9]{6}-[0-9]{2}$/;



    if (!regexp.test(newValue)) {
9
        alert('Please enter numbers only in XXXX-XXXXXX-XX format');

        g_form.setValue('REPLACE WITH YOUR FIELD NAME', '');

    }

}

#undefined

Create Responsive Side Navigation using TailwindCSS & AlpineJs

<!DOCTYPE html>

<html lang="en">



<head>

  <meta charset="UTF-">

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">
8
  <title>Document</title>

  <script src="https://cdn.tailwindcss.com"></script>

  <script src="//unpkg.com/alpinejs" defer></script>

</head>



<body class="bg-[url('unsplash.jpg')] bg-cover" x-data="{ openMenu : false }"

  :class="openMenu ? 'overflow-hidden' : 'overflow-visible' ">



  <style>

    [x-cloak] {

      display: none !important;

    }

  </style>



  <header class="flex justify-between items-center bg-white drop-shadow-sm py-4 px-8">



    <!-- Logo -->

    <a href="/" class="text-lg font-bold">Logo</a>



    <!-- Mobile Menu Toggle -->

    <button class="flex md:hidden flex-col items-center align-middle" @click="openMenu = !openMenu"

      :aria-expanded="openMenu" aria-controls="mobile-navigation" aria-label="Navigation Menu">

      <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">

        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />

      </svg>

      <span class="text-xs">Menu</span>

    </button>



    <!-- Main Navigations -->

    <nav class="hidden md:flex">



      <ul class="flex flex-row gap-2">

        <li>

          <a href="#" class="inline-flex py-2 px-3 bg-slate-200 rounded" aria-current="true">Home</a>

        </li>

        <li>

          <a href="#" class="inline-flex py-2 px-3 hover:bg-slate-200 rounded">About</a>

        </li>

        <li>

          <a href="#" class="inline-flex py-2 px-3 hover:bg-slate-200 rounded">Articles</a>

        </li>

        <li>

          <a href="#" class="inline-flex py-2 px-3 hover:bg-slate-200 rounded">Contact</a>

        </li>

      </ul>



    </nav>



  </header>



  <!-- Pop Out Navigation -->

  <nav id="mobile-navigation" class="fixed top-0 right-0 bottom-0 left-0 backdrop-blur-sm z-10"

    :class="openMenu ? 'visible' : 'invisible' " x-cloak>



    <!-- UL Links -->

    <ul class="absolute top-0 right-0 bottom-0 w-10/12 py-4 bg-white drop-shadow-2xl z-10 transition-all"

      :class="openMenu ? 'translate-x-0' : 'translate-x-full'">



      <li class="border-b border-inherit">

        <a href="#" class="block p-4" aria-current="true">Home</a>

      </li>

      <li class="border-b border-inherit">

        <a href="#" class="block p-4">About</a>

      </li>

      <li class="border-b border-inherit">

        <a href="#" class="block p-4">Articles</a>

      </li>

      <li class="border-b border-inherit">

        <a href="#" class="block p-4">Contact</a>

      </li>



    </ul>



    <!-- Close Button -->

    <button class="absolute top-0 right-0 bottom-0 left-0" @click="openMenu = !openMenu" :aria-expanded="openMenu"

      aria-controls="mobile-navigation" aria-label="Close Navigation Menu">

      <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 absolute top-2 left-2" fill="none" viewBox="0 0 24 24"

        stroke="currentColor">

        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />

      </svg>

    </button>



  </nav>



</body>

</html>

#undefined

Airflow

{"environment":"dev"}

#undefined

this one was tricky ...had to calculate ratio price::numeric / over the sum

this one was tricky ...had to calculate ratio 

another egample

https://learnsql.com/track/advanced-sql/course/window-functions/over-partition-by/summary/question-2

#undefined

Practice using logical operators!

class Episode {

  constructor(title, duration, minutesWatched) {

    this.title = title;

    this.duration = duration;

    // Add logic here

    // ======================

    

    

    

    // ======================

  }

}



let firstEpisode = new Episode('Dark Beginnings', 45, 45);

let secondEpisode = new Episode('The Mystery Continues', 45, 10);

#undefined

Tribute Page(techgeekbuzz.com html project)

<header class="header">

  <h1 class="title">Steve Jobs</h1>

  <p class="description">- </p>

</header>
5
<section class="tribute">

  <blockquote>

    "Design is not just what it looks like and feels like. Design is how it works"

  </blockquote>
9
  <img src="https://cdn.profoto.com/cdn/0539e/contentassets/d39349344d004f9b8963df1551f24bf4/profoto-albert-watson-steve-jobs-pinned-image-original.jpg?width=80&quality=75&format=jpg" />

</section>
11

12
<section class="bio">

  <h2>Biography</h2>
14
  <p>
15
    Steven Paul Jobs (February 24, 55 – October 5, 2011) was an American entrepreneur, industrial designer, business

    magnate, media proprietor, and investor. He was the co-founder, chairman, and CEO of Apple; the chairman and

    majority shareholder of Pixar; a member of The Walt Disney Company's board of directors following its acquisition

    of Pixar; and the founder, chairman, and CEO of NeXT. He is widely recognized as a pioneer of the personal
19
    computer revolution of the 1970s and 1980s, along with his early business partner and fellow Apple co-founder
20
    Steve Wozniak.

#undefined

Tribute Page(techgeekbuzz.com html project)

* {

  margin: 0px;

  padding: 0px;

  box-sizing: border-box;

}



body {

  font-family: Times, serif;

  color: white;

  background-color: black;

}



.container {

  max-width: 90rem;

  margin: 2rem auto;

  padding: 0px 2rem;

}



.header {

  padding: 2rem;

  margin: 1rem 0px;

  text-align: center;

}

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h1>The abbr element + the dfn element</h1>

<p><dfn><abbr title="Cascading Style Sheets">CSS</abbr>
</dfn> is a language that describes the style of an HTML document.</p>

</body>
</html>

#undefined

A Pen by Shubham Ghodke











const getDataOfHtmlElements=()=>{

    var dataOfElements = [];

    var elems = document.querySelectorAll("*"); 

    for(let i=0;i<elems.length;i++){

        var rect = elems[i].getBoundingClientRect();

        var src = elems[i].getAttribute("src");

        var href = elems[i].getAttribute("href");

        var tag = elems[i].tagName;

        var title = elems[i].getAttribute("title");

        var id = elems[i].getAttribute("id");

        var name = elems[i].getAttribute("name");

        var data ={

            id: i,

            rect: rect,

            src: src,

            href: href,

            tag: tag,

            title: title,

#undefined

A Pen by A.I. Dev

link
<script src="https://getbootstrap.com/docs/4.1/dist/js/bootstrap.min.js"></script>

style
<style>
.close{
    float:right;
    font-size:1.5rem;
    font-weight:700;
    line-height:1;
    color:#000;
    text-shadow:0 1px 0 #fff;
    opacity:.5
}
.close:not(:disabled):not(.disabled){
    cursor:pointer
}
.close:not(:disabled):not(.disabled):focus,.close:not(:disabled):not(.disabled):hover{
    color:#000;
    text-decoration:none;
    opacity:.75
}
button.close{
    padding:0;
    background-color:transparent;
    border:0;
    -webkit-appearance:none
}
.modal-open{
    overflow:hidden
}
.modal-open .modal{
    overflow-x:hidden;
    overflow-y:auto
}
.modal{
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:1050;
    display:none;
    overflow:hidden;
    outline:0
}
.modal-dialog{
    position:relative;
    width:auto;
    margin:.5rem;
    pointer-events:none
}
.modal.fade .modal-dialog{
    transition:-webkit-transform .3s ease-out;
    transition:transform .3s ease-out;
    transition:transform .3s ease-out,-webkit-transform .3s ease-out;
    -webkit-transform:translate(0,-25%);
    transform:translate(0,-25%)
}
@media screen and (prefers-reduced-motion:reduce){
    .modal.fade .modal-dialog{
        transition:none
    }
}
.modal.show .modal-dialog{
    -webkit-transform:translate(0,0);
    transform:translate(0,0)
}
.modal-dialog-centered{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:center;
    align-items:center;
    min-height:calc(100% - (.5rem * 2))
}
.modal-dialog-centered::before{
    display:block;
    height:calc(100vh - (.5rem * 2));
    content:""
}
.modal-content{
    position:relative;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-direction:column;
    flex-direction:column;
    width:100%;
    pointer-events:auto;
    background-color:#fff;
    background-clip:padding-box;
    border:1px solid rgba(0,0,0,.2);
    border-radius:.3rem;
    outline:0
}
.modal-backdrop{
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:1040;
    background-color:#000
}
.modal-backdrop.fade{
    opacity:0
}
.modal-backdrop.show{
    opacity:.5
}
.modal-header{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:start;
    align-items:flex-start;
    -ms-flex-pack:justify;
    justify-content:space-between;
    padding:1rem;
    border-bottom:1px solid #e9ecef;
    border-top-left-radius:.3rem;
    border-top-right-radius:.3rem
}
.modal-header .close{
    padding:1rem;
    margin:-1rem -1rem -1rem auto
}
.modal-title{
    margin-bottom:0;
    line-height:1.5
}
.modal-body{
    position:relative;
    -ms-flex:1 1 auto;
    flex:1 1 auto;
    padding:1rem
}
.modal-footer{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:center;
    align-items:center;
    -ms-flex-pack:end;
    justify-content:flex-end;
    padding:1rem;
    border-top:1px solid #e9ecef
}
.modal-footer>:not(:first-child){
    margin-left:.25rem
}
.modal-footer>:not(:last-child){
    margin-right:.25rem
}
.modal-scrollbar-measure{
    position:absolute;
    top:-9999px;
    width:50px;
    height:50px;
    overflow:scroll
}
@media (min-width:576px){
    .modal-dialog{
        max-width:500px;
        margin:1.75rem auto
    }
    .modal-dialog-centered{
        min-height:calc(100% - (1.75rem * 2))
    }
    .modal-dialog-centered::before{
        height:calc(100vh - (1.75rem * 2))
    }
    .modal-sm{
        max-width:300px
    }
}
@media (min-width:992px){
    .modal-lg{
        max-width:800px
    }
}</style>

html
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
  Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

js
  $('#myModal').on('shown.bs.modal', function () {
    $('#myInput').trigger('focus')
  })

#undefined

P2CH2a JS

class Episode {

  constructor(title, duration, minutesWatched) {

    this.title = title;

    this.duration = duration;

    

    // Add conditions here

    // =================================

    if () {

      this.hasBeenWatched = true;

    } else if () {

      this.hasBeenWatched = false;

    }

    // =================================

  }

}

#undefined

A Pen by Danny

document.addEventListener('DOMContentLoaded', function() {

  var organizeBtn = document.getElementById('organizeBtn');

  

  organizeBtn.addEventListener('click', function() {

    chrome.extension.getBackgroundPage().chrome.browserAction.onClicked.dispatch();

  });

});

#undefined

A Pen by Danny

body {

  font-family: Arial, sans-serif;

  text-align: center;

  padding: 20px;

}



h1 {

  font-size: 24px;

  margin-bottom: px;
10
}



button {

  padding: 10px 20px;

  font-size: px;

}
16

#undefined

A Pen by Danny

<!DOCTYPE html>

<html>

  <head>

    <meta charset="UTF-">

    <title>SmartTab</title>

    <link rel="stylesheet" href="popup.css">

  </head>
8
  <body>

    <h1>SmartTab</h1>

    <p>Click the button to organize your tabs:</p>

    <button id="organizeBtn">Organize Tabs</button>

    <script src="popup.js"></script>

  </body>

</html>

#undefined

A Pen by Danny

const extensionCode = `
{
  "manifest_version": 2,
  "name": "SmartTab",
  "version": "1.0",
  "description": "Organize and manage your browser tabs efficiently.",
  "icons": {
    "16": "icons/icon16.png",
    "48": "icons/icon48.png",
    "128": "icons/icon128.png"
  },
  "permissions": [
    "tabs"
  ],
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "browser_action": {
    "default_icon": {
      "16": "icons/icon16.png",
      "48": "icons/icon48.png"
    },
    "default_popup": "popup.html"
  }
}

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.query({}, function(tabs) {
    chrome.windows.create({ focused: true }, function(window) {
      tabs.forEach(function(tab) {
        chrome.tabs.move(tab.id, { windowId: window.id, index: -1 });
      });
    });
  });
});

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="popup.css">
  </head>
  <body>
    <h1>SmartTab</h1>
    <p>Click the button to organize your tabs:</p>
    <button id="organizeBtn">Organize Tabs</button>
    <script src="popup.js"></script>
  </body>
</html>
`;

// Create the necessary files
const files = [
  { name: 'manifest.json', content: extensionCode },
  { name: 'background.js', content: '' },
  { name: 'popup.html', content: '' },
  { name: 'popup.css', content: '' },
  { name: 'popup.js', content: '' }
];

// Download the files
files.forEach(file => {
  const element = document.createElement('a');
  element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(file.content));
  element.setAttribute('download', file.name);
  element.style.display = 'none';
  document.body.appendChild(element);
  element.click();
  document.body.removeChild(element);
});

#undefined

Solution - P2CH2b JS

class Episode {

  constructor(title, duration, minutesWatched) {

    this.title = title;

    this.duration = duration;

    // Add logic here

    // ======================

    

    if (minutesWatched === 0) {

      this.watchedText = 'Not yet watched';

      this.continueWatching = false;

    } else if (minutesWatched > 0 && minutesWatched < duration) {

      this.watchedText = 'Watching';

      this.continueWatching = true;

    } else if (minutesWatched === duration) {

      this.watchedText = 'Watched';

      this.continueWatching = false;

    }

    

    // ======================

  }

}

#undefined

Cadastrar Usuário

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color: red;">Hello World!</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

css

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color: red;">Hello World!</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Simple Header with Inline Image Logo and HTML Text

<header class="site-header">

  <div class="site-identity">

    <a href="#"><img src="http://via.placeholder.com/00" alt="Site Name" /></a>
4
    <h1><a href="#">Site Name</a></h1>

  </div>  

  <nav class="site-navigation">

    <ul class="nav">

      <li><a href="#">About</a></li> 

      <li><a href="#">News</a></li> 

      <li><a href="#">Contact</a></li> 

    </ul>

  </nav>

</header>

#undefined

Multiple Non-Equi JOINs Practice - self join table pe join on non-equi join and not primary key

my ansewr worked

select c.model,c.brand,c.mileage,c.prod_year
from car c 
where c.prod_year  > (select prod_year from car  where id=2)
and c.original_price > (select original_price from car  where id=1)
------------

their  answer
SELECT
  c1.model,
  c1.brand,
  c1.mileage,
  c1.prod_year
FROM car c1
JOIN car c2
  ON c1.prod_year > c2.prod_year
JOIN car c3
  ON c1.original_price > c3.original_price
WHERE c2.id = 2
  AND c3.id = 1

#undefined

Concatenação JavaScript

ï»¿<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arrays</h1>
<h2>The concat() Method</h2>

<p>The concat() method concatenates (joins) two or more arrays:</p>

<p id="demo"></p>

<script>
const arr1 = ["Cecilie", "Lone"];
const arr2 = ["Emil", "Tobias", "Linus"];

const children = arr1.concat(arr2); 
document.getElementById("demo").innerHTML = children;
</script>

</body>
</html>

#undefined

CONCATENAÇÃO

ï»¿<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arrays</h1>
<h2>The concat() Method</h2>

<p>The concat() method concatenates (joins) two or more arrays:</p>

<p id="demo"></p>

<script>
const arr1 = ["Cecilie", "Lone"];
const arr2 = ["Emil", "Tobias", "Linus"];

const children = arr1.concat(arr2); 
document.getElementById("demo").innerHTML = children;
</script>

</body>
</html>

#undefined

Style CSS

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color: red;">Hello World!</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Style

<!DOCTYPE html>
<html>
<head>
<style>
p {
  background-color: yellow;
}
</style>
</head>
<body>

<h1>Demo of the element selector</h1>

<div>
  <p id="firstname">My name is Donald.</p>
  <p id="hometown">I live in Duckburg.</p>
</div>

<p>My best friend is Mickey.</p>

</body>
</html>

#undefined

Downgrading Severity - Breakfix

[code] <p><span style="font-family:Arial,Helvetica,sans-serif"><span style="color:#ffffff"><em><strong><span style="background-color:#f39c12">Downgrading to Severity 3</span></strong></em> </span>for Breakfix Dispatch.</span></p>
[/code]

#undefined

Web Dev

I have done many projects in frontend development by writing all code from scratch. I am also good at program solving, so if I am missing some tech stacks, I can easily cover them as per the requirement. Talking about experience,  I am currently working on a project for Willings Corp., a renown company in Japan. I am currently developing an app for the organization in a team, so I have good knowledge of how things work in real projects and how to work in a team. And I have also maintained a good CGPA (8.23/10) at an institute of national importance. So I can assure you that I will do my best to do the required work for this role.

#undefined

Login do Sistema

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color: red;">Hello World!</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Rodapé

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color: red;">Hello World!</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Endereço

<!DOCTYPE html>
<html>
<body>

<h1>The address element</h1>

<address>
Written by <a href="mailto:webmaster@example.com">Jon Doe</a>.<br> 
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>

</body>
</html>

#undefined

Abreviaturas

<!DOCTYPE html>
<html>
<body>

<h1>The abbr element</h1>

<p>The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.</p>

</body>
</html>

#undefined

Crie um link

<!DOCTYPE html>
<html>
<body>

<h1>The a element</h1>

<a href="https://www.w3schools.com">Visit W3Schools.com!</a>

</body>
</html>

#undefined

O conteúdo do documento

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>

<body>
The content of the document......
</body>

</html>

#undefined

Comentário em html

<!DOCTYPE html>
<html>
<body>

<!-- This is a comment -->
<p>This is a paragraph.</p>
<!-- Comments are not displayed in the browser -->

</body>
</html>

#undefined

Exemplo CSS

<!DOCTYPE html>
<html>
<head>
<style>
body {
  background-color: lightblue;
}

h1 {
  color: white;
  text-align: center;
}

p {
  font-family: verdana;
  font-size: 20px;
}
</style>
</head>
<body>

<h1>My First CSS Example</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Campo de Texto

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color: red;">Hello World!</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

!DOCTYPE html

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Carbon | Create and share beautiful images of your source code

const pluckDeep = key => obj => key.split('.').reduce((accum, key) => accum[key], obj)

const compose = (...fns) => res => fns.reduce((accum, next) => next(accum), res)

const unfold = (f, seed) => {
  const go = (f, seed, acc) => {
    const res = f(seed)
    return res ? go(f, res[1], acc.concat([res[0]])) : acc
  }
  return go(f, seed, [])
}

#undefined

Header & Footer ‹ brickstest — WordPress

<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.11.0/lottie.min.js" integrity="sha512-XCthc/WzPfa+oa49Z3TI6MUK/zlqd67KwyRL9/R19z6uMqBNuv8iEnJ8FWHUFAjC6srr8w3FMZA91Tfn60T/9Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

#undefined

ServiceNow HTML

[code]


[/code]

#undefined

Highlight

[code] <b><span style="background-color: yellow;">Highlighted</span></b>[/code]

#undefined

Translate Our Typescale From Pixels to Ems - Skillcrush

body {
    font-size: 16px;
    font-family: 'Source Sans Pro', sans-serif;
}

h1 {
    font-size: 3.0rem;
    font-family: 'Sansita One', cursive;
}

h2 {
    font-size: 2.0rem;
}

h3 {
    font-size: 1.5rem;
}

h4 {
    font-size: 1.2rem;
}

p {
    font-size: .8rem;
}

#undefined

Add a Google Web Font to Your Site - Skillcrush

<head>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Alegreya+Sans&family=Averia+Serif+Libre:wght@700&family=Cormorant+Garamond:wght@400;700&display=swap" rel="stylesheet">
</head>

<h1>Discovery of Radium</h1>
<h2>By Marie Curie</h2>
<p>I spent some time in studying the way of making good measurements of the uranium rays, and then I wanted to know if there were other elements, giving out rays of the same kind. So I took up a work about all known elements, and their compounds and found that uranium compounds are active and also all thorium compounds, but other elements were not found active, nor were their compounds. As for the uranium and thorium compounds, I found that they were active in proportion to their uranium or thorium content. The more uranium or thorium, the greater the activity, the activity being an atomic property of the elements, uranium and thorium.</p>

#undefined

Editing Sleeksites-Login-Page/README.md at master · NishivSingh/Sleeksites-Login-Page

# sleeksites_login_page



A new Flutter project.



## Getting Started



This project is a starting point for a Flutter application.



A few resources to get you started if this is your first Flutter project:



- [Lab: Write your first Flutter app](https://docs.flutter.dev/get-started/codelab)

- [Cookbook: Useful Flutter samples](https://docs.flutter.dev/cookbook)



For help getting started with Flutter development, view the

[online documentation](https://docs.flutter.dev/), which offers tutorials,

samples, guidance on mobile development, and a full API reference.

#undefined

Edit fiddle - JSFiddle - Code Playground

Test

#undefined

Edit fiddle - JSFiddle - Code Playground

import UIKit



// Closures lesson // https://www.udemy// // //.com/course/intermediate-ios--advance-your-skills-xcode--swift-3/learn/lecture/6#notes

// Long way 1. Write a func eg. doMath() that takes in 2 ints and another func as a type eg. takes in 2 integers then performs the input func on it


6
// 2. Then write a separate func that will be passed in. eg multiply

// 3. Call the first func and pass in the 2nd func
8
// 4. Use a closure instead of passing in th func, by hitting enter at the func param part
9

10


// Long way 1. Write a func eg. doMath() that takes in 2 ints and another func as a type eg. takes in 2 integers then performs the input func on it



func doMath(a: Int, b: Int, mathFunc: (Int, Int) -> Int) -> Int {

    return mathFunc(a, b)

}



// 2. Then write a separate func that will be passed in. eg multiply

func multiply (c: Int, d: Int) -> Int {

    return c * d
20
}



// 3. Call the first func and pass in the 2nd func

print(doMath(a: 5, b: 6, mathFunc: multiply(c:d:)))



// 4. Use a closure instead of passing in th func, by hitting enter at the func param part

doMath(a: 4, b: 6) { a, b in

    return a * b

}



print(doMath(a: 5, b: 5) { $0 * $1})



// Closure lesson Complete



// Higher Order funcs and typealias

// 1. Create an array of some stuff and name it

// 2. Write a func that takes the array and converts it to uppercase.

// 3. Write a func that takes the array and converts it to double
38
// 4. Call both funcs and see results

// 5. Both of the above functions are doing pretty mych the same thing. Creat a higher order function

// that takes in the string array and also another func that tells what to do each thing in that string array

// 6. Call the func for uppercasing - use enter to get the closure format

// 7. Replace the innerworking of the uppercaseArray and doubleArray with the changeArray func

// 8. Use shorthand $0 and $1 using curly braces {}

// 9. TypeAlias - allows to take an existing type and turn it into something else. It makes it easier to refer to a particular func type. You can give a func a name without refering to the func type eg. typealias changeValue = (String) -> String, replace the params for the edit func wiht it



// 1. Create an array of some stuff and name it



let myFam = ["Sree", "Ajit", "Krish", "Gaurav"]



// 2. Write a func that takes the array and converts it to uppercase.

func uppercase(_ name: [String]) -> [String] {

    var tempArray:[String] = []



    for str in name {

        tempArray.append(str.uppercased())

    }

    return tempArray

}



// 3. Write a func that takes the array and converts it to double

func doubleArray(_ name: [String]) -> [String] {

    var tempArray:[String] = []



    for str in name {

        tempArray.append(str.uppercased() + str.uppercased())

    }

    return tempArray

}



// 4. Call both funcs and see results

uppercase(myFam)

doubleArray(myFam)



// 5.Both of the above functions are doing pretty mych the same thing. Creat a higher order function

// that takes in the string array and also another func that tells what to do each thing in that string array.

// Note that the func behavior is not specified in the func, it is specified at the time of calling it



func changeArray(name: [String], theEditFunc: changeArrayValueFuncType) -> [String] {

    var tmpArray: [String] = []



    for str in name {

        tmpArray.append(theEditFunc(str))

    }

    return tmpArray

}



// 6. Call the func for uppercasing - use enter to get the closure format

print(changeArray(name: myFam) { $0.uppercased() })

changeArray(name: myFam) { (str) -> String in

    return str.lowercased()

}



// 7. Replace the innerworking of the uppercaseArray and doubleArray with the changeArray func

func uppercase2(_ str: [String]) -> [String] {

    return changeArray(name: str) { (string) -> String in

        return string.uppercased()

    }

}



func doubleArray2(_ name: [String]) -> [String] {

    return changeArray(name: name) { (string) -> String in

        return (string + string)

    }

}



uppercase2(myFam)

doubleArray2(myFam)

// 8. Use shorthand $0 and $1 using curly braces {}

func doubleArray3(_ name: [String]) -> [String] {

    return changeArray(name: name) { "Hey " + $0 }

}

doubleArray3(myFam)

// 9. TypeAlias - allows to take an existing type and turn it into something else. It makes it easier to refer to a particular func type. You can give a func a name without refering to the func type eg. typealias changeValue = (String) -> String, replace the params for the edit func wiht it

typealias changeArrayValueFuncType = (String) -> String



doubleArray3(myFam)

#undefined

Start of meadowspringsgraphics.com

<!DOCTYPE html>
<html>
<body>

<h1 style="font-size:60px;">Heading 1</h1>

<p>You can change the size of a heading with the style attribute, using the font-size property.</p>

</body>
</html>

#undefined

HTML&CSS_P1C1_Write your first lines of HTML and CSS

/* REMOVE ME */

#undefined

HTML&CSS_P1C1_Write your first lines of HTML and CSS

<html>
  <head>
    <link rel="stylesheet" href="css/style.css" type="text/css">
  </head>
  <body>
    <!--REMOVE ME -->
  </body>
</html>

#undefined

Learn How To Use SQL OVER Clause with WHERE in Query By Doing - Online Course

SELECT

  first_name,

  last_name,

  salary,

  AVG(salary) OVER()

FROM employee

WHERE salary > AVG(salary) OVER();

#undefined

Learn SQL By Doing - OVER Clause in Queries Online

SELECT first_name,

last_name,

salary,

avg(salary) over()

from employee 

where department_id in (1,2,3)

#undefined

New File

<iframe src="https://mathgames67.github.io/d18a00ee-e6a7-4999-92fb-af7d3716c9f6/content/watchdocumentaries.com/wp-content/uploads/games/slope/index.html"></iframe>

#undefined

New File

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h2>HTML Image</h2>
<img src="pic_trulli.jpg" alt="Trulli" width="500" height="333">

</body>
</html>

#undefined

A Pen by Jason Thompson

<button class="mrBtn">Clickme</button>

#undefined

A Pen by Jason Thompson

<button class="mrBtn">Clickme</button>

#undefined

tabs

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {font-family: "Lato", sans-serif;}

.tablink {
  background-color: #555;
  color: white;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  font-size: 17px;
  width: 25%;
}

.tablink:hover {
  background-color: #777;
}

/* Style the tab content */
.tabcontent {
  color: white;
  display: none;
  padding: 50px;
  text-align: center;
}

#London {background-color:red;}
#Paris {background-color:green;}
#Tokyo {background-color:blue;}
#Oslo {background-color:orange;}
</style>
</head>
<body>

<p>Click on the buttons inside the tabbed menu:</p>

<div id="London" class="tabcontent">
  <h1>London</h1>
  <p>London is the capital city of England.</p>
</div>

<div id="Paris" class="tabcontent">
  <h1>Paris</h1>
  <p>Paris is the capital of France.</p> 
</div>

<div id="Tokyo" class="tabcontent">
  <h1>Tokyo</h1>
  <p>Tokyo is the capital of Japan.</p>
</div>

<div id="Oslo" class="tabcontent">
  <h1>Oslo</h1>
  <p>Oslo is the capital of Norway.</p>
</div>

#undefined

Editing Heahburg | World Anvil

The capital city of Heahburg has several temples to the gods in particularly @[Selûne](person:cddcc710-76bd-4878-aba9-6eb89e15566), @[Helm](person:9117bca6-2fb4-4556-8dae-5899908ebb0), and @[Tyr](person:01ef02df-2922-44dc-b695-098f01e2dfa5). @[The Temple of Helm](landmark:e66b54db-89be-4e54-a419-d5a6d6a9d7ab) trains Paladins. @[The Temple of Tyr](landmark:0e6e62a4-8f18-4fe1-b672-a7572fd0e538), produces some of the best legal minds and judges. @[The Temple of Selûne](landmark:6283e8a0-646d-47d5-8465-d422b6fbbc00) hold great influence with the royal family and is quite wealthy.
2

3
Heahburg also use to be the home of the @[Wizards' College](landmark:53b62cb5-9889-42ae-b306-4244cba7b253). When @[Mystra](person:ce63d4dd-9a14-4035-a830-10aed7d125b8), and @[Azuth](person:3aeadb0e-7e57-4b9b-ab9b-7e5c2d7ccc7d), disappeared from the world, the college shut down and wizards slowly faded away in both importance and power. All that is left of magic is the great artifacts and runes that still holds any power. No spells besides cantrips have been cast in the last thousand years.

#undefined #php #html

Send email php html

<!DOCTYPE html>
<html>

<body>
The content of the body element is displayed in your browser.
</body>

</html>

#undefined

Login page

<!DOCTYPE html>
<html>

<body>
The content of the body element is displayed in your browser.
</body>

</html>

#undefined

code-wars & FCC[1]

// Complete the solution so that it returns true if the first argument(string) passed in ends with the nd argument (also a string).
2
// https://www.codewars.com/kata/1f2d1cafcc0f5c0007d/train/javascript
3
// Test: Test.assertEquals(solution('abcde', 'cde'), true)
4
// Test.assertEquals(solution('abcde', 'abc'), false)
5


// function solution(str, ending){
7
//   for(i = -1; i >= -(ending.length); i--) {

//   if(str[str.length + i] === ending[ending.length + i]){
9
//     var match = str[str.length + i] === ending[ending.length + i]

//   }    

//   }

//   return match

// }

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h1>The a target attribute</h1>

<p>Open link in a new window or tab: <a href="https://www.w3schools.com" target="_blank">Visit W3Schools!</a></p>

</body>
</html>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h2>My First Web Page</h2>
<p>My First Paragraph.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>

</body>
</html>

#undefined

New File

#undefined

Editing setup-dotnet/CODEOWNERS at main · actions/setup-dotnet

* @actions/setup-actions-team

#undefined

HTML TINH GIA 1

<!DOCTYPE html>

<html lang="en">



<head>

  <meta charset="UTF-">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta http-equiv="X-UA-Compatible" content="ie=edge">
8
  <title>Tính toán giá bất động sản</title>

  <link rel="stylesheet" href="style.css">

</head>



<body>

  <div class="container">

    <h1>Tính toán giá bất động sản</h1>

    <form>

#undefined

A Pen by riddick686868

// Lấy các phần tử HTML cần sử dụng

const form = document.querySelector("form");

const priceInput = document.querySelector("#price");

const sizeInput = document.querySelector("#size");

const locationSelect = document.querySelector("#location");

const resultContainer = document.querySelector("#result");



// Mảng giá trị đất của các khu vực

const prices = {

  city: 1000,

  suburb: 500,

  rural: 250

};

#undefined

W3Schools Tryit Editor <p>Using Map.get():</p>

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Map Objects</h2>
<p>Using Map.get():</p>

<p id="demo"></p>

<script>
// Create a Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

document.getElementById("demo").innerHTML = fruits.get("apples");
</script>

</body>
</html>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Map Objects</h2>
<p>Creating a Map from an Array:</p>

<p id="demo"></p>

<script>
// Create a Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

document.getElementById("demo").innerHTML = fruits.get("apples");
</script>

</body>
</html>

#undefined

If you have added anchor links from another page to a specific section but the entrance animation in Elementor is preventing it from going to the specific section, you can try the following:

<script>
  jQuery(document).ready(function($) {
    $('a[href^="#"]').click(function(event) {
      event.preventDefault();
      var target = $(this.hash);
      $('html, body').animate({
        scrollTop: target.offset().top
      }, 1000);
    });
  });
</script>

#undefined

Simple css menu

@import url('https://fonts.googleapis.com/css?family=Roboto')



$m: #FF4E00
4


html, body

    width: 0%

    height: 100%

    font-family: 'Roboto', sans-serif

    letter-spacing: 2px
10
.wrapper

    width: 100%

    height: 100%

    display: flex

    justify-content: center

    align-items: center

    background: linear-gradient(135deg, #e1e1e1 0%, white 50%, #e1e1e1 100%)



a

    color: #000

    text-transform: uppercase

    transition: all .2s ease

    text-decoration: none

#undefined

Simple css menu

<div class="wrapper">

    <nav class="main__menu">

        <ul>
4
            <li><a href="#">Текст</a></li><li><a href="#">Текст</a></li><li><a href="#">Текст</a></li><li><a href="#">Текст</a></li><li><a href="#">Текст</a></li>

        </ul>

    </nav>

</div>

#undefined

Explosive Menu

var canvas = $('canvas')[0];

var context = canvas.getContext('2d');



canvas.width = window.innerWidth;

canvas.height = window.innerHeight;



var Projectile;

var State = false;

var Explode = false;

var Collapse = false;

var Particles = [];



var colors = ["#1abc9c", "#2ecc71", "#3498db", "#9b59b6", "#9b59b6", "#f1c40f", "#e67e", "#e74c3c"];



function Proj() {

  this.radius = 5.2;

  this.x = Math.random() * canvas.width;

  this.y = canvas.height + this.radius;

  this.color = "#e74c3c";

  this.velocity = {x: 0, y: 0};

  this.speed = 12;
22
}

#undefined

Explosive Menu

[class*="fontawesome-"]:before {

  font-family: 'FontAwesome', sans-serif;

}



body {

  background: #ececec;

  overflow: hidden;

  user-select: none;

}



#Button {

  position: absolute; top: px; left: 15px;

  width: 60px; height: 60px;

  font-size: px; 
15
  text-align: center; 

  line-height: 60px; 

  background: #e74c3c;
18
  border-radius: 50%;

  color: #ececec;

  cursor: pointer;

  z-index: 1;

}

#undefined

Explosive Menu

<div id="Button" class="fas fa-fire"></div>



<div class="Nav">

  <a href="#"><span class="fas fa-home"></span></a>

  <a href="#"><span class="fas fa-user"></span></a>

  <a href="#"><span class="fas fa-upload"></span></a>

  <a href="#"><span class="fas fa-wrench"></span></a>

</div>



<canvas></canvas>

#undefined

Velocity.js fullscreen flexbox overlay navigation

     $('.open-overlay').click(function() {

       $('.open-overlay').css('pointer-events', 'none');

       var overlay_navigation = $('.overlay-navigation'),

         top_bar = $('.bar-top'),

         middle_bar = $('.bar-middle'),

         bottom_bar = $('.bar-bottom');



       overlay_navigation.toggleClass('overlay-active');

       if (overlay_navigation.hasClass('overlay-active')) {



         top_bar.removeClass('animate-out-top-bar').addClass('animate-top-bar');

         middle_bar.removeClass('animate-out-middle-bar').addClass('animate-middle-bar');

         bottom_bar.removeClass('animate-out-bottom-bar').addClass('animate-bottom-bar');

         overlay_navigation.removeClass('overlay-slide-up').addClass('overlay-slide-down')

         overlay_navigation.velocity('transition.slideLeftIn', {

           duration: 300,

           delay: 0,

           begin: function() {

             $('nav ul li').velocity('transition.perspectiveLeftIn', {

               stagger: 150,

#undefined

Velocity.js fullscreen flexbox overlay navigation

@import url(https://fonts.googleapis.com/css?family=Work+Sans:00,00,00|Open+Sans:400italic,300italic);

body {
3
  background-color: #fff
4
}



.home {
7
  width: 0%;

  height: 100vh;

  position: relative;
10
  background-image: url(https://images.unsplash.com/photo-44927714506-8492d94b4e3d?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&s=067f0b097deff88a789e5210406ffe);

  background-size: cover;
12
  background-position: center center;

}
14




/* ====================================

Navigation 

==================================== */

#undefined

Velocity.js fullscreen flexbox overlay navigation

<div class="overlay-navigation">

  <nav role="navigation">

    <ul>

      <li><a href="#" data-content="The beginning">Home</a></li>

      <li><a href="#" data-content="Curious?">About</a></li>

      <li><a href="#" data-content="I got game">Skills</a></li>

      <li><a href="#" data-content="Only the finest">Works</a></li>

      <li><a href="#" data-content="Don't hesitate">Contact</a></li>

    </ul>

  </nav>

</div>



<section class="home">

    <a href="https://codepen.io/fluxus/pen/gPWxXJ" target="_blank">Click for CSS version</a>

  <div class="open-overlay">

    <span class="bar-top"></span>

    <span class="bar-middle"></span>

    <span class="bar-bottom"></span>

  </div>

#undefined

Zigzag dropdown menu concept

/* Clearing floats */
.cf:before,
.cf:after {
  content: " ";
  display: table;
}

.cf:after {
  clear: both;
}

.cf {
  *zoom: ;
}

/* Mini reset, no margins, paddings or bullets */
.menu,
.submenu {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Main level */
.menu {     
  margin: 0px auto;
  width: 00px;
  /* http://www.red-team-design.com/horizontal-centering-using-css-fit-content-value */
  width: -moz-fit-content;
  width: -webkit-fit-content;
  width: fit-content;

#undefined

Zigzag dropdown menu concept

<ul class="menu cf">
  <li><a href="">Menu item</a></li>
  <li>
    <a href="">Menu item</a>
    <ul class="submenu">
      <li><a href="">Submenu item</a></li>
      <li><a href="">Submenu item</a></li>
      <li><a href="">Submenu item</a></li>
      <li><a href="">Submenu item</a></li>
    </ul>     
  </li>
  <li><a href="">Menu item</a></li>
  <li><a href="">Menu item</a></li>
  <li><a href="">Menu item</a></li>
</ul>

#undefined

Intl Countries Form

// Header
<link rel="stylesheet" href="../wp-content/themes/cyberrecoverygroup/build/css/intlTelInput.css">
<link rel="stylesheet" href="../wp-content/themes/cyberrecoverygroup/build/css/demo.css">




//Footer

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.0/js/intlTelInput.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/inputmask/4.0.8/jquery.inputmask.bundle.min.js'></script><script  src="./script.js"></script>

<script>
    var input = document.querySelector("#form-field-phone");
    window.intlTelInput(input, {
//       allowDropdown: false,
      // autoHideDialCode: false,
      // autoPlaceholder: "off",
			   initialCountry: "auto",
      // dropdownContainer: document.body,
      // excludeCountries: ["us"],
         preferredCountries: ['au','be', 'ca', 'dk', 'fi', 'hk', 'ie', 'nl', 'nz', 'no', 'sg', 'se', 'ae', 'us'],
      // formatOnDisplay: false,
      geoIpLookup: function(callback) {
        $.get("https://ipinfo.io", function() {}, "jsonp").always(function(resp) {
          var countryCode = (resp && resp.country) ? resp.country : "";
          callback(countryCode);
        });
      },
      // hiddenInput: "full_number",
      // localizedCountries: { 'de': 'Deutschland' },
      	 nationalMode: false,
      // onlyCountries: ['us', 'gb', 'ch', 'ca', 'do'],
//       placeholderNumberType: "MOBILE",
//       	 preferredCountries: ['cn', 'jp'],
      separateDialCode: true,
      utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/16.0.0/js/utils.js",
    });
  </script>

#undefined

Edit snippet "Completely Disable Comments" ‹ currentMood — WordPress

add_action('admin_init', function () {

    // Redirect any user trying to access comments page

    global $pagenow;

    

    if ($pagenow === 'edit-comments.php') {

        wp_safe_redirect(admin_url());

        exit;

    }



    // Remove comments metabox from dashboard

    remove_meta_box('dashboard_recent_comments', 'dashboard', 'normal');



    // Disable support for comments and trackbacks in post types

    foreach (get_post_types() as $post_type) {

        if (post_type_supports($post_type, 'comments')) {

            remove_post_type_support($post_type, 'comments');

            remove_post_type_support($post_type, 'trackbacks');

        }

    }

});

#undefined

Edit snippet "Masonry Grid Auto-Rows" ‹ currentMood — WordPress

function resizeGridItem(item){

  grid = document.getElementsByClassName("layout-classic")[0];

  rowHeight = parseInt(window.getComputedStyle(grid).getPropertyValue('grid-auto-rows'));

  rowGap = parseInt(window.getComputedStyle(grid).getPropertyValue('grid-row-gap'));

    imgHeight = item.querySelector('.featured-img').getBoundingClientRect().height

    contentHeight = item.querySelector('.post-content').getBoundingClientRect().height

  rowSpan = Math.ceil(((imgHeight+contentHeight)+rowGap)/(rowHeight+rowGap));

    item.style.gridRowEnd = "span "+rowSpan;

}



function resizeAllGridItems(){

  allItems = document.querySelectorAll(".layout-classic .post");

  for(x=0;x<allItems.length;x++){

    resizeGridItem(allItems[x]);

  }

}



function resizeInstance(instance){

    item = instance.elements[0];

  resizeGridItem(item);

}

#undefined

New File

# These are supported funding model platforms



github: # Replace with up to  GitHub Sponsors-enabled usernames e.g., [user1, user2]
4
patreon: # Replace with a single Patreon username

open_collective: # Replace with a single Open Collective username

ko_fi: # Replace with a single Ko-fi username

tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel

community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry

liberapay: # Replace with a single Liberapay username

issuehunt: # Replace with a single IssueHunt username

otechie: # Replace with a single Otechie username

lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry

custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']

#undefined

New File

# These are supported funding model platforms



github: # Replace with up to  GitHub Sponsors-enabled usernames e.g., [user1, user2]
4
patreon: # Replace with a single Patreon username

open_collective: # Replace with a single Open Collective username

ko_fi: # Replace with a single Ko-fi username

tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel

community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry

liberapay: # Replace with a single Liberapay username

issuehunt: # Replace with a single IssueHunt username

otechie: # Replace with a single Otechie username

lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry

custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']

#undefined

A Pen by poliku102

<div id="page-body" data-select-id="select2-data-page-body">
2


  <div id="col-center">



    <div id="content-wrapper">



      <div class="tabs forma-podbora" id="forma-podbora">



        <div class="tabs__content  active">

          <div class="row">



            <!--                         СЮДА -->

            <form action="/primerka-diskov/podbor" id="diskiForm" method="post" data-select2-id="select2-data-diskiForm">



              <div class="col-md-9 form__image fixedBlock" style="width: 100%; max-width: 100%; flex: 0 0 100%; height: 288px; min-height: auto; position: fixed; top: 0px; left: 0px; z-index: 80; padding: 0px;">

                <div class="image__block">

                  <img data-savepage-currentsrc="https://konsulavto.ru/static/images/avto/kia/2M6CPv_15507_imgred.jpg" data-savepage-src="https://konsulavto.ru/static/images/avto/kia/2M6CPv_15507_imgred.jpg" src="https://konsulavto.ru/static/images/avto/kia/2M6CPv_15507_imgred.jpg" alt="Подбор автомобильных дисков" id="avto__image" data-toggle="tooltip" data-placement="bottom" class="img-responsive" data-original-title="Установлены диски Диск колесный  литой " style="max-height: 0px; margin-top: 0px;">
18
                  <img class="dials left-dial" data-x="1" data-y="56" data-d="" data-savepage-currentsrc="https://konsulavto.ru/static/images/dials/%D0%A1%D0%9A%D0%90%D0%94/yf9Fle_40684_img2.png" data-savepage-src="https://konsulavto.ru/static/images/dials/СКАД/yf9Fle_40684_img2.png" src="https://konsulavto.ru/static/images/dials/СКАД/yf9Fle_40684_img2.png" style="display: inline; width: 59.3688px; height: 59.3688px; left: 166.035px; bottom: 15.8588px; opacity: 1;">

                  <img class="dials right-dial" data-x="523" data-y="56" data-d="" data-savepage-currentsrc="https://konsulavto.ru/static/images/dials/%D0%A1%D0%9A%D0%90%D0%94/yf9Fle_40684_img2.png" data-savepage-src="https://konsulavto.ru/static/images/dials/СКАД/yf9Fle_40684_img2.png" src="https://konsulavto.ru/static/images/dials/СКАД/yf9Fle_40684_img2.png" style="display: inline; width: 59.3688px; height: 59.3688px; left: 492.157px; bottom: 15.8588px; opacity: 1;">

                </div>
21
                <div class="selector__image" id="selectImg" style="background: rgb(255, 255, 255); margin-top: 0px; padding-top: 25px; padding-bottom: 25px; padding-left: 25px;">
22
                  <div class="car__color_picker car__color_img_blue" onclick="changeImage('https://konsulavto.ru/static/images/avto/kia/2M6CPv_15507_imgblue.jpg')"></div>

#undefined

A Pen by poliku102

<div id="page-body" data-select-id="select2-data-page-body">
2


  <div id="col-center">



    <div id="content-wrapper">



      <div class="tabs forma-podbora" id="forma-podbora">



        <div class="tabs__content  active">

          <div class="row">



            <!--                         СЮДА -->

            <form action="/primerka-diskov/podbor" id="diskiForm" method="post" data-select2-id="select2-data-diskiForm">



              <div class="col-md-9 form__image fixedBlock" style="width: 100%; max-width: 100%; flex: 0 0 100%; height: 288px; min-height: auto; position: fixed; top: 0px; left: 0px; z-index: 80; padding: 0px;">

                <div class="image__block">

                  <img data-savepage-currentsrc="https://konsulavto.ru/static/images/avto/kia/2M6CPv_15507_imgred.jpg" data-savepage-src="https://konsulavto.ru/static/images/avto/kia/2M6CPv_15507_imgred.jpg" src="https://konsulavto.ru/static/images/avto/kia/2M6CPv_15507_imgred.jpg" alt="Подбор автомобильных дисков" id="avto__image" data-toggle="tooltip" data-placement="bottom" class="img-responsive" data-original-title="Установлены диски Диск колесный  литой " style="max-height: 0px; margin-top: 0px;">
18
                  <img class="dials left-dial" data-x="1" data-y="56" data-d="" data-savepage-currentsrc="https://konsulavto.ru/static/images/dials/%D0%A1%D0%9A%D0%90%D0%94/yf9Fle_40684_img2.png" data-savepage-src="https://konsulavto.ru/static/images/dials/СКАД/yf9Fle_40684_img2.png" src="https://konsulavto.ru/static/images/dials/СКАД/yf9Fle_40684_img2.png" style="display: inline; width: 59.3688px; height: 59.3688px; left: 166.035px; bottom: 15.8588px; opacity: 1;">

                  <img class="dials right-dial" data-x="523" data-y="56" data-d="" data-savepage-currentsrc="https://konsulavto.ru/static/images/dials/%D0%A1%D0%9A%D0%90%D0%94/yf9Fle_40684_img2.png" data-savepage-src="https://konsulavto.ru/static/images/dials/СКАД/yf9Fle_40684_img2.png" src="https://konsulavto.ru/static/images/dials/СКАД/yf9Fle_40684_img2.png" style="display: inline; width: 59.3688px; height: 59.3688px; left: 492.157px; bottom: 15.8588px; opacity: 1;">

                </div>
21
                <div class="selector__image" id="selectImg" style="background: rgb(255, 255, 255); margin-top: 0px; padding-top: 25px; padding-bottom: 25px; padding-left: 25px;">
22
                  <div class="car__color_picker car__color_img_blue" onclick="changeImage('https://konsulavto.ru/static/images/avto/kia/2M6CPv_15507_imgblue.jpg')"></div>

#undefined

Editing CodeHelp-DSA-Busted-Series/mergeSortedArray1.cpp at main · loveBabbar/CodeHelp-DSA-Busted-Series

#include<iostream>

#include<vector>

using namespace std;



void merge(int arr1[], int n, int arr2[], int m, int arr3[]) {



    int i = 0, j = 0;

    int k = 0;

    while( i<n && j<m) {

        if(arr1[i] < arr2[j]){

            arr3[k++] = arr1[i++];

        }

        else{

            arr3[k++] = arr2[j++];

        }

    }



    //copy first array k element ko

    while(i<n) {

        arr3[k++] = arr1[i++];

    }



    //copy kardo second array k remaining element ko

    while(j<m) {

        arr2[k++] = arr2[j++];

    }

}



void print(int ans[], int n) {

    for(int i=0; i<n; i++) {

        cout<< ans[i] <<" ";

    }

    cout << endl;

}



int main() {



    int arr1[5] = {1,3,5,7,9};

    int arr2[3] = {2,4,6};



    int arr3[8] = {0};



    merge(arr1, 5, arr2, 3, arr3);



    print(arr3, 8);

#undefined

what i liked about this is that the answer provided had used "AND" between joins as well

the answer as hint (see how AND is used for multiple join conditions between same table ...last line)
SELECT
  couples.couple_name,
  couples.pref_location,
  apartments.id
FROM couples
JOIN apartments
  ON apartments.price NOT BETWEEN couples.min_price AND couples.max_price
  AND location != pref_location

///////////////////
btw my answer also worked

SELECT c.couple_name,c.pref_location,a.id
FROM apartments a
join 
couples c on c.pref_location <> a.location
where a.price not between c.min_price and c.max_price

#undefined

Learn How To Use Non-Equi SQL JOINs -We also don't have to use the equality operator when joining tables. We are free to use other comparison operators (<, >, <=, >=, !=, <>) or the BETWEEN operator:


SELECT
  auctioneer.name,
  item.name
FROM auctioneer
JOIN item
  ON auctioneer.funds > item.price

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 100px;
  height: 100px;
  background-color: red;
  animation-name: example;
  animation-duration: 4s;
}

@keyframes example {
  0%   {background-color: red;}
  25%  {background-color: yellow;}
  50%  {background-color: blue;}
  100% {background-color: green;}
}
</style>
</head>
<body>

<h1>CSS Animation</h1>

<div></div>

<p><b>Note:</b> When an animation is finished, it goes back to its original style.</p>

</body>
</html>

#undefined

Make div clickable link using onclick attribute.

<div onclick="window.open('http://www.website.com/page', '_blank')">Click Me</div>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

#undefined

Example HTML snippet

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

#undefined

Improve Your Skills By Learning Non-Equi Self JOIN - Vertabelo Academy Online Interactive Course

veru useful to find pairs and avoid repeating 
eg 1,2 is included so no need to incude 2,1

#undefined

Confetti Cannon

<canvas id="canvas"></canvas>

<div class="copy">

    <h1>Confetti Cannon</h1>

    <p>click, drag & release</p>

    <p>CodeWorks4U</p>

</div>

#undefined

Team + WPML ajax filter to fix duplcate issue and loadmore issue

// in code snippet.
function sptp_suppress_filters_mod( $suppress_filters){
	if (defined('DOING_AJAX') && DOING_AJAX) {
	 	$suppress_filters = true;
	 } else {
	 	$suppress_filters = false;
	}

	return $suppress_filters;
}
add_filter( 'sptp_suppress_filters', 'sptp_suppress_filters_mod');

function sptp_filter_groups_mod( $group, $shortcode_id ){
	if('' == $group ){
		$sptp_group = get_terms(array(
			'taxonomy' => 'sptp_group',
			'hide_empty' => false,
		));
		$group = array();
		foreach($sptp_group as $category) {
			$group[] = $category->slug;
		}
	}
	return $group;
}
add_filter( 'sptp_filter_groups', 'sptp_filter_groups_mod', 10, 2);

// New hook in ajax search funtion.
$group = apply_filters( 'sptp_filter_groups', $group, $generator_id );

// Helper.php in sptp_query funtion
if ( isset( $group ) && ! empty( $group ) ) {
			$args['tax_query'] = array(
				array(
					'taxonomy' => 'sptp_group',
					'field'    => 'slug',
					'terms'    => $group,
				),
			);
		}

#undefined

Reservations Custom Page

<html>
<head>
<style>
* {
  box-sizing: border-box;
}

.column {
  float: left;
  width: 50%;
  padding: 10px;
  text-align:center;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}
a{
  text-decoration: none;
  }
</style>
</head>
<body>

<div class="row">
  <div class="column" >

    <h2>Reserve from Dun Laogharie</h2>
 <a href="#">Reservation</a>
  

  </div>
  <div class="column">
   <h2>Reserve from Kimmage</h2>
 <a href="#">Reservation</a>
  </div>
</div>

</body>
</html>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>

<h2>Setting the Viewport</h2>
<p>This example does not really do anything, other than showing you how to add the viewport meta element.</p>

</body>
</html>

#undefined

New File

#undefined

New File

void * SwappyTracer::userData

#undefined

New File

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  x %= 3;
  printf("%d", x);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  float x = 5;
  x /= 3;
  printf("%f", x);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  x *= 3;
  printf("%d", x);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  x -= 3;
  printf("%d", x);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 10;
  x += 5;
  printf("%d", x);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  printf("%d", --x);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  printf("%d", ++x);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  int y = 2;
  printf("%d", x % y);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 12;
  int y = 3;
  printf("%d", x / y);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  int y = 3;
  printf("%d", x * y);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  int y = 3;
  printf("%d", x - y);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  int y = 3;
  printf("%d", x + y);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  int y = 3;
  printf("%d", x + y);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int sum1 = 100 + 50;        // 150 (100 + 50)
  int sum2 = sum1 + 250;      // 400 (150 + 250)
  int sum3 = sum2 + sum2;     // 800 (400 + 400)
  printf("%d\n", sum1);
  printf("%d\n", sum2);
  printf("%d\n", sum3);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int myNum = 100 + 50;
  printf("%d", myNum);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  const int minutesPerHour = 60;
  const float PI = 3.14;

  printf("%d\n", minutesPerHour);
  printf("%f\n", PI);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int num1 = 5;
  int num2 = 2;
  float sum = (float) num1 / num2;

  printf("%.1f", sum);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  // Manual conversion: int to float
  float sum = (float) 5 / 2;

  printf("%f", sum);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  char greetings[] = "Hello World!";
  printf("%s", greetings);
 
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  // Student data
  int studentID = 15;
  int studentAge = 23;
  float studentFee = 75.25;
  char studentGrade = 'B';

  // Print variables
  printf("Student id: %d\n", studentID);
  printf("Student age: %d\n", studentAge);
  printf("Student fee: %f\n", studentFee);
  printf("Student grade: %c", studentGrade);

  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x, y, z;
  x = y = z = 50;
  printf("%d", x + y + z);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5, y = 6, z = 50;
  printf("%d", x + y + z);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int x = 5;
  int y = 6;
  int sum = x + y;
  printf("%d", sum);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  // Create a myNum variable and assign the value 15 to it
  int myNum = 15;
  
  // Declare a myOtherNum variable without assigning it a value
  int myOtherNum;

  // Assign value of myNum to myOtherNum
  myOtherNum = myNum;

  // myOtherNum now has 15 as a value
  printf("%d", myOtherNum);
  
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int myNum = 15;
  
  int myOtherNum = 23;

  // Assign the value of myOtherNum (23) to myNum
  myNum = myOtherNum;

  // myNum is now 23, instead of 15
  printf("%d", myNum);
  
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int myNum = 15;
  
  int myOtherNum = 23;

  // Assign the value of myOtherNum (23) to myNum
  myNum = myOtherNum;

  // myNum is now 23, instead of 15
  printf("%d", myNum);
  
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  // Create variables
  int myNum = 15;              // Integer (whole number)
  float myFloatNum = 5.99;     // Floating point number
  char myLetter = 'D';         // Character
  
  // Print variables
  printf("%d\n", myNum);
  printf("%f\n", myFloatNum);
  printf("%c\n", myLetter);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int myNum = 15;
  printf("My favorite number is: %d", myNum);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int myNum = 15;
  char myLetter = 'D';
  printf("My number is %d and my letter is %c", myNum, myLetter);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  int myNum = 15; // myNum is 15
  myNum = 10; // Now myNum is 10
  
  printf("%d", myNum);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  // Create variables
  int myNum = 15;              // Integer (whole number)
  float myFloatNum = 5.99;     // Floating point number
  char myLetter = 'D';         // Character
  
  // Print variables
  printf("%d\n", myNum);
  printf("%f\n", myFloatNum);
  printf("%c\n", myLetter);
  return 0;
}

#undefined

W3Schools Tryit Editor

#include <stdio.h>

int main() {
  printf("Hello World!");
  return 0;
}

#undefined

New File

#undefined

Edit Custom Code ‹ NORLIGHTSPRESS.COM — WordPress

/* Add your CSS code here.



For example:

.example {

    color: red;

}



For brushing up on your CSS knowledge, check out http://www.w3schools.com/css/css_syntax.asp



End of comment */ 

body {

    background-color: #f9f9f9;

}

#sinatra-header-inner {

    background: #f9f9f9;

}



:root {

    --primary : #4b7a;

}

h2 {

    word-break: keep-all;

}

select[data-filter="category"] {

    width: 100%;

}

#books_grid .books ul.vc_grid-filter center {
28
    font-weight: bold;

    color: #000;

    font-size: 1.1rem;

}

.vc_grid-filter.vc_grid-filter-color-white>.vc_grid-filter-item.vc_active, .vc_grid-filter.vc_grid-filter-color-white>.vc_grid-filter-item:hover {

    background-color: #103965;

    color: #ffffff;

    border-radius: 4px;

}

.vc_grid-filter.vc_grid-filter-color-white>.vc_grid-filter-item.vc_active>span, .vc_grid-filter.vc_grid-filter-color-white>.vc_grid-filter-item:hover>span {

#undefined

Edit Custom Code ‹ NORLIGHTSPRESS.COM — WordPress

    

    $("body").on('click', 'li.vc_grid-filter-item.back-to-top',function() {

        $([document.documentElement, document.body]).animate({

            scrollTop: $("div#all_books").offset().top

        }, 1000);

        

    });

    

    jQuery("select#ct_mobile_filter").change(function(){

        var link = jQuery(this).val()

        window.location = link

    // console.log(link)

    })

    

    //  ========= Custom Filter ==============

    jQuery("li.cm_grid-filter-item:not(.back-to-top)").click(function(){

        text = jQuery(this).find("span").text();

        jQuery(".section_title h2 span#all").text(text)

        target = jQuery(this).find("span").data("cm-grid-filter-value")

        if(target == "*"){

            jQuery("article.elementor-post.elementor-grid-item").fadeIn()

        }else{

            jQuery("article.elementor-post.elementor-grid-item").hide()

            jQuery(".elementor-post__badge:contains("+target+")").parents(".elementor-grid-item").fadeIn()

        }

    })

    jQuery(".cm_grid-styled-select select").click(function(){

        target = jQuery(this).val();

        jQuery(".section_title h2 span#all").text(target);

        if(target == "*"){

            jQuery("article.elementor-post.elementor-grid-item").fadeIn()

        }else{

            jQuery("article.elementor-post.elementor-grid-item").hide()

            jQuery(".elementor-post__badge:contains("+target+")").parents(".elementor-grid-item").fadeIn()

        }

    })

    //  ========= Custom Filter ==============

});

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.container {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
}

.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
}
</style>
</head>
<body>

<h2>Responsive Iframe</h2>
<h3>Maintain Aspect Ratio 16:9</h3>
<p>Resize the window to see the effect.</p>

<div class="container"> 
  <iframe class="responsive-iframe" src="https://www.youtube.com/embed/tgbNymZ7vqY"></iframe>
</div>

</body>

#undefined

modo oscuro con js

#label {

  position: absolute;

  top: px;

  right: 20px;

  font-size: 3em;

  color: rebeccapurple;

  cursor: pointer;

}

#toggle {
10
  display: none;

}

.oscuro {

  background-color: #333;

  color: white;

  transition: all 1.5s ease;

}

#undefined

W3Schools Tryit Editor

import mysql.connector

mydb = mysql.connector.connect(
  host="localhost",
  user="myusername",
  password="mypassword"
)

print(mydb)

#undefined

Create a New Pen

#undefined

Edit fiddle - JSFiddle - Code Playground

#undefined

HTML Iframe Tag Generator - 𝗧𝗛𝗘 𝗕𝗘𝗦𝗧 𝗛𝗧𝗠𝗟 𝗖𝗢𝗗𝗘 𝗪𝗜𝗭𝗔𝗥𝗗

#undefined

A Pen by GEAUX⚜️TECH

<button style="">Hover Me</button>

button {
    position: relative;
    height: 60px;
    width: 200px;
    border: none;
    outline: none;
    color: #fff;
    background-color: #111;
    cursor: pointer;
    border-radius: 5px;
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
}

* {
    margin: 0;
    padding: 0;
}
user agent stylesheet
button {
    appearance: auto;
    writing-mode: horizontal-tb !important;
    font-style: ;
    font-variant-ligatures: ;
    font-variant-caps: ;
    font-variant-numeric: ;
    font-variant-east-asian: ;
    font-weight: ;
    font-stretch: ;
    font-size: ;
    font-family: ;
    text-rendering: auto;
    color: buttontext;
    letter-spacing: normal;
    word-spacing: normal;
    line-height: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: center;
    align-items: flex-start;
    cursor: default;
    box-sizing: border-box;
    background-color: buttonface;
    margin: 0em;
    padding: 1px 6px;
    border-width: 2px;
    border-style: outset;
    border-color: buttonborder;
    border-image: initial;
}
button::before {
    position: absolute;
    content: '';
    top: -2px;
    left: -2px;
    height: calc(100% + 4px);
    width: calc(100% + 4px);
    border-radius: 5px;
    z-index: -1;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: url(data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur stdDeviation="5" /></filter></svg>#filter);
    -webkit-filter: blur(5px);
    filter: blur(5px);
    background: -webkit-linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    background-size: 400%;
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    -webkit-animation: animate 20s linear infinite;
    animation: animate 20s linear infinite;
}

#undefined

Maintenance ‹ Aspire Globally — WordPress

#undefined

Maintenance ‹ Aspire Globally — WordPress

#undefined

Create virtual environments with another Python version — Roel Peters

py -m virtualenv -p="C:\Program Files\Python36\python.Exe" .virtenv

#undefined

me

#undefined

Rich Snippet 2

<script type="application/ld+json">
{
  "@context": "http://schema.org/",
  "@type": "JobPosting",
  "title": "JUDUL LOKER",
  "description": "DESKRIPSI LOKER",
  "datePosted": "2023-02-03",
  "validThrough": "2023-07-01",
  "jobLocationType": "TELECOMMUTE",
  "jobLocation": {
    "@type": "Place",
    "address": {
      "@type": "PostalAddress",
      "addressLocality": "KOTA",
      "addressRegion": "PROVINSI",
      "addressCountry": "Indonesia"
    }
  },
  "hiringOrganization": {
    "@type": "Organization",
    "sameAs": "URL PERUSAHAAN LOKER",
    "name": "NAMA PERUSAHA YANG BUKA LOKER",
    "logo": "URL THUMBNAIL LOKER"
  },
  "employmentType": ["FULL_TIME"],
  "applicantLocationRequirements": {
    "@type": "Country",
    "name": "Indonesia"
  },
  "baseSalary": {
    "@type": "MonetaryAmount",
    "currency": "IDR",
    "value": {
      "@type": "QuantitativeValue",
      "value": 0,
      "unitText": "BULAN"
    }
  },
  "skills": ["SKILL 1", "SKILL 2", "SKILL 3"],
  "responsibilities": [
    "TUGAS 1",
    "TUGAS 2",
    "TUGAS 3"
  ],
  "educationalRequirements": "PENDIDIKAN MINIMAL",
  "experienceRequirements": "PENGALAMAN MINIMAL",
  "qualifications": "KUALIFIKASI LAINNYA",
  "incentiveCompensation": "BONUS",
  "industry": "INDUSTRI TERKAIT",
  "occupationalCategory": "KATEGORI PEKERJAAN"
}
</script>

#undefined

Pengujian Hasil Kaya -LOKER

{

    "@context": "http://schema.org/",

    "@type": "JobPosting",

    "title" : "JUDUL LOKER",

    "description" : "DESKRIPSI LOKER",

    "datePosted" : "-02-03",

    "validThrough" : "601",
8
    "jobLocationType" : "TELECOMMUTE",

    "jobLocation": {

        "@type": "Place",

        "address": {

            "@type": "0",

            "addressLocality": "KOTA",

            "addressRegion": "PROVINSI",

            "addressCountry": "Indonesia"

        }

    },

    "hiringOrganization": {

        "@type": "Organization",
20
        "sameAs": "URL PERUSAHAAN LOKER",

        "name": "NAMA PERUSAHA YANG BUKA LOKER",

        "logo": "URL THUMBNAIL LOKER"
23
    },

    "employmentType": ["FULL_TIME"],

    "applicantLocationRequirements": {

        "@type": "Country",

        "name": "Indonesia"

    },

    "baseSalary": {

        "@type": "MonetaryAmount",

        "currency": "IDR",

        "value": {

            "@type": "QuantitativeValue",

            "value": 0,

            "unitText": "BULAN"

        }

    }

}

#undefined

Ellepse on text

<!DOCTYPE html>
<html>
<head>
<style> 
div.a {
  white-space: nowrap; 
  width: 50px; 
  overflow: hidden;
  text-overflow: clip; 
  border: 1px solid #000000;
}

div.b {
  white-space: nowrap; 
  width: 50px; 
  overflow: hidden;
  text-overflow: ellipsis; 
  border: 1px solid #000000;
}

div.c {
  white-space: nowrap; 
  width: 50px; 
  overflow: hidden;
  text-overflow: "----"; 
  border: 1px solid #000000;
}
</style>
</head>
<body>

<h1>The text-overflow Property</h1>

<p>The following two divs contains a text that will not fit in the box.</p>

<h2>text-overflow: clip (default):</h2>
<div class="a">Hello world!</div>

<h2>text-overflow: ellipsis:</h2>
<div class="b">Hello world!</div>

<h2>text-overflow: "----" (user defined string):</h2>
<div class="c">Hello world!</div>

<p><strong>Note:</strong> The text-overflow: "<em>string</em>" only works in 
Firefox.</p>

</body>
</html>

#undefined

add <style>

add_action( 'wp_head', function ( ) { ?> 


<style>

  </style>

<?php } );

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h1>The JavaScript <i>this</i> Keyword</h1>

<p>In this example, <b>this</b> refers to the window object:</p>

<p id="demo"></p>

<script>
let x = this;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

#undefined

Learn How To Use SQL JOINs To Self JOIN Tables - Vertabelo Academy Online Interactive Course

trick one because i was not sure how to pull older and younger sibling

#undefined

test1 - Jupyter Notebook

import os
os.getcwd()
import pandas as pd
dataset = pd.read_excel("D:\Work\Data\Conso NBFC FIle v1 - CY21.xlsb")
dataset.head()

#undefined

Untitled - Jupyter Notebook

#undefined

W3Schools Tryit Editor

x = 5
y = "Hello, World!"

print(x)
print(y)

#undefined

Untitled - Jupyter Notebook

#undefined

Untitled - Jupyter Notebook

#undefined

Format String en Typescript

StringExtensions.format(this.context.resources.getString("string_086"), PlansEntities.CustomerPlanStatus[this.viewModel._selectedItem.STATUS])


RESOURCES---
  "string_086": "No puede agregar una cuota de un plan en estado [{0}].",
  "string_086.comment": "Mensaje",

#undefined

Usar enums en typescript

export namespace PlansEntities {
    export enum CustomerPlanStatus {
        None = 'Ninguno',
        PreGrant = 'Pre-otorgado',
        Grant = 'Otorgado',
        Cancel = 'Cancelado',
        InLegalProcess = 'En proceso legal',
        Expired = 'Vencido',
        Rejected = 'Rechazado',
        Paid = 'Pagado',
        Refinanced = 'Refinanciado',
        Migrated = 'Migrado',
    }
}

import { PlansEntities } from "../../Entities/CreditPlansEntities";

if (this.viewModel._selectedItem && PlansEntities.CustomerPlanStatus[this.viewModel._selectedItem.STATUS] == PlansEntities.CustomerPlanStatus.Cancel) { …. }

#undefined

Vue SFC Playground

<script>

export default {

  data() {

    return {

      count: 1

    }

  },



  // `mounted` is a lifecycle hook which we will explain later

  mounted() {

    // `this` refers to the component instance.

    console.log(this.count) // => 1



    // data can be mutated as well

    this.count = 2

  }

}

</script>



<template>

  Count is: {{ count }}

</template>

#undefined

W3Schools Tryit Editor

#convert from int to float:
x = float(1)

#convert from float to int:
y = int(2.8)

#convert from int to complex:
z = complex(1)

print(x)
print(y)
print(z)

print(type(x))
print(type(y))
print(type(z))

#undefined

To Test Custom CSS

body>*{

  color: green !important;

  content: 'f023';

  

}

#undefined

Improve Your Knowledge By Learning SQL Multiple JOINs - Vertabelo Academy Online Interactive Course

really good eg of how to find records that weren't sold in a particular period

#undefined

Edit fiddle - JSFiddle - Code Playground

var d = new Date(1673366309);
2
var formattedDate = d.getDate() + "-" + d.getMonth() + "-" + d.getFullYear();
3
var hours = (d.getHours() < 10) ? "0" + d.getHours() : d.getHours();
4
var minutes = (d.getMinutes() < 10) ? "0" + d.getMinutes() : d.getMinutes();
5
var formattedTime = hours + ":" + minutes;
6


formattedDate = formattedDate + " " + formattedTime;
8

9
alert(formattedDate);

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<div style="background-color:black;color:white;padding:20px;">
  <h2>London</h2>
  <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
  <p>Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.</p>
</div> 

</body>
</html>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<p>This is an inline span <span style="border: 1px solid black">Hello World</span> element inside a paragraph.</p>

<p>The SPAN element is an inline element, and will not start on a new line and only takes up as much width as necessary.</p>

</body>
</html>

#undefined

New File

#undefined

Blogger Schema.org markup

<b:if cond='<a href="data:view.isPost" target="_blank" rel="noopener noreferrer">data:view.isPost</a>'>
 
<script type='application/ld+json'>
 
{
 
"<a href="https://twitter.com/context" target="_blank" rel="noopener noreferrer">@context</a>": "<a href="http://schema.org" target="_blank" rel="noopener noreferrer">schema.org</a>",
 
"<a href="https://twitter.com/type" target="_blank" rel="noopener noreferrer">@type</a>": "Article",
 
"<a href="https://twitter.com/id" target="_blank" rel="noopener noreferrer">@id</a>": "<<a href="data:post.url/" target="_blank" rel="noopener noreferrer">data:post.url</a>><a href="https://twitter.com/hashtag/post" target="_blank" rel="noopener noreferrer">#post</a>-body-<<a href="data:post.id/" target="_blank" rel="noopener noreferrer">data:post.id</a>>",
 
"mainEntityOfPage": "<<a href="data:post.url/" target="_blank" rel="noopener noreferrer">data:post.url</a>>",
 
"headline": "<<a href="data:post.title/" target="_blank" rel="noopener noreferrer">data:post.title</a>>",
 
"name": "<<a href="data:post.title/" target="_blank" rel="noopener noreferrer">data:post.title</a>>",
 
"url": "<<a href="data:post.url/" target="_blank" rel="noopener noreferrer">data:post.url</a>>",
 
"description": "<<a href="data:blog.metaDescription/" target="_blank" rel="noopener noreferrer">data:blog.metaDescription</a>>",
 
"image": "<<a href="data:post.featuredImage/" target="_blank" rel="noopener noreferrer">data:post.featuredImage</a>>",
 
"datePublished": "<<a href="data:post.date.iso8601/" target="_blank" rel="noopener noreferrer">data:post.date.iso8601</a>>",
 
"dateModified": "<<a href="data:post.date.iso8601/" target="_blank" rel="noopener noreferrer">data:post.date.iso8601</a>>",
 
"author": {
 
"<a href="https://twitter.com/type" target="_blank" rel="noopener noreferrer">@type</a>": "Person",
 
"name": "<<a href="data:post.author.name/" target="_blank" rel="noopener noreferrer">data:post.author.name</a>>",
 
"url": "<<a href="data:blog.homepageUrl.jsonEscaped/" target="_blank" rel="noopener noreferrer">data:blog.homepageUrl.jsonEscaped</a>>"
 
},
 
"publisher": {
 
"<a href="https://twitter.com/type" target="_blank" rel="noopener noreferrer">@type</a>": "Organization",
 
"name": "<<a href="data:blog.homepageUrl.jsonEscaped/" target="_blank" rel="noopener noreferrer">data:blog.homepageUrl.jsonEscaped</a>>",
 
"description": "Replace this with your site tagline",
 
"logo": {
 
"<a href="https://twitter.com/type" target="_blank" rel="noopener noreferrer">@type</a>": "ImageObject",
 
"url": "<a href="https://surftware.com/logo.png" target="_blank" rel="noopener noreferrer">surftware.com/logo.png</a>",
 
"width": 600,
 
"height": 60
 
}
 
}
 
}
 
</script>
 
</b:if>

#undefined

Gradient color button with hover glow

<div id="testbutton"></div>

#undefined

custom post type template

<?php

if(is_page('home')) {

    $posts_per_page = 2;

} else {

    $posts_per_page = -1;

}

$query = array(

'post_type' => array('journal'),

'post_status' => array('publish'),

'orderby' => 'date',

'order' => 'DESC',

'posts_per_page' => $posts_per_page,

);

$q = new WP_Query($query); ?>



<div class="journals-wrap">

    <?php while ($q->have_posts()) : $q->the_post(); ?>

    <div class="journal-wrapper row">

        <div class="col-md-3">

            <p class="date-meta"><?php echo get_the_date(); ?></p>

            <h4 class="title">

                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>

            </h4>

        </div>

        <div class="col-md-6">

            <p class="text"><?php echo strip_tags(substr(get_the_content(), 0, 0)); echo (strlen(strip_tags(get_the_content())) >= 300) ? ' ...' : ''; ?></p>

        </div>

        <div class="col-md-3">

            <a href="<?php the_permalink(); ?>" class="journal-btn">
30
                <svg width="38" height="27" viewBox="0 0 38 27" fill="none" xmlns="http://www.w3.org/2000/svg">

                <path d="M.4382 6.42613C37.67 5.63184 37.2204 4.79715 .4261 4.5618L23.4824 0.726611C22.6881 0.491264 21.85 0.944381 21.618 1.73868C21.3827 2.597 21.8358 3.36766 22.6301 3.60301L34.1357 7.01206L30.7266 18.5176C30.4913 19.3119 30.9444 20.1466 31.7387 20.382C32.5 20.6173 33.3677 20.1642 33.603 19.3699L37.4382 6.42613ZM1.71564 26.3183L36.7156 7.31828L35.2844 4.68172L0.284362 23.6817L1.71564 26.3183Z" fill="currentColor"/>
32
                </svg>
33
            </a>
34
        </div>
35
    </div>
36
    <?php endwhile; ?>
37
</div>

#undefined

Swiper Smooth Autoplay

var swiperOptions = {

  loop: true,

  freeMode: true,

  spaceBetween: 0,

  grabCursor: true,

  slidesPerView: ,
7
  loop: true,

  autoplay: {

    delay: 1,

    disableOnInteraction: true

  },

  freeMode: true,

  speed: 5000,

  freeModeMomentum: false

};



var swiper = new Swiper(".swiper-container", swiperOptions);



$(".swiper-container").mouseenter(function () {

  console.log("mouse over");

  swiper.autoplay.stop();

});



$(".swiper-container").mouseleave(function () {

#undefined

A Pen by Ky

<!DOCTYPE html>

<html lang="en-us">

  <head>

    <meta charset="utf-">



    <title>Number guessing game</title>


8
    <style>

      html {

        font-family: sans-serif;

      }



      body {

        width: 50%;

        max-width: 800px;

        min-width: 480px;

        margin: 0 auto;

      }

      

      .form input[type="number"] {

        width: 200px;

      }

#undefined

Editing HTML-Crypto-Currency-Chart-Snippets/README.md at master · AYIDouble/HTML-Crypto-Currency-Chart-Snippets · GitHub

# 💹 HTML Crypto Currency Chart Snippets 💹

💹 Simple HTML Snippets to create Tickers / Charts of Cryptocurrencies with the TradingView API 💹



## [💹 Candlestick Chart with Indicators 💹](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Chart)



![Crypto Currency Chart Cryptocurrencies Candle Candlestick with indicators TradingView API RSI Stoch](Images/Chart.png)



```

<div class="tradingview-widget-container">

  <div id="tradingview_7"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/BITFINEX-IOTUSD/" rel="noopener" target="_blank"><span class="blue-text">IOTUSD Chart</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>

  <script type="text/javascript">

  new TradingView.widget(

  {

  "autosize": true,

  "symbol": "BINANCE:IOTAUSD",

  "interval": "D",

  "timezone": "Europe/Zurich",

  "theme": "Dark",

  "style": "1",

  "locale": "en",

  "toolbar_bg": "#f1f3f6",

  "enable_publishing": false,

  "hide_side_toolbar": false,

  "allow_symbol_change": true,

  "studies": [

    "RSI@tv-basicstudies",

    "StochasticRSI@tv-basicstudies"

  ],

  "container_id": "tradingview_048"

}

  );

  </script>

</div>

```



## [💲 Crypto Currency Ticker 💲](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Ticker)


40
![Crypto Currency Ticker Cryptocurrencies Chart TradingView API](Images/Crypto-Ticker.png)



```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com" rel="noopener" target="_blank"><span class="blue-text">Quotes</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-tickers.js" async>

  {
48
  "symbols": [

    {

      "description": "",

      "proName": "COINBASE:BTCUSD"

    },

    {

      "description": "",

      "proName": "COINBASE:ETHUSD"

    },

    {

      "description": "",

      "proName": "BINANCE:IOTAUSD"

    }

  ],

  "colorTheme": "dark",

  "isTransparent": false,

  "locale": "en"

}

  </script>

</div>

```



## [💲 Crypto Currency Ticker Tape 💲](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Ticker-Tape)



![Crypto Currency Ticker Cryptocurrencies Chart TradingView API](Images/Crypto-Currency-Ticker.png)


74
```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com" rel="noopener" target="_blank"><span class="blue-text">Ticker Tape</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-ticker-tape.js" async>

  {

  "symbols": [

    {

      "description": "",

      "proName": "COINBASE:BTCUSD"

    },

    {

      "description": "",

      "proName": "COINBASE:ETHUSD"

    },

    {

      "description": "",

      "proName": "BINANCE:IOTAUSD"

    }

  ],

  "colorTheme": "dark",

  "isTransparent": false,

  "displayMode": "adaptive",

  "locale": "en"

}

  </script>

</div>

```



## [💹 Mini Chart 💹](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Mini-Chart)



![Crypto Currency Mini Chart Cryptocurrencies TradingView API](Images/Mini-Chart.png)



```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/BITFINEX-IOTUSD/" rel="noopener" target="_blank"><span class="blue-text">IOTUSD Rates</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js" async>

  {

  "symbol": "BINANCE:IOTAUSD",

  "width": "100%",

  "height": "100%",

  "locale": "en",

  "dateRange": "12m",

  "colorTheme": "dark",

  "trendLineColor": "rgba(, , 244, 1)",

  "underLineColor": "rgba(, 218, 248, 0.15)",

  "isTransparent": false,

  "autosize": true,

  "largeChartUrl": ""

}

  </script>

</div>

```



## [💹 Overview Chart 💹](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Overview-Chart)



![Crypto Currency Overview Chart Cryptocurrencies Chart TradingView API](Images/Overview-Chart.png)



```

<div class="tradingview-widget-container">

  <div id="tv-medium-widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/COINBASE-BTCUSD/" rel="noopener" target="_blank"><span class="blue-text">BTC</span></a>, <a href="https://www.tradingview.com/symbols/COINBASE-ETHUSD/" rel="noopener" target="_blank"><span class="blue-text">ETH</span></a> <span class="blue-text">and</span> <a href="https://www.tradingview.com/symbols/BITFINEX-IOTUSD/" rel="noopener" target="_blank"><span class="blue-text">IOT Quotes</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>

  <script type="text/javascript">

  new TradingView.MediumWidget(

  {

  "container_id": "tv-medium-widget",

  "symbols": [

    [

      "BTC",

      "COINBASE:BTCUSD|12m"

    ],

    [

      "ETH",

      "COINBASE:ETHUSD|12m"

    ],

    [

      "IOT",

      "BINANCE:IOTAUSD|12m"

    ]

  ],

  "greyText": "Quotes by",

  "gridLineColor": "#e9e9ea",

  "fontColor": "#83888D",

  "underLineColor": "#dbeffb",

  "trendLineColor": "#4bafe9",

  "width": "100%",

  "height": "100%",

  "locale": "en"
164
}

  );

  </script>

</div>

```



## [💹 Technical Analysis 💹](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Technical-Analysis)



![Crypto Currency Technical Analysis Cryptocurrencies Symbol TradingView API](Images/Technical-Analysis.png)



```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/COINBASE-BTCUSD/technicals/" rel="noopener" target="_blank"><span class="blue-text">Technical Analysis for BTCUSD</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-technical-analysis.js" async>

  {

  "showIntervalTabs": true,

  "width": "100%",

  "colorTheme": "dark",

  "isTransparent": false,

  "locale": "en",

  "symbol": "COINBASE:BTCUSD",

  "interval": "1W",

  "height": "100%"

}

  </script>

</div>

```



## [💲 Single Ticker 💲](https://ayidouble.github.io/HTML-Crypto-Currency-Chart-Snippets/Single-Ticker)
194


![Crypto Currency Single Ticker Cryptocurrencies Bitcoin TradingView API](Images/Single-Ticker.png)



```

<div class="tradingview-widget-container">

  <div class="tradingview-widget-container__widget"></div>

  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/COINBASE-BTCUSD/" rel="noopener" target="_blank"><span class="blue-text">BTCUSD Rates</span></a> by TradingView</div>
201
  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-single-quote.js" async>

  {

  "symbol": "COINBASE:BTCUSD",

  "width": "100%",

  "colorTheme": "dark",

  "isTransparent": false,

  "locale": "en"

}

  </script>

</div>

```

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<h2>My First Web Page</h2>
<p>My First Paragraph.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>

</body>
</html>

#undefined

栈的实现 c语言版_51CTO博客_c语言栈的实现以及操作

#include <stdlib.h>

#define MIN_STACK_SIZE 1

struct stack_t{
  int length; 
  int top;
  char *array;
};

typedef struct stack_t * stack;

/*
 * create a empty stack according to the given len
 * return :the pointer to the stack
 */
stack Create_Stack(size_t len)
{
  if(len<MIN_STACK_SIZE)
  {
    return NULL;
  }

  stack s=(stack)malloc(sizeof(struct stack_t));
  if(s==NULL)
  {
    return NULL;
  }

  char *array=(char *)malloc(sizeof(char)*len);
  if(array==NULL)
  {
    return NULL;
  }

  s->top=-1;
  s->array=array;
  s->length=len;

  return s;
}

/* 
 * delete the given stack
 */
int Delete_Stack(stack s)
{
  if(s==NULL)
  {
    return -1;
  }

  free(s->array);

  free(s);
  return 1;

}
/*
 * return -1:empyt
 */
int IsEmptyStack(stack s)
{
  return s->top;
}

/*
 * push a char to stack s
 */
int Push_Stack(stack s,char c)
{
  if(s==NULL||s->top==(s->length-1))
  {
    return -1;
  }

  s->top++;

  s->array[s->top]=c;

  return 1;
}
/*
 * pop a char from stack s
 */
char Pop_Stack(stack s)
{
  if(s==NULL||s->top==-1)
  {
    return -1;
  }

  s->top--;

  return s->array[s->top+1];
}
/*
 * get a char from stack s
 */
char GetStackTop(stack s)
{
  if(s==NULL||s->top==-1)
  {
    return -1;
  }
  return s->array[s->top];
}

#undefined

队列的c语言实现_51CTO博客_c语言实现队列

#include <stdlib.h>
#include <stdio.h>
#define MIN_QUEUE_SIZE 1

struct Queue_t{
  int length; 
  int head,tail;
  char *array;
};

typedef struct Queue_t* Queue;

/*
 * create a empty stack according to the given len
 * return :the pointer to the stack
 */
Queue Create_Queue(size_t len)
{
  if(len<MIN_QUEUE_SIZE)
  {
    return NULL;
  }

  Queue q=(Queue)malloc(sizeof(struct Queue_t));
  if(q==NULL)
  {
    return NULL;
  }

  char *array=(char *)malloc(sizeof(char)*len+1);
  if(array==NULL)
  {
    return NULL;
  }

  q->head=0;
  q->tail=0;

  q->array=array;
  q->length=len+1;

  return q;
}

/* 
 * delete the given stack
 */
int Delete_Queue(Queue q)
{
  if(q==NULL)
  {
    return -1;
  }

  free(q->array);

  free(q);
  return 1;

}
/*
 * return 0:empty
 */
int IsEmptyQueue(Queue q)
{
  if(q==NULL)
  {
    return -1;
  }
  if(q->head==q->tail)
  {
    return 0;
  }
  return 1;
}

/*
 * push a char to stack s
 */
int Enqueue(Queue q,char c)
{
  if(q==NULL)
  {

    return -1;
  }

  //tail arrive to the end?
  if(q->tail==q->length-1)
  {
    //array[0] is empty?
    if(q->head!=0)
    {
      q->array[q->tail]=c;
      q->tail=0;
    }else{

      return -1;
    }

  }else{

    //head is before tail?
    if((q->tail+1)==q->head)
    {

      return -1;
    }
    q->array[q->tail]=c;
    q->tail++;
  }

  return 1;
}
/*
 * pop a char from stack s
 */
char Dequeue(Queue q)
{
  if(IsEmptyQueue(q)<1)
  {
    return -1;
  }

  char temp = q->array[q->head];

  //is head to the end?
  if(q->head==q->length-1)
  {
    q->head=0;
  }else{
    q->head++;
  }


  return temp;
}
/*
 * get a char from stack s
 */
char GetQueueHead(Queue q)
{
  if(IsEmptyQueue(q)<1)
  {
    return -1;
  }
  return q->array[q->head];
}

#undefined

Remove Ion-header bottom border

<ion-header class="ion-no-border">
    {...}
</ion-header>

#undefined

Apni Website (1.1)

hiii

#undefined

Identify Unique Path Param

:(.*?)($|\/)

#undefined

jQuery remove class fashion-x accordion

// on page load close fashion-X page accordions

	  
$(".fashion-x-accordion #elementor-tab-title-1481 ).removeClass("elementor-active");
$(".fashion-x-accordion #elementor-tab-content-1481").hide();
	  
$(".fashion-x-accordion #elementor-tab-title-8141 ).removeClass("elementor-active");
$(".fashion-x-accordion #elementor-tab-content-8141").hide();

#undefined

Regex Tester and Debugger Online - Javascript, PCRE, PHP

/(?=---).*(?=ÐÏ)/g

#undefined

Nov 11 9:06 AM - Codeshare

package demopackage;



public class mainClass {

  public static void main(String[] args) {

    Scanner myScanner = new Scanner(System.in);

    String myInput = myScanner.nextLine();

    

    if (Integer.valueOf(myInput) < 5) {

      System.out.println("Less than 5 since myInput is : " + myInput);

    } else if (Integer.valueOf(myInput) < 10) {

      System.out.println("Less than 10 since myInput is : " + myInput);

    } else {

      System.out.println("Not less than 5 or 10 since myInput is : " + myInput);

    }

    

    System.out.println("NEXT LINE");

  }

}

#undefined

React-Ionic Segment with swipe right and left

// added useRef 
import React, { useState, useRef } from 'react';
import {
  IonSegment, IonSegmentButton, IonRow, IonCol, IonGrid, IonContent, IonSlides,
  IonSlide,IonLabel,
} from '@ionic/react';

//import Segment from '../components/Segment';
const Market: React.FC = () => {

  // a ref variable to handle the current slider
  const slider = useRef<HTMLIonSlidesElement>(null);
  // a state value to bind segment value
  const [value, setValue] = useState("0");

  const slideOpts = {
    initialSlide: 0,
    speed: 400,
    loop: false,
    pagination: {
      el: null
    },

  };

  // a function to handle the segment changes
  const handleSegmentChange = (e: any) => {
    if(e.detail.value != null  || e.detail.value != undefined ){
      setValue(e.detail.value);
      slider.current!.slideTo(e.detail.value);
    } 
  };

  // a function to handle the slider changes
  const handleSlideChange = async (event: any) => {
    let index: number = 0;
    await event.target.getActiveIndex().then((value: any) => (index = value));
    setValue('' + index)
  }
 

  return (
    <>

      <IonSegment value={value} onIonChange={(e) => handleSegmentChange(e)} >
      <IonSegmentButton value="0">
          <IonLabel>Message</IonLabel>
        </IonSegmentButton>

        <IonSegmentButton value="1">
          <IonLabel>Favourite</IonLabel>
        </IonSegmentButton>

        <IonSegmentButton value="2">
          <IonLabel>Calls</IonLabel>
        </IonSegmentButton>
      </IonSegment>

      <IonContent>
        {/*-- Market Segment --*/}
        {/*-- the ref method binds this slider to slider variable --*/}
        <IonSlides pager={true} options={slideOpts} onIonSlideDidChange={(e) => handleSlideChange(e)} ref={slider}>
          <IonSlide>
            <IonGrid>
              <IonRow>
                <IonCol>
                  <h1>Masseges</h1>
                  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate corporis magnam officiis molestias molestiae, sed itaque illum unde inventore animi consequatur aliquam id tempora a libero consectetur ratione eveniet illo harum dignissimos corrupti eaque tempore exercitationem? Voluptatibus ea dolorem quisquam voluptatem, eum ducimus quibusdam veniam, itaque laboriosam placeat, magni aspernatur.</p>
                </IonCol>
              </IonRow>
            </IonGrid>
          </IonSlide>
          {/*-- Package Segment --*/}
          <IonSlide>
            <IonGrid>
              <IonRow>
                <IonCol>
                  <h1>Favourite</h1>
                  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate corporis magnam officiis molestias molestiae, sed itaque illum unde inventore animi consequatur aliquam id tempora a libero consectetur ratione eveniet illo harum dignissimos corrupti eaque tempore exercitationem? Voluptatibus ea dolorem quisquam voluptatem, eum ducimus quibusdam veniam, itaque laboriosam placeat, magni aspernatur.</p>
                </IonCol>
              </IonRow>
            </IonGrid>
          </IonSlide>

          <IonSlide>
            <IonGrid>
              <IonRow>
                <IonCol>
                  <h1>Calls</h1>
                  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate corporis magnam officiis molestias molestiae, sed itaque illum unde inventore animi consequatur aliquam id tempora a libero consectetur ratione eveniet illo harum dignissimos corrupti eaque tempore exercitationem? Voluptatibus ea dolorem quisquam voluptatem, eum ducimus quibusdam veniam, itaque laboriosam placeat, magni aspernatur.</p>
                </IonCol>
              </IonRow>
            </IonGrid>
          </IonSlide>
        </IonSlides>
      </IonContent>
    </>
  )
}

export default Market;

#undefined

Ionic React Segment Example working

const Segments: React.FC = () => {
const [selected, setSelected] = useState<string | undefined>('message');

    return (
    <>
        <IonPage>
            <IonContent>
                <IonSegment value={selected} onIonChange={(event)=> setSelected(event.detail.value)}>

                    <IonSegmentButton value="message">
                        <IonLabel>Message</IonLabel>
                    </IonSegmentButton>

                    <IonSegmentButton value="favourite">
                        <IonLabel>Favourite</IonLabel>
                    </IonSegmentButton>

                    <IonSegmentButton value="calls">
                        <IonLabel>Calls</IonLabel>
                    </IonSegmentButton>
                </IonSegment>

                {/* segment content starts here */}
                <div className='segmentsContent'>
                    {(selected === 'message') && (
                    <div className='segmentTab'>
                        <h1>Tab 1</h1>
                    </div>
                    )}
                    {(selected === 'favourite') && (
                    <div className='segmentTab'>
                        <h1>Tab2</h1>
                    </div>
                    )}
                    {(selected === 'calls') && (
                    <div className='segmentTab'>
                        <h1>Tab3</h1>
                    </div>
                    )}
                </div>

            </IonContent>
        </IonPage>
    </>

    );
    };
    export default Segments;

#undefined

User Name password

Martinluther
savemycodeweb
Codepen@online4

#undefined

Ionic-react on page load example

  useEffect(()=>{
    getData();
  },[]) 
  function getData(){
    setSelected('one')
  }

#undefined

Building for production – Lit

// Import rollup plugins
import html from '@web/rollup-plugin-html';
import polyfillsLoader from '@web/rollup-plugin-polyfills-loader';
import {copy} from '@web/rollup-plugin-copy';
import resolve from '@rollup/plugin-node-resolve';
import {getBabelOutputPlugin} from '@rollup/plugin-babel';
import {terser} from 'rollup-plugin-terser';
import minifyHTML from 'rollup-plugin-minify-html-literals';
import summary from 'rollup-plugin-summary';


// Configure an instance of @web/rollup-plugin-html
const htmlPlugin = html({
  rootDir: './',
  flattenOutput: false,
});


export default {
  // Entry point for application build; can specify a glob to build multiple
  // HTML files for non-SPA app
  input: 'index.html',
  plugins: [
    htmlPlugin,
    // Resolve bare module specifiers to relative paths
    resolve(),
    // Minify HTML template literals
    minifyHTML(),
    // Minify JS
    terser({
      module: true,
      warnings: true,
    }),
    // Inject polyfills into HTML (core-js, regnerator-runtime, webcoponents,
    // lit/polyfill-support) and dynamically loads modern vs. legacy builds
    polyfillsLoader({
      modernOutput: {
        name: 'modern',
      },
      // Feature detection for loading legacy bundles
      legacyOutput: {
        name: 'legacy',
        test: '!!Array.prototype.flat',
        type: 'systemjs',
      },
      // List of polyfills to inject (each has individual feature detection)
      polyfills: {
        hash: true,
        coreJs: true,
        regeneratorRuntime: true,
        fetch: true,
        webcomponents: true,
        // Custom configuration for loading Lit's polyfill-support module,
        // required for interfacing with the webcomponents polyfills
        custom: [
          {
            name: 'lit-polyfill-support',
            path: 'node_modules/lit/polyfill-support.js',
            test: "!('attachShadow' in Element.prototype)",
            module: false,
          },
        ],
      },
    }),
    // Print bundle summary
    summary(),
    // Optional: copy any static assets to build directory
    copy({
      patterns: ['data/**/*', 'images/**/*'],
    }),
  ],
  // Specifies two JS output configurations, modern and legacy, which the HTML plugin will
  // automatically choose between; the legacy build is compiled to ES5
  // and SystemJS modules
  output: [
    {
      // Modern JS bundles (no JS compilation, ES module output)
      format: 'esm',
      chunkFileNames: '[name]-[hash].js',
      entryFileNames: '[name]-[hash].js',
      dir: 'build',
      plugins: [htmlPlugin.api.addOutput('modern')],
    },
    {
      // Legacy JS bundles (ES5 compilation and SystemJS module output)
      format: 'esm',
      chunkFileNames: 'legacy-[name]-[hash].js',
      entryFileNames: 'legacy-[name]-[hash].js',
      dir: 'build',
      plugins: [
        htmlPlugin.api.addOutput('legacy'),
        // Uses babel to compile JS to ES5 and modules to SystemJS
        getBabelOutputPlugin({
          compact: true,
          presets: [
            [
              '@babel/preset-env',
              {
                targets: {
                  ie: '11',
                },
                modules: 'systemjs',
              },
            ],
          ],
        }),
      ],
    },
  ],
  preserveEntrySignatures: false,
};

#undefined

snowcrash

#undefined

extract a list of one element from an array of objects

descriptionsList = allResults.map (obj => obj.description)

#undefined

HTML invoice

/* Shivving (IE is not supported, but at least it won't look as awful)

/* ========================================================================== */



(function (document) {

  var

  head = document.head = document.getElementsByTagName('head')[0] || document.documentElement,

  elements = 'article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output picture progress section summary time video x'.split(' '),
8
  elementsLength = elements.length,

  elementsIndex = 0,

  element;



  while (elementsIndex < elementsLength) {

    element = document.createElement(elements[++elementsIndex]);

  }



  element.innerHTML = 'x<style>' +

    'article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block}' +

    'audio[controls],canvas,video{display:inline-block}' +

    '[hidden],audio{display:none}' +

    'mark{background:#FF0;color:#000}' +

#undefined #html #css

My Profile

- 👋 Hi, I’m @murufi

- 👀 I’m interested in ...

- 🌱 I’m currently learning ...

- 💞️ I’m looking to collaborate on ...

- 📫 How to reach me ...



<!---

murufi/murufi is a ✨ special ✨ repository because its `README.md` (this file) appears on your GitHub profile.

You can click the Preview link to take a look at your changes.

--->

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.container {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
}

.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
}
</style>
</head>
<body>

<h2>Responsive Iframe</h2>
<h3>Maintain Aspect Ratio 16:9</h3>
<p>Resize the window to see the effect.</p>

<div class="container"> 
  <iframe class="responsive-iframe" src="https://www.youtube.com/embed/tgbNymZ7vqY"></iframe>
</div>

</body>
</html>

#undefined

Search a string for a given value

let cadesCheck = searchValue.includes("cade");
    if (cadesCheck){
    $w('#btnCadesDropbox').show();
}

#undefined

Simple Food Cards Design

<div class="container">

   <div class="art-board">

      <div class="art-board__container">

         <div class="card">

            <div class="card__image">

               <img src="https://images.pexels.com/photos/4077/pexels-photo-1640777.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500" alt="Salad" />
7
            </div>

            <div class="card__info">

               <div class="car__info--title">

                  <h3>Salad</h3>

                  <p>Fresh & sweet</p>

               </div>

               <div class="card__info--price">

                  <p>$ 5</p>

                  <span class="fa fa-star checked"></span>
16
                  <span class="fa fa-star checked"></span>

                  <span class="fa fa-star checked"></span>

                  <span class="fa fa-star checked"></span>

                  <span class="fa fa-star checked"></span>

               </div>

            </div>

         </div>

#undefined

A Pen by gekkkk

#undefined

grid-template-areas

/* Grid */

.grid {

  display: grid;

}



.logo {

  grid-area: logo;

}



.nav {

  grid-area: nav;

}



.content {

  grid-area: content;

}



.sidenav {

  grid-area: sidenav;

}



.advert {

  grid-area: advert;

}

#undefined

grid-template-areas

<div>

<h1>grid-template-areas</h1>

<section class="grid grid-template-areas-1">

  <div class="item logo">logo</div>

  <div class="item nav">nav</div>

  <div class="item content">content</div>

  <div class="item sidenav">sidenav</div>

  <div class="item advert">advert</div>

  <div class="item footer">footer</div>

</section>

</div>



<div>

<h1>grid-template-areas</h1>

<section class="grid grid-template-areas-2">

  <div class="item logo">logo</div>

  <div class="item nav">nav</div>

  <div class="item content">content</div>

  <div class="item sidenav">sidenav</div>

  <div class="item advert">advert</div>

  <div class="item footer">footer</div>

</section>

</div>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
  box-sizing: border-box;
}

#myInput {
  background-image: url('/css/searchicon.png');
  background-position: 10px 12px;
  background-repeat: no-repeat;
  width: 100%;
  font-size: 16px;
  padding: 12px 20px 12px 40px;
  border: 1px solid #ddd;
  margin-bottom: 12px;
}

#myUL {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

#myUL li a {
  border: 1px solid #ddd;
  margin-top: -1px; /* Prevent double borders */
  background-color: #f6f6f6;
  padding: 12px;
  text-decoration: none;
  font-size: 18px;
  color: black;
  display: block
}

#myUL li a:hover:not(.header) {
  background-color: #eee;
}
</style>
</head>
<body>

<h2>My Phonebook</h2>

<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name">

<ul id="myUL">
  <li><a href="#">Adele</a></li>
  <li><a href="#">Agnes</a></li>

  <li><a href="#">Billy</a></li>
  <li><a href="#">Bob</a></li>

  <li><a href="#">Calvin</a></li>
  <li><a href="#">Christina</a></li>
  <li><a href="#">Cindy</a></li>
</ul>

<script>
function myFunction() {
    var input, filter, ul, li, a, i, txtValue;

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
  box-sizing: border-box;
}

#myInput {
  background-image: url('/css/searchicon.png');
  background-position: 10px 12px;
  background-repeat: no-repeat;
  width: 100%;
  font-size: 16px;
  padding: 12px 20px 12px 40px;
  border: 1px solid #ddd;
  margin-bottom: 12px;
}

#myUL {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

#myUL li a {
  border: 1px solid #ddd;
  margin-top: -1px; /* Prevent double borders */
  background-color: #f6f6f6;
  padding: 12px;
  text-decoration: none;
  font-size: 18px;
  color: black;
  display: block
}

#myUL li a:hover:not(.header) {
  background-color: #eee;
}
</style>
</head>
<body>

<h2>My Phonebook</h2>

<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name">

<ul id="myUL">
  <li><a href="#">Adele</a></li>
  <li><a href="#">Agnes</a></li>

  <li><a href="#">Billy</a></li>
  <li><a href="#">Bob</a></li>

  <li><a href="#">Calvin</a></li>
  <li><a href="#">Christina</a></li>
  <li><a href="#">Cindy</a></li>
</ul>

<script>
function myFunction() {
    var input, filter, ul, li, a, i, txtValue;

#undefined

Edit Plugins ‹ Grossworth — WordPress

<?php



/**

 * Plugin Name: TeraWallet

 * Plugin URI: https://wordpress.org/plugins/woo-wallet/

 * Description: The leading wallet plugin for WooCommerce with partial payment, refunds, cashbacks and what not!

 * Author: WCBeginner

 * Author URI: https://wcbeginner.com/

 * Version: 1.3.

 * Requires at least: 4.4

 * Tested up to: 6.0

 * WC requires at least: 3.0

 * WC tested up to: 6.5

 * 

 * Text Domain: woo-wallet

 * Domain Path: /languages/

 *

 *

 * This program is free software: you can redistribute it and/or modify

 * it under the terms of the GNU General Public License as published by

 * the Free Software Foundation, either version 3 of the License, or

 * (at your option) any later version.

 *
24
 * This program is distributed in the hope that it will be useful,

 * but WITHOUT ANY WARRANTY; without even the implied warranty of

 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

 * GNU General Public License for more details.

 *

 * You should have received a copy of the GNU General Public License

 * along with this program. If not, see <http://www.gnu.org/licenses/>.

 */



if ( ! defined( 'ABSPATH' ) ) {

    exit;

}

#undefined

microvania

const gc = document.querySelector('#game_console')
const ga = document.querySelector('#game_alert')
const gc_loc = gc.getBoundingClientRect()
const pl = document.querySelector('#player')
var cols = 48 // multiple of 16
var rows = 27 // multiple of 9
const tile_size = gc_loc.width*(100/cols/100)
document.body.style.setProperty('--tile-line-height', tile_size+'px')

pl.style.top = (tile_size*13) + 'px'
pl.style.left = (tile_size*27) + 'px'
var pl_loc = pl.getBoundingClientRect() 
gc.style.width = '1000px'
gc.style.height = tile_size*rows+'px'

var gravity = 8,
    kd,
    x = pl_loc.left,
    x_speed = 5,
    pb_y = 0,
    score = 0,
    rot = 0,
    data_p = 0,
    bonus = 1,
    dead = false,
    kd_list = [],
    d = {},
    highjump = false,
    timer = 0;

const level = [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,0,1,1,1,1,1,1,1,0,0,0,0,1,1,1,1,1,1,1,0,
               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,8,1,9,9,1,1,1,1,1,0,0,0,1,1,1,1,1,1,1,0,
               0,1,0,1,1,1,1,0,0,0,1,1,0,0,0,1,1,0,0,0,0,0,1,1,1,0,1,1,0,0,0,1,1,1,1,1,1,1,0,0,1,1,1,0,0,1,1,0,
               0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,0,0,0,1,1,1,1,1,1,1,1,0,0,1,1,0,1,1,1,0,
               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,1,1,0,0,0,1,1,1,1,1,1,1,1,0,1,1,1,0,1,1,1,0,
               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,0,0,0,1,1,1,1,1,1,1,1,0,1,1,0,0,1,1,0,0,
               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,1,1,0,1,1,0,0,0,0,0,0,1,1,1,1,1,0,1,1,1,0,1,1,1,0,
               0,1,1,1,0,2,2,0,0,0,2,2,0,0,0,2,2,0,0,1,0,0,1,1,1,0,1,1,0,0,0,1,1,1,1,1,0,0,0,0,0,1,1,0,1,1,1,0,
               0,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,0,1,1,0,0,1,1,0,
               0,1,1,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,1,1,1,1,1,1,1,1,0,0,1,0,1,1,1,0,
               0,1,1,1,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,1,1,1,1,1,1,9,1,1,1,1,0,1,1,1,0,
               0,0,1,1,0,1,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,1,1,0,2,2,0,1,1,1,1,1,1,0,1,1,0,0,
               0,1,1,1,0,0,0,0,0,2,2,0,2,2,0,2,1,0,0,0,0,0,1,0,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,0,
               0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,
               0,1,1,1,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,1,1,9,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,,1,0,
               0,1,1,1,0,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,1,8,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,0,1,1,0,
               0,0,1,1,0,0,0,1,1,1,1,0,0,0,0,0,0,1,1,1,1,1,1,0,1,1,0,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,
               0,1,1,1,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,0,1,1,1,1,1,1,0,1,1,1,1,1,1,1,1,1,1,1,1,1,0,
               0,1,1,1,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,1,0,0,1,1,1,1,0,1,0,1,1,1,1,1,1,1,1,1,1,1,1,0,0,
               0,1,1,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,0,1,1,1,0,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0,0,0,
               0,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,1,1,1,1,1,1,0,1,1,0,0,1,1,1,1,1,0,0,1,1,1,1,1,1,1,1,1,1,1,0,0,
               0,0,1,1,1,1,1,1,1,0,1,1,1,0,0,0,1,1,1,1,1,1,1,0,0,1,0,1,1,1,1,1,1,0,0,0,1,1,1,1,1,1,1,1,1,1,1,0,
               0,0,0,1,1,1,1,0,1,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,1,1,0,1,1,1,1,0,0,0,0,0,0,0,0,0,0,1,1,1,0,
               0,0,0,1,0,1,1,0,2,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,0,1,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,
               0,0,0,2,0,0,2,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,2,2,0,2,0,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,
               0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]

function buildGame(){
  for(var i=0;i<cols*rows;i++) {
    var d = document.createElement('div')
    d.className = 'tile'
    if(level[i] == 0) {
      // d.className = Math.random() > .2 ? 'tile ground cube' : 'tile ground stripes'   
      d.className = 'tile ground' 
      // d.style.background = 'dimgray'
    }
    if(level[i] == 2) {
      d.className = 'tile lava'      
    }
    if(level[i] == 8) {
      // d.className = Math.random() > .2 ? 'tile rocket cube' : 'tile rocket stripes'
      d.className = 'tile rocket'
      d.style.background = 'dimgray'
    }
    if(level[i] == 9) {
      d.className = 'tile finalgoal'
      d.style.background = 'goldenrod'
      d.style.borderRadius = '50%'
    }
    if(level[i] == 'B') {
      d.className = 'tile key blue'
      d.style.background = 'dodgerblue'
      d.style.borderRadius = '50%'      
    }
    if(level[i] == 'BD') {
      d.className = 'tile door ground blue'
      d.style.background = 'linear-gradient(to bottom, transparent 20%, dodgerblue 20%, dodgerblue 40%, transparent 40%, transparent 60%, dodgerblue 60%, dodgerblue 80%, transparent 80%'      
    }
    if(level[i] == 'G') {
      d.className = 'tile key green'
      d.style.background = 'limegreen'
      d.style.borderRadius = '50%'      
    }
    if(level[i] == 'GD') {
      d.className = 'tile door ground green'
      d.style.background = 'linear-gradient(to right, transparent 20%, limegreen 20%, limegreen 40%, transparent 40%, transparent 60%, limegreen 60%, limegreen 80%, transparent 80%'      
    }
    if(level[i] == 'P') {
      d.className = 'tile key purple'
      d.style.background = 'MediumOrchid'
      d.style.borderRadius = '50%'      
    }
    if(level[i] == 'PD') {
      d.className = 'tile door ground purple'
      d.style.background = 'linear-gradient(to bottom, transparent 20%, MediumOrchid 20%, MediumOrchid 40%, transparent 40%, transparent 60%, MediumOrchid 60%, MediumOrchid 80%, transparent 80%'      
    }
    if(level[i] == 'H') {
      d.className = 'tile highjump'
      // d.style.background = 'goldenrod'
    }
    d.setAttribute('grid_loc', [i % cols,Math.floor(i/cols)])
    d.style.width = tile_size + 'px'
    d.style.height = tile_size + 'px'
    d.style.position = 'absolute'
    // d.innerHTML = i
    // d.style.outline = '1px dotted gray'
    d.style.left = (i % cols)*tile_size + 'px'
    d.style.top = Math.floor(i/cols)*tile_size + 'px'

    gc.appendChild(d)
  }  

}

buildGame()

function updatePlayer() {
  var pl_loc = pl.getBoundingClientRect()  
  var pl_center = document.elementFromPoint(pl_loc.x + (tile_size*.5), pl_loc.y + (tile_size*.5))
  var pl_xy1 = document.elementFromPoint(pl_loc.x + (pl_loc.width*.25), pl_loc.y + pl_loc.height + (gravity*.5))
  var pl_xy2 = document.elementFromPoint(pl_loc.x + (pl_loc.width*.75), pl_loc.y + pl_loc.height + (gravity*.5))
  var pl_xy3 = document.elementFromPoint(pl_loc.x - (x_speed*.5), pl_loc.y + (pl_loc.height*.5))
  var pl_xy4 = document.elementFromPoint(pl_loc.x + pl_loc.width + (x_speed*.5), pl_loc.y + (pl_loc.height*.5))
  var pl_xy5 = document.elementFromPoint(pl_loc.x + (pl_loc.width*.5), pl_loc.y - (gravity*.5))
  // var pl_xy6 = document.elementFromPoint(pl_loc.x + (pl_loc.width*.5), pl_loc.y + pl_loc.height)

  // console.log(pl_center)

  function endGame() {
    alert('you died')
  }

  //if dead stop, else update player and everything else
  if(!pl_xy1 || !pl_xy2 || dead) {
    endGame()
  } else { 

    // set player top   
    // if player on ground set new top
    if((pl_xy1.classList.contains('ground') ||
        pl_xy2.classList.contains('ground'))) {
      gravity = 0
    } else {
      if(gravity < 8) {
        gravity += .51
      } else {
        gravity = 8
      }      
    }
    pl.style.top = pl_loc.top - gc_loc.top + gravity + 'px'
    // console.log(gravity)    

    // add jump-force
    if(d[38] && gravity == 0) {
      gravity = -8
      if(highjump) {
        gravity = -9
      }
    } 
    if(pl_xy5.classList.contains('ground')) {
      gravity = 5
    }
    pl.style.top = pl_loc.top - gc_loc.top + gravity + 'px'
    // track left/right movement
    if(d[37] && x > gc_loc.x) {
      if(!pl_xy3.classList.contains('ground')) {
        x -= x_speed
        pl.className = ''
        pl.classList.add('goleft')
      } else {
        pl.className = ''
      }
    }
    if(d[39] && x + pl_loc.width < gc_loc.x + gc_loc.width) {
      if(!pl_xy4.classList.contains('ground')) {
        x += x_speed
        pl.className = ''
        pl.classList.add('goright')
      } else {
        pl.className = ''
      }
    }  
    pl.style.left = x - gc_loc.left + 'px'

    if(pl_center.classList.contains('lava')) {
      // console.log('lava')
      pl.style.top = (tile_size*13) + 'px'
      pl.style.left = (tile_size*27) + 'px'
      pl_loc = pl.getBoundingClientRect()
      x = pl_loc.left
    }
    if(pl_center.classList.contains('highjump')) {
      // console.log('lava')
      highjump = true
      pl_center.style.display = 'none'
      ga.innerHTML = 'You got high jump!'
      ga.style.opacity = '1'
      setTimeout(function(){
        ga.style.opacity = '0'
      },4000)      
    }
    if(pl_center.classList.contains('key')) {
      pl_center.style.display = 'none'      
      var clr = pl_center.classList[2]
      ga.innerHTML = 'You got the '+clr+' key!'
      ga.style.opacity = '1'
      setTimeout(function(){
        ga.style.opacity = '0'
      },4000)
      var doors = document.querySelectorAll('.door')
      doors.forEach(function(elm){
        if(elm.classList[3] == clr) {
          elm.classList.remove('ground')          
        }
      })            
    }
    if(pl_center.classList.contains('door')) {
      pl_center.style.display = 'none'
    }
    if(pl_center.classList.contains('finalgoal')) {
      pl_center.style.display = 'none'
      var clr = pl_center.style.background
      var doors = document.querySelectorAll('.rocket')
      doors.forEach(function(elm){
        elm.style.display = 'none'
      })

      setTimeout(function(){
        pl.style.opacity = '0'
        document.body.style.setProperty('--pl-clr', 'transparent')
        document.querySelector('#big_rocket').classList.add('adios')
        setTimeout(function(){
          var time = (timer/30)
          ga.innerHTML = '<h2>YOU WIN!</h2>'+time.toFixed(2)+' seconds'
          ga.style.opacity = '1'
          // setTimeout(function(){
          //   ga.style.opacity = '0'
          // },4000)          
        }, 2250)
      }, 250)      
    }

    timer++
    setTimeout(updatePlayer, 1000/30)
  }  
}

updatePlayer()

window.focus()

ga.innerHTML = 'Arrow keys to move and jump'
ga.style.opacity = '1'
setTimeout(function(){
  ga.style.opacity = '0'
},4000)

window.addEventListener('keydown', function(e) { d[e.which] = true; })
window.addEventListener('keyup', function(e) {   
  d[e.which] = false; 
  pl.className = ''
})

#undefined

microvania

const gc = document.querySelector('#game_console')

const ga = document.querySelector('#game_alert')

const gc_loc = gc.getBoundingClientRect()

const pl = document.querySelector('#player')

var cols = 4 // multiple of 1
6
var rows = 2 // multiple of 
7
const tile_size = gc_loc.width*(0/cols/100)
8
document.body.style.setProperty('--tile-line-height', tile_size+'px')
9

10
pl.style.top = (tile_size*) + 'px'

pl.style.left = (tile_size*) + 'px'

var pl_loc = pl.getBoundingClientRect() 
13
gc.style.width = '1000px'

gc.style.height = tile_size*rows+'px'



var gravity = 8,

    kd,

    x = pl_loc.left,

    x_speed = 5,

    pb_y = 0,

    score = 0,

    rot = 0,

    data_p = 0,

    bonus = 1,

    dead = false,

    kd_list = [],
27
    d = {},

    highjump = false,

    timer = 0;



const level = [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,8,8,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,

               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,8,8,0,1,1,1,1,1,1,1,0,0,0,0,1,1,1,1,1,1,1,0,

               0,1,'B',1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,8,8,8,1,9,1,1,1,1,1,1,0,0,0,1,1,1,1,1,1,1,0,

               0,1,0,1,1,1,1,0,0,0,1,1,0,0,0,1,1,0,0,0,0,0,1,1,1,0,8,8,0,0,0,1,1,1,1,1,1,1,0,0,1,1,1,0,0,1,1,0,

               0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,8,8,0,0,0,1,1,1,1,1,1,1,1,0,0,1,1,0,1,1,1,0,

               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,8,8,0,0,0,1,1,1,1,1,1,1,1,0,1,1,1,0,1,1,1,0,

               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,8,8,0,0,0,1,1,1,1,1,1,1,1,0,1,1,0,0,1,1,0,0,

               0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,1,1,0,8,8,0,0,0,0,0,0,1,1,1,1,1,0,1,1,1,0,1,1,1,0,

               0,1,1,1,0,2,2,0,0,0,2,2,0,0,0,2,2,0,0,2,2,0,1,1,1,0,8,8,0,0,0,1,1,1,1,1,0,0,0,0,0,1,1,0,1,1,1,0,

               0,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,0,1,1,0,0,1,1,0,

               0,'BD','BD',0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,1,1,1,1,1,1,1,1,0,0,1,0,1,1,1,0,

               0,1,1,1,0,1,'G',1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,1,0,

               0,0,1,1,0,1,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,1,1,0,2,2,0,1,1,1,1,1,1,0,'PD','PD',0,0,

               0,1,1,1,0,0,0,0,0,2,2,0,2,2,0,2,2,0,0,0,0,0,0,0,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,0,

               0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,1,1,1,1,1,1,1,'GD',1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,

               0,1,1,1,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,1,1,1,1,1,1,1,'GD',1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,

#undefined

New File

# Sample workflow for building and deploying a Jekyll site to GitHub Pages

name: Deploy Jekyll with GitHub Pages dependencies preinstalled



on:

  # Runs on pushes targeting the default branch

  push:

    branches: ["master"]



  # Allows you to run this workflow manually from the Actions tab

  workflow_dispatch:



# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages

permissions:

  contents: read

  pages: write

  id-token: write



# Allow one concurrent deployment

concurrency:

  group: "pages"

  cancel-in-progress: true



jobs:

  # Build job

  build:

    runs-on: ubuntu-latest

#undefined

CSS Hover Drawer

<head>

  <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Sansita+One|Quicksand">

</head>



<div class="container">

  <div class="drawer">

    <h2>

      Driver's Name

    </h2>

    <p>

      Vote for your favorite driver

    </p>

  </div>

</div>

#undefined

CSS Hover Drawer

.container {

  width: 00px;
3
  height: 300px;

  margin: 0 auto;

  background-image: url(http://pillowparty.me/300/300);

  overflow: hidden;

}



.drawer {

  width: 300px;

  height: 300px;

  margin: 0 auto;

  background-color: #000000;

  opacity: 0.6;

  transition: all 0.6s ease;

  position: relative;

  top: 300px;

}



.container:hover .drawer {

  top: 210px;

}

#undefined

CSS Hover Drawer

.container {

  width: 00px;
3
  height: 300px;

  margin: 0 auto;

  background-image: url(http://pillowparty.me/300/300);

  overflow: hidden;

}



.drawer {

  width: 300px;

  height: 300px;

  margin: 0 auto;

  background-color: #000000;

  opacity: 0.6;

  transition: all 0.6s ease;

  position: relative;

  top: 300px;

}



.container:hover .drawer {

  top: 210px;

}

#undefined

CSS Hover Drawer

.container {

  width: 00px;
3
  height: 300px;

  margin: 0 auto;

  background-image: url(http://pillowparty.me/300/300);

  overflow: hidden;

}



.drawer {

  width: 300px;

  height: 300px;

  margin: 0 auto;

  background-color: #000000;

  opacity: 0.6;

  transition: all 0.6s ease;

  position: relative;

  top: 300px;

}



.container:hover .drawer {

  top: 210px;

}

#undefined

W3Schools Tryit Editor js auslösen

<!DOCTYPE html>
<html>
<body>

<h1>My First JavaScript</h1>

<button type="button"
onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>

<p id="demo"></p>

</body>
</html>

#undefined

hello world

console.log("hello world")

#undefined #python

W3Schools Tryit Editor

for x in "banana":
  print(x)

#undefined #todoo #javascript

Todooo list sample

#undefined

New File

- 👋 Hi, I’m @nellestri

- 👀 I’m interested in ...

- 🌱 I’m currently learning ...

- 💞️ I’m looking to collaborate on ...

- 📫 How to reach me ...



<!---

nellestri/nellestri is a ✨ special ✨ repository because its `README.md` (this file) appears on your GitHub profile.

You can click the Preview link to take a look at your changes.

--->

#undefined #c++

W3Schools Tryit Editor

#include <iostream>
using namespace std;

int main() {
  int myAge = 35;
  cout << "I am " << myAge << " years old.";
  return 0;
}

#undefined #c++

W3Schools Tryit Editor

#include <iostream>
using namespace std;

int main() {
  cout << "Hello World! \n";
  cout << "I am learning C++";
  return 0;
}

#undefined #c++

W3Schools Tryit Editor

#include <iostream>
using namespace std;

int main() {
  cout << "Hello World!";
  return 0;
}

#undefined

Avoca - jquery on page load

<script src="https://code.jquery.com/jquery-3.5.0.min.js"></script>
<script>

$(window).bind('hashchange', function() {
     //code
    console.log('Page has changed')
    startObserving()


});

let observer = new MutationObserver(function (mutations, me) {
$(".lazyload-wrapper").find('img.fd-image').each(function(){
$(this).attr('srcset', $(this).attr('srcset').replace(/jpg(.)+/,'jpg'));
});
})

function startObserving() {
console.log('Starting Observing')
observer.observe(document, {
    childList: true,
    subtree: true,
})
}
startObserving()

</script>

#undefined

W3Schools Tryit Editor

<!DOCTYPE html>
<html>
<body>

<?php
for($f=1;$f<=100;$f++) { 
echo $f; echo "<br>"; 
}

?> 

</body>
</html>

#undefined

navigate sections by up down buttons



// // export function section1_viewportEnter(event) {
// //   $w('#buttonNext').show("roll",rollOptions);
// // 	$w('#sideShapeMain').show("glide",glideOptions);
// //   // $w('#sideShapeMain').show("fade",fadeOptions); 
// //   $w('#logoBgnd').hide("glide",glideOptions2);
// // }

// // export function Section1Regular_viewportEnter(event) {
// // console.log('do something')
// // 	$w('#sideShapeMain').hide("glide",glideOptions); 
// //   // $w('#sideShapeMain').hide("fade",fadeOptions); 
// //   $w('#logoBgnd').show("glide",glideOptions2);
// // }

// function scrollToNextSection(){

//   if (nextSect == "1"){
// 	$w('#section1Top').scrollTo();
//   nextSect = "2";
//   prevSect = "1";

//   } else if (nextSect == "2"){
// 	$w('#section2car').scrollTo();
//   nextSect = "3";
//   prevSect = "2";
 
//   } else if (nextSect == "3"){
// 	$w('#section3Info').scrollTo();
//   nextSect = "2";
//   prevSect = "3";
  
//   } else if (nextSect == "4"){
// 	$w('#section4Carbon').scrollTo();
//   nextSect = "3";
//   prevSect = "4";
  
//   } else if (nextSect == "5"){
// 	$w('#section5RearView').scrollTo();
//   nextSect = "4";
//   prevSect = "5";
  
//   } else if (nextSect == "6"){
// 	$w('#section6Pledge').scrollTo();
//   nextSect = "bottom";
//   prevSect = "6";
  
//   } else if (nextSect == "bottom"){
// 	$w('#buttonNext').hide();
//   nextSect = "bottom";
//   prevSect = "5";
//   }
// }

// function scrollToPrevSection(){
//   if (prevSect == "0"){
// 	$w('#section1Top').scrollTo();
//   $w('#buttonPrev').hide();
//   nextSect = "2";
//   prevSect = "1";

//   } else if (prevSect == "1"){
// 	$w('#section1Top').scrollTo();
//   $w('#buttonPrev').hide();
//   nextSect = "2";
//   prevSect = "1";

//   } else if (prevSect == "2"){
// 	$w('#section2car').scrollTo();
//   nextSect = "3";
//   prevSect = "2";
  
//   } else if (prevSect == "3"){
// 	$w('#section3Info').scrollTo();
//   nextSect = "4";
//   prevSect = "3";
 
//   } else if (prevSect == "4"){
// 	$w('#section4Carbon').scrollTo();
//   nextSect = "5";
//   prevSect = "4";
  
//   } else if (prevSect == "5"){
// 	$w('#section5RearView').scrollTo();
//   nextSect = "6";
//   prevSect = "5";
  
//   } else if (prevSect == "6"){
// 	$w('#section6Pledge').scrollTo();
//   nextSect = "bottom";
//   prevSect = "6";
  
//   } 
// }

// export function buttonNext_click(event) {
// 	scrollToNextSection();
// }

// export function buttonPrev_click(event) {
// 	scrollToPrevSection();
// }

// export function section1Top_viewportEnter(event) {
//   $w('#buttonPrev').show();
// // 	nextSect = "2";
// //   prevSect = "0";
// }

// export function section2car_viewportEnter(event) {
//   $w('#buttonPrev').show();
//   // nextSect = "3";
//   // prevSect = "1";
// }

// // export function section3Info_viewportEnter(event) {
// // 	nextSect = "4";
// //   prevSect = "2";
// // }

// // export function section4Carbon_viewportEnter(event) {
// // 	nextSect = "5";
// //   prevSect = "3";
// // }

// // export function section5RearView_viewportEnter(event) {
// //   $w('#buttonNext').show();
// // 	nextSect = "6";
// //   prevSect = "4";
// // }

// export function section6Pledge_viewportEnter(event) {
//   $w('#buttonNext').hide();
// 	// nextSect = "bottom";
//   // prevSect = "5";
// }

/**
*	Adds an event handler that runs when the mouse pointer is moved
 off of the element.

 You can also [define an event handler using the Properties and Events panel](https://support.wix.com/en/article/velo-reacting-to-user-actions-using-events).
	[Read more](https://www.wix.com/corvid/reference/$w.Element.html#onMouseOut)
*	 @param {$w.MouseEvent} event
*/


/**
*	Adds an event handler that runs when the mouse pointer is moved
 off of the element.

 You can also [define an event handler using the Properties and Events panel](https://support.wix.com/en/article/velo-reacting-to-user-actions-using-events).
	[Read more](https://www.wix.com/corvid/reference/$w.Element.html#onMouseOut)
*	 @param {$w.MouseEvent} event
*/

#undefined

SQL Basics - SQL online course | LearnSQL.com

select * from

mountain,

(select * from

 country where 

 POPULATION> 50000)

 as country_population

where mountain.COUNTRY_ID

=country_population.id

#undefined

get clicked repeater item data

function getGovernorId() {
    $w("#repeaterGov").onItemReady(($item, itemData, index) => {
        $item("#btnEditGov").onClick((event) => {
            let staffId = itemData._id;
            console.log('staffId is ',staffId,itemData.staffName)	
            $w('#datasetGovEdit').setFilter(wixData.filter().eq('_id', staffId));
            collapseAll();
            $w('#stripGovEdit').expand();
        })
    })
}

#undefined

New File

#undefined

(php) La fonction "strpos()"

<?php 

    $title = get_the_title();

    

    // Si le titre contient le mot "promo", j'ajoute un emoji

    if( strpos( $title, 'promo' ) !== false ) {

        $title = '💰' . $title; 

    }

?>

    <h1><?php echo $title; ?></h1>

#undefined

fichier functions.php

<?php 



// Ajouter la prise en charge des images mises en avant

add_theme_support( 'post-thumbnails' );



// Ajouter automatiquement le titre du site dans l'en-tête du site

add_theme_support( 'title-tag' );

#undefined

(fichier web-config.php) Espacer les enregistrements automatiques

<?php

define( 'AUTOSAVE_INTERVAL', 300 ); // 300/60 secondes = 5 minutes

#undefined

(fichier web-config.php) Limiter le nombre de révisions des posts

<?php 

define( 'WP_POST_REVISIONS', 5 ); // C'est bien suffisant !

#undefined

(fichier web-config.php) Désactiver l’éditeur de fichiers

<?php 

define( 'DISALLOW_FILE_EDIT', true );

#undefined

Tryit Editor v3.7

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("p").click(function(){
    $(this).hide();
  });
});
</script>
</head>
<body>

<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>

</body>
</html>

#undefined

A Pen by Ania Sadka

#undefined

PHP To Lower Case

<!DOCTYPE html>
<html>
<body>

<?php
echo strtolower("Hello WORLD.");
?>
   
</body>
</html>

#undefined

PHP String Replace

<!DOCTYPE html>
<html>
<body>

<p>Search the string "Hello World!", find the value "world" and replace it with "Peter":</p>

<?php
echo str_replace("world","Peter","Hello world!");
?>

</body>
</html>

#undefined

Alternative to document execCommand to copy to Clipboard in the Browsers using JavaScript - How To JS

let copyToClipboardButton = document.getElementById('copyToClipboard');

copyToClipboardButton.addEventListener('click', () => {
    let textToCopy = document.getElementById('myDiv').innerText;
    if(navigator.clipboard) {
        navigator.clipboard.writeText(textToCopy).then(() => {
            alert('Copied to clipboard')
        })
    } else {
        console.log('Browser Not compatible')
    }

})

#undefined

Accordion with plus minus icon toggle pure css

#undefined

SQL Fiddle

#undefined

Random Password Generator

import random as r
p = 'abcdefghijklmnopqrstuvwxyz0123456789%^*(-_=+)'           # Population
print(''.join(r.choices(p, k=10)))                       # Return a k sized list of population elements chosen with replacement.

#undefined

SQL Basics - SQL online course | LearnSQL.com

select department,max(salary),min(salary)
from employees
where year=2014
group by department

#undefined

New File

#undefined

PHP Check if Key exist in array

<!DOCTYPE html>
<html>
<body>

<?php
$a=array("Volvo"=>"XC90","BMW"=>"X5");
if (array_key_exists("Volvo",$a))
  {
  echo "Key exists!";
  }
else
  {
  echo "Key does not exist!";
  }
?>

</body>
</html>

#undefined

Tryit Editor v3.7

<!DOCTYPE html>
<html>
<body>

<p>Image to use:</p>

<img id="scream" width="220" height="277"
src="pic_the_scream.jpg" alt="The Scream">

<p>Canvas:</p>

<canvas id="myCanvas" width="240" height="297"
style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.
</canvas>

<script>
window.onload = function() {
    var canvas = document.getElementById("myCanvas");
    var ctx = canvas.getContext("2d");
    var img = document.getElementById("scream");
   ctx.drawImage(img, 10, 10);
};
</script>

</body>
</html>

#undefined

dcm2arr_2 - Jupyter Notebook

img_series_name = sitk.ImageSeriesReader.GetGDCMSeriesFileNames(img_path)

#undefined

photopea

<!DOCTYPE html>
<html>
<body>

<h2>HTML Iframes</h2>
<p>You can use the height and width attributes to specify the size of the iframe:</p>

<iframe src="demo_iframe.htm" height="200" width="300" title="Iframe Example"></iframe>

</body>
</html>

#undefined

SrcShare - Easily Share Code

require("dotenv").config();

const Discord = require("discord.js");

const Sequelize = require("sequelize");

const keep_alive = require("./keep_alive.js");

//const { MessageEmbed } = require('discord.js');

const token = process.env["DISCORD_BOT_SECRET"];

const prefix = "!";

#undefined

SrcShare - Easily Share Code

require("dotenv").config();

const Discord = require("discord.js");

const Sequelize = require("sequelize");

const keep_alive = require("./keep_alive.js");

//const { MessageEmbed } = require('discord.js');

const token = process.env["DISCORD_BOT_SECRET"];

const prefix = "!";

#undefined

SrcShare - Easily Share Code

require("dotenv").config();

const Discord = require("discord.js");

const Sequelize = require("sequelize");

const keep_alive = require("./keep_alive.js");

//const { MessageEmbed } = require('discord.js');

const token = process.env["DISCORD_BOT_SECRET"];

const prefix = "!";

#undefined

Glassmorphism

 <link rel="preconnect" href="https://fonts.gstatic.com">

<link href="https://fonts.googleapis.com/css2?family=Fira+Code&display=swap" rel="stylesheet">

<link href="https://fonts.googleapis.com/css2?family=Acme&display=swap" rel="stylesheet">

<div class="wrapper">

            <div class="box">

                <div class="description">

                    <h2>Box 1</h2>

                    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. A sunt rem magni quasi tempore alias nostrum mollitia delectus cupiditate hic unde minima quis officiis, quidem quae quisquam, aperiam porro fugiat?</p>

                    <ul class="list">

                        <li><a href="https://twitter.com/sudo_Jayasree" target="_blank" rel="noopener noreferrer"><i class="fab fa-twitter"></i></a></li>

                        <li><a href="https://github.com/Jayasree77"><i class="fab fa-github"></i></a></li>

#undefined

vanilla tilt

 <link rel="preconnect" href="https://fonts.gstatic.com">

<link href="https://fonts.googleapis.com/css2?family=Fira+Code&display=swap" rel="stylesheet">

<link href="https://fonts.googleapis.com/css2?family=Acme&display=swap" rel="stylesheet">

<div class="wrapper">

            <div class="box">

                <div class="description">

                    <h2>Box 1</h2>

                    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. A sunt rem magni quasi tempore alias nostrum mollitia delectus cupiditate hic unde minima quis officiis, quidem quae quisquam, aperiam porro fugiat?</p>

                    <ul class="list">

                        <li><a href="https://twitter.com/sudo_Jayasree" target="_blank" rel="noopener noreferrer"><i class="fab fa-twitter"></i></a></li>

                        <li><a href="https://github.com/Jayasree77"><i class="fab fa-github"></i></a></li>

#undefined

Tryit Editor v3.7

<!DOCTYPE html>
<html>
<body>

<h2>Iframe - Target for a Link</h2>

<iframe src="demo_iframe.htm" name="iframe_a" height="300px" width="100%" title="Iframe Example"></iframe>

<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a></p>

<p>When the target attribute of a link matches the name of an iframe, the link will open in the iframe.</p>

</body>
</html>

#undefined

Hide Prices and Payment on Checkout - Heineken

<style>

<!--ORDERING TEMPLATE: NO PRICES OR PAYMENT-->
/*CHANGE PER LANGUAGE*/
:root {
--checkout-pay-button: "Place an Order"!important;
}
.fd-page.fd-page__order-checkout button[data-fd="checkout-place-order"] .buttonState:after{
    content:"Place Order";
    font-size:20px!important;
    margin-top:4px!important;
}
#flipdish-menu section.fd-content__side .fd-section__profile-panel{
    display:none!important;
}
<!--END ORDERING TEMPLATE: NO PRICES OR PAYMENT-->


</style>
<link rel="stylesheet" href="https://d2bzmcrmv4mdka.cloudfront.net/production/ordering-system/noPricesOrPayment/production-v1.min.css">

#undefined

Create beautiful images of your code

Different type of tages
1 . commets Tag <%--  this is Jsp comment  --%>
2 . Declarations Tag  <%! int a,b,c  %>
3.  Directives Tag <%@ import="java.sql.*" %>
4.  Expressions Tag <%= expression %>
5.  Scriplets Tag <% Code fragment %>

#undefined

GRADIENT BKGRD

<!DOCTYPE html>
<html lang="en">


	<link rel="stylesheet" href="https://filedn.com/lemwFTMODslJcMYhfh17Ldk/CSS-Animated-Gradient-Backgrounds/css/dark.css" /
   
    
	
</head>


	<div class="gradient-bg">

	</div>
	

</body>

</html>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

ANIMATED BACKGROUND

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

#codevember 16/01 — Frustradient

<div class="c c1"></div>

<div class="c c2"></div>

<!-- todo: make the gradient code exportable -->

#undefined

#codevember 16/01 — Frustradient

<div class="c c1"></div>

<div class="c c2"></div>

<!-- todo: make the gradient code exportable -->

#undefined

Bootstrap scroll spy example

[data-spy] {

  height: 200px;

  overflow: auto;

}

#undefined

HTML Editor - Free Online Instant WYSIWYG

#undefined

Numero 1 a 50

#include<stdio.h>
#include<locale.h> 

   {

    int num;

        setlocale(LC_ALL,"Portuguese");
        printf("\n\t Imprimir os números de 1 até 50 : \n"); 
        for(num=1;num<=50;num++)
     {
        printf(" %d\n",num);
     }
   return 0;
}

#undefined

email template

@import url(https://fonts.googleapis.com/css?family=Nunito);
 @import url(https://fonts.googleapis.com/css?family=Nunito); 

#outlook a {
      padding: 0;
    }

    body {
      margin: 0;
      padding: 0;
      -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
    }

    table,
    td {
      border-collapse: collapse;
      mso-table-lspace: 0pt;
      mso-table-rspace: 0pt;
    }

    img {
      border: 0;
      height: auto;
      line-height: 100%;
      outline: none;
      text-decoration: none;
      -ms-interpolation-mode: bicubic;
    }

    p {
      display: block;
      margin: 13px 0;
    }
 

    @media only screen and (min-width:480px) {
      .mj-column-per-100 {
        width: 100% !important;
        max-width: 100%;
      }
    }
  

    .moz-text-html .mj-column-per-100 {
      width: 100% !important;
      max-width: 100%;
    }
 
    [owa] .mj-column-per-100 {
      width: 100% !important;
      max-width: 100%;
    }
  
    @media only screen and (max-width:480px) {
      table.mj-full-width-mobile {
        width: 100% !important;
      }

      td.mj-full-width-mobile {
        width: auto !important;
      }
    }

#undefined

email template

<div style="background-color: rgb(5, 255, 255); margin: 0px auto; text-align: justify;">Have you experienced water leak damage before?
2
  <img src="https://0tnw.mjt.lu/img/04tnw/b/r2/pjqo.png" style="max-width: 0%" width="500"></div>

<div style="align-self: middle; margin: 10px 0px; font-family: Arial, sans-serif; font-size: 15px; letter-spacing: normal; line-height: 1; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);">Hi,</div>
4
<div style="text-align: justify; margin: 10px 0px; font-family: Arial, sans-serif; font-size: 15px; letter-spacing: normal; line-height: 1; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);">I’m Dayna from Custos Home. I know how precious your home is to you. You have the right to want to live in peace in this house where you have made so many sacrifices. Do you know, every year, about <strong>one in 50 homeowners files a water damage</strong> or freezing claim, <strong>accounting for 2% of all homeowners insurance claims</strong>, according to the Insurance Information Institute? The <strong>average cost of a water damage or freezing claim is $,09.</strong></div>
5
<div style="text-align: justify; margin: 10px 0px; font-family: Arial, sans-serif; font-size: 15px; letter-spacing: normal; line-height: 1; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);">With Custos, protect your living space from flooding and save money. Also, check the status of your home and control the water valve remotely with Custos App.</div>

<div style="margin: 10px 0px; font-family: Arial, sans-serif; font-size: 15px; letter-spacing: normal; line-height: 1; text-align: left; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);">&nbsp;</div>
7
<div style="background-color: rgb(255, 255, 255); margin: 0px auto;"><img style="align-self:middle;" src="https://04tnw.mjt.lu/img/04tnw/b/r27/pjno.gif" style="max-width: 100%" width="240"></div>
8
<div style="text-align: justify; margin: 10px 0px; font-family: Arial, sans-serif; font-size: 16px; letter-spacing: normal; line-height: 1; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);">As a matter of fact, <strong>14 thousand homeowners were impacted by water leak damage</strong> every day and have to seek urgent solutions. In addition, <strong>37% of these homeowners cause serious damage</strong> to their homes due to these leaks and flooding.</div>
9
<div style="text-align: justify; margin: 10px 0px; font-family: Arial, sans-serif; font-size: 16px; letter-spacing: normal; line-height: 1; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);">Even if your insurance covers some or all of the damage, many intangible treasures in your home can be irreversibly damaged or destroyed.</div>
10
<div style="text-align: justify; margin: 10px 0px; font-family: Arial, sans-serif; font-size: 16px; letter-spacing: normal; line-height: 1; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);">Custos comes to you with a great solution. This is a very practical, hassle-free, effortless, and extremely affordable solution: Custos Kit.</div>
11
<div style="margin: 10px 0px; font-family: Arial, sans-serif; font-size: 16px; letter-spacing: normal; line-height: 1; text-align: left; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);">&nbsp;</div>

<div style="background-color: rgb(255, 255, 255); margin: 0px auto;"><img src="https://04tnw.mjt.lu/img/04tnw/b/r27/pjng.jpeg" style="max-width: 100%" width="400"></div>

<div style="text-align: justify; margin: 10px 0px; font-family: Arial, sans-serif; font-size: 15px; letter-spacing: normal; line-height: 1; color: rgb(0, 0, 0); direction: ltr; background-color: rgb(255, 255, 255);"><strong>Custos Kit is a DIY Water Leak Damage Prevention solution</strong>. It includes a Valve Servo to control the water valve, two leak sensors to detect leaks and tell the valve servo to take action, and a Gateway to connect the kit to the internet so <strong>you can monitor and control your home remotely.</strong></div>

#undefined

email template

#undefined

Calculate Width

width: calc(100% - 300px) !important;

#undefined

הסתרת מוצרים שאינם במלאי

add_action( 'pre_get_posts', 'njengah_hide_out_of_stock_products' );

function njengah_hide_out_of_stock_products( $query ) {

  if ( ! $query->is_main_query() || is_admin() ) {
    return;
  }

     if ( $outofstock_term = get_term_by( 'name', 'outofstock', 'product_visibility' ) ) {

     $tax_query = (array) $query->get('tax_query');

      $tax_query[] = array(
      'taxonomy' => 'product_visibility',
      'field' => 'term_taxonomy_id',
      'terms' => array( $outofstock_term->term_taxonomy_id ),
      'operator' => 'NOT IN'
   );

  $query->set( 'tax_query', $tax_query );

}

  remove_action( 'pre_get_posts', 'njengah_hide_out_of_stock_products' );

}

#undefined

Leap Year

def is_leap(year):

    if year%4 == 0:

        leap = True

        if year % 100 == 0:

            leap = True

            if year % 400 ==0 :

                leap = True

            else:

                leap = False

        else:

            leap = True

    else:

        leap = False



    return leap



year = int(input())

print(is_leap(year))

#undefined

preload_product_page_featured_page_automatic

function preload_product_page_featured_page_automatic() {
    if ( is_product() ){
		$attachment_ids[0] = get_post_thumbnail_id( $product->id );
		$attachment_full = wp_get_attachment_image_src($attachment_ids[0], 'full' );
     	$attachment = wp_get_attachment_image_src($attachment_ids[0], 'woocommerce_single' );
		$attachment_mobile = wp_get_attachment_image_src($attachment_ids[0], 'woo-product-single-image-size-hook' );
echo ''. PHP_EOL .'<!-- Preload Product Page First Featured Image -->'. PHP_EOL .'<link rel="preload" href="' .$attachment[0]. '" as="image">'. PHP_EOL .'<!-- End Preload Product Page First Featured Image -->';	
}
 
}
add_action( 'wp_head', 'preload_product_page_featured_page_automatic');

#undefined

Redirect Wordpress page

<script>
window.location.replace("https://thegravyboatcarvery.co.uk/order-online/");
</script>

#undefined

שינוי טקסט

/*Change text strings */
function my_text_strings( $translated_text, $text, $domain ) {
    switch ( $translated_text ) {
        case 'סכום ביניים' :
            $translated_text = __( 'סה"כ', 'woocommerce' );
            break;
            case 'תשלום' :
            $translated_text = __( 'לתשלום', 'woocommerce' );
            break;
            case 'מעבר לסל הקניות' :
            $translated_text = __( 'סל קניות', 'woocommerce' );
            break;
			case 'לא נמצאו מוצרים בעגלת הקניות.' :
            $translated_text = __( 'הסל שלך ריק לבנתיים :), תבלי!', 'woocommerce' );
            break;
    }
    return $translated_text;
}
add_filter( 'gettext', 'my_text_strings', 20, 3 );

#undefined

stack like data structure kotlin

/**
 * You can edit, run, and share this code.
 * play.kotlinlang.org
 */
fun main() {
    val numbers = listOf(1,2,3,4)
    
    var numSet: MutableSet<Int> = mutableSetOf()
    
    for (number in numbers) {
        numSet.add(number)
    }
    
    println(numSet.size == numbers.size)
    
}

#undefined

sytem slowed while flattening

# system slowed
list_ = [0, [2, 3, [5, 4], 6, 5], [3, 4, 5], 6, 7, 9]
list1 = []
for item in list_:
    if type(item)== list:
        while type(item)== list:
            list1.extend(item)
    else:
        list1.append(item)
#         if type(item)== list:
#             list1.extend(item)
#         elif type(item)!= list:
print(list1)

#undefined

kernel died while flattening lists

# Dead after running

list_ = [0, [2, 3, [5, 4], 6, 5], [3, 4, 5], 6, 7, 9]

def flattening(list_):
    list1 = []
    for item in list_:
        if type(item)!= list:
            list1.append(item)
        else: # type(item)!= list:
            list1.extend(item)
            return flattening(list_); 
    print(list1)

flattening(list_)

#undefined

Elixir Top Banner (links to order page)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
window.addEventListener('DOMContentLoaded', (event) => {
var newNode = document.createElement('div');
newNode.classList.add("bannernew");
newNode.insertAdjacentHTML('beforeend',`SEASONAL OFFER: ORDER A TORTA AND GET A $1 DRIP COFFEE. ORDER NOW`,);
// Get the reference node
var referenceNode = document.querySelector('#header');
// Insert the new node before the reference node
referenceNode.parentNode.insertBefore(newNode, referenceNode);
$('div.bannernew').each(function() {
  var link = $(this).html();
  $(this).contents().wrap('<a href="/order"></a>');
});
});
</script>
@media only screen and (min-width: 600px) {
    body #header{
       padding-top:35px!important;
   }
.bannernew{
    position:absolute;
    text-align:center;
    background:#da291c;
    z-index:9999999999!important;
    top:0;
    width:100%;
    height:35px;
    font-size:20px;
    padding-top:5px;
}
.bannernew a {
    color: white !important;
}
}
@media only screen and (max-width: 600px) {
    body #header{
       padding-top:40px!important;
   }
.bannernew{
    position:absolute;
    text-align:center;
    background:#da291c;
    z-index:9999999999!important;
    top:0;
    width:100%;
    height:40px;
    font-size:14px;
   padding-top:5px;
}
.bannernew a {
    color: white !important;
    font-size: 14px;
}
}

#undefined

Infinite loop

from itertools import count

for i in count(0):

    print("1 w1ll n0t st0p")

#undefined

Infinite loop

for _ in iter(int, 1):

    print("i will not stop")

#undefined

Antigravity

#import the below module and see what happens
import antigravity
#NOTE - it wont work on online ide

#undefined

Lazy loading images using IntersectionObserver - example code

document.addEventListener("DOMContentLoaded", function() {

  var lazyloadImages;    



  if ("IntersectionObserver" in window) {

    lazyloadImages = document.querySelectorAll(".lazy");

    var imageObserver = new IntersectionObserver(function(entries, observer) {

      entries.forEach(function(entry) {

        if (entry.isIntersecting) {

          var image = entry.target;

          image.src = image.dataset.src;

          image.classList.remove("lazy");

          imageObserver.unobserve(image);

        }

      });

    });



    lazyloadImages.forEach(function(image) {

      imageObserver.observe(image);

    });

  } else {  

    var lazyloadThrottleTimeout;

    lazyloadImages = document.querySelectorAll(".lazy");

#undefined

Lazy loading images using event handlers - example code

document.addEventListener("DOMContentLoaded", function() {

  var lazyloadImages = document.querySelectorAll("img.lazy");    

  var lazyloadThrottleTimeout;

  

  function lazyload () {

    if(lazyloadThrottleTimeout) {

      clearTimeout(lazyloadThrottleTimeout);

    }    

    

    lazyloadThrottleTimeout = setTimeout(function() {

        var scrollTop = window.pageYOffset;

        lazyloadImages.forEach(function(img) {

            if(img.offsetTop < (window.innerHeight + scrollTop)) {

              img.src = img.dataset.src;

              img.classList.remove('lazy');

            }

        });

        if(lazyloadImages.length == 0) { 

          document.removeEventListener("scroll", lazyload);

          window.removeEventListener("resize", lazyload);

          window.removeEventListener("orientationChange", lazyload);

        }

#undefined

how props work!

function Welcome(props) {

  return <h1>Hello, {props.name}</h1>;

}



const root = ReactDOM.createRoot(document.getElementById('root'));

const element = <Welcome name="Sara" />;

root.render(element);

#undefined

Function Recursion

def tri_recursion(k):
  if(k > 0):
    result = k + tri_recursion(k - 1)
    print(result)
  else:
    result = 0
  return result

print("\n\nRecursion Example Results")
tri_recursion(6)

#undefined

Editing central/order-source.ts at SYSOP-1363-InconsistenciesBetweenShipmentItems · whitebox-co/central

/**

 * Where the order was created at time of whitebox ingestion.

 *

 * e.g. Tasks, API, EDI, etc.

 */

export type OrderSource =

  | 'AUTOMATION'

  | 'AMAZON'

  | 'SHOPIFY'

  | 'API'

  | 'WOOCOMMERCE'

  | 'SS_CREATE'

  | 'BIGCOMMERCE'

  | 'DASHBOARD'

  | 'MANUAL'

  | 'WHOLESALE'

  | 'EDI'

  | 'SHIPSTATION_TASK'

  | 'GOOGLE_CLOUD_FUNCTION'

  | 'TASKS'

  | 'WEBHOOK'

  | 'SCHEDULED';

#undefined

pivot_table drop lever

df_pivot=df.pivot_table(index=['date'],columns=['trip_type'],values=['weekday','weekend'],aggfunc=np.sum)

df_pivot.columns=df_pivot.columns.droplevel(0)

#undefined

Merge

output=df.merge(flattened,how='left',left_on='account_id',right_on='account_id')

#undefined

A Pen by SaHul

#undefined

DartPad

void main() {
  getNumber();
}

getNumber () {
  print ("Hello");
}

#undefined #child

Edit Themes ‹ Bruna Carolina Santos — WordPress

/*
Theme Name:     Twenty Seventeen Child
Theme URI:      https://wordpress.org/themes/twentyseventeen-child/
Description:    Tema Child per il tema Twenty Thirteen
Author:         Bruna Carolina Santos
Author URI:     
Template:       twentyseventeen
Version:        2.8-wpcom
*/

#undefined

Edit Themes ‹ Bruna Carolina Santos — WordPress

#undefined

Customiser Dark Theme

<style>
  /* Root Variables */
  
    :root {
      --fd_Font: inherit;
      --fd_Dark: #ffffff;
      --fd_Bodytext: #d1d1d1;
      --fd_Subtletext: #b7b7b7;
      --fd_Disabledtext: #7d7d7d;
      --fd_Light: #ababab;
      --fd_Pale: #4f4f4f;
      --fd_Background: #000000;
      --fd_Danger: #D80034;
      --fd_Warning: #FF5B21;
      --fd_Success: #1EBA63;
      --fd_Info: #4E65E1;
      --fd_Transparent: transparent;
    }
  </style>
  <link rel="stylesheet" href="https://d2bzmcrmv4mdka.cloudfront.net/production/ordering-system/chromeExtension/production-v1.min.css">

#undefined

A Pen by Daron

<div class="msgBox msgBox__container bg-light-grey">

  

  <section class="topBar bg-grey">

    <a href="#" class="round arrowBox bg-white"><div class="arrow down"></div></a>

  </section>

  

  <section class="user">

    <div class="avatarBox">

        <img class="round avatar" src="https://lh3.googleusercontent.com/DzXJfgqnFZmEOerX1XWEBm5F0udVmtx7Wkl6WSmL1in8fzHhZAml4hGERWmFh0buKmGUTeIttb9Go6sRjmE=rw">

      <div class="user__status round bg-pink"></div>

    </div>

    <div class="user__nameContainer">

      <div class="user__detail mid-grey">Kerem Suer</div>

      <div class="user__detail light-grey">Contributor</div>

    </div>

    <button class="btn">Block</button>

  </section>



  <section class="user">

    <div class="avatarBox">

        <img class="round avatar" src="https://lh3.googleusercontent.com/DzXJfgqnFZmEOerX1XWEBm5F0udVmtx7Wkl6WSmL1in8fzHhZAml4hGERWmFh0buKmGUTeIttb9Go6sRjmE=rw">

#undefined

Centrar Imagen - FlexBox

// NO JS

#undefined

find out whether the radio button is checked, or not

<!DOCTYPE html>
<html>
<body>

Radio button:<input type="radio" id="myRadio" checked>

<p>Click the "Try it" button to find out whether the radio button is checked, or not.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
  var x = document.getElementById("myRadio").checked;
  document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

#undefined

Untitled1 - Jupyter Notebook

model training and testing

#undefined

Light and Dark theme React with Less and CSS variables

const LIGHT_THEME = 'light-theme';

const DARK_THEME = 'dark-theme';



const ThemeContext = React.createContext();



function ThemeWrapper({ children }) {

  const [theme, setTheme] = React.useState(LIGHT_THEME);

  

  const applyTheme = (newTheme) => {

    document.getElementById('app').className = newTheme;

    setTheme(newTheme);

  }

  

  return (

    <ThemeContext.Provider value={{ theme, applyTheme }}>

      {children}

    </ThemeContext.Provider>

  )

}

#undefined

Simple React Dark Mode.

function Header() {

  const [ darkMode, setDarkMode ] = React.useState(false)

   

  React.useEffect(() => {

    const body = document.body

    const toggle = document.querySelector('.toggle-inner')

    

    // If dark mode is enabled - adds classes to update dark-mode styling.

    // Else, removes and styling is as normal.

    if( darkMode === true ) {

      body.classList.add('dark-mode')

      toggle.classList.add('toggle-active')

    } else {

      body.classList.remove('dark-mode')

      toggle.classList.remove('toggle-active')

    }

  }, [darkMode])

  

  return (

#undefined

Copy/paste contacts

#undefined

mobile menu close

<script>
    jQuery(document).ready(function() {

        jQuery("#dd-menu-mobile ul li a").attr("onclick", "menuClose()");
        jQuery(".dd-cta-close").attr("onclick", "menuClose()");

    });

    function menuClose() {
        var element = document.getElementById("dd-section");
        element.classList.toggle("dd-m-menu");
    }

</script>

#undefined

Slick Carousel smooth scroll

$('#gallery').slick({

  slidesToShow: ,

  slidesToScroll: 1,

  autoplay: true,

  autoplaySpeed: 0,
6
  speed: 000,

  pauseOnHover: false,
8
  cssEase: 'linear'

});

#undefined

filter array with rest operator

https://jsbin.com/

#undefined

New File

# creak-engine

#undefined

1 chisi ohshadimi

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>

<p id="demo"></p>

<script>
const d = new Date("03/25/2015");
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

#undefined

Terminator Shell Shortcuts

There are several keyboard shortcuts available:

Ctrl-Shift-E: Split the view vertically.
Ctrl-Shift-O: Split the view horizontally.
Ctrl-Shift-P: Focus be active on the previous view.
Ctrl-Shift-N: Focus be active on the next view.
Ctrl-Shift-W: Close the view where the focus is on.
Ctrl-Shift-Q: Exit terminator.
Ctrl-Shift-X: Enlarge active window
Ctrl-Alt-W: Edit window title

#undefined

https://www.codegrepper.com

https://www.codegrepper.com

#undefined

30 Seconds of Knowledge - Snippet

.hover-shadow-box-animation {

  display: inline-block;

  vertical-align: middle;

  transform: perspective(1px) translateZ(0);

  box-shadow: 0 0 1px transparent;

  margin: px;

  transition-duration: 0.3s;

  transition-property: box-shadow, transform;

}
10
.hover-shadow-box-animation:hover,

.hover-shadow-box-animation:focus,

.hover-shadow-box-animation:active {

  box-shadow: 1px 10px 10px -10px rgba(0, 0, 24, 0.5);

  transform: scale(1.2);

}

#undefined

Blur below iframe

<head>
<style>
  body{
  //background-color: transparent;
background-color: rgba(0,0,0,0.3);
 backdrop-filter: blur(10px);
  }
</style>
</head>

#undefined

Insert Headers and Footers ‹ Private Tutoring & Test Prep Services — WordPress

<script id="frase-script" data-hash="1eb88405a45a439c" src="https://app.frase.io/js/libraries/bot.js"></script>
2
<script src="https://p-visitor-tracking.s3.ap-south-1.amazonaws.com/tracking.js" id="traek_script&VHoUzzXKDkZl38AOS1RdlSKtQCenzGSh"></script>
3
<meta name="google-site-verification" content="L_vGUaI3AOGtve31I11D844-h8hDqtjlsZxqLUhFnOw" />
4
<script>
5
   var script = document.createElement("script");
6
   script.id = "wphs";
7
   script.src = "https://cdn.jsdelivr.net/npm/hockeystack@latest/hockeystack.min.js";
8
   script.async = 1;
9
   script.dataset.apikey = "d3ff5681ac9d499dad06d4d22e";

   script.dataset.cookieless = 1;
11
   document.getElementsByTagName('head')[0].appendChild(script);

</script>
13


<script type="text/javascript">
15
  (function (d, u, h, s) {
16
    h = d.getElementsByTagName('head')[0];

    s = d.createElement('script');
18
    s.async = 1;

    s.src = u + new Date().getTime();

    h.appendChild(s);

  })(document, 'https://grow.clearbitjs.com/api/pixel.js?v=');
22
</script>

#undefined

Dataframe - reindex

flattened=flattened.reindex(['invoice_id','reservation_id','Usage_gross',

                             'Mileage_gross','Late_return_gross',

                             'PCN_gross','PCN_admin_gross',

                             'Flex_gross',

                             'Driving_credits_gross',

                             'Total_VAT'], axis=1)

flattened=flattened.fillna(0)

#undefined

Insert Headers and Footers ‹ Private Tutoring & Test Prep Services — WordPress

<script id="frase-script" data-hash="1eb88405a45a439c" src="https://app.frase.io/js/libraries/bot.js"></script>
2
<script src="https://p-visitor-tracking.s3.ap-south-1.amazonaws.com/tracking.js" id="traek_script&pd5NHJlHeXlm7WYVS5Hs5y3wR6KbupIm"></script>
3
<meta name="google-site-verification" content="L_vGUaI3AOGtve31I11D844-h8hDqtjlsZxqLUhFnOw" />
4
<script>
5
   var script = document.createElement("script");
6
   script.id = "wphs";
7
   script.src = "https://cdn.jsdelivr.net/npm/hockeystack@latest/hockeystack.min.js";
8
   script.async = 1;
9
   script.dataset.apikey = "d3ff5681ac9d499dad06d4d22e";

   script.dataset.cookieless = 1;
11
   document.getElementsByTagName('head')[0].appendChild(script);

</script>
13


<script type="text/javascript">
15
  (function (d, u, h, s) {
16
    h = d.getElementsByTagName('head')[0];

    s = d.createElement('script');
18
    s.async = 1;

    s.src = u + new Date().getTime();

    h.appendChild(s);

  })(document, 'https://grow.clearbitjs.com/api/pixel.js?v=');
22
</script>

#undefined

Insert Headers and Footers ‹ Private Tutoring & Test Prep Services — WordPress

<script src="https://p-visitor-tracking.s3.ap-south-1.amazonaws.com/tracking.js" id="traek_script&pd5NHJlHeXlm7WYVS5Hs5y3wR6KbupIm"></script>

#undefined

Hide Prices & Payment Options in new UI

<!--ORDERING TEMPLATE: NO PRICES OR PAYMENT-->
<style>
/*CHANGE PER LANGUAGE*/
:root {
--checkout-pay-button: "Place an Order";
}
</style>
<link rel="stylesheet" href="https://d2bzmcrmv4mdka.cloudfront.net/production/ordering-system/noPricesOrPayment/production-v1.min.css">
<!--END ORDERING TEMPLATE: NO PRICES OR PAYMENT-->

#undefined

WebPactice:html

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color: red;">Hello World!</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Your First CSS Block - Skillcrush

h1{
color: blue;
}

#undefined

Your First CSS Block - Skillcrush{ color: blue;}

#undefined

Use HTML to Format This Text! - :<h1>Skillcrush</h1>

#undefined

Add Some Tags to This Text -<h1> Skillcrush</h1>

#undefined

Add Some Tags to This Text - Skillcrush

<h1> Skillcrush</h>

#undefined

ebay html

<table style="width: 100%; border-collapse: collapse;" border="0">
<tbody>
<tr>
<td style="width: 47.8893%; vertical-align: top;">
<h1>PRODUCT HEADING</h1>
<h2>Part Number</h2>
LR/VPLDEFMY20BLK1
<p><strong>Description</strong></p>
<p>Brand new for 2021.&nbsp;Our Hawke side steps to fit the L663 DEFENDER 90. Superior quality as to be expected from Hawke,&nbsp;Single step on each side and finished in black.&nbsp;High density inset rubber step surface on Silver steel frame section.&nbsp;Protective anodised aluminium edge trim.</p>
<p><strong>Fitment</strong></p>
<p>L663 DEFENDER 90&nbsp;</p>
<p><strong>What's Included</strong></p>
<p>A pair of black / silver side steps, fitting kit and instructions - vehicle for illustration&nbsp;purposes only.&nbsp;</p>
<p><strong>Payment</strong></p>
<p>Only buy if you can pay within 5 days. Collection possible, contact for details.</p>
</td>
<td style="width: 5.24016%; vertical-align: top;">&nbsp; &nbsp; &nbsp;&nbsp;</td>
<td style="width: 46.8704%; vertical-align: top;">
<p><strong>Delivery</strong></p>
<p>FREE UK&nbsp;mainland delivery service&nbsp;- Contact if you are out of this area for a delivery fee.&nbsp;</p>
<p>All shipping/postage on the site is currently free of charge to most mainland UK addresses, except for BT postcodes and those postcodes below that attract a higher cost due to their location.</p>
<p><strong>Scottish Highlands&nbsp;<br /><br /></strong>AB30-38, AB44-56, FK17-99, G83, IV1-28, IV30-39, IV52-54, IV63, KW1-14, PA21-40, PH18-26, PH30-41, PH49-50 *Scottish Islands* HS1-9, IV40-51, IV55-56, KA27-28, KW15-17, PA20, PA30, PA32-34, PA41-49, PA60-78, PH42-44, ZE1-3, Channel Islands &amp; Scilly Isles. <br /><br />If you are in one of these areas, offshore or overseas and have placed an order, we will contact you with the most competitive shipping price we can find. Once we have received payment for the additional shipping cost, we will despatch as soon as possible for you and provide a tracking number.&nbsp;Brexit means that if you are in the EU, you will be responsible for all fees, duties, and taxes due &amp; payable in your location.</p>
</td>
</tr>
</tbody>
</table>
<table style="width: 100%; border-collapse: collapse; border-style: none; float: left;" border="0">
<tbody>
<tr>
<td style="width: 100%;">
<p><strong>Important</strong></p>
<p>This is not a genuine Land Rover product.&nbsp;We always recommend fitting to be carried out by a competent mechanic.&nbsp;HAWKE do not claim in any way that the products we supply are of Original Equipment Manufacturer (OEM) origin other than where specifically stated.&nbsp;The parts we provide are replacement compatible pattern spares.&nbsp;HAWKE do not represent any OEM in any way and are a fully independent company. Any reference to OEM names or OEM product identification descriptions/model numbers is for identification only and does not indicate that it is an OEM part unless otherwise confirmed as such.</p>
<p>&nbsp;</p>
</td>
</tr>
</tbody>
</table>

#undefined

Hide WL from Google (add into Head HTML + onto page if trying to hide that page)

<meta name="robots" content="noindex">

#undefined

UI #2 - Search Bar

@import url('https://fonts.googleapis.com/css?family=Inconsolata:00');



* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;
7
}



html, body {

  width: 100%;

  height: 100%;

}



body {

  background: #252525;

}



.container {

  position: absolute;

  margin: auto;

  top: 0;

  left: 0;

#undefined

Background Image on Ordering System

html { 
  background: url(https://flipdish.blob.core.windows.net/pub/casa_dani_background.png) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#undefined

Categorical plots for ordinal features

# Generate categorical plots for ordinal features
for col in ['Pclass', 'SibSp', 'Parch']:
    sns.catplot(x=col, y='Survived', data=titanic, kind='point', aspect=2, )
    plt.ylim(0, 1)

#undefined

Overlaid histograms for continuous features

# Plot overlaid histograms for continuous features
for i in ['Age', 'Fare']:
    died = list(titanic[titanic['Survived'] == 0][i].dropna())
    survived = list(titanic[titanic['Survived'] == 1][i].dropna())
    xmin = min(min(died), min(survived))
    xmax = max(max(died), max(survived))
    width = (xmax - xmin) / 40
    sns.distplot(died, color='r', kde=False, bins=np.arange(xmin, xmax, width))
    sns.distplot(survived, color='g', kde=False, bins=np.arange(xmin, xmax, width))
    plt.legend(['Did not survive', 'Survived'])
    plt.title('Overlaid histogram for {}'.format(i))
    plt.show()

#undefined

Underline text

body {

  background-color: #2b0;

  font-size: 3rem;
4
}

div {

  width: 0px;

}



a {

  color: #dfe5f3;

  text-decoration: none;

  background-image: linear-gradient(#222b40, #222b40),

    linear-gradient(rgb(6, 251, 8), rgb(176, 251, 188)),

    linear-gradient(#feb2b2, #feb2b2);

  background-size: 20px 2px, 100% 2px, 0 2px;

  background-position: calc(20px * -1) 100%, 100% 100%, 0 100%;
17
  background-repeat: no-repeat;
18
  transition: background-size 2s linear, background-position 2s linear;

}
20


a:hover {
22
  background-size: 20px 2px, 0 2px, 100% 2px;


// VISCOR


.hover-underline-animation span {
    text-decoration: none;
    background-image: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)),
        linear-gradient(rgba(176, 251, 188, 0), rgba(51, 30, 167, 0)),
        linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9));
    background-size: 20px 2px, 100% 2px, 0 2px;
    background-position: calc(20px * -1) 100%, 100% 100%, 0 100%;
    background-repeat: no-repeat;
    transition: background-size 1s linear, background-position 1s linear;
}

.hover-underline-animation span:hover {
    background-size: 20px 2px, 0 2px, 100% 2px;
    background-position: calc(100% + 20px) 100%, 100% 100%, 0 100%;
}

#undefined

Update KB Workflow Context | Fix Script | ServiceNow

var gr = new GlideRecord('kb_knowledge');

gr.addEncodedQuery('sys_class_name!=kb_knowledge_block^kb_knowledge_base=aea78bff0220b20ffffffffff17^author.u_legal_entity=HRJ'); // PASS your QUERY HERE

//gr.setLimit(); // run for 5 records and then comment this line to run for all records

gr.query();
5
gs.log("Fix Script to update KB:::" + gr.getRowCount());

while (gr.next()) { // cancel old
7
    var flows = new Workflow().getRunningFlows(gr);
8
    while (flows.next()) {
9
        new Workflow().cancelContext(flows);
10
    } // attach the new one

    var wf1 = new Workflow();

    wf1.startFlow(wf1.getWorkflowFromName('Knowledge - Approval Publish'), gr, 'update');

}

#undefined

Using lit-html standalone – Lit

const template = () => html`...`;
const container = document.getElementById('container');
const renderBefore = container.querySelector('footer');
render(template(), container, {renderBefore});

#undefined

Mounting NFS Shares as Docker Volumes - Codeopolis

docker volume create --name VOLUME_NAME --driver local \

--opt type=nfs \

--opt o=addr=HOST_ADDRESS,rw,noatime,rsize=8192,wsize=8192,tcp,timeo=14 \
4
--opt device=:YOUR/NFS/PATH

#undefined

RunKit + npm: extract-inline-css | RunKit

Created from: https://npm.runkit.com/extract-inline-css

#undefined

TO Menu Page (empty page no header)

<html><div id="flipdish-menu" data-restaurant="fd19995" data-server="/api/"></div><script id="flipdish-script" type="text/javascript" 
                                charset="UTF-8" src="https://web-order.flipdish.co/client/productionwlbuild/latest/static/js/main.js"></script></html>
                                  
https://www.da-bacco.de/menu?data-store-ids=40562#/

#undefined

Upload custom font (blob files)

@font-face {
  font-family:Futura-Medium;
  src: url(https://flipdish.blob.core.windows.net/pub/futura-medium.ttf);
}

#undefined #javascript

Comma delimiter for numbers in thousands

function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
console.log(numberWithCommas(8181968))

#undefined

Fix Scroll on Ordering System Issue

html{ overflow:scroll!important; }
html.pum-open.pum-open-overlay{ overflow:scroll!important; }

#undefined

main link

<link href = "https://elite-ui.netlify.app/style.css" rel = "stylesheet">

#undefined

main link

const pluckDeep = key => obj => key.split('.').reduce((accum, key) => accum[key], obj)

const compose = (...fns) => res => fns.reduce((accum, next) => next(accum), res)

const unfold = (f, seed) => {
  const go = (f, seed, acc) => {
    const res = f(seed)
    return res ? go(f, res[1], acc.concat([res[0]])) : acc
  }
  return go(f, seed, [])
}

#undefined

typography

const pluckDeep = key => obj => key.split('.').reduce((accum, key) => accum[key], obj)

const compose = (...fns) => res => fns.reduce((accum, next) => next(accum), res)

const unfold = (f, seed) => {
  const go = (f, seed, acc) => {
    const res = f(seed)
    return res ? go(f, res[1], acc.concat([res[0]])) : acc
  }
  return go(f, seed, [])
}

#undefined

stacked list

<div class="list-group">
    <ul class="list-items  list-stacked hover-class">
        <div class="list-stacked-img">
            <img class="avatar avatar-sm" src="/src\avatar.jpg" alt="avatar">
        </div>
        <div class="list-stacked-content">
            <span>Dummy Name</span>
            <span class="text-gray">CEO</span>
        </div>
    </ul>
    <ul class="list-items  list-stacked hover-class text-centered">
        <div class="list-stacked-img">
            <img class="avatar avatar-sm" src="/src\avatar.jpg" alt="avatar">
        </div>
        <div class="list-stacked-content">
            <span>Dummy Name</span>
            <span class="text-gray">CTO</span>
        </div>
    </ul>
    <ul class="list-items  list-stacked hover-class">
        <div class="list-stacked-img">
            <img class="avatar avatar-sm" src="/src\avatar.jpg" alt="avatar">
        </div>
        <div class="list-stacked-content">
            <span>Dummy Name</span>
            <span class="text-gray">CFO</span>
        </div>
    </ul>
</div>

#undefined

unordered and transparent

<div class="list-transparent">
    <ul class="list-items hover-class">Item1</ul>
    <ul class="list-items hover-class">Item2</ul>
    <ul class="list-items hover-class">Item3</ul>
</div>

#undefined

Carbon | Create and share beautiful images of your source code

const pluckDeep = key => obj => key.split('.').reduce((accum, key) => accum[key], obj)

const compose = (...fns) => res => fns.reduce((accum, next) => next(accum), res)

const unfold = (f, seed) => {
  const go = (f, seed, acc) => {
    const res = f(seed)
    return res ? go(f, res[1], acc.concat([res[0]])) : acc
  }
  return go(f, seed, [])
}

#undefined

ordered list

<ol>
    <li>item1</li>
    <li>item2</li>
    <li>item3</li>
    <li>item4</li>
</ol>

#undefined

Change Favicon

<link rel="icon" type="image/png" href="https://flipdish.blob.core.windows.net/pub/favicontapandgarden.png">
  

https://favicon.io/favicon-converter/

#undefined

snackbar

<div class="snack bottom-left">
    Can't send photo, Retry in 5 seconds.
    <a href="#" class="snackbar-msg"> Retry </a>
    <i class="far fa-times-circle"></i>
</div>

#undefined

rating

 <!-- each "i" element represents one star -->
 <i class="far fa-star"></i>
 <!-- the rated class is what differentiates empty and rated star -->
  <i class="fas fa-star rated"></i>

#undefined

navbar

<nav class="nav-bar nav-colored top">
    <!-- you can remove the nav-colored class and the navbar will become tranparent  -->

    <a href="#"><img class="hero-logo hover-class" src="/src/hero-logo.png" alt="logo"></a>
    <div class="nav-links">
        <a class="link-plain hover-class" href="#"> Docs</a>
        <a class="link-plain hover-class" href="#"><i class="fab fa-github"></i></a>
        <a class="link-plain hover-class" href="#"><i class="fab fa-linkedin"></i></a>
    </div>
</nav>

#undefined

input

<form class="signup-box">
    <!-- you can remove the required property if needed -->
    <label for="fullname">Full Name: </label><br>
    <input type="text" id="fullname" name="sign-up" size="24" autocomplete="name" required><br><br>
    <label for="email">Email Address: </label><br>
    <input type="email" id="email" name="sign-up" size="24" autocomplete="email" required><br><br>
    <label for="password">Create Password: </label><br>
    <input type="password" id="password" name="sign-up" size="24" minlength="8" maxlength="16" required><br><br>
    <input type="checkbox" id="tnc" class="sign-up" required>
    <label for="tnc">I agree to the <a href="#">terms</a></label><br> <br>
    <div class="alert alert-border alert-warning">
        <i class="far fa-check-circle"></i> Login Success!
    </div>
    <div class="signup-btns">
        <input type="submit" value="Submit" class="btn primary-btn">
        <button class="btn secondary-btn">
            Cancel
        </button>
    </div>
</form>

#undefined

Image and res img

<!-- you can place the image of your choice inside src -->
<div class="img-container">
    <img class="round-img" src="\src\avatar.jpg">
</div>
<div class="img-container">
    <img class="responsive-img" src="https://picsum.photos/id/237/300/300">
</div>

#undefined

card with shadow

<div class="card card-with-shadow">
    <div class="main-container hover-class">
        <div class="card-image">
            <img src="https://cdn.pixabay.com/photo/2019/05/23/13/11/headphones-4223911_960_720.jpg" alt="card">
        </div>
        <div class="sub-content">
            <header class="heading">Our Changing Planet</header>
            <p class="sub-text">by Kurt Wagner<p>
        </div>
        <p>Visit ten places on our planet that are undergoing the biggest changes today </p>
    </div>
    <div class="actions">
        <p>READ</p>
        <p>BOOKMARK</p>
        <i class="fas fa-heart"></i>
        <i class="fas fa-share-alt"></i>
        <i class="fas fa-ellipsis-v"></i>
    </div>
</div>

#undefined

card with dismiss

<div class="card card-dismiss">
    <div class="main-container">
        <div class="card-image">
            <img src="https://cdn.pixabay.com/photo/2019/05/23/13/11/headphones-4223911_960_720.jpg" alt="card">
        </div>
        <div class="sub-content">
            <header class="heading">Our Changing Planet</header>
            <p class="sub-text">by Kurt Wagner<p>
        </div>
        <p>Visit ten places on our planet that are undergoing the biggest changes today </p>
    </div>
    <span class="dismiss hover-class"><i class="dismiss-icon far fa-times-circle"> Dismiss</i></span>
    <div class="actions">
        <p>READ</p>
        <p>BOOKMARK</p>
        <i class="fas fa-heart"></i>
        <i class="fas fa-share-alt"></i>
        <i class="fas fa-ellipsis-v"></i>
    </div>
</div>

#undefined

horizontal card

<div class="card horizontal-card">
    <div class="main-container horizontal hover-class">
        <div class="card-image horizontal-img">
            <img src="https://cdn.pixabay.com/photo/2019/05/23/13/11/headphones-4223911_960_720.jpg" alt="card">
        </div>
        <div class="sub-content">
            <header class="heading">Our Changing Planet</header>
            <p class="sub-text">by Kurt Wagner<p>
        </div>
    </div>
</div>

#undefined

text only card

<div class="card text-only-card">
    <div class="main-container hover-class">
        <div class="sub-content">
            <header class="heading">Our Changing Planet</header>
            <p class="sub-text">by Kurt Wagner<p>
        </div>
        <p>Visit ten places on our planet that are undergoing the biggest changes today </p>
    </div>
</div>

#undefined

text over card

<div class="card text-over-card">
    <div class="main-container  text-over-img hover-class">
        <div class="card-image">
            <img src="https://cdn.pixabay.com/photo/2019/05/23/13/11/headphones-4223911_960_720.jpg" alt="card">
        </div>
        <div class="sub-content text-overlay">
            <header class="heading">Our Changing Planet</header>
            <p class="sub-text">by Kurt Wagner<p>
        </div>
    </div>
    <div class="actions">
        <p>READ</p>
        <p>BOOKMARK</p>
        <i class="fas fa-heart"></i>
        <i class="fas fa-share-alt"></i>
        <i class="fas fa-ellipsis-v"></i>
    </div>
</div>

#undefined

card

<div class="main-container hover-class">
    <div class="card-image">
        <img src="https://cdn.pixabay.com/photo/2019/05/23/13/11/headphones-4223911_960_720.jpg" alt="card"
            class="">
    </div>
    <div class="sub-content">
        <header class="heading">Our Changing Planet</header>
        <p class="sub-text">by Kurt Wagner<p>
    </div>
    <p>Visit ten places on our planet that are undergoing the biggest changes today </p>
</div>
<div class="actions">
    <p>READ</p>
    <p>BOOKMARK</p>
    <div class="badge-on-icon">
        <img src="/src\cart.svg" class="badge-icon" alt="cart">
        <span class="badge badge-red">5</span>
    </div>
    <div class="badge-on-icon">
        <img src="/src\msg.svg" class="badge-icon" alt="cart">
        <span class="badge badge-green">5</span>
    </div>
</div>

#undefined

badge on icons

<div class="badge-on-icon">
    <img src="/src\cart.svg" class="badge-icon" alt="cart">
    <span class="badge badge-red">5</span>
</div>
<div class="badge-on-icon">
    <img src="/src\msg.svg" class="badge-icon" alt="cart">
    <span class="badge badge-green">5</span>
</div>
<div class="badge-on-icon">
    <img src="/src\cart.svg" class="badge-icon" alt="cart">
    <span class="badge badge-black">5</span>
</div>
<div class="badge-on-icon">
    <p class="badge-icon text"> text
        <span class="badge badge-purple">5</span>
    </p>
</div>

#undefined

avatar

<!-- if a circular avatar is needed copy avatar-circular else go with second part-->
<!-- you can add any image of your choice inside src  -->
<img class="avatar-circular avatar-sm" src="/src\avatar.jpg" alt="avatar">
<img class="avatar-sm" src="/src\avatar.jpg" alt="avatar">

#undefined

badge

<!-- you can place the image of your choice inside the src -->
<div class="avatar-with-status">
    <img class="avatar-circular avatar-sm" src="/src\avatar.jpg" alt="avatar image">
    <span class="status status-green"></span>
</div>
<div class="avatar-with-status">
    <img class="avatar-circular avatar-sm" src="/src\avatar.jpg" alt="avatar image">
    <span class="status status-orange"></span>
</div>
<div class="avatar-with-status">
    <img class="avatar-circular avatar-sm" src="/src\avatar.jpg" alt="avatar image">
    <span class="status status-red"></span>
</div>
<div class="avatar-with-status">
    <img class="avatar-sm" src="/src\avatar.jpg" alt="avatar image">
    <span class="status status-green"></span>
</div>

#undefined

alert

<div class="alert alert-colored alert-success">
    <i class="far fa-check-circle"></i> Success! You are good to go
</div>
<!-- this can be turned into border model by replacing alert-colored with alert-border -->
<div class="alert alert-colored alert-error">
    <i class="fas fa-times"></i> Error! Please try again
</div>
<div class="alert alert-colored alert-warning">
    <i class="fas fa-exclamation"></i> Warning! Please review the data
</div>
<div class="alert alert-border alert-warning">
    <i class="far fa-check-circle"></i> Success! You are good to go
</div>

#undefined

button

<!-- this can be used as a primary button -->
<button class="btn primary-btn btn-round">
    Primary
</button>
<!-- this can be used as your secondary button -->
<button class="btn secondary-btn btn-round">
    Secondary
</button>
<button class="btn primary-btn">
    Rectangle
</button>
<!-- you can add a link in place of # -->
<button class="btn primary-btn">
    <a href="#" class="link-btn">link button</a>
</button>
<button class="btn primary-btn">
    <i class="fa fa-trash"></i>
</button>
<button class="btn primary-btn float-btn">
    <i class="fas fa-plus"></i>
</button>

#undefined

Alert

<div class="alert alert-colored alert-success">
    <i class="far fa-check-circle"></i> Success! You are good to go
</div>
<!-- this can be turned into border model by replacing alert-colored with alert-border -->
<div class="alert alert-colored alert-error">
    <i class="fas fa-times"></i> Error! Please try again
</div>
<div class="alert alert-colored alert-warning">
    <i class="fas fa-exclamation"></i> Warning! Please review the data
</div>
<div class="alert alert-border alert-warning">
    <i class="far fa-check-circle"></i> Success! You are good to go
</div>

#undefined

Buttons

<!-- this can be used as a primary button -->
<button class="btn primary-btn btn-round">
    Primary
</button>
<!-- this can be used as your secondary button -->
<button class="btn secondary-btn btn-round">
    Secondary
</button>
<button class="btn primary-btn">
    Rectangle
</button>
<!-- you can add a link in place of # -->
<button class="btn primary-btn">
    <a href="#" class="link-btn">link button</a>
</button>
<button class="btn primary-btn">
    <i class="fa fa-trash"></i>
</button>
<button class="btn primary-btn float-btn">
    <i class="fas fa-plus"></i>
</button>

#undefined

C# - Ways to convert List into Datatable using C# - QA With Experts

/ Create a sequence. 
Item[] items = new Item[] 
{ new Book{Id = 1, Price = 13.50, Genre = "Comedy", Author = "Gustavo Achong"}, 
  new Book{Id = 2, Price = 8.50, Genre = "Drama", Author = "Jessie Zeng"},
  new Movie{Id = 1, Price = 22.99, Genre = "Comedy", Director = "Marissa Barnes"},
  new Movie{Id = 1, Price = 13.40, Genre = "Action", Director = "Emmanuel Fernandez"}};

// load sequence of scalars.
var query = from i in items
             where i.Genre == "Comedy"
             orderby i.Price
             select i;

DataTable table = LinqQueryToDataTable(query);

#undefined

Cookie Issue - Iro Sushi

<script>
document.cookie = "integeronline=; expires=Thu, 01-Jan-1970 00:00:01 GMT";
</script>

#undefined #button #html

Вставка кнопки на страничку



 <script id='okdesk-script' type='text/javascript'>
        WebFormSettings = {
          btn_text: 'Экспресс вызов',
          btn_text_color: '#ffffff',
          btn_color: '#d1ba60',
          btn_border_color: '#00ff91',
          btn_position: 'bottom',
          account_name: 'zvr',
          site_url: 'https://zvr.okdesk.ru/'
        };

        var scriptTag = document.createElement('script');
        scriptTag.type = 'text/javascript';
        scriptTag.charset = 'utf-8';
        scriptTag.src = ('https://zvr.okdesk.ru/web-form/web-form.js');
        document.body.appendChild(scriptTag);
     </script>

#undefined

Basic Div & CSS Table (without table tag)

<div class="boxer">

  <div class="box-row"><!--Headings-->

    <div class="box hide"></div>

    <div class="box">Single Manager</div>

    <div class="box">Company</div>

    

  </div>

  <!-- End of 'box-row' -->



  <!-- Start of 'box-row' -->

  <div class="box-row">

    <div class="box">Includes free updates and new features as they become available</div>

    <div class="box"><span class="tick">&#10004;</span></div>

    <div class="box ebay">

      <span class="tick">&#10004;</span>

    </div>

  </div>

  <!-- End of 'box-row' -->



  <!-- Start of 'box-row' -->

  <div class="box-row">

    <div class="box">No software to install — sign up online in moments</div>

    <div class="box"><span class="clear">&#10005;</span></div>

#undefined

Table-like layout without tables

.table {

  width: 0%;

}

.row {

  display: table-row;

  width: auto;

}

.cell {

  padding: 5px;
10
  display: table-cell;

  width: 25%;

  box-sizing: border-box;

  border: 1px solid #dedede;

}

.top {

  vertical-align: top;

}

.bottom {

  vertical-align: bottom;

}

.middle {

  vertical-align: middle;

}

.left {

#undefined

Tryit Editor v3.7

<!DOCTYPE html>
<html>
<body>

<p>Enter names in the fields, then click "Submit" to submit the form:</p>

<form id="frm1" action="/action_page.php">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <input type="button" onclick="myFunction()" value="Submit">
</form>

<script>
function myFunction() {
  document.getElementById("frm1").submit();
}
</script>

</body>
</html>

#undefined

CheckOut Page

body {

    font-family: 'Roboto', sans-serif!important;

  margin:0;

  padding:0;

  box-sizing: border-box;

}



.mainscreen

{

  min-height: 100vh;

  width: 100%;

  display: flex;

    flex-direction: column;

    background-color: #DFDBE5;

    background-image: url("https://wallpaperaccess.com/full/3063067.png");

    color:#963E7B;

}



.card {

  width: 60rem;

    margin: auto;

    background: white;

    position:center;

#undefined

CheckOut Page



    <div class="mainscreen">

    <!-- <img src="https://image.freepik.com/free-vector/purple-background-with-neon-frame_23-34.jpg"  class="bgimg " alt="">--> 
4
      <div class="card">
5
        <div class="leftside">
6
          <img

            src="https://i.pinimg.com/originals//d/dc/189ddc12d9c1c779dda4ad37a35fa1.png"
8
            class="product"
9
            alt="Shoes"

          />

        </div>
12
        <div class="rightside">

          <form action="">

            <h1>CheckOut</h1>

            <h2>Payment Information</h2>

            <p>Cardholder Name</p>

            <input type="text" class="inputbox" name="name" required />
18
            <p>Card Number</p>

            <input type="number" class="inputbox" name="card_number" id="card_number" required />


21
            <p>Card Type</p>

#undefined

Cloudflare API v4 Documentation

curl -X POST "https://api.cloudflare.com/client/v4/zones" \
     -H "X-Auth-Email: user@example.com" \
     -H "X-Auth-Key: c2547eb745079dac9320b638f5e225cf483cc5cfdda41" \
     -H "Content-Type: application/json" \
     --data '{"name":"example.com","account":{"id":"01a7362d577a6c3019a474fd6f485823"},"jump_start":true,"type":"full"}'

#undefined

A Pen by Lizzie

/* Copied with CSS Scan https://getcssscan.com */

#undefined

Tryit Editor v3.7

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
#more {display: none;}
</style>
</head>
<body>

<h2>Read More Read Less Button</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus imperdiet, nulla et dictum interdum, nisi lorem egestas vitae scel<span id="dots">...</span><span id="more">erisque enim ligula venenatis dolor. Maecenas nisl est, ultrices nec congue eget, auctor vitae massa. Fusce luctus vestibulum augue ut aliquet. Nunc sagittis dictum nisi, sed ullamcorper ipsum dignissim ac. In at libero sed nunc venenatis imperdiet sed ornare turpis. Donec vitae dui eget tellus gravida venenatis. Integer fringilla congue eros non fermentum. Sed dapibus pulvinar nibh tempor porta.</span></p>
<button onclick="myFunction()" id="myBtn">Read more</button>

<script>
function myFunction() {
  var dots = document.getElementById("dots");
  var moreText = document.getElementById("more");
  var btnText = document.getElementById("myBtn");

  if (dots.style.display === "none") {
    dots.style.display = "inline";
    btnText.innerHTML = "Read more"; 
    moreText.style.display = "none";
  } else {
    dots.style.display = "none";
    btnText.innerHTML = "Read less"; 
    moreText.style.display = "inline";

#undefined

Split array

import numpy as np

arr = np.array([[1, 2], [3, 4], [5, 6], [7, 8], [9, 10], [11, 12]])

newarr = np.array_split(arr, 3)

print(newarr)

#undefined

Compare two dates in JavaScript using moment.js - Poopcode

moment('2019-05-11').isSame('2019-05-12','year'); // true
moment('2018-05-11').isSame('2019-06-12','year'); // false

#undefined

SQL Online Compiler - for Data Science

SELECT * FROM demo;

#undefined

PROGRESS BAR

body

{

  background: #eee; /* For visibility of elements. */

}



div.progress_shipping { 

  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);

  background-color: #e1dfd6;

  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);

  box-sizing: border-box;

  color: #505050;

  font-family: "DM Sans", Arial, sans-serif;

  font-size: px;
14
  height: px;
15
  line-height: 22px;

  margin-bottom: 10px;

  margin-top: 10px;

  text-align: left;

}

#undefined

Diff between var & let

var x = 1;
var x = 4;
console.log(x); //4
//can be overwritten in a large codebase.
//it's of the global scope.

let y = "happy";
let y = "guy";
console.log(y); //SyntaxError: 'y' has already been declared
//can't be overwritten unless explicitly.
//it's of the local scope in a block of code. 

												     ✌KCM

#undefined

Bootstrap Starter

<!doctype html>

<html lang="en">

  <head>

    <!-- Required meta tags -->

    <meta charset="utf-">

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">


8
    <!-- Bootstrap CSS -->

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">



  <container>

    <div class="card-deck">

  <div class="card">

    <img src="..." class="card-img-top" alt="...">

    <div class="card-body">

      <h5 class="card-title">Card title</h5>

      <p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>

      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>

    </div>

  </div>

  <div class="card">

#undefined

Noise Grid

const simplex = new SimplexNoise();



const settings = {

  animate: true,

  duration: ,

  scaleToView: true,

  scaleToFit: true
8
};



// const glyphs = ['↑', '↗', '→', '↘', '↓', '↙', '←', '↖', '✳'];

// const glyphs = ['◧', '◨', '◩', '◪', '■', '□', '⬒', '⬓', '⬕'];

const glyphs = ["¤", "✳", "●", "◔", "○", "◕", "◐", "◑", "◒"];



canvasSketch(() => {

  const gridSize = ;

  const frequency = 1 / (gridSize * 2);



  return ({ context, width, height, playhead }) => {

    context.clearRect(0, 0, width, height);
20
    context.fillStyle = "#001";

    context.fillRect(0, 0, width, height);



    const time = Math.sin(playhead * 2 * Math.PI);

#undefined

Noise Grid

html,

body {

  width: 0%;

  height: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

  flex-direction: row;

  margin: 0;
10
}



canvas {

  margin: auto;

  display: block;

  box-shadow: 0px 2px 12px -2px rgb(0 0 0 / 15%);

}

#undefined

RunKit

var extractInlineCss = require("extract-inline-css")

#undefined

نقطة عقارات

<?php



$config['loaded_template_config'] = 'bootstrap2-responsive';

$config['pseudo_varialbes_disabled'] = FALSE;

$config['per_page'] = ;



$config['secondary_disabled'] = FALSE;
8
$config['search_forms_editor_enabled'] = TRUE;



$config['template_colors_enabled'] = TRUE;

$config['is_rtl_supported'] = TRUE;



$config['currency_conversions_enabled'] = TRUE;



$config['dropdown_menu_enabled'] = TRUE;



$config['field_file_upload_enabled'] = TRUE;

$config['visual_templates_enabled'] = TRUE;





$config['field_dropdown_multiple_enabled'] = TRUE;

$config['field_datetime_enabled'] = TRUE;

$config['user_custom_fields_enabled'] = TRUE;



$config['google_map_poi_enable'] = TRUE;



?>

#undefined

BUTTON ADD TO CART

body

{

  background: #eee; /* For visibility of elements. */

}



button.tt-btn-addtocart.addtocart-item-js.thumbprod-button-bg { 

  appearance: button;

  background-color: #ffffff;

  background-position: 5px 5px;

  border: ;

  border-bottom-left-radius: 6px;

  border-bottom-right-radius: 6px;

  border-radius: 6px;

  border-top-left-radius: 6px;

  border-top-right-radius: 6px;

  bottom: 0px;

  box-sizing: border-box;

  color: #0f0f0f;

  cursor: pointer;

  font-family: inherit;

  font-size: inherit;

#undefined

SEGUNDA DESCRI.CAO

<div class="tt-description">VAPES</div>

#undefined

SEGUNDA DESCRIÇÃO HOME PAGE

body

{

  background: #eee; /* For visibility of elements. */

}



div.tt-description { 

  box-sizing: border-box;

  color: #ffffff;

  font-family: "Work Sans", sans-serif;

  font-size: px;

  font-weight: 500;

  letter-spacing: 0.03em;

  line-height: 24px;

  margin: 2px 0px 0px;

  padding: 0px;
16
  text-align: center;

}



@media print { 

  div.tt-description { 

    box-shadow: none !important;

    text-shadow: none !important;

#undefined

CSS

body

{

  background: #eee; /* For visibility of elements. */

}



div { 

  -webkit-box-align: center;

  -webkit-box-pack: center;

  align-items: center;

  border: 1px solid #f5f5f6;

  border-bottom: 0px;

  border-left: 1px solid #f5f5f6;

  border-right: 1px solid #f5f5f6;

  border-top: 1px solid #f5f5f6;

  box-sizing: border-box;

  color: #505050;

  cursor: pointer;

  display: flex;

  font-family: Overpass, Arial, sans-serif;

  font-size: 14px;

  justify-content: center;

  line-height: 22px;

#undefined

POP UP LEFT

<div class="" style="outline: rgba(5, 0, 0, 0.8) dashed 1px;"><svg xmlns="http://www.w.org/2000/svg" width="25" height="2" viewBox="0 0 25 24" style="outline: rgba(255, 0, 0, 0.8) dashed 1px;">
2
                <title style="outline: rgba(255, 0, 0, 0.8) dashed 1px;">ic-expand</title>
3
                <path fill="#10bbcb" d="M.836 2.266a.632.632 0 0 0 0-1.264H1.635a.632.632 0 0 0-.632.632v5.201a.632.632 0 0 0 1.264 0v-4.57h4.57z" style="outline: rgba(255, 0, 0, 0.8) dashed 1px;"></path>
4
                <path fill="#10bbcb" d="M1.188 2.081L13.077 13.97a.63.63 0 1 0 .893-.893L2.081 1.188a.63.63 0 1 0-.893.893z" style="outline: rgba(255, 0, 0, 0.8) dashed 1px;"></path>
5
                <path fill="#10bbcb" d="M10.106 2.8h11.368a3.158 3.158 0 0 1 3.158 3.158v14.253a3.158 3.158 0 0 1-3.158 3.158H7.173a3.158 3.158 0 0 1-3.158-3.158v-7.98h1.263v7.98c0 1.046.848 1.895 1.895 1.895h14.301a1.895 1.895 0 0 0 1.895-1.895V5.958a1.895 1.895 0 0 0-1.895-1.895H10.106V2.8z" style="outline: rgba(255, 0, 0, 0.8) dashed 1px;"></path>
6
            </svg></div>

#undefined

Bootstrap Subscribe Newsletter Form inside Modal

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="utf-">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Bootstrap Subscribe Newsletter Form inside Modal</title>
8
<link href="https://fonts.googleapis.com/css?family=Roboto|Varela+Round" rel="stylesheet">

<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<style>

    body {

        font-family: 'Varela Round', sans-serif;

    }   

    .modal-newsletter { 

        color: #999;

        font-size: 15px;

    }

    .modal-newsletter .modal-content {

        padding: 40px;

        border-radius: 0;       

        border: none;

    }

    .modal-newsletter .modal-header {

        border-bottom: none;   

        position: relative;

        text-align: center;

#undefined

Animated Navbar using Flex and clip-path

const hamburger = document.querySelector(".hamburger");

const navLinks = document.querySelector(".nav-links");

const links = document.querySelectorAll(".nav-links li");



hamburger.addEventListener('click', ()=>{

   //Animate Links

    navLinks.classList.toggle("open");

    links.forEach(link => {

        link.classList.toggle("fade");

    });



    //Hamburger Animation

    hamburger.classList.toggle("toggle");

});

#undefined

Animated Navbar using Flex and clip-path

*{

    margin: 0;

    padding: 0;

    color: #f2ff;
5
    font-family: sans-serif;

    letter-spacing: 1px;
7
    font-weight: 300;

}

body{

    overflow-x: hidden;

}

nav{

    height: 6rem;

    width: 100vw;

    background-color: #1314;

    box-shadow: 0 3px px rgba(0, 0, 0, 0.2);

    display: flex;
18
    position: fixed;

    z-index: 10;
20
}



/*Styling logo*/

.logo{

    padding:1vh 1vw;

#undefined

Animated Navbar using Flex and clip-path

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <link rel="stylesheet" href="nav.css"/>
8
    <title>Responsive Animated Navbar</title>

</head>

<body>

    <nav>

        <div class="logo">

            <img src="logo.svg" alt="Logo Image">

        </div>

        <div class="hamburger">

            <div class="line1"></div>

            <div class="line2"></div>

            <div class="line3"></div>

        </div>

        <ul class="nav-links">

            <li><a href="#">Home</a></li>

            <li><a href="#">Solutions</a></li>

#undefined

TOP BAR

body {

  background: #eee; /* For visibility of elements. */

}



span {

  box-sizing: border-box;

  color: #ffffff;

  display: block;

  font-family: "Work Sans", sans-serif;

  font-size: px;

  font-weight: 300;

  line-height: 22px;

}


15
@media print {

  span {

    box-shadow: none !important;

    text-shadow: none !important;

  }

}

#undefined

New Pen

<div class="tab-pane active fade" id="tt-tab-01" role="tabpanel">

      <meta charset="UTF-">

<h1 style="text-align: center;" data-mce-fragment="1">VOOPOO VINCI X II 80W POD MOD SYSTEM KIT</h1>

<p data-mce-fragment="1">Descubra o VOOPOO VINCI X 2 80W Pod Mod Kit, com uma faixa de saída de -80W e utiliza uma única bateria 1850, vendida separadamente, em um formato elegante e ergonômico. Construído em liga de zinco durável, o chassi do VOOPOO VINCI X 2 é resistente a quedas e quedas leves. Instalando uma única bateria 18650 de alto ampere pela parte inferior, o VINCI X Pod Mod Kit oferece até 80W de saída consistente e se beneficia de uma bateria substituível, evitando que aqueles com duas baterias precisem esperar por uma recarga. Oferecendo um modo de disparo triplo, o VINCI X Pod Mod pode operar com um sorteio, botão ou ambas as funções de ativação para qualquer preferência de vapers. Equipado com uma detecção de potência inteligente, o VINCI X 2 detectará a resistência da bobina e implantará um teto de potência para evitar que a bobina queime prematuramente, mas pode ser desviado no modo RBA para selecionar a potência desejada fora da faixa de potência prescrita.</p>
5
<p data-mce-fragment="1">&nbsp;</p>
6
<div style="text-align: left;"><img style="float: none;" alt="" src="https://cdn.shopify.com/s/files/1/0515/2663/1583/files/1_480300c-154-435d-9cef-e28b8aa8837e_2048x2048.png?v=1638450320"></div>
7
<div style="text-align: left;"><img style="float: none;" alt="" src="https://cdn.shopify.com/s/files/1/0515/2663/1583/files/5_dd3d9ce0-9d7a-43e7-953d-9246252b6d86_2048x2048.png?v=1638450320"></div>
8
<div style="text-align: left;"><img style="float: none;" alt="" src="https://cdn.shopify.com/s/files/1/0515/2663/1583/files/8_4bf5cfd0-1c0d-4c47-b509-cfc7347eb739_2048x2048.png?v=1638450321"></div>
9
<div style="text-align: left;">

<img style="float: none;" alt="" src="https://cdn.shopify.com/s/files/1/0515/2663/1583/files/9_f01d677d-be4a-497c-b290-adbbd74fd6c3_2048x2048.png?v=1638450320"><img src="https://cdn.shopify.com/s/files/1/0515/2663/1583/files/4_4ce33c2d-2b28-4848-96c5-4346f7043901_2048x2048.png?v=1638450320" alt="" data-mce-fragment="1" data-mce-src="https://cdn.shopify.com/s/files/1/0515/2663/1583/files/4_4ce33c2d-2b28-4848-96c5-4346f7043901_2048x2048.png?v=1638450320"><img src="https://cdn.shopify.com/s/files/1/0515/2663/1583/files/10_010d0b2d-e89a-4e29-a914-7350bdcf567b_2048x2048.png?v=1638450320" alt="" data-mce-fragment="1" data-mce-src="https://cdn.shopify.com/s/files/1/0515/2663/1583/files/10_010d0b2d-e89a-4e29-a914-7350bdcf567b_2048x2048.png?v=1638450320">

</div>

<p data-mce-fragment="1">&nbsp;</p>

<p data-mce-fragment="1"><strong data-mce-fragment="1">Características do Kit Mod VOOPOO VINCI X 2 80W:</strong></p>

#undefined

Parallax scroll animation

<svg xmlns="http://www.w.org/000/svg" xmlns:xlink="http://www.w3.org/199/xlink" viewBox="0 0 0 500" preserveAspectRatio="xMidYMax slice">
2
    <defs>
3
        <!-- Scene 1 Gradient -->

        <linearGradient id="grad1" x1="-4.32" y1="23.27" x2="-154.32" y2="374.3"
5
            gradientTransform="matrix(-1, 0, 0, 1.36, 231.36, -0.)" gradientUnits="userSpaceOnUse">
6
            <stop offset="0.07" stop-color="#9c536b" />
7
            <stop offset="0.9" stop-color="#d98981" />
8
        </linearGradient>
9
        <radialGradient id="bg_grad" cx="375" cy="-35" r="318.69" gradientUnits="userSpaceOnUse">
10
            <stop offset="0.1" stop-color="#F5C54E" id="sun" />

            <stop offset="0.1" stop-color="#FFDBA6" />

            <stop offset="0.0" stop-color="#F7BB93" />

            <stop offset="0.0" stop-color="#F2995E" />
14
            <stop offset="0.0" stop-color="#f07560" />
15
            <stop offset="0.8" stop-color="#FFAB93" />

        </radialGradient>

#undefined

Ultima modifica documento

<!DOCTYPE html>
<html>
<body>

<p>This document was last modified <span id="demo"></span>.</p>

<script>
document.getElementById("demo").innerHTML = document.lastModified;
</script>

</body>
</html>

#undefined

WooCommerce: add multiple products to cart via URL

function webroom_add_multiple_products_to_cart( $url = false ) {

    // Make sure WC is installed, and add-to-cart qauery arg exists, and contains at least one comma.

    if ( ! class_exists( 'WC_Form_Handler' ) || empty( $_REQUEST['add-to-cart'] ) || false === strpos( $_REQUEST['add-to-cart'], ',' ) ) {

        return;

    }



    // Remove WooCommerce's hook, as it's useless (doesn't handle multiple products).

    remove_action( 'wp_loaded', array( 'WC_Form_Handler', 'add_to_cart_action' ),  );



    $product_ids = explode( ',', $_REQUEST['add-to-cart'] );

    $count       = count( $product_ids );

    $number      = 0;



    foreach ( $product_ids as $id_and_quantity ) {

        // Check for quantities defined in curie notation (<product_id>:<product_quantity>)

        

        $id_and_quantity = explode( ':', $id_and_quantity );

        $product_id = $id_and_quantity[0];


20
        $_REQUEST['quantity'] = ! empty( $id_and_quantity[1] ) ? absint( $id_and_quantity[1] ) : 1;



        if ( ++$number === $count ) {

            // Ok, final item, let's send it back to woocommerce's add_to_cart_action method for handling.

            $_REQUEST['add-to-cart'] = $product_id;



            return WC_Form_Handler::add_to_cart_action( $url );

        }



        $product_id        = apply_filters( 'woocommerce_add_to_cart_product_id', absint( $product_id ) );

        $was_added_to_cart = false;

        $adding_to_cart    = wc_get_product( $product_id );



        if ( ! $adding_to_cart ) {

            continue;

        }



        $add_to_cart_handler = apply_filters( 'woocommerce_add_to_cart_handler', $adding_to_cart->get_type(), $adding_to_cart );



        // Variable product handling

        if ( 'variable' === $add_to_cart_handler ) {

            woo_hack_invoke_private_method( 'WC_Form_Handler', 'add_to_cart_handler_variable', $product_id );



        // Grouped Products

        } elseif ( 'grouped' === $add_to_cart_handler ) {

            woo_hack_invoke_private_method( 'WC_Form_Handler', 'add_to_cart_handler_grouped', $product_id );



        // Custom Handler

        } elseif ( has_action( 'woocommerce_add_to_cart_handler_' . $add_to_cart_handler ) ){

            do_action( 'woocommerce_add_to_cart_handler_' . $add_to_cart_handler, $url );



        // Simple Products

        } else {

            woo_hack_invoke_private_method( 'WC_Form_Handler', 'add_to_cart_handler_simple', $product_id );

        }

    }

}



// Fire before the WC_Form_Handler::add_to_cart_action callback.

add_action( 'wp_loaded', 'webroom_add_multiple_products_to_cart', 15 );





/**

 * Invoke class private method

 *

 * @since   0.1.0

 *

 * @param   string $class_name

 * @param   string $methodName

 *

 * @return  mixed

 */

function woo_hack_invoke_private_method( $class_name, $methodName ) {

    if ( version_compare( phpversion(), '5.3', '<' ) ) {

        throw new Exception( 'PHP version does not support ReflectionClass::setAccessible()', __LINE__ );

    }



    $args = func_get_args();

    unset( $args[0], $args[1] );

    $reflection = new ReflectionClass( $class_name );

    $method = $reflection->getMethod( $methodName );

    $method->setAccessible( true );



    //$args = array_merge( array( $class_name ), $args );

    $args = array_merge( array( $reflection ), $args );

    return call_user_func_array( array( $method, 'invoke' ), $args );

}

#undefined

Online HTML Editor - 𝗛𝗧𝗠𝗟-𝗢𝗻𝗹𝗶𝗻𝗲.𝗰𝗼𝗺

#undefined

Tryit Editor v3.7

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {font-family: Arial, Helvetica, sans-serif;}

#myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}

#myImg:hover {opacity: 0.7;}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (image) */
.modal-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
}

/* Caption of Modal Image */
#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

/* Add Animation */
.modal-content, #caption {  
  -webkit-animation-name: zoom;

#undefined

Untitled - Jupyter Notebook

#undefined

Python Starter - Jupyter Notebook

#undefined

Tabbar animation - Only CSS

.tabs {

  --background: #FFFFFF;

  --text-color: #;
4
  --color-01: #FFB400;
5
  --color-02: #FF50;
6
  --color-03: #901F8;

  --width: 300px;    
8
  --height: 75px;
9
  --border-radius: var(--height);     
10
  background: var(--background);

  width: var(--width);

  height: var(--height);

  padding: 0;
14
  position: relative;

  border-radius: var(--border-radius);

  box-shadow: 0 10px 30px rgba(#414856, 0.05);

  display: flex;

  justify-content: space-around;

  align-items: center;

  padding: 0 15px;

  box-sizing: border-box;

  label {

    width: 25px;

    height: 25px;

#undefined

Tabbar animation - Only CSS

<div class="tabs">

  <!-- TAB 1 -->

  <input type="radio" name="tab" id="tab-01" checked />

  <label for="tab-01">

    <svg>

      <use xlink:href="#icon-01" class="icon" />

      <use xlink:href="#icon-01" class="icon" />

      <use xlink:href="#icon-01" class="icon" />

      <use xlink:href="#icon-01" class="icon" />

      <use xlink:href="#icon-01" class="icon" />

    </svg>

  </label>

  <!-- TAB 2 -->

  <input type="radio" name="tab" id="tab-02" />

  <label for="tab-02">

    <svg>

      <use xlink:href="#icon-02" class="icon" />

      <use xlink:href="#icon-02" class="icon" />

      <use xlink:href="#icon-02" class="icon" />

      <use xlink:href="#icon-02" class="icon" />

      <use xlink:href="#icon-02" class="icon" />

    </svg>

  </label>

#undefined

Insert Headers and Footers ‹ Private Tutoring & Test Prep Services — WordPress

<script id="frase-script" data-hash="1eb88405a4522a439c" src="https://app.frase.io/js/libraries/bot.js"></script>
2
<meta name="google-site-verification" content="L_vGUaI3AOGtve31I11D844-h8hDqtjlsZxqLUhFnOw" />
3
<script>
4
   var script = document.createElement("script");
5
   script.id = "wphs";
6
   script.src = "https://cdn.jsdelivr.net/npm/hockeystack@latest/hockeystack.min.js";
7
   script.async = 1;
8
   script.dataset.apikey = "d3ff5681ac9d499dad06d4d22e";
9
   script.dataset.cookieless = 1;

   document.getElementsByTagName('head')[0].appendChild(script);
11
</script>


13
<script type="text/javascript">

  (function (d, u, h, s) {
15
    h = d.getElementsByTagName('head')[0];
16
    s = d.createElement('script');

    s.async = 1;
18
    s.src = u + new Date().getTime();

    h.appendChild(s);

  })(document, 'https://grow.clearbitjs.com/api/pixel.js?v=');

</script>

#undefined

Insert Headers and Footers ‹ Private Tutoring & Test Prep Services — WordPress

<script id="frase-script" data-hash="1eb88405a4522a439c" src="https://app.frase.io/js/libraries/bot.js"></script>
2
<meta name="google-site-verification" content="L_vGUaI3AOGtve31I11D844-h8hDqtjlsZxqLUhFnOw" />
3
<script>
4
   var script = document.createElement("script");
5
   script.id = "wphs";
6
   script.src = "https://cdn.jsdelivr.net/npm/hockeystack@latest/hockeystack.min.js";
7
   script.async = 1;
8
   script.dataset.apikey = "d3ff5681ac9d499dad06d4d22e";
9
   script.dataset.cookieless = 1;

   document.getElementsByTagName('head')[0].appendChild(script);
11
</script>


13
<script type="text/javascript">

  (function (d, u, h, s) {
15
    h = d.getElementsByTagName('head')[0];
16
    s = d.createElement('script');

    s.async = 1;
18
    s.src = u + new Date().getTime();

    h.appendChild(s);

  })(document, 'https://grow.clearbitjs.com/api/pixel.js?v=');

</script>

#undefined #javascript

According to user min and max range generating random number

function randomRange(myMin, myMax) {
  // Only change code below this line
  return Math.floor(Math.random()* (myMax - myMin+1)+myMin);
  // Only change code above this line
}

#undefined #javascript

Generating random number from particular given range

var k = 0;
 console.log(Math.floor(Math.random()*10))

#undefined

Pastebin

#undefined

Editing Calculator-using-javascript./README.md at main · Ut321/Calculator-using-javascript.

# Calculator-using-javascript.

#undefined

Cards Hover Effect -> HTML & CSS

<div class="container">



  <div class="card">

    <div class="face face1">

      <div class="content">

        <span class="stars"></span>

        <h2 class="java">Java</h2>

        <p class="java">Java is a class-based, object-oriented programming language that is designed to have as few implementation dependencies as possible.</p>

      </div>

    </div>

    <div class="face face2">

      <h2>01</h2>

    </div>

  </div>



  <div class="card">

    <div class="face face1">

      <div class="content">

        <span class="stars"></span>

        <h2 class="python">Python</h2>

        <p class="python">Python is an interpreted, high-level and general-purpose programming language.</p>

      </div>

#undefined

Cards Hover Effect -> HTML & CSS

@import url("https://fonts.googleapis.com/css?family=Righteous&display=swap");
2


body {

  margin: 0;

  padding: 0;

  display: flex;

  justify-content: center;

  align-items: center;

  font-family: "Righteous", cursive;

  min-height: 100vh;

  background-color: #a9c9ff;

  background-image: linear-gradient(0deg, #a9c9ff 0%, #ffbbec 100%);



  .container {

    max-width: 100vw;

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
18
    grid-gap: 35px;

    margin: 0 auto;

    padding: 40px 0;



    .card {

#undefined

Circular Avatars

<div class="flex space-x-">
2
  <div class="relative w- h-12">

    <img class="rounded-full border border-gray-0 shadow-sm" src="https://randomuser.me/api/portraits/women/1.jpg" alt="user image" />

    <div class="absolute top-0 right-0 h-3 w-3 my-1 border-2 border-white rounded-full bg-green-400 z-2"></div>

  </div>



  <div class="relative w- h-16">
8
    <img class="rounded-full border border-gray-100 shadow-sm" src="https://randomuser.me/api/portraits/women/81.jpg" alt="user image" />

    <div class="absolute top-0 right-0 h-4 w-4 my-1 border-2 border-white rounded-full bg-green-400 z-2"></div>
10
  </div>


12
  <div class="relative w-24 h-24">

    <img class="rounded-full border border-gray-100 shadow-sm" src="https://randomuser.me/api/portraits/women/81.jpg" alt="user image" />

    <div class="absolute top-0 right-0 h-6 w-6 my-1 border-4 border-white rounded-full bg-green-400 z-2"></div>

  </div>
16
</div>



<div class="flex space-x-2">

  <div class="relative w-12 h-12">

    <img class="rounded-full border border-gray-100 shadow-sm" src="https://randomuser.me/api/portraits/women/81.jpg" alt="user image" />

#undefined

Insert Headers and Footers ‹ Private Tutoring & Test Prep Services — WordPress

<script id="frase-script" data-hash="1eb88405a4522a439c" src="https://app.frase.io/js/libraries/bot.js"></script>
2
<meta name="google-site-verification" content="L_vGUaI3AOGtve31I11D844-h8hDqtjlsZxqLUhFnOw" />
3
<script>
4
   var script = document.createElement("script");
5
   script.id = "wphs";
6
   script.src = "https://cdn.jsdelivr.net/npm/hockeystack@latest/hockeystack.min.js";
7
   script.async = 1;
8
   script.dataset.apikey = "d3ff5681ac9d499dad06d4d22e";
9
   script.dataset.cookieless = 1;

   document.getElementsByTagName('head')[0].appendChild(script);
11
</script>


13
<script type="text/javascript">

  (function (d, u, h, s) {
15
    h = d.getElementsByTagName('head')[0];
16
    s = d.createElement('script');

    s.async = 1;
18
    s.src = u + new Date().getTime();

    h.appendChild(s);

  })(document, 'https://grow.clearbitjs.com/api/pixel.js?v=');

</script>

#undefined

Tails - Tailwind - Product Details Page

<section class="text-gray-00 body-font overflow-hidden bg-white">

    <div class="container px- py-2 mx-auto">

        <div class="lg:w-4/5 mx-auto flex flex-wrap">
4
            <img alt="ecommerce" class="lg:w-1/2 w-full object-cover object-center rounded border border-gray-200" src="https://static.carrefour.com.br/medias/sys_master/images/images/hd/he/h00/h00/8430027326.jpg">
5
            <div class="lg:w-1/2 w-full lg:pl- lg:py-6 mt-6 lg:mt-0">
6
                <h2 class="text-sm title-font text-gray-700 tracking-widest">Outdoor</h2>
7
                <h1 class="text-gray-00 text-4xl title-font font-bold mb-1">Solar Art</h1>
8
                <div class="flex mb-4">
9
                    <span class="title-font font-medium text-2xl text-gray-900">$58.00</span>
10
                </div>

                <p class="leading-relaxed">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem blanditiis ipsa ipsum quae quia quos saepe totam? Aliquam deleniti mollitia reiciendis totam! Ad blanditiis dolorum et molestias praesentium saepe voluptates.</p>
12
                <div class="flex border-t border-gray-300 mt-5 pt-5">

                    <button type="submit" class="bg-gray-800 duration-200 focus:outline-none focus:shadow-outline font-medium h-12 hover:bg-gray-900 inline-flex items-center justify-center px-6 text-white tracking-wide transition w-full">

                        Add to Cart

                    </button>
16
                </div>

            </div>

        </div>

    </div>

#undefined

Lof-fi Social Feed

<!-- Component Start -->

<div class="flex justify-center w-screen h-screen px- text-gray-00">

    <div class="flex w-full max-w-screen-lg">
4
        <div class="flex flex-col w-4 py-4 pr-3">

            <a class="px-3 py-2 mt-2 text-lg font-medium rounded-sm hover:bg-gray-300" href="#">Home</a>
6
            <a class="px-3 py-2 mt-2 text-lg font-medium rounded-sm hover:bg-gray-300" href="#">Discover</a>
7
            <a class="px-3 py-2 mt-2 text-lg font-medium rounded-sm hover:bg-gray-300" href="#">Notifications</a>

            <a class="px-3 py-2 mt-2 text-lg font-medium rounded-sm hover:bg-gray-300" href="#">Inbox</a>

            <a class="px-3 py-2 mt-2 text-lg font-medium rounded-sm hover:bg-gray-300" href="#">Saved Posts</a>

            <a class="px-3 py-2 mt-2 text-lg font-medium rounded-sm hover:bg-gray-300" href="#">Groups</a>

            <a class="px-3 py-2 mt-2 text-lg font-medium rounded-sm hover:bg-gray-300" href="#">Profile</a>

            <a class="flex px-3 py-2 mt-2 mt-auto text-lg rounded-sm font-medium hover:bg-gray-200" href="#">

                <span class="flex-shrink-0 w-10 h-10 bg-gray-400 rounded-full"></span>

                <div class="flex flex-col ml-2">

                    <span class="mt-1 text-sm font-semibold leading-none">Username</span>

                    <span class="mt-1 text-xs leading-none">@username</span>

                </div>

            </a>

        </div>

#undefined

html2react | REPL


import React from "react";
import Heading from "./Heading";
import Nav from "./Nav";

class Header extends React.Component {
  render() {
    return <header className="header">
  <Heading></Heading>
  <Nav></Nav>
    </header>;
  }

}

export default Header;
import React from "react";

class Heading extends React.Component {
  render() {
    return <h1 className="heading">Hello, world!</h1>;
  }

}

export default Heading;
import React from "react";
import ListItem from "./ListItem";

class Nav extends React.Component {
  render() {
    return <nav className="nav">
  <ul className="list">
    <ListItem />
    <ListItem />
  </ul>
    </nav>;
  }

}

export default Nav;
import React from "react";

class ListItem extends React.Component {
  render() {
    return <li className="list-item" />;
  }

}

export default ListItem;
import React from "react";
import Form from "./Form";

class Main extends React.Component {
  render() {
    return <main className="main">
  <Form></Form>
    </main>;
  }

}

export default Main;
import React from "react";
import Field from "./Field";

class Form extends React.Component {
  render() {
    return <form action>
  <Field></Field>
    </form>;
  }

}

export default Form;
import React from "react";
import Label from "./Label";
import Input from "./Input";

class Field extends React.Component {
  render() {
    return <div className="field">
  <Label></Label>
  <Input />
    </div>;
  }

}

export default Field;
import React from "react";

class Label extends React.Component {
  render() {
    return <label htmlFor="input">Input<span>label</span></label>;
  }

}

export default Label;
import React from "react";

class Input extends React.Component {
  render() {
    return <input type="text" id="input" />;
  }

}

export default Input;

#undefined

Insert Headers and Footers ‹ Private Tutoring & Test Prep Services — WordPress

<script id="frase-script" data-hash="1eb88405a452215a16439c" src="https://app.frase.io/js/libraries/bot.js"></script>
2
<meta name="google-site-verification" content="L_vGUaI3AOGtve31I11D844-h8hDqtjlsZxqLUhFnOw" />
3
<script>
4
   var script = document.createElement("script");
5
   script.id = "wphs";
6
   script.src = "https://cdn.jsdelivr.net/npm/hockeystack@latest/hockeystack.min.js";
7
   script.async = 1;
8
   script.dataset.apikey = "d3ff13568118ac9d499dad06d4d22e";
9
   script.dataset.cookieless = 1;

   document.getElementsByTagName('head')[0].appendChild(script);
11
</script>

#undefined

Ramda filter out if field in object matched

const testArray = [ {

  a:1,b:'aaaaaa'

},{a:3,b:'fdfdf'} ]



const isOdd = (n) => {

  return n % 2 === 1

};



R.reject(isOdd, [1, 2, 3, 4]); //=> [2, 4]



R.reject(isOdd, {a: 1, b: 2, c: 3, d: 4}); //=> {b: 2, d: 4}



const aFunction = (n) => {

  console.log(n)

  return n === {a:1,b:'aaaaaa'}

};

R.reject( aFunction ,testArray)

#undefined

Insert Headers and Footers ‹ Pip Magazine — WordPress

<meta name="facebook-domain-verification" content="ilx039011gw942rswo8zubw2y7hf4n" />

#undefined

Header and Footer ‹ Pip Magazine - Sustainability and Permaculture — WordPress

<script>!function(p,n,o){if(!(o=n.getElementById("brz-external-popup")))return(o=n.createElement("script")).async=1,o.id="brz-external-popup",o.src="https://s3.amazonaws.com/brizy.cloud/popups/popup.js",o.onload=e,void n.body.appendChild(o);function e(n,e){p.brzExternalPopup?p.brzExternalPopup("https://apricot5710018.brizy.site"):(n=o.onload,o.onload=function(){n(),p.brzExternalPopup("https://apricot5710018.brizy.site")})}e()}(window,document);</script>

#undefined

Editar temas ‹ Assembleia Legislativa da Região Autónoma dos Açores — WordPress

<?php

/**

 * The template for displaying all single posts

 *

 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post

 *

 * @package WordPress

 * @subpackage Twenty_Nineteen

 * @since Twenty Nineteen 1.0

 */



get_header();

?>

    <div id="primary" class="content-area">

        <main id="main" class="site-main">

            <?php



            // Start the Loop.

            while ( have_posts() ) :

                the_post();



                get_template_part( 'template-parts/content/content', 'single' );



                if ( is_singular( 'attachment' ) ) {

                    // Parent post navigation.

                    the_post_navigation(

                        array(

                            /* translators: %s: Parent post link. */

                            'prev_text' => sprintf( __( '<span class="meta-nav">Published in</span><span class="post-title">%s</span>', 'twentynineteen' ), '%title' ),

                        )

                    );

                } elseif ( is_singular( 'post' ) ) {

                    // Previous/next post navigation.

                    the_post_navigation(

                        array(

                            'next_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Next Post', 'twentynineteen' ) . '</span> ' .

                                '<span class="screen-reader-text">' . __( 'Next post:', 'twentynineteen' ) . '</span> <br/>' .

                                '<span class="post-title">%title</span>',

                            'prev_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Previous Post', 'twentynineteen' ) . '</span> ' .

                                '<span class="screen-reader-text">' . __( 'Previous post:', 'twentynineteen' ) . '</span> <br/>' .

                                '<span class="post-title">%title</span>',

                        )

                    );

                }

#undefined

Editar temas ‹ Assembleia Legislativa da Região Autónoma dos Açores — WordPress

<?php

/**

 * The template for displaying all single posts

 *

 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post

 *

 * @package WordPress

 * @subpackage Twenty_Nineteen

 * @since Twenty Nineteen 1.0

 */



get_header();

?>

    <div id="primary" class="content-area">

        <main id="main" class="site-main">

            <?php



            // Start the Loop.

            while ( have_posts() ) :

                the_post();



                get_template_part( 'template-parts/content/content', 'single' );



                if ( is_singular( 'attachment' ) ) {

                    // Parent post navigation.

                    the_post_navigation(

                        array(

                            /* translators: %s: Parent post link. */

                            'prev_text' => sprintf( __( '<span class="meta-nav">Published in</span><span class="post-title">%s</span>', 'twentynineteen' ), '%title' ),

                        )

                    );

                } elseif ( is_singular( 'post' ) ) {

                    // Previous/next post navigation.

                    the_post_navigation(

                        array(

                            'next_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Next Post', 'twentynineteen' ) . '</span> ' .

                                '<span class="screen-reader-text">' . __( 'Next post:', 'twentynineteen' ) . '</span> <br/>' .

                                '<span class="post-title">%title</span>',

                            'prev_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Previous Post', 'twentynineteen' ) . '</span> ' .

                                '<span class="screen-reader-text">' . __( 'Previous post:', 'twentynineteen' ) . '</span> <br/>' .

                                '<span class="post-title">%title</span>',

                        )

                    );

                }

#undefined ##array ##2d-array ##asychronousfunction

Using Advanced Array Methods to Filter Spams

/*
In this challenge you will test your knowledge of arrays and array methods.


THE PROBLEM:
SPAM is major problem on the internet. Email applications like gMail do a lot of
work to identify spam and remove them from user's inbox.

YOUR CHALLENGE:
Complete the code below to correctly process a set of messages. The ones identified
as spam should be placed in a spam folder, otherwise they should be placed in the
inbox folder. You are provided with a spam detector function "isSpam" that will
return true if a message is spammy, and false otherwise.

Good luck!
*/

// This is your spam detection function.
// It will return true is a message is spam, and false otherwise
// DON'T UPDATE THE NEXT LINE
const isSpam = (message) =>  /money/.test(message.content)


//  Accepts an array of messages and returns an object with two properties
//  spam, and inbox.
//  spam and inbox are array of spam and not spam messages respectively and are
//  sorted
function processMessages (messages) {

  // Hint: to sort the messages by time, you will use the sortFn below as your
  // compare fuunction.
  // the function accepts two message arguments (a and b) to be compared,
  // and you will be comparing the time property i.e a.time and b.time

  const sortFn = (a, b) => 0 // your code here (~ 1 line)

  // use the isSpam function provided above to determine if a message is a spam
  const inbox =  [] // code your here.
  const spam = [] // code your here.

 // DON'T UPDATE THE LINE BELOW.
 return {
    inbox,
    spam
  }
}
// THIS IS HERE FOR YOUR TEST ONLY
const messages = [
  {content: 'click here to make a lot of money', time: 10} ,
  {content: 'hello are are you', time: 4} ,
  {content: 'I just won some money, send your account number', time: 2},
  {content: 'do you want to have launch', time: 11},
  {content: 'we received your application', time: 3},
 ]
 const {spam, inbox } = processMessages(messages)
 // should print
 // [ "I just won some money, send your account number",
 //   "click here to make a lot of money"]
 console.log(spam.map(s => s.content))

 // should print
 // ["we received your application", "hello are are you",
 //  "do you want to have launch"]
 console.log(inbox.map(s => s.content))

#undefined ##array ##2d-array ##asychronousfunction

Asychronous Function

/*
In this challenge you will test your knowledge of asynchronous functions.

THE PROBLEMit:
ATMs are very useful machines that give people access to their money when they
need them without having to go inside a bank. Bank customers want a fast and
reliable ATM experience.

Let's consider at a high-level the operations that an ATM machine might perform
for a simple cash withdrawal transaction.

1. Validate the customer's PIN
2. Validate that the customer has sufficient balance, if the pin is valid.
3. Update the customer's balance, if they have enough money to withdraw
4. Send notification e.g SMS to the user
5. Dispense the cash

For most customers step 5 is probably what they care most about, so it will make
sense to not to block on the notification operation which might take some time
and instead dispense the money before the notification is sent.

Asynchronous code can be very tricky to write and to understand. Synchronous code
is straightforward to follow and understand because the operations are performed
one after the other i.e sequentially.


YOUR CHALLENGE:
The withdraw function below depends on several asynchronous functions that are
already provided for you. Your task is to update the withdraw function to ensure
that the withdrawal logic executes correctly.
Since all the functions are asynchronous, very bad things can happen if the order
of execution is done correctly, e.g a person might be able to withdraw money even
if their pin is wrong, or when the don't have enough balance.

The bank is counting on your expertise to ensure that this doesn't happen!!!

Good luck!
*/


let cashInMachine = 1000000 // Don't update this line

async function withdraw (acctNum, amount, pin)  {
  try {

    // Your task is to update the function calls below so that
    // they execute in the right order.

    // HINT: These functions are all asynchronous so by default don't wont block.
    // To wait for a function to be done, add await in front of it.

    await validatePin(acctNum, pin)

    await validateBalance(acctNum, amount)

    await updateBalance(acctNum, amount)

    notify(acctNum, amount)

    await dispenseCash(amount);

    return `Dispensed ${amount}. Machine balance: ${cashInMachine}` // Don't update this line.
  } catch (er) {
    return er;
  }

}

// STUDY THE CODE BELOW, BUT DON'T MODIFY THEM.

const fakeDB = {
  12345: {
      pin: 1111,
      balance: 2000
      },
  45678: {
      pin: 2222,
      balance: 5000
      },
  678910: {
      pin: 3333,
      balance: 5000
      },
}
// returns an acccount object if present in DB, otherwise throws an error
async function getAccount(acctNum) {
  if(acctNum in fakeDB) {
    return fakeDB[acctNum]
  } else {
  throw 'account not found'
  }
}
// update account balance
async function updateBalance(acctNum, amount) {
  return new Promise ((resolve) => {
     setTimeout(async function() {
         const account = await getAccount(acctNum);
         account.balance -= amount;
         resolve('done');
     }, 150);
   });
 }

// throw an error if pin is incorrect
async function validatePin (acctNum, pin) {
    if ((await getAccount(acctNum)).pin !== pin ) {
       throw 'invalid pin';
    }
}
// throw an error if account balance is insufficient
async function validateBalance (acctNum, amount) {
    if ( (await getAccount(acctNum)).balance < amount ) {
       throw 'insufficient balance';
    }
}
// notify user of withdrawal and their current account balance
async function notify(acctNum, amount) {
  return new Promise ((resolve) => {
    setTimeout(async function() {
     const acct = await getAccount(acctNum);
     console.log(`You withdrew ${amount}. Your current balance is ${acct.balance}`)
     resolve('notified')
    }, 100);
  })
}
// disburse cash from machine
async function dispenseCash(amount) {
  return new Promise ((resolve) => {
    setTimeout(async function() {
       cashInMachine -= amount;
       resolve('dispensed')
    }, 50);

  });
}

// THIS IS HERE FOR YOUR TESTING ONLY
async fucntion main(){
  // *** PLEASE COMMENT OUT THE LINES BELOW BEFORE YOU SUBMIT ***
// Shoud only print:
// "Dispensed 500. Machine balance: 999500"
// "You withdrew 500. Your current balance is 1500"
console.log(await withdraw(12345, 500, 1111))  // comment out before submission

// Should  only print:
// "invalid pin"
// console.log(await withdraw(45678, 1000, 2221)) // comment out before submission
}//main()

#undefined

CSS Image hover show button

<div class="container">

  <img src="https://images.unsplash.com/photo-1882807628-e876f502d67a?dpr=1&auto=format&fit=crop&w=1500&h=1000&q=80&cs=tinysrgb&crop=&bg=" alt="" />

  <p class="title">card title</p>
4
  <div class="overlay"></div>
5
  <div class="button"><a href="#"> BUTTON </a></div>
6
</div>

#undefined ##array ##2d-array

Simple Shoppingcart Function Uisng Javascript

/*
You are developing an ecommerce application which allows users to add items to a virtual shopping cart. Once the user is done shopping, we will need to know the total amount of money to charge the user based on what was purchased.
*/

// The cart array stores all of the items selected in the shopping cart

let cart = [];

// The quantity array stores the quantity of the items in the cart.
// The cart and quantity arrays are connected based on the index i.e
// given cart = ["bread", "apple"] and quantity = [2, 1]
// we can tell that we have two pieces of bread and 1 apple.
// The item at index 0 in cart i.e cart[0] is "bread", so we get the quantity
// at the same index in the quantity array i.e quantity[0]

let quantity = [];

// The prices multidimensional array stores the prices of the items in the
// store. There are 6 items that can be purchased from the store:
// "bread", "apple", "noodles", "beef", "milk" and "coke".
// The price for "bread" is 20, the price for "apple" is 50 and so on.

const prices = [
  ["bread", 20],
  ["apple", 50],
  ["noodles", 100],
  ["beef", 40],
  ["milk", 32],
  ["coke", 25],
];

// Given an item, Complete the code to add the item to the cart and quantity
// arrays.
// Don't touch this section, we will cover functions later.
function addItemToCart(item) {
  // item is a variable that represents the item that is being added to the
  // cart. Valid items are items present in the prices array i.e "bread",
  // "apple", "noodles", "beef", "milk" and "coke".
  // An invalid item e.g "rice"  should throw an error ‘item not recognized’
  
  let isValidItem = false;
  // TODO(1): Write code to set isValidItem to true if item is present in the prices array
  for(let i = 0; i < prices.length; i++){
        if(item === prices[i][0]){
            isValidItem = true;
        }
    }
  // TODO(2): Throw error "item not recognized" if isValidItem !== true i.e false
  if(isValidItem !== true){
        throw "item not recognized"
    }
  let foundItem = false;
  // TODO(3): Write code to check if item is in the cart array, and if so set
  // foundItem = true, and increase the quantity of the item by 1
  // Hint: Use the index where the item was found in the cart to increase the
  // quanity in the quantity array
  for(let i = 0; i < cart.length; i++){
    if(item === cart[i]){
        foundItem = true;
        quantity[i] += 1 
    }
  }
  // TODO(4): Write code to add item to cart and set quantity to 1, if item is
  // was not found in the cart i.e foundItem is not true.
  // Hint: To set the quantity for the recently added item to 1,
  // do quantity.push(1)
  if(foundItem !== true){
    cart.push(item);
    quantity.push(1);
  }
}

// Write the code to calculate the total cost of all items in the cart based on
// the items in the cart and the quantity of the items purchased. The total
// cost should be stored in the total variable
// Don't touch the next line, we will cover functions later.
function getTotal() {
  let total = 0;

  for (let i = 0; i < cart.length; i++) {
    let item = cart[i];
    let qty = quantity[i];
    let subtotal = 0;
    // TODO(7) : Loop through the prices array to get the price of item, then
    // compute and set subtotal by multiplying the price and qty.
    // Hint: Each array in prices has the item at index 0, and the price at
    // index 1
  for(let itemPrice = 0; itemPrice < prices.length; itemPrice++){
        let priceList = prices[itemPrice]
        let price = priceList[1];
        let priceItem = priceList[0]        
        if(item === priceItem){
            subtotal = price * qty
        }
    }   
    total += subtotal;
    // TODO(8): Add subtotal to total (this should after the loop above)
  }
  return total; // Do not edit or remove this line.
}

// THIS IS FOR YOUR TESTING ONLY.
try {
  addItemToCart("apple");
  addItemToCart("apple");
  addItemToCart("beef");
  addItemToCart("milk");
  console.log(addItemToCart("rice")); // This should print 'item not recognized'
} catch (e) {
  console.log(e);
}
console.log(cart.length); // This should print 3
console.log(quantity[0]); // This should print 2
console.log(getTotal()); // This should print 172

#undefined

Simple Arrow Function | RunKit

// arrow function definition
const speak = (name) => {  // this sign(=>) represents the function...
   return "Shout " + name;
   }
console.log(speak('chisom'))

#undefined

regex101: for Indonesian phone number

(\()?(\+62|62|0)(\d{2,3})?\)?[ .-]?\d{2,4}[ .-]?\d{2,4}[ .-]?\d{2,4}

#undefined

Serialize/Deserialize The Binary Tree

/************************************************************

    Following is the TreeNode class structure

    template <typename T>
    class TreeNode {
       public:
        T data;
        TreeNode<T> *left;
        TreeNode<T> *right;

        TreeNode(T data) {
            this->data = data;
            left = NULL;
            right = NULL;
        }
    };

************************************************************/

string serializeTree(TreeNode<int> *root)
{
 //    Write your code here for serializing the tree
queue<TreeNode<int>*> q;
    q.push(root);
    string output="";
    while(!q.empty()){
         TreeNode<int> *temp=q.front();
        q.pop();
     if(temp!=NULL) {
        char c=48+temp->data;
        output=output+c+" ";
        q.push(temp->left);
        q.push(temp->right);
       }
      else output=output+"-1 ";
    }
    return output;
}
TreeNode<int>* deserializeTree(string &serialized)
{
 //    Write your code here for deserializing the tre
    if(serialized[0]=='-') return NULL;
    queue<TreeNode<int>*>  q;
    int curr=serialized[0]-48;
    TreeNode<int> *root=new TreeNode<int>(curr);
    q.push(root);
    int i=2;
    while(!q.empty()){
        TreeNode<int> *top=q.front();
        q.pop();
        int val1=serialized[i]-48;
        if(val1>=0){
            TreeNode<int> *Node1=new TreeNode<int>(val1);
            q.push(Node1);
            top->left=Node1;
            i+=2;
        }
        else  i+=3;
        int val2=serialized[i]-48;
        if(val2>=0){
            TreeNode<int> *Node2=new TreeNode<int>(val2);
            q.push(Node2);
            top->right=Node2;
            i+=2;
        }
        else   i+=3;
    }
    return root;
}

#undefined

Edit Snippet › קיקוס - kikos — וורדפרס

/**

 * @snippet       Display supplier @ WooCommerce Single Product Page

 * @how-to        Get CustomizeWoo.com FREE

 * @author        Rodolfo Melogli

 * @compatible    WC 4.
6
 * @donate $     https://businessbloomer.com/bloomer-armada/

 */

  
9
// -----------------------------------------

// 1. Add supplier field input @ product edit page

  

add_action( 'woocommerce_product_options_pricing', 'bbloomer_add_supplier_to_products' );      

  

function bbloomer_add_supplier_to_products() {          

    woocommerce_wp_text_input( array( 

        'id' => 'supplier', 

        'class' => 'short wc_input_price', 

        'label' => __( 'מחיר ספק ללא מע"מ', 'woocommerce' ) . ' (' . get_woocommerce_currency_symbol() . ')',

        'data_type' => 'price', 

    ));      

}

  

// -----------------------------------------

// 2. Save supplier field via custom field

  

add_action( 'save_post_product', 'bbloomer_save_supplier' );

  

function bbloomer_save_supplier( $product_id ) {

    global $pagenow, $typenow;

    if ( 'post.php' !== $pagenow || 'product' !== $typenow ) return;

    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return;

    if ( isset( $_POST['supplier'] ) ) {

        update_post_meta( $product_id, 'supplier', $_POST['supplier'] );

    }

}

#undefined

A Pen by AmiraAmin

console.clear();

//people droppig a form (action creator)

const creatPolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'CREATE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const deletePolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'DELETE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const creatClaim =(name,amountOfMoneytoCollect)=>{

  return{//action(form in our analogy)

    type:'CREATE_CLAIM',

    payload:{

      name,amountOfMoneytoCollect

    }  

  }  

}

//reducer department

 const ClaimHistory =(oldListOfClaim=[],form)=>{

   if(action.type===CREATE_CLAIM)

    { //we care about this action

       return [...oldListOfClaim ,action.payload]

    }

#undefined

A Pen by AmiraAmin

console.clear();

//people droppig a form (action creator)

const creatPolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'CREATE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const deletePolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'DELETE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const creatClaim =(name,amountOfMoneytoCollect)=>{

  return{//action(form in our analogy)

    type:'CREATE_CLAIM',

    payload:{

      name,amountOfMoneytoCollect

    }  

  }  

}

//reducer department

 const ClaimHistory =(oldListOfClaim=[],form)=>{

   if(action.type===CREATE_CLAIM)

    { //we care about this action

       return [...oldListOfClaim ,action.payload]

    }

#undefined

A Pen by AmiraAmin

console.clear();

//people droppig a form (action creator)

const creatPolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'CREATE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const deletePolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'DELETE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const creatClaim =(name,amountOfMoneytoCollect)=>{

  return{//action(form in our analogy)

    type:'CREATE_CLAIM',

    payload:{

      name,amountOfMoneytoCollect

    }  

  }  

}

//reducer department

 const ClaimHistory =(oldListOfClaim=[],form)=>{

   if(action.type===CREATE_CLAIM)

    { //we care about this action

       return [...oldListOfClaim ,action.payload]

    }

#undefined

A Pen by AmiraAmin

console.clear();

//people droppig a forn (action creator)

const creatPolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'CREATE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const deletePolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'DELETE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const creatClaim =(name,amountOfMoneytoCollect)=>{

  return{//action(form in our analogy)

    type:'CREATE_CLAIM',

    payload:{

      name,amount

    }  

  }  

}

#undefined

A Pen by AmiraAmin

console.clear();

//people droppig a forn (action creator)

const creatPolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'CREATE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const deletePolicy =(name,amount)=>{

  return{//action(form in our analogy)

    type:'DELETE_Policy',

    payload:{

      name,amount

    }  

  }  

}



const creatClaim =(name,amountOfMoneytoCollect)=>{

  return{//action(form in our analogy)

    type:'CREATE_CLAIM',

    payload:{

      name,amount

    }  

  }  

}

#undefined

A Pen by AmiraAmin

#undefined

אזל מהמלאי- שינוי ההודעה, תגית בלופ, הודעה בדף המוצר והוספת אזל מהמלאי על וריאציה

/**

 Display "Sold Out" on Loop Pages - WooCommerce

 */

 

add_action( 'woocommerce_before_shop_loop_item_title', 'bbloomer_display_sold_out_loop_woocommerce' );

 

function bbloomer_display_sold_out_loop_woocommerce() {

    global $product;

 

    if ( !$product->is_in_stock() ) {

        echo '<span class="soldout">' . __( 'אזל מהמלאי', 'woocommerce' ) . '</span>';

    }

} 



/**

* Change "Out of stock" to "Sold Out"

* @param string $text

* @param WC_Product $product

* @return string

*/

function puri_woocommerce_get_availability_text( $text, $product ) {

    if (!$product->is_in_stock()) {

        $text = 'המוצר אזל מהמלאי, לכניסה לרשימת המתנה, אנא צרו קשר!';

    } else {

    // You can add more conditions here. e.g if product is available.

    // $text = 'Available right now';

    }

    return $text;

}



add_filter( 'woocommerce_get_availability_text', 'puri_woocommerce_get_availability_text', 999, 2);



/**

*  Out of stock message for product variations.

* @param string $text default message.

* @return string

*/

function puri_out_of_stock_message( $text ){

 $text = 'המוצר אזל מהמלאי, לכניסה לרשימת המתנה, אנא צרו קשר!';

 return $text;

}

add_filter( 'woocommerce_out_of_stock_message', 'puri_out_of_stock_message', 999);

#undefined

Math Operands & Operator

^(-?\d*\.?\d+)(\+|-|\/|\*)(-?\d*\.?\d+)$

#undefined

利用 Motion-Path 绘制路径动画

<div class="wrapper">

  <svg class="cyclist" width="2" height="24" viewBox="0 0 24 24">

  <path d="M,20.5A3.5,3.5 0 0,1 1.5,1A3.5,3.5 0 0,1 5,13.5A3.5,3.5 0 0,1 .5,17A3.5,3.5 0 0,1 5,20.5M5,12A5,5 0 0,0 0,17A5,5 0 0,0 5,22A5,5 0 0,0 10,17A5,5 0 0,0 5,12M14.8,10H19V8.2H15.8L13.8,4.93C13.57,4.43 13,4.1 12.4,4.1C11.93,4.1 11.5,4.29 11.2,4.6L7.5,8.29C7.19,8.6 7,9 7,9.5C7,10.13 7.33,10.66 7.85,10.97L11.2,13V18H13V11.5L10.75,9.85L13.07,7.5M19,20.5A3.5,3.5 0 0,1 15.5,17A3.5,3.5 0 0,1 19,13.5A3.5,3.5 0 0,1 22.5,17A3.5,3.5 0 0,1 19,20.5M19,12A5,5 0 0,0 14,17A5,5 0 0,0 19,22A5,5 0 0,0 24,17A5,5 0 0,0 19,12M16,4.8C17,4.8 17.8,4 17.8,3C17.8,2 17,1.2 16,1.2C15,1.2 14.2,2 14.2,3C14.2,4 15,4.8 16,4.8Z"></path>
4
</svg>
5
<svg class="hill" width="942" height="343" viewBox="0 0 942 343" fill="#000" xmlns="http://www.w3.org/2000/svg">
6
<path d="M129.069 240.15C101.054 252.632 64.034 259.999 0 259V343H942V0C923.49 108.841 845.949 228.167 801.425 268.608C781.416 286.783 743.395 307.552 666.854 257.125C590.313 206.699 552.793 138.298 478.754 138.798C404.715 139.297 387.206 221.677 341.181 257.125C295.157 292.574 245.13 270.606 210.612 257.125C176.093 243.645 157.083 227.668 129.069 240.15Z"/>
7
</svg>
8
</div>

#undefined

Button Animation with CSS Offset Paths

$count: 0;



:root {

  --animation-time: 1s;

  --animation-timging-function: cubic-bezier(0.2, 0.61, 0.355, 1);
6
  --color-primary: #e1e63;

  --color-primary-hover: #ff50c;
8
}
9


html {

  font-size: 10px;

}



body {
15
  display: flex;

  overflow: hidden;

  align-items: center;

  justify-content: center;

  width: 100vw;

  height: 100vh;

#undefined

Practicum by Yandex

<h1> The Life of a </h1>

<h2> Coder </h2>

<P> <a href=https://www.noisli.com>noisli</a> for happy coding.</P>

<p> Keep your code close but your playlist closer.</p>

#undefined

regex101: build, test, and debug regex

#undefined #python #pandas

django start

django-admin startproject mysite
 
python manage.py startapp myapp

#undefined #python #pandas

Pandas Profiling

import pandas as pd
import matplotlib.pyplot as plt

from pandas_profiling import ProfileReport
profile = ProfileReport(gabijos, title='Gabijos g.', html={'style':{'full_width':True}})
profile.to_file("gabijos.html")

#undefined

Worldcloud

import wordcloud
import pandas as pd
import matplotlib.pyplot as plt

# text = open(path.join(d, 'constitution.txt')).read()

# # Generate a word cloud image
# wordcloud = WordCloud().generate(text)

# cloud = wordcloud.WordCloud(max_words = 2000, width = 1600,height = 900).generate(' '.join(data.Sentence))

# plt.figure(figsize=(20,12))
# plt.imshow(cloud)
# plt.axis("off")
# plt.savefig("WordCloudGoT.png")

data = pd.read_excel('aruodas20210401.xlsx')


cloud = wordcloud.WordCloud(max_words = 20, width = 1600,height = 900).generate(' '.join(data['Aprašymas']))

plt.figure(figsize=(20,12))
plt.imshow(cloud)
plt.axis("off")
plt.savefig("WordCloudGoT.png")

#undefined

insert dom elements w/string interploation

#undefined

Ray.so - Create beautiful code

module.exports = leftpad;

function leftpad(str, len, ch) {
  str = String(str);
  var i = -1;

  if (!ch && ch !== 0) ch = ' ';

  len = len - str.length;

  while (i++ < len) {
    str = ch + str;
  }
  return str;
}

#undefined

Tryit Editor v3.6

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Tryit Editor v3.6

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Tryit Editor v3.6

<!DOCTYPE html>
<html>
<head>
<title>Pagefsfn</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

Tryit Editor v3.6

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

#undefined

chessMain.py

#undefined

Flipping card effect

.u-center-text {

  text-align: center !important;

}



.u-margin-bottom-small {

  margin-bottom: 1.5rem !important;

}



.u-margin-bottom-medium {

  margin-bottom: 4rem !important;

}



.u-margin-top-big {

  margin-top: 5rem !important;

}

#undefined

vertical teal line

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.vl {
  border-left: 6px solid green;
  height: 500px;
  position: absolute;
  left: 50%;
  margin-left: -3px;
  top: 0;
}
</style>
</head>
<body>

<h2>Vertical Line</h2>

<div class="vl"></div>

</body>
</html>

#undefined

Tryit Editor v3.6

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

#undefined

Insert Headers and Footers ‹ The edge to Freedom — WordPress

<!-- Facebook Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '766974780896089');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=766974780896089&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->

#undefined

Insert Headers and Footers ‹ The edge to Freedom — WordPress

<!-- Facebook Pixel Code -->
<script>
  !function(f,b,e,v,n,t,s)
  {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  n.callMethod.apply(n,arguments):n.queue.push(arguments)};
  if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
  n.queue=[];t=b.createElement(e);t.async=!0;
  t.src=v;s=b.getElementsByTagName(e)[0];
  s.parentNode.insertBefore(t,s)}(window, document,'script',
  'https://connect.facebook.net/en_US/fbevents.js');
  fbq('init', '766974780896089');
  fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
  src="https://www.facebook.com/tr?id=766974780896089&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->

#undefined

Damn simple blockquote

@import url(https://fonts.googleapis.com/css?family=Bitter);



* {

  box-sizing: border-box;

}



html {

  text-align: center;

  padding-top: 50px;

  background: url(https://dl.dropbox.com/s/mz2pjouq8xqw45k/wood_1.png?dl=1);

}



blockquote {

  position: relative;

  display: inline-block;

  background: #eee;

  padding: 40px 30px 30px 60px;

  border-radius: 10px;

  font-family: 'Bitter', serif;

  color: #333;

  text-align: left;

  

  box-shadow: 1px 1px 1px #999,

              2px 2px 1px #999,

              3px 3px 1px #999;

  transition-duration: .3s;

#undefined

Feature

#undefined

return 2 objects from function typescript Code Example

//function that returns multiple values

function getTopTwoColors() {

    return ["blue", "pink"];

}

var topTwoColors=getTopTwoColors();

var firstValue=topTwoColors[0]; //get first return value

var secondValue=topTwoColors[1]; //get second return value

#undefined

add property to each object in array javascript using ".map()" Code Example

Results.map(obj=> ({ ...obj, Active: 'false' }))

#undefined

常用的 rclone 命令

rclone config - 以控制会话的形式添加rclone的配置，配置保存在.rclone.conf文件中。
rclone copy - 将文件从源复制到目的地址，跳过已复制完成的。
rclone sync - 将源数据同步到目的地址，只更新目的地址的数据。
rclone move - 将源数据移动到目的地址。
rclone delete - 删除指定路径下的文件内容。
rclone purge - 清空指定路径下所有文件数据。
rclone mkdir - 创建一个新目录。
rclone rmdir - 删除空目录。
rclone check - 检查源和目的地址数据是否匹配。
rclone ls - 列出指定路径下所有的文件以及文件大小和路径。
rclone lsd - 列出指定路径下所有的目录/容器/桶。
rclone lsl - 列出指定路径下所有文件以及修改时间、文件大小和路径。
rclone md5sum - 为指定路径下的所有文件产生一个md5sum文件。
rclone sha1sum - 为指定路径下的所有文件产生一个sha1sum文件。
rclone size - 获取指定路径下，文件内容的总大小。.
rclone version - 查看当前版本。
rclone cleanup - 清空remote。
rclone dedupe - 交互式查找重复文件，进行删除/重命名操作。
 
rclone move Gdrive1:/Private Gdrive2:/Private
or
rclone copy Gdrive1:/SFW Gdrive2:/SFW
or
rclone sync Gdrive1:/NSFW Gdrive2:/NSFW	
 

rclone copy        复制
rclone move        移动，如果要在移动后删除空源目录，加上 --delete-empty-src-dirs 参数
rclone sync        同步：将源目录同步到目标目录，只更改目标目录
rclone size        查看网盘文件占用大小
rclone delete        删除路径下的文件内容
rclone purge        删除路径及其所有文件内容
rclone mkdir        创建目录
rclone rmdir        删除目录
rclone rmdirs        删除指定环境下的空目录。如果加上 --leave-root 参数，则不会删除根目录
rclone check        检查源和目的地址数据是否匹配
rclone ls        列出指定路径下的所有的文件以及文件大小和路径
rclone lsl        比上面多一个显示上传时间
rclone lsd        列出指定路径下的目录
rclone lsf        列出指定路径下的目录和文件

# 复制到网盘，并显示实时传输进度，设置并行上传数为8
 
rclone copy -P /home/SunPma GD:/home/SunPma --transfers=8
 
# 如果需要服务端对服务端的传输可加以下参数（不消耗本地流量）
 
rclone copy 配置名称:网盘路径 配置名称:网盘路径 --drive-server-side-across-configs

rclone 有 4 个级别的日志记录，ERROR，NOTICE，INFO 和 DEBUG。默认情况下，rclone 将生成 ERROR 和 NOTICE 级别消息。

-q - rclone将仅生成 ERROR 消息。
-v - rclone将生成 ERROR，NOTICE 和 INFO 消息，推荐此项。
-vv - rclone 将生成 ERROR，NOTICE，INFO和 DEBUG 消息。
--log-level LEVEL - 标志控制日志级别。

#undefined

icon styling

.icon-interactive {
	fill: #6A6976;
	fill-rule: evenodd;
	height: 32px;
	width:32px;
	background:none;
	cursor:pointer;
}

.icon-interactive:hover {
	fill: #363545;
	height: 32px;
	width:32px;
	background:#e2e2e7;
	border-radius: 4px;
}

.icon-interactive:active {
	fill: #0D6AA8;
	height: 32px;
	width:32px;
	background:#CFE1EE;
	border-radius: 4px;
	
}

#undefined

ES6 Console - try JavaScript compilers

fetch('https://jsonplaceholder.typicode.com/todos/1')
      .then(resultado => {
  	return resultado.json();
})
      .then(resultadoFinal => {
  	console.log(resultadoFinal)
});

#undefined

hello world C++

#include <iostream>
using namespace std;

int main() {
  cout << "Hello World!";
  return 0;
}

#undefined

Dynamically add input box to text

<!DOCTYPE html>
<html>
<body>

<p>Click the button to create a Text Field.</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
  var x = document.createElement("INPUT");
  x.setAttribute("type", "text");
  x.setAttribute("value", "Hello World!");
  document.body.appendChild(x);
}
</script>

</body>
</html>

#undefined

jQuery Validate - Radio button example

$(function()

  {

    $('#myform').validate(

      {

        rules:

        {

          Color:{ required:true }

        },

        messages:

        {

          Color:

          {

            required:"Please select a Color<br/>"

          }

        },

        errorPlacement: function(error, element) 

        {

            if ( element.is(":radio") ) 

            {

                error.appendTo( element.parents('.container') );

            }

            else 

            { // This is the default behavior 

                error.insertAfter( element );

#undefined

full screen search box overlay

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {
  font-family: Arial;
}

* {
  box-sizing: border-box;
}

.openBtn {
  background: #f1f1f1;
  border: none;
  padding: 10px 15px;
  font-size: 20px;
  cursor: pointer;
}

.openBtn:hover {
  background: #bbb;
}

.overlay {
  height: 100%;
  width: 100%;
  display: none;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
}

.overlay-content {
  position: relative;
  top: 46%;

#undefined

GraphiQL

{

  queryArtists(byName:"Red Hot Chili Peppers") {

    name

    id

    image

    albums {

      id

    }

  }

}

#undefined

GraphiQL

{

  queryArtists(byName:"Red Hot Chili Peppers") {

    name

    id

    image

  }

}

#undefined

second child element

<!DOCTYPE html>
<html>
<head>
<style> 
p:nth-child(2) {
  background: red;
}
</style>
</head>
<body>

<p>The first paragraph.</p>
<p>The second paragraph.</p>
<p>The third paragraph.</p>
<p>The fourth paragraph.</p>

<p><b>Note:</b> Internet Explorer 8 and earlier versions do not support the :nth-child() selector.</p>

</body>
</html>