replace bootstrap

This commit is contained in:
Yuri Kuznetsov
2024-08-02 13:13:52 +03:00
parent 04018bba93
commit 142cbfa4b8
5 changed files with 10 additions and 280 deletions

View File

@@ -49,7 +49,6 @@
@import "modals.less";
@import "tooltip.less";
@import "popovers.less";
@import "carousel.less";
// Utility classes
@import "utilities.less";

View File

@@ -1,270 +0,0 @@
//
// Carousel
// --------------------------------------------------
// Wrapper for the slide container and indicators
.carousel {
position: relative;
}
.carousel-inner {
position: relative;
overflow: hidden;
width: 100%;
> .item {
display: none;
position: relative;
.transition(.6s ease-in-out left);
// Account for jankitude on images
> img,
> a > img {
&:extend(.img-responsive);
line-height: 1;
}
// WebKit CSS3 transforms for supported devices
@media all and (transform-3d), (-webkit-transform-3d) {
.transition-transform(~'0.6s ease-in-out');
.backface-visibility(~'hidden');
.perspective(1000px);
&.next,
&.active.right {
.translate3d(100%, 0, 0);
left: 0;
}
&.prev,
&.active.left {
.translate3d(-100%, 0, 0);
left: 0;
}
&.next.left,
&.prev.right,
&.active {
.translate3d(0, 0, 0);
left: 0;
}
}
}
> .active,
> .next,
> .prev {
display: block;
}
> .active {
left: 0;
}
> .next,
> .prev {
position: absolute;
top: 0;
width: 100%;
}
> .next {
left: 100%;
}
> .prev {
left: -100%;
}
> .next.left,
> .prev.right {
left: 0;
}
> .active.left {
left: -100%;
}
> .active.right {
left: 100%;
}
}
// Left/right controls for nav
// ---------------------------
.carousel-control {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: @carousel-control-width;
.opacity(@carousel-control-opacity);
font-size: @carousel-control-font-size;
color: @carousel-control-color;
text-align: center;
text-shadow: @carousel-text-shadow;
background-color: rgba(0, 0, 0, 0); // Fix IE9 click-thru bug
// We can't have this transition here because WebKit cancels the carousel
// animation if you trip this while in the middle of another animation.
// Set gradients for backgrounds
&.left {
#gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001));
}
&.right {
left: auto;
right: 0;
#gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5));
}
// Hover/focus state
&:hover,
&:focus {
outline: 0;
color: @carousel-control-color;
text-decoration: none;
.opacity(.9);
}
// Toggles
.icon-prev,
.icon-next,
.glyphicon-chevron-left,
.glyphicon-chevron-right {
position: absolute;
top: 50%;
margin-top: -10px;
z-index: 5;
display: inline-block;
}
.icon-prev,
.glyphicon-chevron-left {
left: 50%;
margin-left: -10px;
}
.icon-next,
.glyphicon-chevron-right {
right: 50%;
margin-right: -10px;
}
.icon-prev,
.icon-next {
width: 20px;
height: 20px;
line-height: 1;
font-family: serif;
}
.icon-prev {
&:before {
content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
}
}
.icon-next {
&:before {
content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)
}
}
}
// Optional indicator pips
//
// Add an unordered list with the following class and add a list item for each
// slide your carousel holds.
.carousel-indicators {
position: absolute;
bottom: 10px;
left: 50%;
z-index: 15;
width: 60%;
margin-left: -30%;
padding-left: 0;
list-style: none;
text-align: center;
li {
display: inline-block;
width: 10px;
height: 10px;
margin: 1px;
text-indent: -999px;
border: 1px solid @carousel-indicator-border-color;
border-radius: 10px;
cursor: pointer;
// IE8-9 hack for event handling
//
// Internet Explorer 8-9 does not support clicks on elements without a set
// `background-color`. We cannot use `filter` since that's not viewed as a
// background color by the browser. Thus, a hack is needed.
// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Internet_Explorer
//
// For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we
// set alpha transparency for the best results possible.
background-color: #000 \9; // IE8
background-color: rgba(0,0,0,0); // IE9
}
.active {
margin: 0;
width: 12px;
height: 12px;
background-color: @carousel-indicator-active-bg;
}
}
// Optional captions
// -----------------------------
// Hidden by default for smaller viewports
.carousel-caption {
position: absolute;
left: 15%;
right: 15%;
bottom: 20px;
z-index: 10;
padding-top: 20px;
padding-bottom: 20px;
color: @carousel-caption-color;
text-align: center;
text-shadow: @carousel-text-shadow;
& .btn {
text-shadow: none; // No shadow for button elements in carousel-caption
}
}
// Scale up controls for tablets and up
@media screen and (min-width: @screen-sm-min) {
// Scale up the controls a smidge
.carousel-control {
.glyphicon-chevron-left,
.glyphicon-chevron-right,
.icon-prev,
.icon-next {
width: (@carousel-control-font-size * 1.5);
height: (@carousel-control-font-size * 1.5);
margin-top: (@carousel-control-font-size / -2);
font-size: (@carousel-control-font-size * 1.5);
}
.glyphicon-chevron-left,
.icon-prev {
margin-left: (@carousel-control-font-size / -2);
}
.glyphicon-chevron-right,
.icon-next {
margin-right: (@carousel-control-font-size / -2);
}
}
// Show and left align the captions
.carousel-caption {
left: 20%;
right: 20%;
padding-bottom: 30px;
}
// Move up the indicators
.carousel-indicators {
bottom: 20px;
}
}

View File

@@ -64,7 +64,7 @@
"amdId": "jquery-textcomplete"
},
{
"src": "node_modules/bootstrap/dist/js/bootstrap.js",
"src": "node_modules/bootstrap/dist/js/bootstrap-for-espo.js",
"bundle": true
},
{

15
package-lock.json generated
View File

@@ -16,7 +16,7 @@
"autobahn-espo": "github:yurikuzn/autobahn-espo#0.1.0",
"autonumeric": "^4.6.0",
"backbone": "^1.3.3",
"bootstrap": "^3.4.1",
"bootstrap": "github:yurikuzn/espo-bootstrap#276c0c575c69a3d18109fbfed22ead867677bd4b",
"bootstrap-colorpicker": "^2.5.2",
"bootstrap-datepicker": "^1.9.0",
"bullbone": "github:yurikuzn/bull#1.2.14",
@@ -2577,9 +2577,10 @@
"dev": true
},
"node_modules/bootstrap": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-3.4.1.tgz",
"integrity": "sha512-yN5oZVmRCwe5aKwzRj6736nSmKDX7pLYwsXiCj/EYmo16hODaBiT4En5btW/jhBF/seV+XMx3aYwukYC3A49DA==",
"name": "bootstrap-for-espo",
"version": "0.1.0",
"resolved": "git+ssh://git@github.com/yurikuzn/espo-bootstrap.git#276c0c575c69a3d18109fbfed22ead867677bd4b",
"integrity": "sha512-tIm6wWhRIhxC8foUTO0DbsN3pBwVG+jKFyJNCHbQBfeHMxs7RsLNk1VRl9Layth4cTc0xS6C+HLbumOYpjGFRA==",
"engines": {
"node": ">=6"
}
@@ -9965,9 +9966,9 @@
}
},
"bootstrap": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-3.4.1.tgz",
"integrity": "sha512-yN5oZVmRCwe5aKwzRj6736nSmKDX7pLYwsXiCj/EYmo16hODaBiT4En5btW/jhBF/seV+XMx3aYwukYC3A49DA=="
"version": "git+ssh://git@github.com/yurikuzn/espo-bootstrap.git#276c0c575c69a3d18109fbfed22ead867677bd4b",
"integrity": "sha512-tIm6wWhRIhxC8foUTO0DbsN3pBwVG+jKFyJNCHbQBfeHMxs7RsLNk1VRl9Layth4cTc0xS6C+HLbumOYpjGFRA==",
"from": "bootstrap@github:yurikuzn/espo-bootstrap#276c0c575c69a3d18109fbfed22ead867677bd4b"
},
"bootstrap-colorpicker": {
"version": "2.5.2",

View File

@@ -44,7 +44,7 @@
"autobahn-espo": "github:yurikuzn/autobahn-espo#0.1.0",
"autonumeric": "^4.6.0",
"backbone": "^1.3.3",
"bootstrap": "^3.4.1",
"bootstrap": "github:yurikuzn/espo-bootstrap#276c0c575c69a3d18109fbfed22ead867677bd4b",
"bootstrap-colorpicker": "^2.5.2",
"bootstrap-datepicker": "^1.9.0",
"bullbone": "github:yurikuzn/bull#1.2.14",