ASP.NET 主题以及客户特定的图像和 CSS

发布于 2024-12-20 08:22:22 字数 581 浏览 2 评论 0原文

我们有一个 ASP.NET 解决方案,在 App_Theme/{selected theme} 中使用图像、css 和 .skin 文件。今天的主题包含许多很多文件和图像,对于客户主题,我们向 App_Themes 添加一个新文件夹,并将所有文件复制到新文件夹,并对图像、皮肤和 CSS 进行 10-200 处更改。

这里的问题是默认主题,我们通常在开发、发展和成长时使用的主题,使主题客户主题过时。因此,当升级时,我们必须检查所有文件以查找更改,并希望找到所有更改。有时我们会错过一些真正重要的事情。

完美的解决方案是拥有一个包含基本 CSS、皮肤和图像的基本主题。当我们添加新的客户主题时,我们只告诉系统发生了什么变化、要覆盖哪些 css 选择器以及要使用哪些图像,而不是使用基本主题中的图像。根据我的理解,如果在 App_Themes 文件夹中使用正常的 ASP.NET 主题功能,则只能有一个主题而不是 BASE 主题,然后说一个具有不同背景的 DeliveryCustomer 主题和解决方案应使用的其他一些图像BASE 主题中的那些。

有没有人有一些指导方针可以在未来以可维护的方式解决这个问题。我看到人们重写 App_Theme 路径以使其与自定义皮肤一起使用。

谢谢!

We have a ASP.NET solution using images, css and .skin files with in the App_Theme/{selected theme}. The themes today contains many, many files and images and for a customer theme we add a new folder to the App_Themes and copy all files to the new folder and make the 10-200 changes on images, skin and css's.

The issue here is that the default theme, the one we normally have when we develop, evolve's and grows making theme customer theme out of date. So when an upgrade comes we have to go through all files looking for changes and hopefully finding them all. Sometimes we miss things that are really important.

The perfect solution would be to have a base theme that contains the base css, skin and images. And when we add a new customer theme we only tell the system what has been changed, what css-selectors to override and what images to use instead of the images from the base theme. In my understanding, if using the normal ASP.NET theme functionality in App_Themes folder, you can only have ONE theme and not a BASE theme and then say a DeliveryCustomer-theme that has a different background and some other images that the solution shall use instead of the ones in the BASE-theme.

Does anyone have some guidelines to solve this in a maintainable way for the future. I seen that people override the App_Theme path to make it work with custom skins.

thanks!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

尝蛊 2024-12-27 08:22:22

使用您所描述的基本主题的概念。将所有常见的 CSS 规则提取到另一个文件中,我们将其命名为 base.css

base.css 和所有常见的图像放在 App_Themesoutside 文件夹中,然后只包含 CSS 文件,例如您通常会在主页上添加任何其他内容。

<link rel="stylesheet" type="text/css" href="/styles/base.css" /> <!-- Note this isn't in app_themes -->

然后,确保各种主题中的 CSS 文件仅指定样式的增量。

Use the concept of a base theme like you described. Pull out all common CSS rules into another file, let's call it base.css.

Take base.css and all the images that are common, and put them in a folder outside of App_Themes, and just include the CSS file like you normally would any other on your master page.

<link rel="stylesheet" type="text/css" href="/styles/base.css" /> <!-- Note this isn't in app_themes -->

Then, make sure your CSS files in various themes only specify the delta for your styles.

你如我软肋 2024-12-27 08:22:22

好的,这就是我知道的做法。
我创建了一个默认主题,它是原始主题,包含所需的所有 css 文件、皮肤文件和图像,而且数量很多。该主题位于 App_Themes 文件夹中。我在 App_Themes 文件夹旁边创建了一个名为 ThemeSkins 的新文件夹。在此文件夹中,我将所有新皮肤放在不同的文件夹中。文件夹名称是您想要的新主题的名称。在每个皮肤文件夹中都有 css 文件,其中仅包含我想要重载的选择器。还有一些我想替换的图像。

我创建了一个 ThemeCreator 工具,它可以执行三件事:

  • 删除 App_Themes 文件夹中除默认主题之外的所有主题。这是为了让开发人员只需要一个主题。 ThemeSkin 中仍然需要完成一些工作,但总体工作量很小。
  • 接下来,该工具会查看 ThemeSkins 中的文件夹,并在 App_Themes 下为每个皮肤及其名称创建一个文件夹。然后它将默认主题复制到刚刚创建的所有新皮肤文件夹中。
  • 最后一件事是,它会将皮肤特定文件合并到 App_Themes 下新创建的皮肤中,并让用户知道添加了哪些文件仅供参考。该工具在所有 css 文件上添加前缀“z_”,以便这些文件在所有 css 文件的最后加载,并且会重载默认选择器。

剩下的事情就是更新皮肤文件,到目前为止,没有客户需要更改这些文件。但是当他们这样做时,我想我只是添加了一个皮肤文件,并且必须以自动方式更新默认值,因为皮肤标记不能像 css 选择器那样重载。

这工作起来非常顺利,并为我们提供了一种很好且精益的方式来处理我们主题的皮肤。
有人知道如何获得相同的结果吗?使用 ASP.NET 主题的主要问题是,您不能使用默认主题,然后仅对其应用外观,而不使用外观文件中的形状和颜色属性。不建议这样做,因为外观文件会将所有属性复制到标记中需要它们的所有位置,而不仅仅是像 css 类那样引用它们。

Ok, so here is how I'v done it know.
I have created a Default theme that is the original theme with all the css-files, skin-files and images that is needed, and that is alot. This theme is in the App_Themes folder. Them I'v created a new folder called ThemeSkins next to the App_Themes folder. In this folder I have all the new skins in different folders. The folders name is the name of the new theme that one want's to have. In each of the skin folders there are css-files that contains only the selectors that I want to overload. There is also images that I want to replace.

I have created a ThemeCreator tool that does three things:

  • Remove all themes except the Default theme in the App_Themes folder. This is to only have one main theme to work on for the developers. There will still be work that needs to be done in the ThemeSkins, but the overall work load will be minimal.
  • Next the tool looks at the folders that is in ThemeSkins and creates a folder under App_Themes for each skin with its name. Then it copies the Default theme into all the new skin folders that it just created.
  • The last thing is that it will merge the skin specific files into the newly created skin under App_Themes and let the user know what files were added just for information. The tool adds a prefix, "z_", on all css-files so that these are loaded last of all css-files and there for will overload the default selectors.

The thing that remains is to update the skin-files, so far, no customer has needed changes in these files. But when they do, I guess I just add a skin files and have to update the default in a automatic way since the skin-markers can't be overloaded as css-selectors can.

This works really smooth and gives us a nice and lean way to work with skins on our themes.
Any one got a better idea how to get the same result? the major issue using ASP.NET themes are that you can't use a default theme and then just apply skins to it without using the shape and color attribute in the skin-files. This is not recommended as the skin files will copy out all attribute to all the places that they are needed in the markup and not just reference them as css-classes do.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文