diff --git a/core/client/app/html/apps.html b/core/client/app/html/apps.html index ce3981d623..ba3a41e0e8 100644 --- a/core/client/app/html/apps.html +++ b/core/client/app/html/apps.html @@ -11,253 +11,295 @@ -
Skip to main content +
Skip to main content - + -
+
- - - - - - -
-
-
-
-

Ghost

-
-
- - 14,301 -
-
-

A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.

-
-
- -
- - -
+
+
+

Apps

+
+
-
+ - +
- - +
-
+
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+
+
+
+
+

Ghost

+
+
+ + 14,301 +
+
+

A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.

+
+
+ +
+
+ +
+ +
+ +
+ +
+ +
+ + + + + + + + + +
diff --git a/core/client/app/html/themes.html b/core/client/app/html/themes.html index e6cfe2e422..931df0b67b 100644 --- a/core/client/app/html/themes.html +++ b/core/client/app/html/themes.html @@ -11,249 +11,263 @@ -
Skip to main content +
Skip to main content - + -
- - - - -
-
-

Themes

-
- - -
-
- -
- -
-
- - - - -

Select a theme for your blog

-
-
- -
- - - - - - - - - - - - - - +
+ + + +
+
+

Themes

+
+
-
+ - +
- - +
+
+ + + + +

Select a theme for your blog

+
+
-
+
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+
+ + + + + + +
diff --git a/core/client/app/styles/layouts/packages.css b/core/client/app/styles/layouts/packages.css index f22fcb61ab..1a52909ac9 100644 --- a/core/client/app/styles/layouts/packages.css +++ b/core/client/app/styles/layouts/packages.css @@ -22,15 +22,44 @@ max-width: 1200px; } +/* 3 col themes */ +.package-grid-themes .package-grid-cell { + flex: 0 0 33.3333%; +} + +/* 2 col themes */ +@media (max-width: 1240px) { + .package-grid-themes .package-grid-cell { + flex: 0 0 50%; + } +} + +/* 1 col themes */ +@media (max-width: 800px) { + .package-grid-themes .package-grid-cell { + flex: 1 1 100%; + } +} + +/* 2 col apps */ +.package-grid-apps .package-grid-cell { + flex: 0 0 50%; +} + +/* 1 col apps */ +@media (max-width: 1200px) { + .package-grid-apps .package-grid-cell { + flex: 1 1 100%; + } +} + /* Package Card Theme /* ---------------------------------------------------------- */ .package-card-theme { - flex: 1 1 290px; overflow: hidden; margin: 10px; - max-width: 440px; border: rgba(0,0,0,0.1) 1px solid; border-radius: 5px; } @@ -95,7 +124,6 @@ /* ---------------------------------------------------------- */ .package-card-app { - flex: 1 1 500px; overflow: hidden; margin: 10px; padding: 20px; @@ -297,7 +325,7 @@ border-top: #e1e1e1 1px solid; border-radius: 0; } - .package-card-app:first-of-type { + .package-grid-cell:first-of-type .package-card-app { border-top: none; } }