Skip to content

Commit

Permalink
dark mode
Browse files Browse the repository at this point in the history
  • Loading branch information
@rez1dent3
rez1dent3 committed Jul 27, 2024
1 parent 7aa2b10 commit bbbe6b3
Show file tree
Hide file tree
Showing 25 changed files with 2,767 additions and 3,452 deletions.
31 changes: 24 additions & 7 deletions main.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,25 +13,42 @@ import (
//go:embed public
var staticFiles embed.FS

// main is the entry point of the program.
// It serves the HTML content from the "public" directory.
// It listens on the address specified by the environment variables HOST and PORT,
// defaulting to "127.0.0.1:8080" if the variables are not set.
func main() {
// Load the embedded file system and get the "public" directory.
htmlContent, err := fs.Sub(staticFiles, "public")
if err != nil {
log.Fatal(err)
log.Fatal("Failed to load embedded file system:", err) // Exit if the embedded file system cannot be loaded
}

http.Handle("/", http.FileServer(http.FS(htmlContent)))
// Create a file server to serve the HTML content.
fileServer := http.FileServer(http.FS(htmlContent))

host, _ := os.LookupEnv("HOST")
port, ok := os.LookupEnv("PORT")
// Set the handler for the root path ("/") to the file server.
http.Handle("/", fileServer)

// Get the host and port from the environment variables.
host, _ := os.LookupEnv("HOST") // Get the host from the environment variable, defaulting to "" if not set
port, ok := os.LookupEnv("PORT") // Get the port from the environment variable, defaulting to "" if not set
if !ok {
port = "8080"
port = "8080" // Default port is 8080
}

addr := net.JoinHostPort(host, port)
// Create the address to listen on.
addr := net.JoinHostPort(host, port) // Join the host and port with a colon separator

// Log the address we are listening on.
log.Printf("Listening on %s...\n", addr)

// Start the server.
// The server will listen indefinitely until it is stopped.
// If an error occurs that is not due to the server being closed,
// the error will be logged and the program will exit.
err = http.ListenAndServe(addr, nil)
if err != nil && !errors.Is(err, http.ErrServerClosed) {
log.Fatal(err)
log.Fatal("Server error:", err) // Exit if there is an error other than the server being closed
}
}
5,036 changes: 1,862 additions & 3,174 deletions package-lock.json
View file

Large diffs are not rendered by default.

6 changes: 4 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,13 +31,15 @@
"@rollup/plugin-json": "^6.1.0",
"@rollup/plugin-node-resolve": "^15.2.3",
"@rollup/plugin-replace": "^5.0.7",
"@rollup/plugin-terser": "^0.4.4",
"@theme-toggles/react": "^4.1.0",
"babel-preset-minify": "^0.5.2",
"bulma": "^1.0.2",
"notiflix": "^3.2.7",
"preact": "^10.23.1",
"react-helmet-async": "^2.0.5",
"rollup": "^4.19.0",
"rollup-copy-transform-css": "^1.2.5",
"rollup-plugin-copy": "^3.5.0",
"rollup-plugin-import-css": "^3.5.0",
"test": "^3.3.0",
"uuid": "^10.0.0"
}
Expand Down
2 changes: 0 additions & 2 deletions public/app.css
View file

This file was deleted.

1 change: 0 additions & 1 deletion public/app.css.map
View file

This file was deleted.

2 changes: 0 additions & 2 deletions public/bulma-tooltip.css
View file

This file was deleted.

1 change: 0 additions & 1 deletion public/bulma-tooltip.css.map
View file

This file was deleted.

2 changes: 0 additions & 2 deletions public/bulma.css
View file

This file was deleted.

1 change: 0 additions & 1 deletion public/bulma.css.map
View file

This file was deleted.

24 changes: 1 addition & 23 deletions public/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,32 +10,10 @@
<link rel="icon" type="image/png" sizes="32x32" href="./favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./favicon-16x16.png">
<link rel="manifest" href="./site.webmanifest">

<link rel="stylesheet" href="./bulma.css">
<link rel="stylesheet" href="./bulma-tooltip.css">
<link rel="stylesheet" href="./app.css">
</head>
<body>
<div class="uuid-ui--wrapper">
<nav class="navbar is-light" role="navigation" aria-label="main navigation">
<div class="container">
<div class="navbar-brand">
<a class="navbar-item" href="./">
<img src="./android-chrome-192x192.png" >
</a>
</div>
<div class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item" href="./">
UUIDConv UI
</a>
</div>
</div>
</div>
</nav>

<div class="container margin-top" id="app"></div>
</div>
<div id="app"></div>

<footer class="footer margin-top">
<div class="content has-text-centered">
Expand Down
125 changes: 0 additions & 125 deletions public/index.js
View file

This file was deleted.

1 change: 0 additions & 1 deletion public/index.js.map
View file

This file was deleted.

26 changes: 8 additions & 18 deletions rollup.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,38 +5,28 @@ import alias from '@rollup/plugin-alias';
import commonjs from '@rollup/plugin-commonjs';
import json from "@rollup/plugin-json";
import resolve from '@rollup/plugin-node-resolve';
import copy from 'rollup-plugin-copy';
import { createTransform } from 'rollup-copy-transform-css';
import terser from '@rollup/plugin-terser';
import css from "rollup-plugin-import-css";

export default {
input: 'src/index.jsx',
output: {
dir: 'public/',
format: 'iife', // 'cjs' if building Node app, 'umd' for both
format: 'esm',
sourcemap: true,
plugins: [terser()],
},
plugins: [
copy({
targets: [{
src: [
'./src/app.css',
'./node_modules/bulma/css/bulma.css',
'./node_modules/@creativebulma/bulma-tooltip/dist/bulma-tooltip.css',
],
dest: 'public',
transform: createTransform({
inline: true,
minify: true,
map: {inline: false, dir: 'public'},
}),
}]
css({
output: 'app.css',
minify: true,
}),
resolve({
browser: true
}),
commonjs({
include: /node_modules/,
requireReturnsDefault: 'auto', // <---- this solves default issue
requireReturnsDefault: 'auto',
}),
json(),
nodeResolve({
Expand Down
155 changes: 152 additions & 3 deletions src/app.css
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,152 @@
body {display: flex;min-height: 100vh;flex-direction: column;}
.uuid-ui--wrapper {flex: 1}
.margin-top {margin-top: 1rem}
body {
display: flex;
min-height: 100vh;
flex-direction: column;
}

.uuid-ui--wrapper {
flex: 1;
}

.margin-top {
margin-top: 1rem;
}

.b-radio.radio {
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.b-radio.radio {
outline: none;
display: inline-flex;
align-items: center;
}

.b-radio.radio:not(.button) {
margin-right: 0.5em;
}

.b-radio.radio:not(.button) + .radio:last-child {
margin-right: 0;
}

.b-radio.radio + .radio {
margin-left: 0;
}

.b-radio.radio input[type=radio] {
position: absolute;
left: 0;
opacity: 0;
outline: none;
z-index: -1;
}

.b-radio.radio input[type=radio] + .check {
display: flex;
flex-shrink: 0;
position: relative;
cursor: pointer;
width: 1.25em;
height: 1.25em;
transition: background 150ms ease-out;
border-radius: 50%;
border: 2px solid #7a7a7a;
}

.b-radio.radio input[type=radio] + .check:before {
content: "";
display: flex;
position: absolute;
left: 50%;
margin-left: calc(-1.25em * 0.5);
bottom: 50%;
margin-bottom: calc(-1.25em * 0.5);
width: 1.25em;
height: 1.25em;
transition: transform 150ms ease-out;
border-radius: 50%;
transform: scale(0);
background-color: #00d1b2;
}

.b-radio.radio input[type=radio] + .check.is-link:before {
background: #485fc7;
}

.b-radio.radio input[type=radio] + .check.is-info:before {
background: #3e8ed0;
}

.b-radio.radio input[type=radio]:checked + .check {
border-color: #00d1b2;
}

.b-radio.radio input[type=radio]:checked + .check.is-link {
border-color: #485fc7;
}

.b-radio.radio input[type=radio]:checked + .check.is-info {
border-color: #3e8ed0;
}

.b-radio.radio input[type=radio]:checked + .check:before {
transform: scale(0.5);
}

.b-radio.radio input[type=radio]:focus + .check {
box-shadow: 0 0 0.5em rgba(122, 122, 122, 0.8);
}

.b-radio.radio input[type=radio]:focus:checked + .check {
box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.8);
}

.b-radio.radio input[type=radio]:focus:checked + .check.is-link {
box-shadow: 0 0 0.5em rgba(72, 95, 199, 0.8);
}

.b-radio.radio input[type=radio]:focus:checked + .check.is-info {
box-shadow: 0 0 0.5em rgba(62, 142, 208, 0.8);
}

.b-radio.radio .control-label {
padding-left: calc(0.75em - 1px);
}

.b-radio.radio.button {
display: flex;
}

.b-radio.radio.button.is-selected {
z-index: 1;
}

.b-radio.radio[disabled] {
opacity: 0.5;
}

.b-radio.radio:hover input[type=radio]:not(:disabled) + .check.is-link {
border-color: #485fc7;
}

.b-radio.radio:hover input[type=radio]:not(:disabled) + .check.is-info {
border-color: #3e8ed0;
}

.b-radio.radio.is-small {
border-radius: 2px;
font-size: 0.75rem;
}

.b-radio.radio.is-medium {
font-size: 1.25rem;
}

.b-radio.radio.is-large {
font-size: 1.5rem;
}
60 changes: 53 additions & 7 deletions src/app.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,24 +1,70 @@
import React from 'react'
import InputComponent from "./input.jsx"
import HistoryComponent from "./history.jsx"
import NavComponent from './nav.jsx'
import '@creativebulma/bulma-tooltip/dist/bulma-tooltip.css'
import 'bulma/css/bulma.css'
import './app.css'

export default class AppComponent extends React.Component {
/**
* The state of the AppComponent.
* It contains an array of items, which represents the history of conversions.
* @type {Object}
*/
state = {
/**
* The array of items representing the history of conversions.
* @type {Array}
*/
items: [],
}

/**
* Constructor for the AppComponent.
* It calls the constructor of the parent class.
* @param {Object} props - The properties passed to the component.
*/
constructor(props) {
super(props);
}

render({ }, { items }) {
/**
* Render method for the AppComponent.
*
* This method returns a div containing two columns: the input and history components.
* The input component is contained in a column with class 'is-three-fifths' and id 'input-cp'.
* The history component is contained in a column with class 'is-two-fifths is-narrow' and id 'history-cp'.
*
* @returns {JSX.Element} The rendered AppComponent.
*/
render() {
// Get the items from the component's state
const { items } = this.state;

return (
<div className="columns is-centered">
<div className="column is-three-fifths" id="input-cp">
<InputComponent items={items} setItems={(items) => this.setState({items})} />
</div>
<div className="column is-two-fifths is-narrow" id="history-cp">
<HistoryComponent items={items} />
// Wrapper div for the AppComponent
<div className="uuid-ui--wrapper">
{/* Navigation component */}
<NavComponent />
{/* Container div with a margin-top class */}
<div className="container margin-top">
{/* Columns div with a centered layout */}
<div className="columns is-centered">
{/* Input column */}
<div className="column is-three-fifths" id="input-cp">
{/* Input component with items and setItems props */}
<InputComponent
items={items}
setItems={(items) => this.setState({items})}
/>
</div>
{/* History column */}
<div className="column is-two-fifths is-narrow" id="history-cp">
{/* History component with items prop */}
<HistoryComponent items={items} />
</div>
</div>
</div>
</div>
);
Expand Down
Loading

0 comments on commit bbbe6b3

Please sign in to comment.