SEO SIMPLE PACK - Version 2.2.3

Version Description

Adjusted the design of the setting page a little

Download this release

Release Info

Developer looswebstudio
Plugin Icon 128x128 SEO SIMPLE PACK
Version 2.2.3
Comparing to
See all releases

Code changes from version 2.2.2 to 2.2.3

Files changed (15) hide show
  1. class/trait/field.php +2 -2
  2. dist/css/post.css +1 -1
  3. dist/css/ssp.css +1 -1
  4. inc/page_help.php +2 -1
  5. inc/page_ogp.php +6 -3
  6. inc/page_top.php +6 -3
  7. readme.txt +4 -1
  8. seo-simple-pack.php +2 -2
  9. src/scss/_mixin.scss +21 -0
  10. src/scss/inc/_field.scss +2 -10
  11. src/scss/inc/_help_btn.scss +0 -22
  12. src/scss/inc/_preview.scss +47 -6
  13. src/scss/inc/_ssp_tabs.scss +11 -0
  14. src/scss/post.scss +1 -0
  15. src/scss/ssp.scss +80 -34
class/trait/field.php CHANGED
@@ -92,8 +92,8 @@ trait Field {
92
  </div>
93
  <?php if ( $args['preview'] ) : ?>
94
  <div class="ssp-field__preview">
95
- <span class="ssp-field__preview__label">
96
- ┗ <?=esc_html__( 'Preview', 'loos-ssp' )?> :
97
  </span>
98
  <div class="ssp-field__preview__content">
99
  <?=wp_kses_post( self::replace_snippets_forpv( $now_value ) )?>
92
  </div>
93
  <?php if ( $args['preview'] ) : ?>
94
  <div class="ssp-field__preview">
95
+ ┗ <span class="ssp-field__preview__label">
96
+ <?=esc_html__( 'Preview', 'loos-ssp' )?> :
97
  </span>
98
  <div class="ssp-field__preview__content">
99
  <?=wp_kses_post( self::replace_snippets_forpv( $now_value ) )?>
dist/css/post.css CHANGED
@@ -1 +1 @@
1
- .ssp-field+.ssp-field{margin-top:40px}.ssp-field[data-disable="1"]~.ssp-field{display:none}.ssp-field[data-active="0"]~.ssp-field{opacity:.5;pointer-events:none}.ssp-field input[type=text],.ssp-field textarea{width:100%;padding:4px 8px}.ssp-field .hide{display:none}.ssp-field code{margin:0;padding:2px 6px;font-size:inherit;font-style:normal;background:#eee}.ssp-field__body{padding:0 8px}.ssp-field__title{display:block;margin-bottom:16px;padding-left:8px;font-weight:700;font-size:14px;border-left:2px solid #87ab87}.ssp-field__desc{color:#666;font-size:13px;font-style:italic}.ssp-field__item.-radio_btn{display:flex;flex-wrap:wrap}.ssp-field__item.-radio_btn .ssp-field__radioInput{display:none}.ssp-field__item.-radio_btn .ssp-field__radioLabel{width:40px;height:40px;margin:4px;padding:0;line-height:34px;text-align:center;vertical-align:middle;background:#fcfcfc;border:1px solid #ccc;box-shadow:inset 0 0 2px #fff}.ssp-field__item.-radio_btn :checked+.ssp-field__radioLabel{border:2px solid #eba170}.ssp_metabox{padding:16px}@media screen and (max-width:767px){.ssp-field__body{padding:0}}
1
+ .ssp-field+.ssp-field{margin-top:40px}.ssp-field[data-disable="1"]~.ssp-field{display:none}.ssp-field[data-active="0"]~.ssp-field{opacity:.5;pointer-events:none}.ssp-field input[type=text],.ssp-field textarea{width:100%;padding:4px 8px}.ssp-field .hide{display:none}.ssp-field code{margin:0;padding:2px 6px;font-size:inherit;font-style:normal;background:#eee}.ssp-field__body{padding-left:8px}.ssp-field__title{display:block;margin-bottom:16px;padding-left:8px;font-weight:700;font-size:14px;border-left:2px solid #87ab87}.ssp-field__desc{color:#666;font-size:13px;font-style:italic}.ssp-field__item.-radio_btn{display:flex;flex-wrap:wrap}.ssp-field__item.-radio_btn .ssp-field__radioInput{display:none}.ssp-field__item.-radio_btn .ssp-field__radioLabel{width:40px;height:40px;margin:4px;padding:0;line-height:34px;text-align:center;vertical-align:middle;background:#fcfcfc;border:1px solid #ccc;box-shadow:inset 0 0 2px #fff}.ssp-field__item.-radio_btn :checked+.ssp-field__radioLabel{border:2px solid #eba170}.ssp_metabox{padding:16px}
dist/css/ssp.css CHANGED
@@ -1 +1 @@
1
- .ssp-field+.ssp-field{margin-top:40px}.ssp-field[data-disable="1"]~.ssp-field{display:none}.ssp-field[data-active="0"]~.ssp-field{opacity:.5;pointer-events:none}.ssp-field input[type=text],.ssp-field textarea{width:100%;padding:4px 8px}.ssp-field .hide{display:none}.ssp-field code{margin:0;padding:2px 6px;font-size:inherit;font-style:normal;background:#eee}.ssp-field__body{padding:0 8px}.ssp-field__title{display:block;margin-bottom:16px;padding-left:8px;font-weight:700;font-size:14px;border-left:2px solid #87ab87}.ssp-field__desc{color:#666;font-size:13px;font-style:italic}.ssp-field__item.-radio_btn{display:flex;flex-wrap:wrap}.ssp-field__item.-radio_btn .ssp-field__radioInput{display:none}.ssp-field__item.-radio_btn .ssp-field__radioLabel{width:40px;height:40px;margin:4px;padding:0;line-height:34px;text-align:center;vertical-align:middle;background:#fcfcfc;border:1px solid #ccc;box-shadow:inset 0 0 2px #fff}.ssp-field__item.-radio_btn :checked+.ssp-field__radioLabel{border:2px solid #eba170}.ssp-helpButton{display:inline-block;width:24px;height:24px;margin-left:16px;padding:0;color:#fff!important;font-weight:700;font-size:12px;line-height:24px;text-align:center;text-decoration:none;vertical-align:middle;background:#556158;border-radius:50%;box-shadow:inset 0 0 4px hsla(0,0%,78.4%,.5);transition:transform .25s}.ssp-helpButton:hover{transform:scale(1.1)}.ssp-helpTable{width:100%;max-width:560px;margin:0 0 24px}.ssp-helpTable thead{background:#e3e4e3}.ssp-helpTable td,.ssp-helpTable th{padding:6px 8px;text-align:left}.ssp-field__preview{display:flex;flex-wrap:wrap;align-items:center;width:100%;padding:4px}.ssp-field__preview__label{margin-right:8px}.ssp-field__preview__content{display:inline-block;margin:0;padding:8px 12px;background:#ececec;border-radius:2px;box-shadow:inset 0 0 4px #ddd}.ssp-field__preview__content span{margin:0 2px;padding:4px 8px;color:#fff;font-size:13px;background:#87ab87;border-radius:4px}.ssp-page .nav-tab-wrapper{border-bottom:1px solid #ddd}.ssp-page .nav-tab{background:rgba(0,0,0,.05);border:none;border-radius:2px 2px 0 0;cursor:pointer}.ssp-page .nav-tab.act_,.ssp-page .nav-tab:hover{color:#000;background:#fdfdfd}.ssp-page .tab-contents{display:none;padding:16px}.ssp-page .tab-contents.act_{display:block}.ssp_switch_box{position:relative;display:inline-block;width:64px;height:28px;margin:0 8px}.ssp_switch_box input{display:none}.ssp_switch_box__slider{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#ccc;cursor:pointer;transition:.4s}.ssp_switch_box__slider:before{position:absolute;right:4px;bottom:4px;width:20px;height:20px;background-color:#fff;transition:.4s;content:""}input:checked+.ssp_switch_box__slider{background-color:#2196f3}input:checked+.ssp_switch_box__slider:before{right:40px}.ssp_switch_box__slider.-round{border-radius:34px}.ssp_switch_box__slider.-round:before{border-radius:50%}.ssp-page{margin:0 20px 20px 0;padding:8px}.ssp-page,.ssp-page *{box-sizing:border-box}.ssp-page .ssp-page__savedMessage{margin:24px 0}h1.ssp-page__title{line-height:1.5}.ssp-page__section+.ssp-page__section{margin-top:48px}.ssp-page__section__title{position:relative;padding:8px 0 8px 16px;line-height:1.5;letter-spacing:.5px}.ssp-page__section__title:before{position:absolute;top:50%;left:0;z-index:-1;display:block;width:40px;height:40px;background-image:linear-gradient(-45deg,transparent 25%,#87ab87 0,#87ab87 50%,transparent 0,transparent 75%,#87ab87 0,#87ab87);background-size:6px 6px;border-radius:50%;transform:translateY(-50%);opacity:.4;content:""}.ssp-page__section__body{padding:24px;background:#fff;border-radius:3px;box-shadow:0 2px 4px rgba(0,0,0,.05),0 4px 4px -4px rgba(0,0,0,.1)}.ssp-page__note{padding-left:4px;font-style:italic}textarea[name=home_desc]{max-width:1000px;height:12em}[name=home_keyword]{max-width:1000px}.-webmaster input{max-width:800px}.-webmaster code b{margin:0 2px;padding:2px 4px;color:#fff;font-weight:400;font-size:.9em;background:#87ab87;border-radius:4px}@media screen and (min-width:768px){.ssp-page .ssp-field__body{display:flex;flex-wrap:wrap;justify-content:space-between}.ssp-page .ssp-field__item{width:40%}.ssp-page .ssp-field__desc{width:57%}.ssp-page .ssp-field__body.-wide .ssp-field__desc,.ssp-page .ssp-field__body.-wide .ssp-field__item{width:100%}.ssp-page .ssp-field__body.-mt-shorten{margin-top:-24px}}@media screen and (max-width:767px){.ssp-field__body{padding:0}}
1
+ .ssp-field+.ssp-field{margin-top:40px}.ssp-field[data-disable="1"]~.ssp-field{display:none}.ssp-field[data-active="0"]~.ssp-field{opacity:.5;pointer-events:none}.ssp-field input[type=text],.ssp-field textarea{width:100%;padding:4px 8px}.ssp-field .hide{display:none}.ssp-field code{margin:0;padding:2px 6px;font-size:inherit;font-style:normal;background:#eee}.ssp-field__body{padding-left:8px}.ssp-field__title{display:block;margin-bottom:16px;padding-left:8px;font-weight:700;font-size:14px;border-left:2px solid #87ab87}.ssp-field__desc{color:#666;font-size:13px;font-style:italic}.ssp-field__item.-radio_btn{display:flex;flex-wrap:wrap}.ssp-field__item.-radio_btn .ssp-field__radioInput{display:none}.ssp-field__item.-radio_btn .ssp-field__radioLabel{width:40px;height:40px;margin:4px;padding:0;line-height:34px;text-align:center;vertical-align:middle;background:#fcfcfc;border:1px solid #ccc;box-shadow:inset 0 0 2px #fff}.ssp-field__item.-radio_btn :checked+.ssp-field__radioLabel{border:2px solid #eba170}.ssp-helpTable{width:100%;max-width:560px;margin:0 0 24px}.ssp-helpTable thead{background:#e3e4e3}.ssp-helpTable td,.ssp-helpTable th{padding:6px 8px;text-align:left}.ssp-field__preview{display:flex;flex-wrap:wrap;align-items:center;width:100%;padding:4px;font-size:13px}.ssp-field__preview__label{margin-left:4px}.ssp-field__preview__content{display:inline-block;margin-left:8px;padding:12px;background:#ececec;border-radius:3px;box-shadow:inset 0 0 4px #ddd}.ssp-field__preview__content span{margin:0 2px;padding:4px 8px;color:#fff;background:#87ab87;border-radius:4px}.ssp-helpButton{display:inline-block;width:22px;height:22px;margin-left:12px;padding:0;color:#fff!important;font-weight:700;font-size:12px;line-height:22px;text-align:center;text-decoration:none;vertical-align:middle;background:#87ab87;border-radius:50%;box-shadow:inset 0 0 4px rgba(50,50,50,.15);transition:transform .25s}.ssp-helpButton:hover{transform:scale(1.1)}.ssp-page .ssp-page__tabs{padding-bottom:6px;overflow-y:auto}.ssp-page .nav-tab-wrapper{display:flex;border-bottom:1px solid #ddd}.ssp-page .nav-tab{background:rgba(0,0,0,.05);border:none;border-radius:2px 2px 0 0;cursor:pointer}.ssp-page .nav-tab.act_,.ssp-page .nav-tab:hover{color:#000;background:#fdfdfd}.ssp-page .tab-contents{display:none;margin-bottom:1em;padding:16px}.ssp-page .tab-contents.act_{display:block}.ssp_switch_box{position:relative;display:inline-block;width:64px;height:28px;margin:0 8px}.ssp_switch_box input{display:none}.ssp_switch_box__slider{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#ccc;cursor:pointer;transition:.4s}.ssp_switch_box__slider:before{position:absolute;right:4px;bottom:4px;width:20px;height:20px;background-color:#fff;transition:.4s;content:""}input:checked+.ssp_switch_box__slider{background-color:#2196f3}input:checked+.ssp_switch_box__slider:before{right:40px}.ssp_switch_box__slider.-round{border-radius:34px}.ssp_switch_box__slider.-round:before{border-radius:50%}#wpcontent{padding:0 20px!important}.ssp-page{margin-top:1em;padding:8px;font-size:14px}.ssp-page,.ssp-page *{box-sizing:border-box}.ssp-page .form-table,.ssp-page .form-table p,.ssp-page .form-table td,.ssp-page .form-table th,.ssp-page input{font-size:inherit!important}.ssp-page .ssp-page__savedMessage{margin:24px 0}h1.ssp-page__title{font-weight:700;line-height:1.5}.ssp-page__section+.ssp-page__section{margin-top:48px}.ssp-page__section__title{position:relative;padding:8px 0 8px 16px;line-height:1.5;letter-spacing:.5px}.ssp-page__section__title:before{position:absolute;top:50%;left:0;z-index:-1;display:block;width:40px;height:40px;background-image:linear-gradient(-45deg,transparent 25%,#87ab87 0,#87ab87 50%,transparent 0,transparent 75%,#87ab87 0,#87ab87);background-size:6px 6px;border-radius:50%;transform:translateY(-50%);opacity:.4;content:""}.ssp-page__section__body{padding:24px;background:#fff;border-radius:4px;box-shadow:0 2px 4px rgba(0,0,0,.05),0 4px 8px -4px rgba(0,0,0,.1)}.ssp-page__note{padding-left:4px;font-style:italic}textarea[name=home_desc]{max-width:1000px;height:12em}[name=home_keyword]{max-width:1000px}.-webmaster input{max-width:800px}.-webmaster code b{margin:0 2px;padding:2px 4px;color:#fff;font-weight:400;font-size:.9em;background:#87ab87;border-radius:4px}.ssp-field__body{display:flex}@media screen and (min-width:783px){.ssp-field__body{flex-wrap:wrap;justify-content:space-between}.ssp-field__body .ssp-field__item{width:40%}.ssp-field__body .ssp-field__desc{width:57%}.ssp-field__body.-wide .ssp-field__desc,.ssp-field__body.-wide .ssp-field__item{width:100%}.ssp-field__body.-mt-shorten{margin-top:-24px}}@media screen and (max-width:782px){.ssp-field__preview{font-size:12px}.ssp-field__preview__label{display:none}.ssp-field__preview__content{padding:8px}.ssp-helpButton{margin-left:12px}.ssp-page .tab-contents{padding:0}#wpcontent{padding:0 16px!important}.ssp-page{margin-right:0!important;padding:0}.ssp-page__section__body{padding:16px}.ssp-field__body{flex-direction:column}.ssp-field__body .ssp-field__item{order:0}.ssp-field__body .ssp-field__desc{order:2}.ssp-field__body .ssp-field__preview{order:1}}
inc/page_help.php CHANGED
@@ -23,10 +23,11 @@ $tags = [
23
  ];
24
 
25
  ?>
26
- <div class="ssp-page">
27
  <h1 class="ssp-page__title">
28
  <?=esc_html__( 'Help page', 'loos-ssp' )?>
29
  </h1>
 
30
  <div class="ssp-page__body">
31
  <div class="ssp-page__section">
32
  <h2 class="ssp-page__section__title">
23
  ];
24
 
25
  ?>
26
+ <div class="ssp-page wrap">
27
  <h1 class="ssp-page__title">
28
  <?=esc_html__( 'Help page', 'loos-ssp' )?>
29
  </h1>
30
+ <hr class="wp-header-end">
31
  <div class="ssp-page__body">
32
  <div class="ssp-page__section">
33
  <h2 class="ssp-page__section__title">
inc/page_ogp.php CHANGED
@@ -20,13 +20,16 @@ if ( 'POST' === $_SERVER['REQUEST_METHOD'] && isset( $_POST['is_setting_form'] )
20
  }
21
 
22
  ?>
23
- <div class="ssp-page">
24
  <h1 class="ssp-page__title">
25
  <?=esc_html__( 'OGP settings', 'loos-ssp' )?>
26
  </h1>
 
27
  <?php if ( $is_updated ) self::output_saved_message(); ?>
28
- <div class="ssp-page__tabs nav-tab-wrapper">
29
- <?php self::output_setting_tab( SSP_Menu::$ogp_menu_tabs ); ?>
 
 
30
  </div>
31
  <div class="ssp-page__body">
32
  <form action="" method="post" id="ssp_form" accept-charset="UTF-8">
20
  }
21
 
22
  ?>
23
+ <div class="ssp-page wrap">
24
  <h1 class="ssp-page__title">
25
  <?=esc_html__( 'OGP settings', 'loos-ssp' )?>
26
  </h1>
27
+ <hr class="wp-header-end">
28
  <?php if ( $is_updated ) self::output_saved_message(); ?>
29
+ <div class="ssp-page__tabs">
30
+ <div class="nav-tab-wrapper">
31
+ <?php self::output_setting_tab( SSP_Menu::$ogp_menu_tabs ); ?>
32
+ </div>
33
  </div>
34
  <div class="ssp-page__body">
35
  <form action="" method="post" id="ssp_form" accept-charset="UTF-8">
inc/page_top.php CHANGED
@@ -20,13 +20,16 @@ if ( 'POST' === $_SERVER['REQUEST_METHOD'] && isset( $_POST['is_setting_form'] )
20
  }
21
 
22
  ?>
23
- <div class="ssp-page">
24
  <h1 class="ssp-page__title">
25
  SEO SIMPLE PACK <?=esc_html__( 'General settings', 'loos-ssp' )?>
26
  </h1>
 
27
  <?php if ( $is_updated ) self::output_saved_message(); ?>
28
- <div class="ssp-page__tabs nav-tab-wrapper">
29
- <?php self::output_setting_tab( SSP_Menu::$top_menu_tabs ); ?>
 
 
30
  </div>
31
  <div class="ssp-page__body">
32
  <form action="" method="post" id="ssp_form" accept-charset="UTF-8">
20
  }
21
 
22
  ?>
23
+ <div class="ssp-page wrap">
24
  <h1 class="ssp-page__title">
25
  SEO SIMPLE PACK <?=esc_html__( 'General settings', 'loos-ssp' )?>
26
  </h1>
27
+ <hr class="wp-header-end">
28
  <?php if ( $is_updated ) self::output_saved_message(); ?>
29
+ <div class="ssp-page__tabs">
30
+ <div class="nav-tab-wrapper">
31
+ <?php self::output_setting_tab( SSP_Menu::$top_menu_tabs ); ?>
32
+ </div>
33
  </div>
34
  <div class="ssp-page__body">
35
  <form action="" method="post" id="ssp_form" accept-charset="UTF-8">
readme.txt CHANGED
@@ -4,7 +4,7 @@ Donate link: https://loos-web-studio.com/
4
  Tags: SEO, meta, analytics, webmaster, simple, japan, meta tag
5
  Requires at least: 4.6
6
  Tested up to: 5.7
7
- Stable tag: 2.2.2
8
  Requires PHP: 5.6
9
  License: GPLv2 or later
10
  License URI: https://www.gnu.org/licenses/gpl-2.0.html
@@ -121,6 +121,9 @@ The following hooks are available.
121
 
122
  == Changelog ==
123
 
 
 
 
124
  = 2.2.2 =
125
  - Support for WordPress 5.7.
126
  - Support for PHP 8.0.
4
  Tags: SEO, meta, analytics, webmaster, simple, japan, meta tag
5
  Requires at least: 4.6
6
  Tested up to: 5.7
7
+ Stable tag: 2.2.3
8
  Requires PHP: 5.6
9
  License: GPLv2 or later
10
  License URI: https://www.gnu.org/licenses/gpl-2.0.html
121
 
122
  == Changelog ==
123
 
124
+ = 2.2.3 =
125
+ Adjusted the design of the setting page a little
126
+
127
  = 2.2.2 =
128
  - Support for WordPress 5.7.
129
  - Support for PHP 8.0.
seo-simple-pack.php CHANGED
@@ -3,7 +3,7 @@
3
  * Plugin Name: SEO SIMPLE PACK
4
  * Plugin URI: https://wemo.tech/1670
5
  * Description: A very simple SEO plugin. You can easily set and customize meta tags and OGP tags for each page.
6
- * Version: 2.2.2
7
  * Author: LOOS,Inc.
8
  * Author URI: https://loos-web-studio.com/
9
  * License: GPL2 or later
@@ -17,7 +17,7 @@ defined( 'ABSPATH' ) || exit;
17
  * 定数宣言
18
  */
19
  if ( ! defined( 'SSP_VERSION' ) ) {
20
- define( 'SSP_VERSION', ( defined( 'WP_DEBUG' ) && WP_DEBUG ) ? date_i18n( 'mdGis' ) : '2.2.2' );
21
  }
22
  if ( ! defined( 'SSP_PATH' ) ) {
23
  define( 'SSP_PATH', plugin_dir_path( __FILE__ ) );
3
  * Plugin Name: SEO SIMPLE PACK
4
  * Plugin URI: https://wemo.tech/1670
5
  * Description: A very simple SEO plugin. You can easily set and customize meta tags and OGP tags for each page.
6
+ * Version: 2.2.3
7
  * Author: LOOS,Inc.
8
  * Author URI: https://loos-web-studio.com/
9
  * License: GPL2 or later
17
  * 定数宣言
18
  */
19
  if ( ! defined( 'SSP_VERSION' ) ) {
20
+ define( 'SSP_VERSION', ( defined( 'WP_DEBUG' ) && WP_DEBUG ) ? date_i18n( 'mdGis' ) : '2.2.3' );
21
  }
22
  if ( ! defined( 'SSP_PATH' ) ) {
23
  define( 'SSP_PATH', plugin_dir_path( __FILE__ ) );
src/scss/_mixin.scss ADDED
@@ -0,0 +1,21 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+
2
+ @mixin pc_admin {
3
+
4
+ @media screen and (min-width: 783px) {
5
+ @content;
6
+ }
7
+ }
8
+
9
+ @mixin sp_admin {
10
+
11
+ @media screen and (max-width: 782px) {
12
+ @content;
13
+ }
14
+ }
15
+
16
+ @mixin mb_admin {
17
+
18
+ @media screen and (max-width: 600px) {
19
+ @content;
20
+ }
21
+ }
src/scss/inc/_field.scss CHANGED
@@ -1,4 +1,4 @@
1
- // 設定フィールド
2
  .ssp-field {
3
 
4
  & + .ssp-field {
@@ -40,7 +40,7 @@
40
  }
41
 
42
  .ssp-field__body {
43
- padding: 0 8px;
44
  }
45
 
46
  .ssp-field__title {
@@ -88,11 +88,3 @@
88
 
89
  }
90
 
91
-
92
- @media screen and (max-width: 767px) {
93
-
94
- .ssp-field__body {
95
- padding: 0;
96
- }
97
- }
98
-
1
+ // 設定フィールド 投稿ページのメタボックスと設定ページで共通する部分。
2
  .ssp-field {
3
 
4
  & + .ssp-field {
40
  }
41
 
42
  .ssp-field__body {
43
+ padding-left: 8px;
44
  }
45
 
46
  .ssp-field__title {
88
 
89
  }
90
 
 
 
 
 
 
 
 
 
src/scss/inc/_help_btn.scss DELETED
@@ -1,22 +0,0 @@
1
- .ssp-helpButton {
2
- display: inline-block;
3
- width: 24px;
4
- height: 24px;
5
- margin-left: 16px;
6
- padding: 0;
7
- color: #fff !important;
8
- font-weight: bold;
9
- font-size: 12px;
10
- line-height: 24px;
11
- text-align: center;
12
- text-decoration: none;
13
- vertical-align: middle;
14
- background: #556158;
15
- border-radius: 50%;
16
- box-shadow: inset 0 0 4px rgba(200, 200, 200, 0.5);
17
- transition: transform 0.25s;
18
-
19
- &:hover {
20
- transform: scale(1.1);
21
- }
22
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
src/scss/inc/_preview.scss CHANGED
@@ -4,27 +4,68 @@
4
  align-items: center;
5
  width: 100%;
6
  padding: 4px;
 
7
 
 
 
 
8
  }
9
 
10
  .ssp-field__preview__label {
11
- margin-right: 8px;
 
 
 
 
 
12
  }
13
 
14
  .ssp-field__preview__content {
15
  display: inline-block;
16
- margin: 0;
17
- padding: 8px 12px;
18
  background: #ececec;
19
- border-radius: 2px;
20
  box-shadow: inset 0 0 4px #ddd;
21
 
 
 
 
 
22
  span {
23
  margin: 0 2px;
24
  padding: 4px 8px;
25
  color: #fff;
26
- font-size: 13px;
27
- background: rgb(135, 171, 135);
28
  border-radius: 4px;
29
  }
30
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
4
  align-items: center;
5
  width: 100%;
6
  padding: 4px;
7
+ font-size: 13px;
8
 
9
+ @include sp_admin {
10
+ font-size: 12px;
11
+ }
12
  }
13
 
14
  .ssp-field__preview__label {
15
+
16
+ margin-left: 4px;
17
+
18
+ @include sp_admin {
19
+ display: none;
20
+ }
21
  }
22
 
23
  .ssp-field__preview__content {
24
  display: inline-block;
25
+ margin-left: 8px;
26
+ padding: 12px;
27
  background: #ececec;
28
+ border-radius: 3px;
29
  box-shadow: inset 0 0 4px #ddd;
30
 
31
+ @include sp_admin {
32
+ padding: 8px;
33
+ }
34
+
35
  span {
36
  margin: 0 2px;
37
  padding: 4px 8px;
38
  color: #fff;
39
+ background: #87ab87;
 
40
  border-radius: 4px;
41
  }
42
  }
43
+
44
+
45
+ // HELPボタン
46
+ .ssp-helpButton {
47
+ display: inline-block;
48
+ width: 22px;
49
+ height: 22px;
50
+ margin-left: 12px;
51
+ padding: 0;
52
+ color: #fff !important;
53
+ font-weight: bold;
54
+ font-size: 12px;
55
+ line-height: 22px;
56
+ text-align: center;
57
+ text-decoration: none;
58
+ vertical-align: middle;
59
+ background: #87ab87;
60
+ border-radius: 50%;
61
+ box-shadow: inset 0 0 4px rgba(50, 50, 50, 0.15);
62
+ transition: transform 0.25s;
63
+
64
+ @include sp_admin {
65
+ margin-left: 12px;
66
+ }
67
+
68
+ &:hover {
69
+ transform: scale(1.1);
70
+ }
71
+ }
src/scss/inc/_ssp_tabs.scss CHANGED
@@ -2,7 +2,13 @@
2
  /* タブコンテンツ */
3
  .ssp-page {
4
 
 
 
 
 
 
5
  .nav-tab-wrapper {
 
6
  border-bottom: 1px solid #ddd;
7
  }
8
 
@@ -21,8 +27,13 @@
21
 
22
  .tab-contents {
23
  display: none;
 
24
  padding: 16px;
25
 
 
 
 
 
26
  &.act_ {
27
  display: block;
28
  }
2
  /* タブコンテンツ */
3
  .ssp-page {
4
 
5
+ .ssp-page__tabs {
6
+ padding-bottom: 6px;
7
+ overflow-y: auto;
8
+ }
9
+
10
  .nav-tab-wrapper {
11
+ display: flex;
12
  border-bottom: 1px solid #ddd;
13
  }
14
 
27
 
28
  .tab-contents {
29
  display: none;
30
+ margin-bottom: 1em;
31
  padding: 16px;
32
 
33
+ @include sp_admin {
34
+ padding: 0;
35
+ }
36
+
37
  &.act_ {
38
  display: block;
39
  }
src/scss/post.scss CHANGED
@@ -5,6 +5,7 @@ $color_main : #87ab87;
5
  /* ------------------------------
6
  * metabox
7
  * ------------------------------ */
 
8
  @import "./inc/field";
9
 
10
  .ssp_metabox {
5
  /* ------------------------------
6
  * metabox
7
  * ------------------------------ */
8
+ @import "./mixin";
9
  @import "./inc/field";
10
 
11
  .ssp_metabox {
src/scss/ssp.scss CHANGED
@@ -2,59 +2,54 @@
2
 
3
  $color_main : #87ab87;
4
 
5
-
6
  @import "./inc/**";
7
 
8
  /* ------------------------------
9
  * 設定ページ
10
  * ------------------------------ */
 
 
 
 
 
 
 
 
 
11
  .ssp-page {
12
  box-sizing: border-box;
13
- margin: 0 20px 20px 0;
 
14
  padding: 8px;
 
15
 
16
  * {
17
  box-sizing: border-box;
18
  }
19
 
20
- /* 設定保存メッセージ */
21
- .ssp-page__savedMessage {
22
- margin: 24px 0 24px;
23
  }
24
 
25
- // field 横並びに
26
- @media screen and (min-width: 768px) {
27
-
28
- .ssp-field__body {
29
- display: flex;
30
- flex-wrap: wrap;
31
- justify-content: space-between;
32
- }
33
-
34
- .ssp-field__item {
35
- width: 40%;
36
- }
37
-
38
- .ssp-field__desc {
39
- width: 57%;
40
- }
41
-
42
- .ssp-field__body.-wide {
43
-
44
- .ssp-field__item,
45
- .ssp-field__desc {
46
- width: 100%;
47
- }
48
- }
49
 
50
- .ssp-field__body.-mt-shorten {
51
- margin-top: -24px;
52
- }
53
  }
54
 
55
  }
56
 
57
  h1.ssp-page__title {
 
58
  line-height: 1.5;
59
  }
60
 
@@ -96,8 +91,12 @@ h1.ssp-page__title {
96
  .ssp-page__section__body {
97
  padding: 24px;
98
  background: #fff;
99
- border-radius: 3px;
100
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05), 0 4px 4px -4px rgba(0, 0, 0, 0.1);
 
 
 
 
101
  }
102
 
103
  .ssp-page__note {
@@ -133,3 +132,50 @@ textarea[name="home_desc"] {
133
  border-radius: 4px;
134
  }
135
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
2
 
3
  $color_main : #87ab87;
4
 
5
+ @import "./mixin";
6
  @import "./inc/**";
7
 
8
  /* ------------------------------
9
  * 設定ページ
10
  * ------------------------------ */
11
+
12
+ #wpcontent {
13
+ padding: 0 20px !important;
14
+
15
+ @include sp_admin {
16
+ padding: 0 16px !important;
17
+ }
18
+ }
19
+
20
  .ssp-page {
21
  box-sizing: border-box;
22
+ // margin: 0 20px 20px 0;
23
+ margin-top: 1em;
24
  padding: 8px;
25
+ font-size: 14px;
26
 
27
  * {
28
  box-sizing: border-box;
29
  }
30
 
31
+ @include sp_admin {
32
+ margin-right: 0 !important;
33
+ padding: 0;
34
  }
35
 
36
+ .form-table,
37
+ .form-table th,
38
+ .form-table td,
39
+ .form-table p,
40
+ input {
41
+ font-size: inherit !important;
42
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
43
 
44
+ /* 設定保存メッセージ */
45
+ .ssp-page__savedMessage {
46
+ margin: 24px 0 24px;
47
  }
48
 
49
  }
50
 
51
  h1.ssp-page__title {
52
+ font-weight: bold;
53
  line-height: 1.5;
54
  }
55
 
91
  .ssp-page__section__body {
92
  padding: 24px;
93
  background: #fff;
94
+ border-radius: 4px;
95
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05), 0 4px 8px -4px rgba(0, 0, 0, 0.1);
96
+
97
+ @include sp_admin {
98
+ padding: 16px;
99
+ }
100
  }
101
 
102
  .ssp-page__note {
132
  border-radius: 4px;
133
  }
134
  }
135
+
136
+
137
+ .ssp-field__body {
138
+ display: flex;
139
+
140
+ @include sp_admin {
141
+ flex-direction: column;
142
+
143
+ .ssp-field__item {
144
+ order: 0;
145
+ }
146
+
147
+ .ssp-field__desc {
148
+ order: 2;
149
+ }
150
+
151
+ .ssp-field__preview {
152
+ order: 1;
153
+ }
154
+
155
+ }
156
+ // field 横並びに
157
+ @include pc_admin {
158
+ flex-wrap: wrap;
159
+ justify-content: space-between;
160
+
161
+ .ssp-field__item {
162
+ width: 40%;
163
+ }
164
+
165
+ .ssp-field__desc {
166
+ width: 57%;
167
+ }
168
+
169
+ &.-wide {
170
+
171
+ .ssp-field__item,
172
+ .ssp-field__desc {
173
+ width: 100%;
174
+ }
175
+ }
176
+
177
+ &.-mt-shorten {
178
+ margin-top: -24px;
179
+ }
180
+ }
181
+ }