Browse Source

clean up styles

main
Inhji Y. 9 months ago
parent
commit
ee15d0d7e6
  1. 33
      assets/css/_nprogress.scss
  2. 71
      assets/css/app.scss
  3. 18
      assets/package-lock.json
  4. 2
      assets/package.json

33
assets/css/_nprogress.scss

@ -0,0 +1,33 @@
$bar-color: rgba(131,58,180,1);
/* Make clicks pass-through */
#nprogress {
pointer-events: none;
}
#nprogress .bar {
background: $bar-color;
position: fixed;
z-index: 1031;
top: 0;
left: 0;
width: 100%;
height: 3px;
}
/* Fancy blur effect */
#nprogress .peg {
display: block;
position: absolute;
right: 0px;
width: 100px;
height: 100%;
box-shadow: 0 0 10px $bar-color, 0 0 5px $bar-color;
opacity: 1.0;
-webkit-transform: rotate(3deg) translate(0px, -4px);
-ms-transform: rotate(3deg) translate(0px, -4px);
transform: rotate(3deg) translate(0px, -4px);
}

71
assets/css/app.scss

@ -1,30 +1,77 @@
/* This file is for your main application css. */
@import "~nprogress/nprogress.css";
@import "~minireset.css/minireset.css";
@import "~trix/dist/trix.css";
@import "./phoenix";
@import "./nprogress";
/* === Base === */
body {
margin: 0;
padding: 0;
background: #ddd;
background: #333;
color: #ddd;
font-family: monospace;
font-size: 1rem;
}
header .container,
main .container {
background: white;
padding: 1rem;
}
/* === Layout === */
.container { padding: 1rem; }
.grid { display: flex; }
.col { flex: 1; }
/* === Navigation === */
nav[role=navigation] {
&:before {
content: '';
position: absolute;
width: 100%;
left: 0;
height: 3px;
background: linear-gradient(90deg,
rgba(131,58,180,1) 0%,
rgba(253,29,65,1) 50%,
rgba(252,176,69,1) 100%);
}
.right {
text-align: right;
ul {
margin: 0;
padding: 0;
}
li {
display: inline-block;
}
li a {
display: block;
padding: 1rem;
text-decoration: none;
transition: all 0.3s;
}
li a:hover {
background: #3a3a3a;
}
}
nav > ul { margin-bottom: 0; }
/* === Styling ===*/
a {
color: #ddd;
}
input[readonly] {
background: #ddd;
color: #777;
}
/* === Media Queries === */
@media (max-width: 400px) {
.flex-grid {
display: block;
}
}

18
assets/package-lock.json

@ -4712,14 +4712,6 @@
}
}
},
"milligram": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/milligram/-/milligram-1.4.1.tgz",
"integrity": "sha512-RCgh/boHhcXWOUfKJWm3RJRoUeaEguoipDg0mJ31G0tFfvcpWMUlO1Zlqqr12K4kAXfDlllaidu0x7PaL2PTFg==",
"requires": {
"normalize.css": "~8.0.1"
}
},
"mime-db": {
"version": "1.45.0",
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.45.0.tgz",
@ -4831,6 +4823,11 @@
"minipass": "^3.0.0"
}
},
"minireset.css": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/minireset.css/-/minireset.css-0.0.6.tgz",
"integrity": "sha512-aluj16Tc1KhEYGDa/tedYzIbZ2Ax/JR25MUQzGkqOrcw/P5OPSlwNNrlLpdULu0xFNnxu2SRHx4rKiIMq3iSTQ=="
},
"mississippi": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/mississippi/-/mississippi-3.0.0.tgz",
@ -5117,11 +5114,6 @@
}
}
},
"normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"npmlog": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",

2
assets/package.json

@ -7,7 +7,7 @@
"watch": "webpack --mode development --watch"
},
"dependencies": {
"milligram": "^1.4.1",
"minireset.css": "0.0.6",
"nprogress": "^0.2.0",
"phoenix": "file:../deps/phoenix",
"phoenix_html": "file:../deps/phoenix_html",

Loading…
Cancel
Save