diff --git a/layout/style-css/typography-page.css b/layout/style-css/typography-page.css new file mode 100644 index 0000000..9f4bd16 --- /dev/null +++ b/layout/style-css/typography-page.css @@ -0,0 +1 @@ +@import"https://fonts.googleapis.com/css2?family=Alegreya+Sans:ital,wght@0,100;0,300;0,400;0,500;0,700;0,800;0,900;1,100;1,300;1,400;1,500;1,700;1,800;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap";@import"https://fonts.googleapis.com/css2?family=League+Spartan:wght@100..900&display=swap";@import"http://fonts.cdnfonts.com/css/bahnschrift";@font-face{font-family:"URW Form Extra";src:url("/layout/fonts/urw-font-wof/URWForm-ExtraBoldItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ExtraBoldItalic.woff") format("woff");font-weight:bold;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-BoldItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-BoldItalic.woff") format("woff");font-weight:bold;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Bold.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Bold.woff") format("woff");font-weight:bold;font-style:normal;font-display:swap}@font-face{font-family:"URW Form Demi";src:url("/layout/fonts/urw-font-wof/URWForm-Demi.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Demi.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"URW Form Extra";src:url("/layout/fonts/urw-font-wof/URWForm-ExtraBoldItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ExtraBoldItalic.woff") format("woff");font-weight:bold;font-style:italic;font-display:swap}@font-face{font-family:"URW Form Extra";src:url("/layout/fonts/urw-font-wof/URWForm-ExtraBold.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ExtraBold.woff") format("woff");font-weight:bold;font-style:normal;font-display:swap}@font-face{font-family:"URW Form Demi";src:url("/layout/fonts/urw-font-wof/URWForm-Demi.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Demi.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-BoldItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-BoldItalic.woff") format("woff");font-weight:bold;font-style:italic;font-display:swap}@font-face{font-family:"URW Form Extra";src:url("/layout/fonts/urw-font-wof/URWForm-ExtraBold.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ExtraBold.woff") format("woff");font-weight:bold;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Bold.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Bold.woff") format("woff");font-weight:bold;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Medium.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Medium.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Italic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Italic.woff") format("woff");font-weight:normal;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Light.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Light.woff") format("woff");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-MediumItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-MediumItalic.woff") format("woff");font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-LightItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-LightItalic.woff") format("woff");font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Medium.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Medium.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Regular.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Regular.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Light.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Light.woff") format("woff");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:"URW Form Extra";src:url("/layout/fonts/urw-font-wof/URWForm-ExtraLightItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ExtraLightItalic.woff") format("woff");font-weight:200;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-LightItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-LightItalic.woff") format("woff");font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:"URW Form Extra";src:url("/layout/fonts/urw-font-wof/URWForm-ExtraLight.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ExtraLight.woff") format("woff");font-weight:200;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-MediumItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-MediumItalic.woff") format("woff");font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:"URW Form Extra";src:url("/layout/fonts/urw-font-wof/URWForm-ExtraLightItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ExtraLightItalic.woff") format("woff");font-weight:200;font-style:italic;font-display:swap}@font-face{font-family:"URW Form Extra";src:url("/layout/fonts/urw-font-wof/URWForm-ExtraLight.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ExtraLight.woff") format("woff");font-weight:200;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Italic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Italic.woff") format("woff");font-weight:normal;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Regular.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Regular.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Thin.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Thin.woff") format("woff");font-weight:100;font-style:normal;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-ThinItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ThinItalic.woff") format("woff");font-weight:100;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-ThinItalic.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-ThinItalic.woff") format("woff");font-weight:100;font-style:italic;font-display:swap}@font-face{font-family:"URW Form";src:url("/layout/fonts/urw-font-wof/URWForm-Thin.woff2") format("woff2"),url("/layout/fonts/urw-font-wof/URWForm-Thin.woff") format("woff");font-weight:100;font-style:normal;font-display:swap}.typo-controls{padding:10px;background:rgba(0,0,0,.1);border-radius:10px}.typo-controls p{margin-bottom:0}body #typography-page *{font-family:"URW Form",sans-serif;font-weight:400}.ui_btn_1{color:#fff;background:#1d1d1e;font-family:"URW Form",sans-serif;font-weight:700 !important;font-size:14px;letter-spacing:1px;padding:16px 36px;border-radius:5px;line-height:1;text-transform:uppercase;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:10px}.ui_btn_1:hover{color:#fff}.ui_btn_2{color:#1d1d1e;background:#fff246;font-family:"URW Form",sans-serif;font-weight:700 !important;font-size:14px;letter-spacing:1px;padding:16px 36px;border-radius:5px;line-height:1;text-transform:uppercase;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:10px}.ui_btn_2:hover{color:#1d1d1e}/*# sourceMappingURL=typography-page.css.map */ \ No newline at end of file diff --git a/layout/style-css/typography-page.css.map b/layout/style-css/typography-page.css.map new file mode 100644 index 0000000..ffbc004 --- /dev/null +++ b/layout/style-css/typography-page.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["../style-scss/_variables.scss","../style-scss/typography-page.scss"],"names":[],"mappings":"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","file":"typography-page.css"} \ No newline at end of file diff --git a/layout/style-scss/typography-page.scss b/layout/style-scss/typography-page.scss new file mode 100644 index 0000000..04586e3 --- /dev/null +++ b/layout/style-scss/typography-page.scss @@ -0,0 +1,72 @@ +@import 'variables'; +@import '_mixins'; + +.typo-controls { + padding: 10px; + background: rgba(0, 0, 0, 0.1); + border-radius: 10px; + + p { + margin-bottom: 0; + } + select { + } +} + +body { + #typography-page { + * { + font-family: $font3; + + font-weight: 400; + } + } +} + +.ui_btn_1 { + color: #ffffff; + background: #1d1d1e; + + font-family: $font3; + font-weight: 700 !important; + font-size: 14px; + letter-spacing: 1px; + padding: 16px 36px; + border-radius: 5px; + line-height: 1; + text-transform: uppercase; + + display: inline-flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 10px; + + &:hover { + color: #fff; + } +} + +.ui_btn_2 { + color: #1d1d1e; + background: #fff246; + + font-family: $font3; + font-weight: 700 !important; + font-size: 14px; + letter-spacing: 1px; + padding: 16px 36px; + border-radius: 5px; + line-height: 1; + text-transform: uppercase; + + display: inline-flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 10px; + + &:hover { + color: #1d1d1e; + } +} diff --git a/templates_user/pages/typography-page.php b/templates_user/pages/typography-page.php new file mode 100644 index 0000000..1390e77 --- /dev/null +++ b/templates_user/pages/typography-page.php @@ -0,0 +1,325 @@ +
+
+
+
+
+
+ <h1>...</h1> +
+
+

Nagłówek H1. Rozmiar: 40px

+ +
+
+
+
+
+ +
+ +
+
+ +
+
+
+ +
+ +
+
+ +
+
+
+ +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+ <h2>...</h2> +
+
+

Nagłówek h2. Rozmiar: 34px

+
+
+
+
+
+
+
+
+
+ <h3>...</h3> +
+
+

Nagłówek h3. Rozmiar: 28px

+
+
+
+
+
+
+
+
+
+ <h4>...</h4> +
+
+

Nagłówek h4. Rozmiar: 24px

+
+
+
+
+
+
+
+
+
+ <h5>...</h5> +
+
+
Nagłówek h5. Rozmiar: 20px
+
+
+
+
+
+
+
+
+
+ <h6>...</h6> +
+
+
Nagłówek h6. Rozmiar: 16px
+
+
+
+
+ +
+ +
+
+
+
+ <p>...</p> +
+
+

Zwykły tekst. Rozmiar 14px.

+
+
+
+
+ +
+ +
+
+
+
+ <a>...</a> +
+
+ Odnośnik. Rozmiar 14px. +
+
+
+
+ +
+ +
+
+
+
+ Lista <ul><li>...</li></ul> +
+
+
    +
  • Element listy. Rozmiar 16px
    • +
  • Element listy. Rozmiar 16px
    • +
  • Element listy. Rozmiar 16px
    • +
+
+
+
+
+ +
+ +
+
+
+
+ Lista <ol><li>...</li></ol> +
+
+
    +
  1. Element listy. Rozmiar 16px
    2. +
  2. Element listy. Rozmiar 16px
    3. +
  3. Element listy. Rozmiar 16px
    4. +
+
+
+
+
+ +
+ +
+
+
+
+ Lista rozmiarów tekstów <p>...</p> +
+
+

Zwykły tekst. Rozmiar 10px.

+

Zwykły tekst. Rozmiar 11px.

+

Zwykły tekst. Rozmiar 12px.

+

Zwykły tekst. Rozmiar 13px.

+

Zwykły tekst. Rozmiar 14px.

+

Zwykły tekst. Rozmiar 15px.

+

Zwykły tekst. Rozmiar 16px.

+

Zwykły tekst. Rozmiar 17px.

+

Zwykły tekst. Rozmiar 18px.

+

Zwykły tekst. Rozmiar 19px.

+

Zwykły tekst. Rozmiar 20px.

+

Zwykły tekst. Rozmiar 21px.

+

Zwykły tekst. Rozmiar 22px.

+

Zwykły tekst. Rozmiar 23px.

+

Zwykły tekst. Rozmiar 24px.

+

Zwykły tekst. Rozmiar 25px.

+

Zwykły tekst. Rozmiar 26px.

+
+
+
+
+ +
+ +
+
+
+
+ Elementy interfejsu +
+
+
+
+
+
+
+
+ Przycisk 1 +
+
+ + Gdzie kupić + + +
+
+
+
+
+
+
+ Przycisk 2 +
+
+ + Bezpłatna wycena + + +
+
+
+
+
+
+ + \ No newline at end of file