first commit
This commit is contained in:
DESKTOP-GBA0BK8\Admin
@@ -0,0 +1,609 @@
|
||||
@import "../start";
|
||||
@import "badge";
|
||||
|
||||
#fs_addons
|
||||
{
|
||||
.fs-cards-list
|
||||
{
|
||||
list-style: none;
|
||||
|
||||
.fs-card
|
||||
{
|
||||
float: left;
|
||||
// height: 185px; // With reviews/ratings
|
||||
height: 152px;
|
||||
width: 310px;
|
||||
padding: 0;
|
||||
margin: 0 0 30px 30px;
|
||||
font-size: 14px;
|
||||
list-style: none;
|
||||
border: 1px solid #ddd;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
|
||||
.fs-overlay
|
||||
{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.fs-inner
|
||||
{
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
|
||||
& > ul
|
||||
{
|
||||
@include transition(all, 0.15s);
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
position: absolute;
|
||||
|
||||
& > li
|
||||
{
|
||||
list-style: none;
|
||||
line-height: 18px;
|
||||
padding: 0 15px;
|
||||
width: 100%;
|
||||
display: block;
|
||||
@include box-sizing(border-box);
|
||||
}
|
||||
}
|
||||
|
||||
.fs-card-banner
|
||||
{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
line-height: 0;
|
||||
display: block;
|
||||
height: 100px;
|
||||
background-repeat: repeat-x;
|
||||
background-size: 100% 100%;
|
||||
@include transition(all, 0.15s);
|
||||
|
||||
.fs-badge.fs-installed-addon-badge {
|
||||
font-size: 1.02em;
|
||||
line-height: 1.3em;
|
||||
}
|
||||
}
|
||||
|
||||
.fs-title
|
||||
{
|
||||
margin: 10px 0 0 0;
|
||||
height: 18px;
|
||||
overflow: hidden;
|
||||
color: #000;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.fs-offer
|
||||
{
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.fs-description
|
||||
{
|
||||
background-color: #f9f9f9;
|
||||
padding: 10px 15px 100px 15px;
|
||||
border-top: 1px solid #eee;
|
||||
margin: 0 0 10px 0;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.fs-tag
|
||||
{
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 0px;
|
||||
background: greenyellow;
|
||||
display: block;
|
||||
padding: 2px 10px;
|
||||
@include box-shadow(1px 1px 1px rgba(0,0,0,0.3));
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.fs-cta
|
||||
{
|
||||
.button, .button-group
|
||||
{
|
||||
position: absolute;
|
||||
top: 112px;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 960px) {
|
||||
&:hover
|
||||
{
|
||||
.fs-overlay
|
||||
{
|
||||
border: 2px solid $fms-link-color;
|
||||
margin-left: -1px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
.fs-inner
|
||||
{
|
||||
ul
|
||||
{
|
||||
top: -100px;
|
||||
}
|
||||
|
||||
.fs-card-banner
|
||||
{
|
||||
// background-position: 50% -100px;
|
||||
}
|
||||
|
||||
.fs-title,
|
||||
.fs-offer
|
||||
{
|
||||
color: $fms-link-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#TB_window
|
||||
{
|
||||
&, iframe
|
||||
{
|
||||
width: 821px !important;
|
||||
}
|
||||
}
|
||||
|
||||
#plugin-information
|
||||
{
|
||||
.fyi {
|
||||
width: 266px !important;
|
||||
}
|
||||
|
||||
#section-holder {
|
||||
margin-right: 299px;
|
||||
}
|
||||
|
||||
#section-description
|
||||
{
|
||||
h2, h3, p, b, i, blockquote, li, ul, ol
|
||||
{
|
||||
clear: none;
|
||||
}
|
||||
|
||||
.fs-selling-points
|
||||
{
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
|
||||
ul
|
||||
{
|
||||
margin: 0;
|
||||
|
||||
li
|
||||
{
|
||||
padding: 0;
|
||||
list-style: none outside none;
|
||||
|
||||
i.dashicons
|
||||
{
|
||||
color: $fs-logo-green-color;
|
||||
font-size: 3em;
|
||||
vertical-align: middle;
|
||||
line-height: 30px;
|
||||
float: left;
|
||||
margin: 0 0 0 -15px;
|
||||
}
|
||||
|
||||
h3
|
||||
{
|
||||
margin: 1em 30px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fs-screenshots
|
||||
{
|
||||
@include clearfix();
|
||||
ul
|
||||
{
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
|
||||
li
|
||||
{
|
||||
width: 225px;
|
||||
height: 225px;
|
||||
float: left;
|
||||
margin-bottom: 20px;
|
||||
@include box-sizing(content-box);
|
||||
|
||||
a
|
||||
{
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px solid;
|
||||
@include box-shadow(1px 1px 1px rgba(0, 0, 0, 0.2));
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
&.odd
|
||||
{
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.plugin-information-pricing
|
||||
{
|
||||
$pricing_color: #FFFEEC;
|
||||
$borders_color: #DDD;
|
||||
margin: -16px;
|
||||
// padding: 20px;
|
||||
border-bottom: 1px solid $borders_color;
|
||||
|
||||
.fs-plan
|
||||
{
|
||||
|
||||
h3
|
||||
{
|
||||
margin-top: 0;
|
||||
padding: 20px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.nav-tab-wrapper
|
||||
{
|
||||
border-bottom: 1px solid $borders_color;
|
||||
|
||||
.nav-tab
|
||||
{
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
padding: 0 10px;
|
||||
font-size: 0.9em;
|
||||
|
||||
label
|
||||
{
|
||||
text-transform: uppercase;
|
||||
color: green;
|
||||
background: greenyellow;
|
||||
position: absolute;
|
||||
left: -1px;
|
||||
right: -1px;
|
||||
bottom: 100%;
|
||||
border: 1px solid darkgreen;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 0.9em;
|
||||
line-height: 1em;
|
||||
}
|
||||
|
||||
&.nav-tab-active
|
||||
{
|
||||
cursor: default;
|
||||
background: $pricing_color;
|
||||
border-bottom-color: $pricing_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.fs-single-cycle
|
||||
{
|
||||
h3
|
||||
{
|
||||
background: $pricing_color;
|
||||
margin: 0;
|
||||
padding-bottom: 0;
|
||||
color: #0073aa;
|
||||
}
|
||||
|
||||
.nav-tab-wrapper,
|
||||
.fs-billing-frequency
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.fs-pricing-body
|
||||
{
|
||||
background: $pricing_color;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.button
|
||||
{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
label
|
||||
{
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
var {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.fs-billing-frequency,
|
||||
.fs-annual-discount
|
||||
{
|
||||
text-align: center;
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
text-transform: uppercase;
|
||||
background: #F3F3F3;
|
||||
padding: 2px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.fs-annual-discount
|
||||
{
|
||||
text-transform: none;
|
||||
color: green;
|
||||
background: greenyellow;
|
||||
}
|
||||
|
||||
ul.fs-trial-terms
|
||||
{
|
||||
font-size: 0.9em;
|
||||
|
||||
i
|
||||
{
|
||||
float: left;
|
||||
margin: 0 0 0 -15px;
|
||||
}
|
||||
|
||||
li
|
||||
{
|
||||
margin: 10px 0 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#section-features
|
||||
{
|
||||
.fs-features
|
||||
{
|
||||
margin: -20px -26px;
|
||||
}
|
||||
|
||||
table
|
||||
{
|
||||
width: 100%;
|
||||
border-spacing: 0;
|
||||
border-collapse: separate;
|
||||
|
||||
thead
|
||||
{
|
||||
th
|
||||
{
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.fs-price
|
||||
{
|
||||
color: $fs-logo-green-color;
|
||||
font-weight: normal;
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
tbody
|
||||
{
|
||||
td
|
||||
{
|
||||
border-top: 1px solid #ccc;
|
||||
padding: 10px 0;
|
||||
text-align: center;
|
||||
width: 100px;
|
||||
color: $fs-logo-green-color;
|
||||
|
||||
&:first-child
|
||||
{
|
||||
text-align: left;
|
||||
width: auto;
|
||||
color: inherit;
|
||||
padding-left: 26px;
|
||||
}
|
||||
}
|
||||
tr.fs-odd
|
||||
{
|
||||
td
|
||||
{
|
||||
background: #fefefe;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dashicons-yes
|
||||
{
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fs-dropdown {
|
||||
#fs_addons .fs-cards-list .fs-card .fs-inner &, #plugin-information & {
|
||||
.button-group {
|
||||
.button {
|
||||
position: relative;
|
||||
width: auto;
|
||||
top: 0;
|
||||
right: 0;
|
||||
|
||||
&:focus {
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
|
||||
.fs-dropdown-arrow {
|
||||
border-top: 6px solid white;
|
||||
border-right: 4px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
top: 12px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
&.active:not(.up) {
|
||||
.button:not(.fs-dropdown-arrow-button) {
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.fs-dropdown-arrow-button {
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.active.up {
|
||||
.button:not(.fs-dropdown-arrow-button) {
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
|
||||
.fs-dropdown-arrow-button {
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.fs-dropdown-list {
|
||||
position: absolute;
|
||||
right: -1px;
|
||||
top: 100%;
|
||||
margin-left: auto;
|
||||
padding: 3px 0;
|
||||
border: 1px solid lighten($darkest-color, 75%);
|
||||
background-color: #fff;
|
||||
z-index: 1;
|
||||
width: 230px;
|
||||
text-align: left;
|
||||
@include box-shadow(0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12));
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
padding: 5px 10px;
|
||||
text-decoration: none;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $wp-selected-color;
|
||||
color: #fff;
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.up) {
|
||||
.fs-dropdown-list {
|
||||
@include border-radius(3px 0 3px 3px);
|
||||
}
|
||||
}
|
||||
|
||||
&.up {
|
||||
.fs-dropdown-list {
|
||||
@include border-radius(3px 3px 0 3px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#plugin-information & {
|
||||
.button-group {
|
||||
width: 100%;
|
||||
|
||||
.button {
|
||||
float: none;
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
text-transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
.fs-dropdown-list {
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
&.up {
|
||||
.fs-dropdown-list {
|
||||
top: auto;
|
||||
bottom: 100%;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#plugin-information.wp-core-ui .fs-pricing-body .fs-dropdown .button-group {
|
||||
text-align: center;
|
||||
|
||||
display: table;
|
||||
|
||||
.button {
|
||||
display: table-cell;
|
||||
|
||||
&:not(.fs-dropdown-arrow-button) {
|
||||
left: 1px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#plugin-information-footer {
|
||||
> .button, .fs-dropdown {
|
||||
position: relative;
|
||||
top: 3px;
|
||||
|
||||
&.left {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
> .right, .fs-dropdown {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 961px) {
|
||||
#fs_addons
|
||||
{
|
||||
.fs-cards-list
|
||||
{
|
||||
.fs-card
|
||||
{
|
||||
height: 265px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user