Skip to content

Instantly share code, notes, and snippets.

View dyarfi's full-sized avatar

Defrian Yarfi dyarfi

34 followers · 82 following
View GitHub Profile
@dyarfi
dyarfi / button_hover_reveal.scss
Created August 23, 2021 09:03
button_hover_reveal.scss
/** Body CSS sample **/
body {
background:rgb(255, 247, 233);
}
/** Flatted button %placeholder **/
%btn-flat {
border-radius: 0rem;
}
/** Rounded button **/
.btn-rounded {
@dyarfi
dyarfi / glitchy_helloworld.html
Created August 23, 2021 09:00
glitchy_helloworld.html
<div class="hello-world">
<h1>H</h1>
<h1>E</h1>
<h1>L</h1>
<h1>L</h1>
<h1>O</h1>
<br/>
<h2>W</h2>
<h2>O</h2>
<h2>R</h2>
@dyarfi
dyarfi / glitchy_helloworld.scss
Created August 23, 2021 08:58
glitchy_helloworld.scss
body {
background-color: black;
margin: 5rem 4rem;
text-align: center;
font-family: 'Poppins', 'sans-serif';
}
h1, h2 {
margin: 0;
padding: 0;
color: white;
@dyarfi
dyarfi / css_is_awesome.scss
Created August 23, 2021 08:55
css_is_awesome.scss
body {
font-family: Arial, sans-serif;
background-color: white;
}
.centering-element{
margin: 0;
min-height: 100vh;
height: 100%;
display: grid;
justify-content: center;
@dyarfi
dyarfi / css_is_awesome.html
Last active August 23, 2021 08:53
css_is_awesome.html
<section>
<div class="container">
<div class="row">
<div class="mx-auto">
<div class="col-lg-12 position-relative" style="overflow:visible !important;">
<div class="centering-element">
<div class="w-75">
<h1 class="display-1 heading-big heading-big-square text-left" style="word-wrap:visible">CSS<br/>is<br/>Awesome</h1>
</div>
</div>
@dyarfi
dyarfi / next.config.js
Created March 7, 2021 18:04
Next.js config for SEO default
module.exports = {
serverRuntimeConfig: {
// Will only be available on the server side
mySecret: 'secret',
secretKey: 'secretKey',
jwtToken: 'JwtToken',
},
publicRuntimeConfig: {
// Will be available on both server and client
// Pass through env variables
@dyarfi
dyarfi / semantic.html
Last active June 19, 2021 14:46
A sample of semantic HTML5 web page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Your Website Title</title>
<meta name="description" content="Your Website Description">
</head>
<body>
<header class="header">
@dyarfi
dyarfi / schema.prisma
Last active March 3, 2021 15:20
prisma/schema.prisma
generator client {
provider = "prisma-client-js"
}
datasource db {
provider = "postgresql"
url = env("DATABASE_URL")
}
model Job {
@dyarfi
dyarfi / Layout.jsx
Last active June 16, 2021 16:15
./components/layout/Layout.jsx in Next.js with JWT Authentication
/* next.js head */
import Head from 'next/head';
/* components */
import Header from '../header/Header';
import Footer from '../footer/Footer';
export default function Layout({
children,
title = 'Next.js with JWT Authentication | A boilerplate JWT Authentication and Next.js from dyarfi.github.io',
@dyarfi
dyarfi / FormLogin.jsx
Created September 9, 2020 09:57
./components/form/FormLogin.jsx in Next.js with JWT Authentication
function FormLogin({ props }) {
const {
onSubmitHandler,
onChangeHandler,
stateFormData,
stateFormError,
stateFormMessage,
} = props;
return (
<form className="form-login card" method="POST" onSubmit={onSubmitHandler}>