Skip to content

Commit

Permalink
Merge pull request #15 from alexsoin/remove-jquery
Browse files Browse the repository at this point in the history
feat: remove-jquery
  • Loading branch information
webinmd authored Sep 13, 2023
2 parents c5df0d1 + ed99622 commit 59e7f89
Show file tree
Hide file tree
Showing 8 changed files with 333 additions and 185 deletions.
259 changes: 223 additions & 36 deletions assets/components/frontendmanager/css/web/frontend.css
Original file line number Diff line number Diff line change
@@ -1,41 +1,228 @@
@import "../fonts/flaticon.css";
body.fm-pos-top{padding-top:40px!important}
.fm-panel{background-image:linear-gradient(to right,#3f4850 0,#365462 46%,#3e5554 60%,#42554d 68%,#573d4e 100%);box-shadow:0 0 10px 0 rgba(0,0,0,0.2);height:40px;font:normal 13px "Helvetica Neue",Helvetica,Arial,Tahoma,sans-serif;-webkit-font-smoothing:antialiased;position:fixed;z-index:1040;line-height:40px;top:0;left:0;right:0}
.fm-panel a{color:#fff!important;border-right:1px solid #2F4150;padding:0 20px;display:inline-block;outline:0!important;text-decoration:none!important;float:left}
.fm-panel a:hover, body.fm-hide .fm-panel a.fm-mode:hover{background:#3B5C69}
.fm-panel a span{display:block;float:left;height:40px;margin:0 10px 0 0;color:#fff}
.fm-panel a span[class^="fm-icon-"]:before{font-size:14px;margin:0}
.fm-panel a.fm-logo { height: 40px;}
.fm-panel a.fm-logo img{ height: 16px;
display: block;
margin: 10px 0 0 0;}
.fm-panel a.fm-mode span{margin:0}
.fm-panel a.fm-mode span img{display:none}
.fm-panel.button{display:inline-block;position:static;padding:0 15px;color:#fff}
.fm-panel.button:hover{background:#3B5C69;text-decoration:none}
body .fm-modal .mfp-iframe-scaler iframe{padding:20px;background:#f2f2f2;border-radius:3px}
body .fm-modal .mfp-close{float:right;width:20px}
body.fm-hide{padding-top:0!important}
body.fm-hide .fm-panel{top:-40px;}
body.fm-hide .fm-panel a.fm-mode{position:absolute;top:50px;left:10px;height:35px;width:35px;background:#3e4951;border:0;padding:0;border-radius:100%}
body.fm-hide .fm-panel a.fm-mode span{height:35px; line-height: 1;width:100%;text-align:center}
body.fm-hide .fm-panel a.fm-mode span:before{display:none}
body.fm-hide .fm-panel a.fm-mode span img{ height: 14px;
display: inline-block;
margin: 10px 0 0 0;}

body.fm-pos-bottom{padding-bottom:40px!important}
body.fm-pos-bottom .fm-panel { bottom: 0; top: auto;}
body.fm-pos-bottom.fm-hide .fm-panel {bottom: -40px;}
body.fm-pos-bottom.fm-hide .fm-panel a.fm-mode { top: -50px;}

body.fm .ct-widget.ct-ignition { top: 56px;}
body.fm-hide .ct-app {display: none !important}

:root {
--fm-color-primary: #2F4150;
--fm-color-secondary: #3B5C69;
--fm-index: 1040;
}

@media only screen and (max-width: 1280px) {
.fm-panel a span[class^="fm-icon-"]{margin: 0;}
.fm-panel a span.fm-link-text {display: none;}
.fm-panel,
.fm-panel *,
.fm-panel *::before,
.fm-panel *::after {
box-sizing: border-box;
}

.fm-modal,
.fm-modal *,
.fm-modal *::before,
.fm-modal *::after {
box-sizing: border-box;
}

.fm-panel {
display: none;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
gap: 1em .5em;
background-color: var(--fm-color-primary);
font: normal 13px "Helvetica Neue", Helvetica, Arial, Tahoma, sans-serif;
-webkit-font-smoothing: antialiased;
position: fixed;
z-index: var(--fm-index);
top: 0;
left: 0;
right: 0;
padding: .5em;
}

.fm-panel--show {
display: flex;
}

.fm-row {
display: flex;
flex-direction: row;
overflow-x: auto;
flex: 1;
gap: .5em;
}

.fm-panel a {
display: inline-flex;
gap: .5em;
align-items: center;
color: #fff !important;
padding: 0 1em;
outline: 0 !important;
text-decoration: none !important;
transition: background-color .3s;
border-radius: 1.6em;
height: 2.5em;
line-height: 1;
}

.fm-panel a>img {
height: 1.5em;
width: 1.5em;
}

.fm-panel a.fm-mode {
display: flex;
justify-content: center;
align-items: center;
width: 2.5em;
background-color: var(--fm-color-primary);
padding: 0;
border-radius: 100%;
margin-right: 1em;
}

.fm-panel a:hover {
background-color: var(--fm-color-secondary);
opacity: 1;
}

.fm-panel a span[class^="fm-icon-"]>img {
display: none;
}

.fm-panel a span[class^="fm-icon-"]:before {
font-size: 1em;
margin: 0
}

.fm-link-text {
margin-top: 2px;
white-space: nowrap;
}

.fm-panel.button {
display: inline-block;
position: static;
padding: 0 1em;
color: #fff
}

.fm-panel.button:hover {
background: var(--fm-color-secondary);
text-decoration: none
}

.mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#0b0b0b;opacity:.8}.mfp-wrap{top:0;left:0;width:100%;height:100%;z-index:1043;position:fixed;outline:none!important;-webkit-backface-visibility:hidden}.mfp-container{text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px;box-sizing:border-box}.mfp-container:before{content:'';display:inline-block;height:100%;vertical-align:middle}.mfp-align-top .mfp-container:before{display:none}.mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:1045}.mfp-inline-holder .mfp-content,.mfp-ajax-holder .mfp-content{width:100%;cursor:auto}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out}.mfp-zoom{cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.mfp-auto-cursor .mfp-content{cursor:auto}.mfp-close,.mfp-arrow,.mfp-preloader,.mfp-counter{-webkit-user-select:none;-moz-user-select:none;user-select:none}.mfp-loading.mfp-figure{display:none}.mfp-hide{display:none!important}.mfp-preloader{color:#CCC;position:absolute;top:50%;width:auto;text-align:center;margin-top:-.8em;left:8px;right:8px;z-index:1044}.mfp-preloader a{color:#CCC}.mfp-preloader a:hover{color:#FFF}.mfp-s-ready .mfp-preloader{display:none}.mfp-s-error .mfp-content{display:none}button.mfp-close,button.mfp-arrow{overflow:visible;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;display:block;outline:none;padding:0;z-index:1046;box-shadow:none;touch-action:manipulation}button::-moz-focus-inner{padding:0;border:0}.mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:.65;padding:0 0 18px 10px;color:#FFF;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace}.mfp-close:hover,.mfp-close:focus{opacity:1}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#333}.mfp-image-holder .mfp-close,.mfp-iframe-holder .mfp-close{color:#FFF;right:-6px;text-align:right;padding-right:6px;width:100%}.mfp-counter{position:absolute;top:0;right:0;color:#CCC;font-size:12px;line-height:18px;white-space:nowrap}.mfp-arrow{position:absolute;opacity:.65;margin:0;top:50%;margin-top:-55px;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:transparent}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:hover,.mfp-arrow:focus{opacity:1}.mfp-arrow:before,.mfp-arrow:after{content:'';display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:medium inset transparent}.mfp-arrow:after{border-top-width:13px;border-bottom-width:13px;top:8px}.mfp-arrow:before{border-top-width:21px;border-bottom-width:21px;opacity:.7}.mfp-arrow-left{left:0}.mfp-arrow-left:after{border-right:17px solid #FFF;margin-left:31px}.mfp-arrow-left:before{margin-left:25px;border-right:27px solid #3F3F3F}.mfp-arrow-right{right:0}.mfp-arrow-right:after{border-left:17px solid #FFF;margin-left:39px}.mfp-arrow-right:before{border-left:27px solid #3F3F3F}.mfp-iframe-holder{padding-top:40px;padding-bottom:40px}.mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px}.mfp-iframe-holder .mfp-close{top:-40px}.mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%}.mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0,0,0,0.6);background:#000}img.mfp-img{width:auto;max-width:100%;height:auto;display:block;line-height:0;box-sizing:border-box;padding:40px 0;margin:0 auto}.mfp-figure{line-height:0}.mfp-figure:after{content:'';position:absolute;left:0;top:40px;bottom:40px;display:block;right:0;width:auto;height:auto;z-index:-1;box-shadow:0 0 8px rgba(0,0,0,0.6);background:#444}.mfp-figure small{color:#BDBDBD;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto}.mfp-title{text-align:left;line-height:18px;color:#F3F3F3;word-wrap:break-word;padding-right:36px}.mfp-image-holder .mfp-content{max-width:100%}.mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer}@media screen and (max-width: 800px) and (orientation: landscape),screen and (max-height: 300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0}.mfp-img-mobile img.mfp-img{padding:0}.mfp-img-mobile .mfp-figure:after{top:0;bottom:0}.mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,0.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;box-sizing:border-box}.mfp-img-mobile .mfp-bottom-bar:empty{padding:0}.mfp-img-mobile .mfp-counter{right:5px;top:3px}.mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,0.6);position:fixed;text-align:center;padding:0}}@media all and (max-width: 900px){.mfp-arrow{-webkit-transform:scale(0.75);transform:scale(0.75)}.mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0}.mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%}.mfp-container{padding-left:6px;padding-right:6px}}
body.fm-pos-bottom .fm-panel {
bottom: 0;
top: auto;
}

body.fm-hide .fm-panel,
body.fm-hide .fm-row {
background-color: transparent;
pointer-events: none;
overflow-x: hidden;
}

body.fm-hide .fm-panel a {
opacity: 0;
pointer-events: none;
}

body.fm-hide .fm-panel a.fm-mode {
opacity: 1;
pointer-events: all;
z-index: var(--fm-index);
}

/* Modal */
.fm-modal {
position: fixed;
z-index: calc(var(--fm-index) + 1);
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
padding: 3.5rem;
}

.fm-modal iframe {
position: relative;
width: 100%;
height: 100%;
border-radius: .4em;
border: 0;
padding: .5rem;
background: #f2f2f2;
}

.fm-modal .fm-iframe-wrapper {
position: relative;
width: 100%;
height: 100%;
max-width: 1600px;
border: 0;
background-color: var(--fm-color-primary);
border-radius: .4em;
}

.fm-modal .fm-iframe-wrapper::before {
content: attr(data-text-load);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: white;
display: flex;
justify-content: center;
align-items: center;
font-size: 2em;
}

.fm-modal .fm-btn-close {
position: absolute;
right: 1.25em;
top: 1.25em;
background-color: var(--fm-color-primary);
color: white;
border: none;
border-radius: 50%;
width: 2.3em;
height: 2.3em;
padding: .125em;
z-index: calc(var(--fm-index) + 2);
transition: background-color .3s;
cursor: pointer;
}

.fm-modal .fm-btn-close::before {
content: '';
display: block;
width: 100%;
height: 100%;
background-image: url('data:image/svg+xml,%3Csvg%20xmlns="http://www.w3.org/2000/svg"%20fill="none"%20viewBox="0%200%2024%2024"%20stroke-width="1.5"%20stroke="white"%3E%3Cpath%20stroke-linecap="round"%20stroke-linejoin="round"%20d="M9.75%209.75l4.5%204.5m0-4.5l-4.5%204.5M21%2012a9%209%200%2011-18%200%209%209%200%200118%200z"%20/%3E%3C/svg%3E');
}

.fm-modal .fm-btn-close:hover {
background-color: var(--fm-color-secondary);
}

/* Modal END */

@media only screen and (max-width: 1280px) {
.fm-panel a span[class^="fm-icon-"] {
margin: 0;
}

.fm-panel a span.fm-link-text {
display: none;
}

.fm-modal {
padding: 4rem .3rem .3rem .3rem;
}
}
Empty file.

This file was deleted.

Loading

0 comments on commit 59e7f89

Please sign in to comment.