Skip to content

Commit

Permalink
Merge pull request #62 from hypermodules/css-refactor
Browse files Browse the repository at this point in the history
Css refactor
  • Loading branch information
bcomnes authored Dec 12, 2016
2 parents 75c739a + c27306f commit 7777970
Show file tree
Hide file tree
Showing 25 changed files with 657 additions and 221 deletions.
5 changes: 3 additions & 2 deletions main/player.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,9 @@ function init () {
height: 400,
minWidth: 500,
minHeight: 200,
titleBarStyle: 'hidden',
useContentSize: true
titleBarStyle: 'hidden-inset',
useContentSize: true,
thickFrame: true
})

win.loadURL(PLAYER_WINDOW)
Expand Down
49 changes: 16 additions & 33 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,26 +3,6 @@
"description": "Indescribable music player",
"version": "0.0.0",
"author": "Hyper Modules (https://github.com/hypermodules)",
"browserify": {
"transform": [
[
"sheetify/transform",
{
"use": [
[
"sheetify-postcss",
{
"plugins": [
"postcss-copy-assets"
],
"to": "./renderer/dist/bundle.css"
}
]
]
}
]
]
},
"bugs": {
"url": "https://github.com/hypermodules/hyperamp/issues"
},
Expand All @@ -34,24 +14,24 @@
"choo": "^3.2.0",
"choo-location-electron": "^2.0.0",
"choo-log": "^1.4.0",
"csjs": "^1.0.6",
"electron-config": "^0.2.1",
"electron-context-menu": "^0.7.0",
"electron-debug": "^1.0.1",
"folder-walker": "^3.0.0",
"format-duration": "^1.0.0",
"musicmetadata": "^2.0.4",
"photon": "connors/photon.git#v0.1.2-alpha",
"sheetify": "^5.1.0"
"insert-css": "^1.1.0",
"musicmetadata": "^2.0.4"
},
"devDependencies": {
"browserify": "^13.1.0",
"css-extract": "^1.1.2",
"devtron": "^1.3.0",
"electron": "1.4.12",
"npm-run-all": "^3.1.0",
"postcss-copy-assets": "^0.3.0",
"sheetify-postcss": "^1.0.1",
"mkdirp": "^0.5.1",
"npm-run-all": "^3.1.1",
"rimraf": "^2.5.4",
"spritesh": "^1.2.0",
"standard": "^8.0.0",
"svgo": "^0.7.1",
"tape": "^4.6.0",
"watchify": "^3.7.0"
},
Expand All @@ -69,11 +49,14 @@
"url": "git+https://github.com/hypermodules/hyperamp.git"
},
"scripts": {
"build": "browserify renderer/index.js -p [ css-extract -o renderer/dist/bundle.css ] -o /dev/null",
"main": "electron main",
"prepublish": "npm run build",
"start": "run-p watch main",
"start": "electron main",
"test": "standard",
"watch": "watchify renderer/index.js -p [ css-extract -o renderer/dist/bundle.css ] -o /dev/null"
"prepublish": "npm run build",
"build": "run-s clean clean-svg build-sprite clean:tmp",
"build-sprite": "mkdirp renderer/dist && spritesh -i node_modules/.tmp -o renderer/dist/sprite.svg",
"clean-svg": "rimraf tmp && svgo -f renderer/icons -o node_modules/.tmp",
"clean": "run-p clean:*",
"clean:tmp": "rimraf node_modules/.tmp",
"clean:dist": "rimraf renderer/dist"
}
}
49 changes: 49 additions & 0 deletions renderer/css/base.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
/* ----------------------------------*/
/* Base styles */
/* ----------------------------------*/

html {
height: 100%;
width: 100%;
overflow: hidden;
}

body {
height: 100%;
padding: 0;
margin: 0;
font-family: var(--font-family-default);
font-size: var(--font-size-default);
line-height: var(--line-height-default);
color: var(--gray-color);
background-color: transparent;
}

hr {
margin: 15px 0;
overflow: hidden;
background: transparent;
border: 0;
border-bottom: 1px solid var(--border-color);
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
margin-top: 20px;
margin-bottom: 10px;
font-weight: 500;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

h1 { font-size: 36px; }
h2 { font-size: 30px; }
h3 { font-size: 24px; }
h4 { font-size: 18px; }
h5 { font-size: 14px; }
h6 { font-size: 12px; }

a {
text-decoration: none;
}
127 changes: 5 additions & 122 deletions renderer/css/index.css
Original file line number Diff line number Diff line change
@@ -1,124 +1,7 @@
.toolbar-header .title {
-webkit-app-region: drag;
}
/* ----------------------------------*/
/* HYPERAMP GLOBAL CSSS */
/* ----------------------------------*/

.preferences .pane {
padding: 1rem;
}

a {
text-decoration: none;
}

.volume-control {
position: relative;
display: inline-block;
vertical-align: middle;
-webkit-app-region: no-drag;
width: 100px;
margin: 0 4px;
}

.search-input {
width: auto;
padding: 1px 5px;
vertical-align: middle;
border-color: #ccc;
min-height: auto;
}

.form-control:focus {
border-color: #6db3fd;
box-shadow: 0 0 0 1px #6db3fd;
}

.media-list {
table-layout: fixed;
}

.media-list .time {
text-align: right;
}

.player {
display: inline-block;
}

.btn[disabled]:active {
background-color: #fcfcfc;
background: linear-gradient(to bottom, #fcfcfc 0%, #f1f1f1 100%);
}

.btn[disabled] .icon {
color: gainsboro;
}

.loading {
height: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
font-size: 100pt;
}

.loader,
.loader:before,
.loader:after {
background: rgba(0,0,0,.1);
-webkit-animation: load1 1s infinite ease-in-out;
animation: load1 1s infinite ease-in-out;
width: 1em;
height: 4em;
}
.loader:before,
.loader:after {
position: absolute;
top: 0;
content: '';
}
.loader:before {
left: -1.5em;
-webkit-animation-delay: -0.32s;
animation-delay: -0.32s;
}
.loader {
color: rgba(0,0,0,.1);
text-indent: -9999em;
margin: 88px auto;
position: relative;
font-size: 11px;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
-webkit-animation-delay: -0.16s;
animation-delay: -0.16s;
}
.loader:after {
left: 1.5em;
}
@-webkit-keyframes load1 {
0%,
80%,
100% {
box-shadow: 0 0;
height: 4em;
}
40% {
box-shadow: 0 -2em;
height: 5em;
}
}
@keyframes load1 {
0%,
80%,
100% {
box-shadow: 0 0;
height: 4em;
}
40% {
box-shadow: 0 -2em;
height: 5em;
}
}
@import './variables.css';
@import './base.css';

74 changes: 74 additions & 0 deletions renderer/css/variables.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
/* ----------------*/
/* GLOBAL CSS VARS */
/* ----------------*/

:root {
/* Variables
// --------------------------------------------------
// Type
// --------------------------------------------------
// Try to use the system's font on whatever platform the user is on.
*/
--font-family-default:
system,
-apple-system,
".SFNSDisplay-Regular",
"Helvetica Neue",
Helvetica,
"Segoe UI",
sans-serif;

--font-size-default: 13px;
--font-weight: 500;
--font-weight-bold: 700;
--font-weight-light: 300;
--line-height-default: 1.6;

/*
// Colors
// --------------------------------------------------
// Main colors
*/
--primary-color: #3b99fc;
--chrome-color: #fff;

/* Copy */
--gray-color: #333;

/* Borders */
--border-color: #ddd;
--dark-border-color: #c2c0c2;
--darker-bottom-border-color: #a19fa1;
--toolbar-border-color: #939293;

/* Action colors */
--default-color: #fff;
--positive-color: #34c84a;
--negative-color: #fc605b;
--warning-color: #fdbc40;

/* Shades */
--dark-color: #57acf5;

/* Focus and active colors */
--active-color: #116cd6;
--focus-input-color: #6db3fd;

/* Other
// --------------------------------------------------
// Border radius
*/
--default-border-radius: 4px;

/* Padding */
--padding: 10px;
--padding-mini: 3px;
--padding-less: 5px;
--padding-more: 20px;
}
Empty file removed renderer/dist/.keep
Empty file.
9 changes: 9 additions & 0 deletions renderer/icons/controller-fast-backward.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 9 additions & 0 deletions renderer/icons/controller-fast-forward.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 9 additions & 0 deletions renderer/icons/controller-pause.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 8 additions & 0 deletions renderer/icons/controller-play.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 7777970

Please sign in to comment.