variable id inserted, css recreated(sass)

This commit is contained in:
Tealk
2021-03-19 19:38:54 +01:00
parent c63c21212b
commit 1c414ea428
20 changed files with 306 additions and 403 deletions
+1 -376
View File
@@ -1,376 +1 @@
body {
background: #ffffff;
margin: 0;
margin-top: 80px;
height: 100%;
line-height: 24px;
font-family: "Open Sans", sans-serif;
}
img {
height: auto;
max-width: 100%;
}
a {
padding: 0;
margin: 0;
text-decoration: none;
}
a:hover,
a:focus {
text-decoration: none;
color: #f5f4f4;
}
.centered {
text-align: center;
}
.navbar {
background-color: gray;
border-radius: 0px 0px 30px 30px;
}
main.container {
max-width: 1024px;
min-height: calc(100vh - 157px);
padding-right: 15px;
padding-left: 15px;
margin-left: auto;
margin-right: auto;
}
#install .install,
#install form .card:not(:first-child) {
margin-top: 30px;
}
#status-container .input-group:last-child {
margin-bottom: 0px !important;
}
.status {
float: right;
font-size: 1.05em;
}
#status-big {
margin-bottom: 20px;
padding: 15px;
border-radius: 5px;
font-size: 1.3em;
}
.timeline {
position: relative;
padding: 0 0px 10px;
margin-top: 4px;
}
.timeline .line {
position: absolute;
width: 2px;
display: block;
background: #c2c2c2;
top: 0px;
bottom: 0px;
margin-left: 31px;
}
.timeline .servicelist {
position: relative;
margin: 10px 0px 21px 70px;
clear: both;
}
.timeline .card {
position: relative;
margin: 10px 0px 21px 70px;
clear: both;
}
.timeline .card::before {
position: absolute;
display: block;
top: 8px;
left: -24px;
content: "";
width: 0px;
height: 0px;
border: inherit;
border-width: 12px;
border-top-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
}
.timeline .card .card-colore.icon * {
/*This shouldn't be relative in size...*/
font-size: 20px;
vertical-align: middle;
line-height: 40px;
}
.timeline .card .card-colore.icon {
position: absolute;
left: -59px;
display: block;
width: 40px;
height: 40px;
padding: 0px;
border-radius: 50%;
text-align: center;
float: left;
}
.timeline .card-outline {
border-color: transparent;
background: transparent;
box-shadow: none;
}
.timeline .card-outline .panel-body {
padding: 10px 0px;
}
.timeline .line::before {
top: -4px;
}
.timeline .line::before {
content: "";
position: absolute;
left: -4px;
width: 10px;
height: 10px;
display: block;
border-radius: 50%;
background: #c2c2c2;
}
/* Footer */
#footerwrap {
border-radius: 30px 30px 0px 0px;
min-height: 60px;
padding-top: 15px;
padding-bottom: 10px;
background: gray;
}
#timeline h3 {
margin-top: 40px;
padding-left: 70px;
}
#login-form {
padding-top: 20px;
}
#time input {
max-width: 100%;
}
.card.border-primary input#title {
width: 80%;
}
.card:not(.border-primary) input#title {
width: 100%;
}
.card:not(.border-primary) #time,
.card:not(.border-primary) #end_time_wrapper {
display: none;
}
#time::-moz-placeholder,
#title::-moz-placeholder {
opacity: 1;
}
article.card input {
background: transparent;
border: none;
border-bottom: 1px white outset;
}
article.card textarea {
width: 100%;
background: transparent;
border: none;
resize: vertical;
min-height: 100px;
}
#type {
margin-left: 70px;
}
main.container.admin #timeline .service input[type="checkbox"] {
margin-right: 4px;
margin-top: 0;
vertical-align: middle;
}
#status-container.error input {
box-shadow: 0px 0 2px 1px rgba(255, 0, 0, 1);
}
.delete {
margin-left: 5px;
font-size: 1.2em;
color: white;
line-height: 25px;
}
.delete:hover,
.delete:focus {
color: #eee;
}
.new-service {
width: 100%;
min-width: 250px;
}
.service label {
margin-bottom: 0;
}
.install {
padding-bottom: 25px;
}
#footerwrap .dropdown-menu {
background: gray;
}
#footerwrap .dropdown-menu a {
color: white;
width: 100%;
padding: 2px 5px;
display: block;
}
#footerwrap .dropdown-menu a:hover {
background-color: #2f8ad8;
}
#footerwrap .input-group.dropup.mb-3 {
display: block;
}
#footerwrap .input-group.dropup.mb-3 img {
max-height: 20px;
max-width: 25px;
margin-right: 5px;
vertical-align: middle;
}
.col-md-4.text-left,
.col-md-4.text-right {
line-height: 2.5;
}
body .h1,
body .h2,
body .h3,
body h1,
body h2,
body h3 {
margin-top: 18px;
}
#options .input-group-text {
width: 230px;
}
.row.user .input-group {
width: 100%;
margin-bottom: 5px;
}
.row.user .form-name {
width: 50%;
float: left;
}
label.form-name {
line-height: 20px;
}
.panel .panel-footer .label {
display: inline-block;
}
/* The switch - the box around the slider */
#switch {
height: auto;
line-height: 34px;
font-size: 25px;
}
#switch {
margin-bottom: 5px;
}
.switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}
/* Hide default HTML checkbox */
.switch input {
opacity: 0;
width: 0;
height: 0;
}
/* The slider */
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: 0.4s;
transition: 0.4s;
}
input:checked + .slider {
background-color: #2196f3;
}
input:focus + .slider {
box-shadow: 0 0 1px #2196f3;
}
input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
/* Rounded sliders */
.slider.round {
border-radius: 34px;
}
.slider.round:before {
border-radius: 50%;
}
body{background:#fff;margin:0;margin-top:80px;height:100%;line-height:24px;font-family:"Open Sans",sans-serif}body .h1,body .h2,body .h3,body h1,body h2,body h3{margin-top:18px}img{height:auto;max-width:100%}a{padding:0;margin:0;text-decoration:none}a:hover,a:focus{text-decoration:none;color:#f5f4f4}.centered{text-align:center}#switch{height:auto;line-height:34px;font-size:25px;margin-bottom:5px}#switch .switch{position:relative;display:inline-block;width:60px;height:34px}#switch .switch input{opacity:0;width:0;height:0}#switch .switch .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}#switch .switch .slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;transition:.4s}#switch .switch .slider.round{border-radius:34px}#switch .switch .slider.round:before{border-radius:50%}#switch input:checked+.slider{background-color:#2196f3}#switch input:focus+.slider{box-shadow:0 0 1px #2196f3}#switch input:checked+.slider:before{transform:translateX(26px)}header.navbar{background-color:gray;border-radius:0px 0px 30px 30px}main.container{max-width:1024px;min-height:calc(100vh - 157px);padding-right:15px;padding-left:15px;margin-left:auto;margin-right:auto}main.container#install .settings{padding-bottom:25px}main.container#install .settings,main.container#install form .card:not(:first-child){margin-top:30px}main.container#status #status-big,main.container#dashboard #status-big{margin-bottom:20px;padding:15px;border-radius:5px;font-size:1.3em}main.container#status .timeline,main.container#dashboard .timeline{position:relative;padding:0 0px 10px;margin-top:4px}main.container#status .timeline h3,main.container#dashboard .timeline h3{margin-top:40px;padding-left:70px}main.container#status .timeline .line,main.container#dashboard .timeline .line{position:absolute;width:2px;display:block;background:#c2c2c2;top:0px;bottom:0px;margin-left:31px}main.container#status .timeline .line::before,main.container#dashboard .timeline .line::before{top:-4px;left:-4px;content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:#c2c2c2}main.container#status .timeline .servicelist,main.container#dashboard .timeline .servicelist{position:relative;margin:10px 0px 21px 70px;clear:both}main.container#status .timeline .card,main.container#dashboard .timeline .card{margin:10px 0px 21px 70px}main.container#status .timeline .card::before,main.container#dashboard .timeline .card::before{position:absolute;top:8px;left:-24px;content:"";border:inherit;border-width:12px;border-top-color:transparent;border-bottom-color:transparent;border-left-color:transparent}main.container#status .timeline .card .card-colore.icon,main.container#dashboard .timeline .card .card-colore.icon{position:absolute;left:-59px;width:40px;height:40px;border-radius:50%;text-align:center}main.container#status .timeline .card .card-colore.icon i,main.container#dashboard .timeline .card .card-colore.icon i{font-size:20px;line-height:40px}main.container#status{font-size:1.05em}main.container#dashboard #status{width:230px;text-align:right}main.container#dashboard .card-header.bg-primary input{width:80%}main.container#dashboard .card-header:not(.border-primary) input#title{width:100%}main.container#dashboard .card-header:not(.border-primary) #time,main.container#dashboard .card-header:not(.border-primary) #end_time_wrapper{display:none}main.container#dashboard article.card input{background:transparent;border:none;border-bottom:1px #fff outset}main.container#dashboard article.card textarea{width:100%;background:transparent;border:none;resize:vertical;min-height:100px}main.container#dashboard article.card .delete{margin-left:5px;font-size:1.2em;color:#fff;line-height:25px}main.container#dashboard article.card .delete:hover,main.container#dashboard article.card .delete:focus{color:#eee}main.container#dashboard #type{margin-left:70px}main.container#dashboard #status-container.error input{box-shadow:0px 0 2px 1px red}main.container#login .wrapper{padding-top:20px}main.container#settings .input-group-text{width:230px}footer#footerwrap{border-radius:30px 30px 0px 0px;min-height:60px;padding-top:15px;padding-bottom:10px;background:gray}footer#footerwrap .dropdown-menu{background:gray}footer#footerwrap .dropdown-menu a{color:#fff;width:100%;padding:2px 5px;display:block}footer#footerwrap .dropdown-menu a:hover{background-color:#2f8ad8}footer#footerwrap .input-group.dropup.mb-3{display:block}footer#footerwrap .input-group.dropup.mb-3 img{max-height:20px;max-width:25px;margin-right:5px;vertical-align:middle}/*# sourceMappingURL=main.css.map */
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["main.sass"],"names":[],"mappings":"AAAA,KACE,eAAA,CACA,QAAA,CACA,eAAA,CACA,WAAA,CACA,gBAAA,CACA,kCAAA,CAEA,mDACE,eAAA,CAEJ,IACE,WAAA,CACA,cAAA,CAEF,EACE,SAAA,CACA,QAAA,CACA,oBAAA,CAEA,gBACE,oBAAA,CACA,aAAA,CAEJ,UACE,iBAAA,CAEF,QACE,WAAA,CACA,gBAAA,CACA,cAAA,CACA,iBAAA,CAEA,gBACE,iBAAA,CACA,oBAAA,CACA,UAAA,CACA,WAAA,CAEA,sBACE,SAAA,CACA,OAAA,CACA,QAAA,CAEF,wBACE,iBAAA,CACA,cAAA,CACA,KAAA,CACA,MAAA,CACA,OAAA,CACA,QAAA,CACA,qBAAA,CAEA,cAAA,CAEA,+BACE,iBAAA,CACA,UAAA,CACA,WAAA,CACA,UAAA,CACA,QAAA,CACA,UAAA,CACA,qBAAA,CAEA,cAAA,CAEF,8BACE,kBAAA,CAEA,qCACE,iBAAA,CAGN,8BACE,wBAAA,CAEF,4BACE,0BAAA,CAEF,qCACE,0BAAA,CAEN,cACI,qBAAA,CACA,+BAAA,CAEJ,eACE,gBAAA,CACA,8BAAA,CACA,kBAAA,CACA,iBAAA,CACA,gBAAA,CACA,iBAAA,CAIE,iCACE,mBAAA,CAEF,qFAEE,eAAA,CAKF,uEACE,kBAAA,CACA,YAAA,CACA,iBAAA,CACA,eAAA,CAEF,mEACE,iBAAA,CACA,kBAAA,CACA,cAAA,CAEA,yEACE,eAAA,CACA,iBAAA,CAEF,+EACE,iBAAA,CACA,SAAA,CACA,aAAA,CACA,kBAAA,CACA,OAAA,CACA,UAAA,CACA,gBAAA,CAEA,+FACE,QAAA,CACA,SAAA,CACA,UAAA,CACA,iBAAA,CACA,UAAA,CACA,WAAA,CACA,iBAAA,CACA,kBAAA,CAEJ,6FACE,iBAAA,CACA,yBAAA,CACA,UAAA,CAEF,+EACE,yBAAA,CAEA,+FACE,iBAAA,CACA,OAAA,CACA,UAAA,CACA,UAAA,CACA,cAAA,CACA,iBAAA,CACA,4BAAA,CACA,+BAAA,CACA,6BAAA,CAEF,mHACE,iBAAA,CACA,UAAA,CACA,UAAA,CACA,WAAA,CACA,iBAAA,CACA,iBAAA,CAEA,uHACE,cAAA,CACA,gBAAA,CAEV,sBACE,gBAAA,CAYA,iCACE,WAAA,CACA,gBAAA,CAEF,uDACI,SAAA,CAIF,uEACE,UAAA,CAEF,8IAEE,YAAA,CAIF,4CACE,sBAAA,CACA,WAAA,CACA,6BAAA,CAEF,+CACE,UAAA,CACA,sBAAA,CACA,WAAA,CACA,eAAA,CACA,gBAAA,CAEF,8CACE,eAAA,CACA,eAAA,CACA,UAAA,CACA,gBAAA,CAEA,wGACE,UAAA,CAEN,+BACE,gBAAA,CAEF,uDACE,4BAAA,CAIF,8BACE,gBAAA,CAYF,0CACE,WAAA,CAKN,kBACE,+BAAA,CACA,eAAA,CACA,gBAAA,CACA,mBAAA,CACA,eAAA,CAEA,iCACE,eAAA,CAEA,mCACE,UAAA,CACA,UAAA,CACA,eAAA,CACA,aAAA,CAEA,yCACE,wBAAA,CAEN,2CACE,aAAA,CAEA,+CACE,eAAA,CACA,cAAA,CACA,gBAAA,CACA,qBAAA","file":"main.css"}
+277
View File
@@ -0,0 +1,277 @@
body
background: #ffffff
margin: 0
margin-top: 80px
height: 100%
line-height: 24px
font-family: "Open Sans", sans-serif
.h1, .h2, .h3, h1, h2, h3
margin-top: 18px
img
height: auto
max-width: 100%
a
padding: 0
margin: 0
text-decoration: none
&:hover, &:focus
text-decoration: none
color: #f5f4f4
.centered
text-align: center
#switch
height: auto
line-height: 34px
font-size: 25px
margin-bottom: 5px
.switch
position: relative
display: inline-block
width: 60px
height: 34px
input
opacity: 0
width: 0
height: 0
.slider
position: absolute
cursor: pointer
top: 0
left: 0
right: 0
bottom: 0
background-color: #ccc
-webkit-transition: 0.4s
transition: 0.4s
&:before
position: absolute
content: ""
height: 26px
width: 26px
left: 4px
bottom: 4px
background-color: white
-webkit-transition: 0.4s
transition: 0.4s
&.round
border-radius: 34px
&:before
border-radius: 50%
input
&:checked + .slider
background-color: #2196f3
&:focus + .slider
box-shadow: 0 0 1px #2196f3
&:checked + .slider:before
transform: translateX(26px)
header.navbar
background-color: gray
border-radius: 0px 0px 30px 30px
main.container
max-width: 1024px
min-height: calc(100vh - 157px)
padding-right: 15px
padding-left: 15px
margin-left: auto
margin-right: auto
&#install
.settings
padding-bottom: 25px
.settings,
form .card:not(:first-child)
margin-top: 30px
&#status,
&#dashboard
#status-big
margin-bottom: 20px
padding: 15px
border-radius: 5px
font-size: 1.3em
.timeline
position: relative
padding: 0 0px 10px
margin-top: 4px
h3
margin-top: 40px
padding-left: 70px
.line
position: absolute
width: 2px
display: block
background: #c2c2c2
top: 0px
bottom: 0px
margin-left: 31px
&::before
top: -4px
left: -4px
content: ""
position: absolute
width: 10px
height: 10px
border-radius: 50%
background: #c2c2c2
.servicelist
position: relative
margin: 10px 0px 21px 70px
clear: both
.card
margin: 10px 0px 21px 70px
&::before
position: absolute
top: 8px
left: -24px
content: ""
border: inherit
border-width: 12px
border-top-color: transparent
border-bottom-color: transparent
border-left-color: transparent
.card-colore.icon
position: absolute
left: -59px
width: 40px
height: 40px
border-radius: 50%
text-align: center
i
font-size: 20px
line-height: 40px
&#status
font-size: 1.05em
&#notfound
&#privacy
&#subscripe
&#subsmail
&#dashboard
#status
width: 230px
text-align: right
.card-header.bg-primary input
width: 80%
.card-header:not(.border-primary)
input#title
width: 100%
#time,
#end_time_wrapper
display: none
article.card
input
background: transparent
border: none
border-bottom: 1px white outset
textarea
width: 100%
background: transparent
border: none
resize: vertical
min-height: 100px
.delete
margin-left: 5px
font-size: 1.2em
color: white
line-height: 25px
&:hover, &:focus
color: #eee
#type
margin-left: 70px
#status-container.error input
box-shadow: 0px 0 2px 1px rgba(255, 0, 0, 1)
&#login
.wrapper
padding-top: 20px
&#lostpw
&#newuser
&#servicegroup
&#service
&#settings
.input-group-text
width: 230px
#user
footer#footerwrap
border-radius: 30px 30px 0px 0px
min-height: 60px
padding-top: 15px
padding-bottom: 10px
background: gray
.dropdown-menu
background: gray
a
color: white
width: 100%
padding: 2px 5px
display: block
&:hover
background-color: #2f8ad8
.input-group.dropup.mb-3
display: block
img
max-height: 20px
max-width: 25px
margin-right: 5px
vertical-align: middle