minor update

This commit is contained in:
steevLP 2021-01-28 02:19:03 +01:00
parent 093b6c8e8c
commit e0ec96562d
5 changed files with 56 additions and 43 deletions

View File

@ -5,7 +5,7 @@ body {
margin: 0;
padding: 0;
background: #f8f8f8;
font-family: sans-serif; }
font-family: sans-serifs; }
main {
z-index: 980;
@ -93,11 +93,13 @@ h12 {
.notification-primary {
width: 100%;
display: flex; }
display: flex;
padding: 5px;
border: 2px solid #3498db;
border-radius: 2px; }
.notification-primary h2 {
border-right: 0.3rem solid #3498db;
border-radius: 2px;
padding: 5px;
margin-right: 5px;
min-width: 70px;
@ -106,11 +108,13 @@ h12 {
.notification-danger {
width: 100%;
display: flex; }
display: flex;
padding: 5px;
border: 2px solid #e74c3c;
border-radius: 2px; }
.notification-danger h2 {
border-right: 0.3rem solid #e74c3c;
border-radius: 2px;
padding: 5px;
margin-right: 5px;
min-width: 70px;
@ -119,11 +123,13 @@ h12 {
.notification-warning {
width: 100%;
display: flex; }
display: flex;
padding: 5px;
border: 2px solid #f1c40f;
border-radius: 2px; }
.notification-warning h2 {
border-right: 0.3rem solid #f1c40f;
border-radius: 2px;
padding: 5px;
margin-right: 5px;
min-width: 70px;
@ -132,11 +138,13 @@ h12 {
.notification-success {
width: 100%;
display: flex; }
display: flex;
padding: 5px;
border: 2px solid #2ecc71;
border-radius: 2px; }
.notification-success h2 {
border-right: 0.3rem solid #2ecc71;
border-radius: 2px;
padding: 5px;
margin-right: 5px;
min-width: 70px;

View File

@ -68,7 +68,7 @@ require = (function (modules, cache, entry) {
// Override the current require with this new one
return newRequire;
})({6:[function(require,module,exports) {
})({4:[function(require,module,exports) {
var bundleURL = null;
function getBundleURLCached() {
if (!bundleURL) {
@ -99,7 +99,7 @@ function getBaseURL(url) {
exports.getBundleURL = getBundleURLCached;
exports.getBaseURL = getBaseURL;
},{}],5:[function(require,module,exports) {
},{}],3:[function(require,module,exports) {
var bundle = require('./bundle-url');
function updateLink(link) {
@ -131,7 +131,7 @@ function reloadCSS() {
module.exports = reloadCSS;
},{"./bundle-url":6}],0:[function(require,module,exports) {
},{"./bundle-url":4}],0:[function(require,module,exports) {
var global = (1, eval)('this');
var OldModule = module.bundle.Module;
function Module() {
@ -149,7 +149,7 @@ function Module() {
module.bundle.Module = Module;
if (!module.bundle.parent && typeof WebSocket !== 'undefined') {
var ws = new WebSocket('ws://localhost:50893/');
var ws = new WebSocket('ws://localhost:55832/');
ws.onmessage = function(event) {
var data = JSON.parse(event.data);

19
dist/index.html vendored
View File

@ -26,31 +26,32 @@
<main>
<div class="container">
<h1 style="text-align: center;">Alert Elements</h1>
<div class="alert-primary"> test </div>
<div class="alert-danger"> test </div>
<div class="alert-warning"> test </div>
<div class="alert-primary"> test </div><br>
<div class="alert-danger"> test </div><br>
<div class="alert-warning"> test </div><br>
<div class="alert-success"> test </div>
<br>
<h1 style="text-align: center;">Alert Elements</h1>
<h1 style="text-align: center;">Notification Elements</h1>
<div class="notification-primary">
<h2 class="notification-primary-head">ein kleiner test satz</h2>
<h2>ein kleiner test satz</h2>
<span class="notification-body">Funktion test des objektes</span>
</div>
<br>
<div class="notification-danger">
<h2 class="notification-danger-head">ein kleiner test satz</h2>
<h2>ein kleiner test satz</h2>
<span class="notification-body">Funktion test des objektes</span>
</div>
<br>
<div class="notification-warning">
<h2 class="notification-warning-head">ein kleiner test satz</h2>
<h2>ein kleiner test satz</h2>
<span class="notification-body">Funktion test des objektes</span>
</div>
<br>
<div class="notification-success">
<h2 class="notification-success-head">ein kleiner test satz</h2>
<h2>ein kleiner test satz</h2>
<span class="notification-body">Funktion test des objektes</span>
</div>
<br>
<h1 style="text-align: center;">CSS Grid</h1>
<div class="row">
<div class="col-12 display"><h1>12</h1></div>
@ -69,5 +70,7 @@
</div>
</div>
</main>
<br><br><br>
<br><br><br>
</body>
</html>

View File

@ -26,31 +26,32 @@
<main>
<div class="container">
<h1 style="text-align: center;">Alert Elements</h1>
<div class="alert-primary"> test </div>
<div class="alert-danger"> test </div>
<div class="alert-warning"> test </div>
<div class="alert-primary"> test </div><br>
<div class="alert-danger"> test </div><br>
<div class="alert-warning"> test </div><br>
<div class="alert-success"> test </div>
<br>
<h1 style="text-align: center;">Alert Elements</h1>
<h1 style="text-align: center;">Notification Elements</h1>
<div class="notification-primary">
<h2 class="notification-primary-head">ein kleiner test satz</h2>
<h2>ein kleiner test satz</h2>
<span class="notification-body">Funktion test des objektes</span>
</div>
<br>
<div class="notification-danger">
<h2 class="notification-danger-head">ein kleiner test satz</h2>
<h2>ein kleiner test satz</h2>
<span class="notification-body">Funktion test des objektes</span>
</div>
<br>
<div class="notification-warning">
<h2 class="notification-warning-head">ein kleiner test satz</h2>
<h2>ein kleiner test satz</h2>
<span class="notification-body">Funktion test des objektes</span>
</div>
<br>
<div class="notification-success">
<h2 class="notification-success-head">ein kleiner test satz</h2>
<h2>ein kleiner test satz</h2>
<span class="notification-body">Funktion test des objektes</span>
</div>
<br>
<h1 style="text-align: center;">CSS Grid</h1>
<div class="row">
<div class="col-12 display"><h1>12</h1></div>
@ -69,5 +70,7 @@
</div>
</div>
</main>
<br><br><br>
<br><br><br>
</body>
</html>

View File

@ -18,32 +18,26 @@ body
margin: 0
padding: 0
background: $primBG
font-family: sans-serif
// Nav Overlapping fix
font-family: sans-serifs
main
z-index: 980
position: relative
top: 5.5em
width: 100%
word-break: break-all
// header classes margin fix
@for $i from 1 through 12
h#{$i}
margin: 0
// Dev Classes
.dev
border: 1px solid black
.display
background-color: lightcoral
border: 1px solid red
text-align: center
// Container
.container
width: calc( 100% - 10em )
max-width: 90em
margin: 0 auto
// Alert
.alert-primary
border-radius: 2px
background-color: $primary
@ -71,9 +65,11 @@ main
.notification-primary
width: 100%;
display: flex
padding: 5px
border: 2px solid $primary
border-radius: 2px
.notification-primary h2
border-right: 0.3rem solid $primary
border-radius: 2px
padding: 5px
margin-right: 5px;
min-width: 70px
@ -82,9 +78,11 @@ main
.notification-danger
width: 100%;
display: flex
padding: 5px
border: 2px solid $danger
border-radius: 2px
.notification-danger h2
border-right: 0.3rem solid $danger
border-radius: 2px
padding: 5px
margin-right: 5px;
min-width: 70px
@ -93,9 +91,11 @@ main
.notification-warning
width: 100%;
display: flex
padding: 5px
border: 2px solid $warning
border-radius: 2px
.notification-warning h2
border-right: 0.3rem solid $warning
border-radius: 2px
padding: 5px
margin-right: 5px;
min-width: 70px
@ -104,9 +104,11 @@ main
.notification-success
width: 100%;
display: flex
padding: 5px
border: 2px solid $success
border-radius: 2px
.notification-success h2
border-right: 0.3rem solid $success
border-radius: 2px
padding: 5px
margin-right: 5px;
min-width: 70px
@ -116,7 +118,6 @@ main
line-height: 30pt
font-size: 15pt
word-wrap: break-word
// Grid
div[class^="col-"]
padding: 1rem 0
.row
@ -127,7 +128,6 @@ div[class^="col-"]
flex: 0 0 100% / $columns * $i
.col-offset-#{$i}
margin-left: 100% / $columns * $i
// Navigation
header
background: $navBG
text-align: center
@ -214,7 +214,6 @@ nav a:hover
margin-left: $navgap
margin-bottom: 0
list-style: none
// Left sided Navbar for more custumisation
.nav-logo-left
grid-column: 2 / span 1
.nav-left