Steev/steevcss
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added bundled sass file

Browse Source
This commit is contained in:
Steev 2022-03-20 13:02:13 +01:00
commit 3b9b883216
11 changed files with 126 additions and 9483 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9525
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

3
package.json
View File

@ -13,5 +13,8 @@
"node-sass": "^5.0.0",
"parcel-bundler": "^1.3.1",
"sass": "^1.32.5"
},
"dependencies": {
"core-js": "^3.21.1"
}
}

4
src/index.html
View File

@ -7,9 +7,11 @@
<link rel="stylesheet" href="sass/variables.sass">
<link rel="stylesheet" href="sass/main.sass">
<link rel="stylesheet" href="sass/navbar.sass">
<link rel="stylesheet" href="sass/button.sass">
<link rel="stylesheet" href="sass/messaging.sass">
<link rel="stylesheet" href="sass/selector.sass">
<link rel="stylesheet" href="sass/button.sass">
<link rel="stylesheet" href="sass/forms.sass">
<link rel="stylesheet" href="sass/bundled.sass">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/styles/default.min.css">
</head>
<body>

13
src/sass/bundled.sass Normal file
View File

@ -0,0 +1,13 @@
@import variables
@import main
@import navbar
@import button
@import messaging
@import selector
@import forms

2
src/sass/button.sass
View File

@ -28,7 +28,7 @@
/* Hover classes */
.btn:hover
background-color: rgba(216, 216, 216, 0.847)
background-color: $neutral_dark
.btn-primary:hover
background-color: $primary_dark
.btn-danger:hover

3
src/sass/forms.sass
View File

@ -1,5 +1,6 @@
@import variables
/* flat forms*/
.forms
background-color: $darkbg
background-color: $neutral_dark
border:

6
src/sass/main.sass
View File

@ -4,13 +4,13 @@
box-sizing: border-box
font-family: Verdana, Geneva, Tahoma, sans-serif
hr
background-color: #c0c0c0
border: 2px solid #c0c0c0
background-color: $neutral
border: 2px solid $neutral
border-radius: 5px
body
margin: 0
padding: 0
background: $primBG
background: $neutral
main
z-index: 980
position: relative

2
src/sass/messaging.sass
View File

@ -1,7 +1,7 @@
@import variables
.embed
background-color: #d8d8d8
background-color: $neutral_gray_light
border-radius: 5px
padding: 5px
.alert-primary

23
src/sass/navbar.sass
View File

@ -1,7 +1,7 @@
@import variables
header
background: $primBG
background: $neutral_gray_light
text-align: center
height: 30px
z-index: 999
@ -44,7 +44,7 @@ header
nav
text-align: left
width: 100%
background: $primBG
background: $neutral_gray_light
display: none
transform: scale(1, 0)
transform-origin: top
@ -61,10 +61,10 @@ nav a
text-decoration: none
font-size: 1.2rem
text-transform: uppercase
color: $navdefcolor
color: $neutral
opacity: 0
nav a:hover
color: $navhovcolor
color: $neutral_dark
.nav-toggle:checked ~ nav
display: block
transform: scale(1,1)
@ -101,24 +101,27 @@ nav li
.nav-left ul
display: flex
justify-content: flex-end
/* =========================== */
/* Sidebar code */
/* =========================== */
.sidebar-wrapper
display: flex;
.sidebar-wrapper .sidebar-content
.sidebar-content
width: 100%
.sidebar-wrapper .sidebar-left
.sidebar-left
padding: 0
margin: 0
margin-left: 0
padding-right: 5px
height: 100%
.sidebar-wrapper .sidebar-left .sidebar-menu ul
.sidebar-menu ul
width: fit-content
.sidebar-wrapper .sidebar-left .sidebar-menu .sidebar-title
.sidebar-title
width: max-content
font-size: 20pt
padding-right: 5px
.sidebar-wrapper .sidebar-left .sidebar-menu .sidebar-item li
.sidebar-item li
width: fit-content
color: #2980b9
color: $primary
text-decoration: none
font-size: 12pt

15
src/sass/selector.sass
View File

@ -11,6 +11,7 @@
opacity: 0
width: 0
height: 0
/* The slider */
.slider
position: absolute
@ -19,7 +20,7 @@
left: 0
right: 0
bottom: 0
background-color: #ccc
background-color: $neutral_gray_light
-webkit-transition: .4s
transition: .4s
.slider:before
@ -51,7 +52,7 @@ input:checked + .slider:before
border-radius: 5px
width: 100%
height: 25px
background: #d8d8d8
background: $neutral_gray_light
outline: none
opacity: 0.7
-webkit-transition: .2s
@ -63,19 +64,19 @@ input:checked + .slider:before
appearance: none
width: 25px
height: 25px
background: #5b6568
background: $neutral_gray_dark
cursor: pointer
.range-slider::-moz-range-thumb
width: 25px
height: 25px
background: #5b6568
background: $neutral_gray_dark
cursor: pointer
.range-slider-rounded
-webkit-appearance: none
border-radius: 5px
width: 100%
height: 15px
background: #d8d8d8
background: $neutral_gray_light
outline: none
opacity: 0.7
-webkit-transition: .2s
@ -88,10 +89,10 @@ input:checked + .slider:before
border-radius: 50%
width: 25px
height: 25px
background: #5b6568
background: $neutral_gray_dark
cursor: pointer
.range-slider-rounded::-moz-range-thumb
width: 25px
height: 25px
background: #ecf0f1
background: $neutral_gray_light
cursor: pointer

11
src/sass/variables.sass
View File

@ -1,14 +1,15 @@
$border_width: 1px
/* Sizing Properties */
$border_width: 2px
$border_radius: 5px
$padding: 5px
$columns: 12
$navgap: 1em
/* Colours */
$navhovcolor: #a5a5a5
$navdefcolor: #2e2e2e
$default: rgb(248, 248, 248)
$default_dark: #d1d1d1
$neutral: #a5a5a5
$neutral_dark: #2e2e2e
$neutral_gray_light: rgb(248, 248, 248)
$neutral_gray_dark: rgb(70, 70, 70)
$primary: #3498db
$primary_dark: #2980b9
$danger: #e74c3c