mirror of
https://github.com/Rushilwiz/searchbar.git
synced 2025-04-09 23:00:20 -04:00
initial commit
This commit is contained in:
commit
c11112256d
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,2 @@
|
||||||
|
node_modules
|
||||||
|
out
|
||||||
20
index.html
Normal file
20
index.html
Normal file
|
|
@ -0,0 +1,20 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
|
||||||
|
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'">
|
||||||
|
<link href="./styles.css" rel="stylesheet">
|
||||||
|
<title>Hello World!</title>
|
||||||
|
</head> <body>
|
||||||
|
|
||||||
|
<div class="wrap">
|
||||||
|
<div class="search">
|
||||||
|
<input type="text" class="searchTerm" placeholder="What do you want to do?">
|
||||||
|
<button type="submit" class="searchButton">
|
||||||
|
<i class="fa fa-search"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
42
main.js
Normal file
42
main.js
Normal file
|
|
@ -0,0 +1,42 @@
|
||||||
|
// Modules to control application life and create native browser window
|
||||||
|
const {app, BrowserWindow} = require('electron')
|
||||||
|
const path = require('path')
|
||||||
|
|
||||||
|
function createWindow () {
|
||||||
|
// Create the browser window.
|
||||||
|
const mainWindow = new BrowserWindow({
|
||||||
|
fullscreen: true,
|
||||||
|
webPreferences: {
|
||||||
|
preload: path.join(__dirname, 'preload.js')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// and load the index.html of the app.
|
||||||
|
mainWindow.loadFile('index.html')
|
||||||
|
|
||||||
|
// Open the DevTools.
|
||||||
|
// mainWindow.webContents.openDevTools()
|
||||||
|
}
|
||||||
|
|
||||||
|
// This method will be called when Electron has finished
|
||||||
|
// initialization and is ready to create browser windows.
|
||||||
|
// Some APIs can only be used after this event occurs.
|
||||||
|
app.whenReady().then(() => {
|
||||||
|
createWindow()
|
||||||
|
|
||||||
|
app.on('activate', function () {
|
||||||
|
// On macOS it's common to re-create a window in the app when the
|
||||||
|
// dock icon is clicked and there are no other windows open.
|
||||||
|
if (BrowserWindow.getAllWindows().length === 0) createWindow()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
// Quit when all windows are closed, except on macOS. There, it's common
|
||||||
|
// for applications and their menu bar to stay active until the user quits
|
||||||
|
// explicitly with Cmd + Q.
|
||||||
|
app.on('window-all-closed', function () {
|
||||||
|
if (process.platform !== 'darwin') app.quit()
|
||||||
|
})
|
||||||
|
|
||||||
|
// In this file you can include the rest of your app's specific main process
|
||||||
|
// code. You can also put them in separate files and require them here.
|
||||||
50
package.json
Normal file
50
package.json
Normal file
|
|
@ -0,0 +1,50 @@
|
||||||
|
{
|
||||||
|
"name": "gigantic-polish-contain-n0a5q",
|
||||||
|
"productName": "gigantic-polish-contain-n0a5q",
|
||||||
|
"description": "My Electron application description",
|
||||||
|
"keywords": [],
|
||||||
|
"main": "./main.js",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"author": "rushilwiz",
|
||||||
|
"scripts": {
|
||||||
|
"start": "electron-forge start",
|
||||||
|
"package": "electron-forge package",
|
||||||
|
"make": "electron-forge make",
|
||||||
|
"publish": "electron-forge publish",
|
||||||
|
"lint": "echo \"No linting configured\""
|
||||||
|
},
|
||||||
|
"dependencies": {},
|
||||||
|
"devDependencies": {
|
||||||
|
"@electron-forge/cli": "^6.0.0-beta.64",
|
||||||
|
"@electron-forge/maker-deb": "^6.0.0-beta.64",
|
||||||
|
"@electron-forge/maker-rpm": "^6.0.0-beta.64",
|
||||||
|
"@electron-forge/maker-squirrel": "^6.0.0-beta.64",
|
||||||
|
"@electron-forge/maker-zip": "^6.0.0-beta.64",
|
||||||
|
"electron": "^21.2.3"
|
||||||
|
},
|
||||||
|
"config": {
|
||||||
|
"forge": {
|
||||||
|
"packagerConfig": {},
|
||||||
|
"makers": [
|
||||||
|
{
|
||||||
|
"name": "@electron-forge/maker-squirrel"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "@electron-forge/maker-zip",
|
||||||
|
"platforms": [
|
||||||
|
"darwin"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "@electron-forge/maker-deb",
|
||||||
|
"config": {}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "@electron-forge/maker-rpm",
|
||||||
|
"config": {}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"license": "MIT"
|
||||||
|
}
|
||||||
8
preload.js
Normal file
8
preload.js
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
/**
|
||||||
|
* The preload script runs before. It has access to web APIs
|
||||||
|
* as well as Electron's renderer process modules and some
|
||||||
|
* polyfilled Node.js functions.
|
||||||
|
*
|
||||||
|
* https://www.electronjs.org/docs/latest/tutorial/sandbox
|
||||||
|
*/
|
||||||
|
console.log("stay calm.")
|
||||||
7
renderer.js
Normal file
7
renderer.js
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
/**
|
||||||
|
* This file is loaded via the <script> tag in the index.html file and will
|
||||||
|
* be executed in the renderer process for that window. No Node.js APIs are
|
||||||
|
* available in this process because `nodeIntegration` is turned off and
|
||||||
|
* `contextIsolation` is turned on. Use the contextBridge API in `preload.js`
|
||||||
|
* to expose Node.js functionality from the main process.
|
||||||
|
*/
|
||||||
51
styles.css
Normal file
51
styles.css
Normal file
|
|
@ -0,0 +1,51 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: BerkeleyMono;
|
||||||
|
src: url("fonts/BerkeleyMono-Regular.ttf")
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
|
background: #fff;
|
||||||
|
font-family: 'BerkeleyMono', monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchTerm {
|
||||||
|
width: 100%;
|
||||||
|
border: 3px solid #000;
|
||||||
|
border-right: none;
|
||||||
|
padding: 10px;
|
||||||
|
height: 20px;
|
||||||
|
border-radius: 5px 0 0 5px;
|
||||||
|
outline: none;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchTerm:focus{
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchButton {
|
||||||
|
width: 45px;
|
||||||
|
height: 45px;
|
||||||
|
border: 3px solid #000;
|
||||||
|
background: #000;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 0 5px 5px 0;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*Resize the wrap to see the search bar change!*/
|
||||||
|
.wrap{
|
||||||
|
width: 30%;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user