文件操作 - admin.less

文件: /var/www/ltlcompare.com/wp-content/themes/ltl-compare/css/admin.less

编辑文件内容

@white: #fff;
@black: #000;
@red: #fd1c1c;
@redLight: #ff9f9f;

@link: #399af4;
@linkH: #016ed2;
@linkA: #0884f6;

@text: #747474;
@title: #1B1B20;

@bg: #f4f4f4;
@border: #dedede;
@borderA: #c1c1c1;
@placeholder: #818181;
@placeholderA: #626262;

@ff: 'Inter', sans-serif;

@xl: ~'(max-width: 1439px)';
@lg: ~'(max-width: 1199px)';
@md: ~'(max-width: 1023px)';
@sm: ~'(max-width: 767px)';
@xs: ~'(max-width: 479px)';

@xl_: ~'(min-width: 1440px)';
@lg_: ~'(min-width: 1200px)';
@md_: ~'(min-width: 1024px)';
@sm_: ~'(min-width: 768px)';
@xs_: ~'(min-width: 480px)';

:root {
  --container-padding: 64px;
  --header-height: 104px;
  --input-height: 60px;
  --content-gap: 24px;
  @media @md {
    --header-height: 82px;
    --container-padding: 32px;
  }
  @media @sm {
    --container-padding: 16px;
  }
}

@font-face {
  font-family: "Inter";
  font-display: swap;
  src: url("../fonts/Inter-VariableFont_opsz,wght.woff2")
    format("woff2-variations");
  font-weight: 100 900;
}

.hidden-desktop{
	@media @lg{
		display:none!important;
	}
}

.hidden-tablet{
	@media @md{
		display:none!important;
	}
}

.hidden-mobile{
	@media @sm{
		display:none!important;
	}
}

.visible-mobile{
	@media @sm_{
		display:none!important;
	}
}

.visible-tablet{
	@media @md_{
		display:none!important;
	}
}
.visible-desktop{
	@media @lg_{
		display:none!important;
	}
}

.wp-block {
    max-width: 1080px;
}

.wp-block[data-align="wide"] {
    max-width: 1080px;
}

.wp-block[data-align="full"] {
    max-width: none;
}

.cf-complex__group-head{
	padding-right:110px;
}

.cf-complex__group-title{
	white-space:nowrap;
	overflow:hidden;
}

.cf-media-gallery__item-preview .cf-media-gallery__item-thumb{
	max-width:100%;
	object-position:center center;
	object-fit:contain;
}

.wp-block-group__inner-container:after{
	display:table;
	line-height:0;
	content:'';
	clear:both;
}

.interface-interface-skeleton__content{
	padding-bottom:25px;
}

.cf-media-gallery__list{
	list-style:none!important;
	margin:0!important;
}

.wp-block-post-content [data-type*="carbon-fields/"]:before{
	content:attr(data-title);
	font-weight:600;
	margin-bottom:16px;
	display:block;
	font-size:24px;
	color:@link;
}

.wp-block .cf-field__label{
	font-weight:500;
}

.wp-block-post-content [data-type*="carbon-fields/"]{
	padding:20px 15px;
	background-color:@white;
	border:dashed 2px @placeholder;
}

.wp-block-group{
	position:relative;
	padding:20px 10px;
	border:dashed 2px #ccc;
}

.cf-container-user-meta{
	max-width:none!important;
}

.flatpickr-months .flatpickr-month{
	height:36px;
}
.cur-month{
	margin-right:12px;
}

.cf-container__tabs-item button{
	cursor:pointer;
}

.interface-interface-skeleton__sidebar{
	overflow-y:scroll;
}

.cf-field__help{
	margin-top:5px!important;
}

.cf-complex__tabs-item--tabbed-vertical .cf-complex__tabs-title{
	overflow:hidden;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	text-overflow:ellipsis;
	max-width:200px;
}

.cf-complex--tabbed-vertical .cf-complex__tabs-list{
	padding-left:0;
}

.cf-complex__tabs--tabbed-horizontal .cf-complex__tabs-list{
	padding-left:0;
}

#edittag{
	max-width:unset;
}

#edittag .form-table{
	width:100%;
}

.post-type-object .mce-edit-area iframe{
	min-height:540px;
}

.is-root-container.wp-block-post-content{
	padding-bottom:40px;
}

.components-select-control{
	height:auto;
}

.cf-preview img{
	max-width:100%!important;
}

.block-editor-block-list__block{
	.cover-img {
	  position: relative;
	  overflow: hidden;
	  will-change: transform;
	  img,
	  video {
		 position: absolute;
		 left: 0;
		 top: 0;
		 width: 100%;
		 height: 100%;
		 object-fit: cover;
	  }
	}

.fit-img {
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  justify-content: center;
	  picture,
	  img {
		 display: block;
		 max-height: 100%;
	  }
	}

.section-title {
	  margin-bottom: 48px;
		 @media @md{
			margin-bottom:40px;
		 }
	}

.section-desc{
		margin-bottom: 48px;
		font-weight:500;
		letter-spacing:-.02em;
		color:#393939;
		 @media @md{
			margin-bottom:40px;
		 }
	}

.section-head{
		display:flex;
		align-items:center;
		gap:32px;
		justify-content:space-between;
		 margin-bottom: 48px;
		 .section-title,
		 .section-desc{
			margin:0;
			max-width:424px;
		 }
		 @media @md{
			margin-bottom:40px;
		 }
	}

h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	.h1,
	.h2,
	.h3,
	.h4,
	.h5,
	.h6 {
	  font-weight: 600;
	  color: @title;
	}

h1,
	.h1 {
	  letter-spacing: -0.04em;
	  font-size: 80px;
	  line-height: 1.125;
	  @media @md {
		 font-size: 52px;
		 line-height: 1.25;
	  }
	}

h2,
	.h2 {
	  letter-spacing: -0.06em;
	  font-size: 48px;
	  line-height: 1.16;
	  @media @md {
		 font-size: 32px;
		 line-height: 1.25;
	  }
	}

h3,
	.h3 {
	  letter-spacing: -0.05em;
	  font-size: 30px;
	  line-height: 1.2;
	  @media @md {
		 font-size: 24px;
		 line-height: 1.16;
	  }
	}

h4,
	.h4 {
	  letter-spacing: -0.05em;
	  font-size: 28px;
	  line-height: 1.28;
	  @media @md {
		 font-size: 20px;
		 line-height: 1.2;
	  }
	}

h5,
	.h5 {
	  letter-spacing: -0.05em;
	  font-size: 24px;
	  line-height: 1.2;
	  @media @md {
		 font-size: 18px;
	  }
	}

h6,
	.h6 {
	  letter-spacing: -0.05em;
	  font-size: 20px;
	  line-height: 1.2;
	  @media @md {
		 font-size: 16px;
	  }
	}

.form-block {
	  display: flex;
	  flex-direction: column;
	  &.not-valid {
		 .input {
			border-color: @redLight;
		 }
		 .input-error {
			display: block;
		 }
	  }
	  &:has(.input-icon) {
		 .input {
			padding-left: 50px;
		 }
	  }
	}

.form-block-title {
	  font-weight: 500;
	  margin-bottom: 8px;
	  color: #2b2b2b;
	}

.input-block {
	  display: block;
	  position: relative;
	}

.input {
	  display: block;
	  width: 100%;
	  height: var(--input-height, 60px);
	  border: solid 1px @border;
	  background: @white;
	  padding: 0 16px;
	  appearance: none;
	  border-radius: 8px;
	  color: #2d2d2d;
	  text-overflow: ellipsis;
	  font-size: 16px;
	  transition: border-color 0.4s;
	  box-shadow: none;
	  caret-color: #2d2d2d;
	  font-weight: 400;
	  position: relative;
	  &::-webkit-outer-spin-button,
	  &::-webkit-inner-spin-button {
		 appearance: none;
		 margin: 0;
	  }
	  &::-webkit-search-cancel-button {
		 appearance: none;
		 display: none;
	  }
	  &:focus {
		 border-color: @borderA;
		 z-index: 1;
	  }
	  &.filled {
		 border-color: @borderA;
	  }
	  &.disabled,
	  &[disabled] {
		 pointer-events: none;
	  }
	  &:-webkit-autofill {
		 font-size: 16px;
		 font-family: @ff;
		 -webkit-text-fill-color: #2d2d2d;
		 background-color: transparent;
		 transition: background-color 5000000s 0s, border-color 0.4s;
	  }
	  &:-webkit-autofill::first-line {
		 font-family: @ff;
	  }
	}

.input-error {
	  margin-top: 4px;
	  display: none;
	  color: @red;
	}

.input-icon {
	  position: absolute;
	  color: @link;
	  --size: 22px;
	  left: 16px;
	  top: calc(0.5 * var(--input-height) - 11px);
	  z-index: 2;
	  pointer-events: none;
	}

.btn {
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  gap: 8px;
	  height: 60px;
	  background-color: @link;
	  padding: 0 32px;
	  transition: background-color 0.4s, opacity 0.4s;
	  max-width: 100%;
	  border-radius: 6px;
	  border: 0;
	  flex: none;
	  color: @white;
	  text-align: center;
	  font-size: 16px;
	  font-weight: 600;
	  text-decoration:none!important;
	  @media @md {
		 padding: 0 24px;
	  }
	  &:hover {
		 background-color: @linkH;
	  }
	  &:active {
		 background-color: @linkA;
	  }
	  &[disabled],
	  &.disabled {
		 opacity: 0.3;
		 pointer-events: none;
	  }
	}

.btn-small {
	  height: 48px;
	  @media @md {
		 height: 42px;
		 font-size: 15px;
	  }
	}
	
	.steps-title {
	  margin-bottom: 40px;
	}

.steps-list {
	  display: grid;
	  gap: 16px;
	  @media @md_ {
		 grid-template-columns: 1fr 1fr 1fr;
		 gap: 20px;
	  }
	}

.steps-item {
	  min-width: 0;
	  display: flex;
	  flex-direction: column;
	  gap: 16px;
	  padding: 32px;
	  min-height: 312px;
	  border-radius: 12px;
	  border: solid 1px @border;
	  @media @md {
		 padding: 24px;
		 min-height: 252px;
	  }
	}

.steps-item-head {
	  margin-bottom: auto;
	  display: flex;
	  gap: 16px;
	  align-items: flex-start;
	  justify-content: space-between;
	}

.steps-item-number {
	  letter-spacing: -0.03em;
	  color: @link;
	}

.steps-item-icon {
	  width: 48px;
	  aspect-ratio: 1;
	  flex: none;
	  @media @md {
		 width: 40px;
	  }
	}

.steps-item-desc {
	  color: @title;
	  font-weight: 500;
	  letter-spacing: -0.04em;
	  @media @md {
		 font-size: 15px;
	  }
	}
	
	.info-with-image-section{
		padding:56px 0;
		@media @md{
			padding:48px 0;
		}
		.container{
			display:flex;
			align-items:center;
			gap:48px;
			justify-content:space-between;
			@media @md{
				gap:32px;
				flex-direction:column;
				align-items:unset;
			}
		}
		&:nth-child(even){
			background-color:#F2F6FD;
			.container{
				@media @md_{
					flex-direction:row-reverse;
				}
			}
		}
	}

.info-with-image-body{
		flex:auto;
		min-width:0;
		display:flex;
		flex-direction:column;
		gap:28px;
		max-width:588px;
		@media @md{
			max-width:unset;
		}
	}

.info-with-image-title{
		@media @md_{
			font-size:40px;
		}
	}

.info-with-image-content{
		font-weight:500;
		color:@title;
		@media @md_{
			font-size:18px;
		}
	}

.info-with-image-btn{
		margin:8px auto 0 0;
		@media @md{
			margin:0 auto;
		}
		@media @xs{
			width:100%;
		}
	}

.info-with-image-img{
		flex:none;
		max-width:568px;
		display:flex;
		@media @md{
			margin:0 auto;
		}
	}
	
	.info-with-table-main{
		display:grid;
		gap:40px 48px;
		align-items:start;
		@media @md_{
			grid-template-columns:622fr 636fr;
		}
	}

.info-with-table-content{
		--content-gap:32px;
	}

.info-with-table-body{
		padding:8px 32px;
		background-color:#F2F6FD;
		border-radius:8px;
		border:solid 1px fade(#1F81BE,32%);
		overflow:hidden;
		will-change:transform;
		@media @md{
			padding:0;
		}
		
		.table-wrapp{
			@media @md{
				padding:8px 16px;
			}
		}
		table{
			font-size:18px;
			font-weight:500;
			line-height:1.2;
			letter-spacing:-.04em;
			width:100%;
			@media @md{
				font-size:15px;
			}
			thead{
				font-weight:600;
				font-size:24px;
				color:#399AF4;
				@media @md{
					font-size:16px;
				}
				td,
				th{
					border-bottom:solid 1px fade(#1F81BE,32%);
				}
			}
			th{
				display:none;
				color:#399AF4;
				font-size:24px;
				font-weight:600;
				@media @md{
					font-size:16px;
				}
			}
			&:has(th:not(:empty)){
				th{
					display:table-cell;
				}
			}
			td,
			th{
				padding:32px 16px 32px 0;
				vertical-align:top;
				text-align:left;
				@media @md{
					padding-top:16px;
					padding-bottom:16px;
					white-space:nowrap;
				}
				&:last-child{
					padding-right:0;
				}
			}
		}
	}

.table-wrapp{
		@media @md{
			overflow-x:auto;
		}
	}
	
	.accordion{
	display:flex;
	flex-direction:column;
	gap:20px;
}

.accordion-item{
	background-color:@white;
	border-radius:8px;
	overflow:hidden;
	will-change:transform;
	border:solid 1px #D9D9D9;
	transition:border-color .4s,background-color .4s;
	&.active{
		border-color:fade(#356B9D,23%);
		background-color:#F2F6FD;
		.accordion-item-toggle{
			i{
				background-color:#0083D7;
				color:@white;
				svg{
					transform:rotate(-180deg);
				}
			}
		}
	}
}

.accordion-item-toggle{
	display:flex;
	align-items:center;
	padding:26px 20px 26px 32px;
	color:inherit;
	transition:color .4s;
	gap:16px;
	font-size:28px;
	letter-spacing:-.04em;
	@media @md{
		font-size:20px;
		padding:20px;
	}
	span{
		flex:auto;
		min-width:0;
	}
	i{
		flex:none;
		position:relative;
		display:flex;
		width:48px;
		aspect-ratio:1;
		background:#F5F5F7;
		color:#0083D7;
		border-radius:4px;
		display:grid;
		place-items:center;
		transition:color .4s,background-color .4s;
		@media @md{
			width:36px;
		}
	}
	svg{
		transition:transform .4s;
		@media @md{
			--size:18px;
		}
	}
	&:hover{
		color:#0083D7;
	}
}

.accordion-item-body{
	display:none;
}

.accordion-item-content{
	padding:6px 32px 32px;
	font-size:20px;
	font-weight:500;
	letter-spacing:-.04em;
	max-width:824px;
	color:#474747;
	@media @md{
		padding:12px 20px 20px;
		max-width:unset;
		font-size:16px;
	}
}

.swiper-wrapper{
	overflow-x:auto;
	display:flex;
	gap:16px;
}

svg.icon{
	display:none;
}

.swiper-slide{
	flex:none;
}

.items-slider{
	overflow:visible;
	.blog-item{
		width:424px;
		@media @md{
			width:245px;
		}
	}
}

.blog-item{
	display:flex;
	flex-direction:column;
	gap:16px;
	position:relative;
	&:has(.blog-item-img){
		border-radius:8px 8px 0 0;
		.blog-item-read-more{
			&:before{
				border-radius:8px 8px 0 0;
			}
		}
	}
	&:hover{
		.blog-item-img{
			&:before{
				border-color:@link;
			}
		}
		.blog-item-read-more{
			text-decoration-color:fade(@link, 0%);
		}
	}
}

.blog-item-img{
	aspect-ratio:424/254;
	border-radius:8px;
	margin-bottom:8px;
	&:before{
		content:'';
		position:absolute;
		inset:0;
		border-radius:inherit;
		z-index:1;
		border:solid 1px #D9D9D9;
		transition:border-color .4s;
	}
}

.blog-item-desc{
	letter-spacing:-.04em;
	color:@placeholder;
	font-weight:500;
}

.blog-item-read-more{
	align-self:flex-start;
	font-weight:600;
	text-decoration:underline;
	text-underline-offset:2px;
	text-decoration-thickness:1px;
	transition:text-decoration-color .4s;
	&:before{
		content:'';
		position:absolute;
		inset:0;
		z-index:9;
	}
}

.slider-nav{
	display:none;
}

.items-slider{
	.review-item{
		width: 528px;
		@media @md{
			width: 286px;
		}
	}
}

.review-item {
  padding: 40px;
  border-radius: 12px;
  background-color: #f2f6fd;
  display: flex;
  flex-direction: column;
  gap: 40px;
  height: unset;
  @media @md {
    gap: 36px;
    padding: 24px;
  }
}

.review-item-head {
  display: flex;
  gap: 16px;
  justify-content: space-between;
  align-items: flex-start;
  @media @md {
    margin-bottom: 8px;
  }
  & > svg {
    --size: 42px;
    color: #056dae;
    @media @md {
      --size: 26px;
    }
  }
}

.review-item-stars {
  display: flex;
  gap: 2px;
  svg {
    --size: 22px;
    @media @md {
      --size: 18px;
    }
    &.active {
      color: #ffb800;
    }
  }
}

.review-item-text {
  color: #323232;
  font-size: 20px;
  letter-spacing: -0.04em;
  font-weight: 500;
  @media @md {
    font-size: 18px;
  }
}

.review-item-foot {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  @media @md_ {
    padding-top: 8px;
  }
}

.review-item-name {
  font-weight: 600;
  color: #056dae;
  letter-spacing: -0.016em;
  line-height: 1.1;
  @media @md_ {
    font-size: 18px;
  }
}

.review-item-date {
  color: #939393;
  letter-spacing: -0.0625em;
  line-height: 1.2;
  @media @md {
    font-size: 15px;
  }
}

.custom-block-reviews{
	.section-head{
		 .section-desc{
			&:not(:only-child){
				@media @md_{
					max-width:266px;
					text-align:right;
				}
			}
		 }
	}
}

.form-start {
  width: 822px;
  max-width: 100%;
  margin: 0 auto;
  padding: 16px;
  background-color: fade(#d2d2d2, 25%);
  border-radius: 12px;
  gap: 16px;
  display: grid;
  @media @md {
    margin-top: 4px;
  }
  @media @sm_ {
    grid-template-columns: 1fr 1fr max-content;
  }
}

.form-start-submit {
  @media @sm {
    margin-top: 4px;
  }
}

.ready-body {
  padding: 64px 60px;
  border-radius: 15px;
  background: #6482ab url('../img/ready-bg.png') right bottom no-repeat;
  background-size: 768px 480px;
  @media @md {
    padding: 28px 20px;
    background-size: 280px 174px;
  }
  @media (-webkit-min-device-pixel-ratio: 2),
    (min-resolution: 192dpi),
    (min-resolution: 2dppx) {
    background-image: url('../img/ready-bg@2x.png');
  }
}

.ready-content {
  max-width: 528px;
  .form-start {
    background-color: fade(@white, 25%);
    @media @sm_ {
      max-width: 504px;
      grid-template-columns: 1fr 1fr;
      gap: 20px 12px;
      margin: 0;
      padding: 20px;
    }
  }
  .form-start-submit {
    @media @sm_ {
      grid-column: span 2;
    }
  }
}

.ready-title {
  font-size: 54px;
  color: @white;
  margin-bottom: 44px;
  @media @md {
    font-size: 36px;
    margin-bottom: 20px;
  }
}

}

文件操作 - admin.less

文件: /var/www/ltlcompare.com/wp-content/themes/ltl-compare/css/admin.less

编辑文件内容

修改文件时间

删除文件